布局知识库

This commit is contained in:
qq787203167
2022-08-03 11:56:10 +08:00
parent 530350df13
commit 25801c7483
9 changed files with 662 additions and 26 deletions
@@ -11,16 +11,149 @@
</div>
<div style="padding-top: 68px;background: #fff">
<div class="detail-content" style="padding: 24px">
<div class="content-text">
<div class="text-field" v-for="(item,index) in standardContentList" :key="index">
<span class="text-field-left" :title="item.title">{{item.title}}</span>
<span class="text-field-right text-field-right-url"
@click="clickButtonToUpload(queryForm[item.value])"
v-if="item.type == 2 && queryForm[item.value]"
>{{ $t('viewFile') }}</span>
<span class="text-field-right"
:title="queryForm[item.value]" v-else>
{{queryForm[item.value]}}fdgdgdfg
</span>
</div>
</div>
<div class="content">
sfdsfdsf的防控流感的飞机过来看的结果东法兰克感觉地方给了地方国家的分开两个就地方孤苦伶仃附件给领导反馈
独守空房了就收到付款了的角色发看来都是风景但是考虑附件第三方库老师积分迪斯科浪费绝对是分类的课时费
是反抗拉萨的飞机罗斯福就点十六分就但是发
迪斯科浪费电视机分厘卡的设计分类的水库附近的说服力但是积分的历史房价多少发了多少给京东方管理看豆腐干豆腐干看
a fjsd fklsdjfk s是否考虑技术的反抗类毒素就发的撒开了房间但是发离开打扫房间是开了房间都是老师JFK了的身份圣诞快乐就是的反抗类毒素解放迪斯科浪费是
考虑到房价打开拉萨附近分离技术的领导是否打开拉萨范德萨发了开始就发的考虑是否就但是考虑发及代理商开发就十分大师傅看
</div>
<div class="content-icon">
<span class="content-icon-text">
<a-icon class="icon" type="eye"/>
<span>123456</span>
</span>
<span class="content-icon-text">
<a-icon class="icon" type="like"/>
<span>123456</span>
</span>
<span class="content-icon-text">
<a-icon class="icon" type="star"/>
<span>123456</span>
</span>
</div>
<div class="box-text">
<div class="header-text">
{{$t('comment')}}
</div>
</div>
<a-form-model :model="formInline" class="formAdd" :rules="rules" ref="ruleForm">
<a-row :gutter="24">
<a-col :span="24">
<div class="box-title-text">
<a-form-model-item class="itemModel" prop="approvalOpinion">
<a-textarea :placeholder="$t('pleaseEnter')+$t('comment')"
v-model="formInline.approvalOpinion"
:rows="4"/>
</a-form-model-item>
</div>
</a-col>
</a-row>
</a-form-model>
<div class="content-button">
<a-button class="header-btn submit" @click="release" type="primary">{{$t('release')}}</a-button>
</div>
<div>
<div class="box-text">
<div class="header-text">
<span style="margin-right: 20px">张三</span>
2022-12-12 10:10:12
</div>
</div>
<div class="content">
sfdsfdsf的防控流感的飞机过来看的结果东法兰克感觉地方给了地方国家的分开两个就地方孤苦伶仃附件给领导反馈
独守空房了就收到付款了的角色发看来都是风景但是考虑附件第三方库老师积分迪斯科浪费绝对是分类的课时费
是反抗拉萨的飞机罗斯福就点十六分就但是发
迪斯科浪费电视机分厘卡的设计分类的水库附近的说服力但是积分的历史房价多少发了多少给京东方管理看豆腐干豆腐干看
a fjsd fklsdjfk s是否考虑技术的反抗类毒素就发的撒开了房间但是发离开打扫房间是开了房间都是老师JFK了的身份圣诞快乐就是的反抗类毒素解放迪斯科浪费是
考虑到房价打开拉萨附近分离技术的领导是否打开拉萨范德萨发了开始就发的考虑是否就但是考虑发及代理商开发就十分大师傅看
</div>
<div class="box-text">
<div class="header-text">
<span style="margin-right: 20px">张三</span>
2022-12-12 10:10:12
</div>
</div>
<div class="content">
sfdsfdsf的防控流感的飞机过来看的结果东法兰克感觉地方给了地方国家的分开两个就地方孤苦伶仃附件给领导反馈
独守空房了就收到付款了的角色发看来都是风景但是考虑附件第三方库老师积分迪斯科浪费绝对是分类的课时费
是反抗拉萨的飞机罗斯福就点十六分就但是发
迪斯科浪费电视机分厘卡的设计分类的水库附近的说服力但是积分的历史房价多少发了多少给京东方管理看豆腐干豆腐干看
a fjsd fklsdjfk s是否考虑技术的反抗类毒素就发的撒开了房间但是发离开打扫房间是开了房间都是老师JFK了的身份圣诞快乐就是的反抗类毒素解放迪斯科浪费是
考虑到房价打开拉萨附近分离技术的领导是否打开拉萨范德萨发了开始就发的考虑是否就但是考虑发及代理商开发就十分大师傅看
</div>
</div>
</div>
</div>
</div>
<viewFileModel ref="viewFileModelRef"/>
</div>
</template>
<script>
import viewFileModel from '@/components/viewFileModel/index'
export default {
name: 'problemKnowledgeBaseView'
name: 'problemKnowledgeBaseView',
components: {
viewFileModel
},
data() {
return {
standardContentList: [
{
title: this.$t('problemClassification'),
value: ''
},
{
title: this.$t('market'),
value: ''
},
{
title: this.$t('standardNo'),
value: ''
},
{
title: this.$t('standardName'),
value: ''
},
{
title: this.$t('enclosure'),
type: 2,
value: ''
}
],
queryForm: {},
formInline: {},
rules: {}
}
},
mounted() {
document.title = this.$t('applicableInstructionsMarketList')
},
methods: {
clickButtonToUpload(item) {
this.$refs.viewFileModelRef.clickButtonToUpload(item)
},
release() {
}
}
}
</script>
@@ -85,4 +218,132 @@
}
}
}
.box-text {
display: flex;
justify-content: space-between;
height: 60px;
line-height: 40px;
.header-text {
font-size: 16px;
font-weight: 400;
color: #000F16;
}
}
.content-text {
width: 100%;
display: flex;
flex-wrap: wrap;
.text-field {
width: 33%;
margin-bottom: 8px;
.text-field-left {
width: 124px;
display: inline-block;
font-size: 14px;
font-weight: 400;
color: #6F7385;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
margin-right: 24px;
}
.text-field-right {
width: calc(100% - 200px);
display: inline-block;
font-size: 16px;
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
color: #040B29;
font-weight: 400;
}
.text-field-right-url {
color: #00B3BE !important;
cursor: pointer;
margin-top: 10px;
}
}
}
.content {
font-size: 16px;
color: #040B29;
font-weight: 400;
}
.content-icon {
height: 40px;
line-height: 40px;
font-size: 16px;
color: #040B29;
font-weight: 400;
text-align: right;
margin-top: 20px;
}
.content-icon-text {
display: inline-block;
padding: 0 20px;
cursor: pointer;
line-height: 40px;
}
.content-icon-text .icon {
font-size: 24px;
color: #3b4249 !important;
}
.content-icon-text span {
display: inline-block;
margin-left: 4px;
}
.box-title-text {
line-height: 1.4;
display: flex;
/*align-items: center;*/
}
.title-text {
width: 88px;
text-align: right;
display: inline-block;
font-weight: 500;
font-size: 14px;
margin-right: 16px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
height: 42px;
line-height: 48px;
color: #000F16;
}
.box-input {
display: inline-block;
height: 38px;
width: 100%;
}
.itemModel {
width: 100%;
display: inline-block;
margin-top: 2px;
margin-bottom: 12px;
}
.content-button {
text-align: right;
}
.header-btn {
height: 38px;
}
</style>