修改数据字段双语、整体页面样式调整

This commit is contained in:
qq787203167
2022-02-15 14:18:47 +08:00
parent 25ca649eb8
commit 396b0b69a5
5 changed files with 132 additions and 115 deletions
+58 -50
View File
@@ -4,7 +4,7 @@
<div v-for="(val,index) in headerText" :key="index">
<div class="header-text">
&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;{{val.text}}
&nbsp;{{val.text}}
</div>
<a-row :gutter="24" v-if="isDisplayType">
<div v-for="item in val.content">
@@ -12,8 +12,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-input class="box-input"
@@ -28,8 +28,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-multi-select-tag class="box-input" v-model="formInline[item.db_field_name]"
@@ -44,8 +44,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-date-picker class="box-input" v-model="formInline[item.db_field_name]"
@@ -59,8 +59,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-range-picker class="box-input" v-model="formInline[item.db_field_name]"
@@ -74,8 +74,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-input-number class="box-input"
@@ -89,8 +89,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-dict-select-tag class="box-input" v-model="formInline[item.db_field_name]"
@@ -106,8 +106,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-multi-select-tag class="box-input" v-model="formInline[item.db_field_name]"
@@ -122,8 +122,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-dict-select-tag v-model="formInline[item.db_field_name]"
@@ -139,8 +139,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-textarea :placeholder="$t('selectStatus')"
@@ -150,18 +150,18 @@
</div>
</a-col>
<a-col :span="24" v-else-if="item.field_show_type === 'file'">
<a-col :span="12" v-else-if="item.field_show_type === 'file'">
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-button type="primary" style="height: 38px;width: calc(50% - 80px);line-height: 38px"
<a-button type="primary" class="button-text"
@click="clickButtonToUpload(item.db_field_name)">
{{ (formInline[item.db_field_name] === 'null' || formInline[item.db_field_name] === '' ||
formInline[item.db_field_name] == null) ? '上传文件' : '查看已上传文件'
formInline[item.db_field_name] == null) ? '点击上传' : '查看已上传文件'
}}
</a-button>
</a-form-model-item>
@@ -172,8 +172,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<Standardselection :query="item" :disabled="disabled" v-model="formInline[item.db_field_name]"/>
@@ -191,8 +191,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-input class="box-input" v-model="formInline[item.db_field_name]"
@@ -206,8 +206,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-multi-select-tag class="box-input" v-model="formInline[item.db_field_name]"
@@ -222,8 +222,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-date-picker class="box-input" v-model="formInline[item.db_field_name]"
@@ -237,8 +237,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-range-picker v-model="formInline[item.db_field_name]"
@@ -252,8 +252,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-input-number class="box-input"
@@ -267,8 +267,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-dict-select-tag class="box-input" v-model="formInline[item.db_field_name]"
@@ -283,8 +283,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-multi-select-tag class="box-input" v-model="formInline[item.db_field_name]"
@@ -299,8 +299,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<j-dict-select-tag v-model="formInline[item.db_field_name]" :placeholder="$t('selectStatus')"
@@ -314,8 +314,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-textarea :placeholder="$t('selectStatus')"
@@ -329,14 +329,14 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<a-button type="primary" style="height: 38px;width: calc(50% - 80px);line-height: 38px"
@click="clickButtonToUpload(item.db_field_name)">
{{ (formInline[item.db_field_name] === 'null' || formInline[item.db_field_name] === '' ||
formInline[item.db_field_name] == null) ? '上传文件' : '查看已上传文件'
formInline[item.db_field_name] == null) ? '点击上传' : '查看已上传文件'
}}
</a-button>
</a-form-model-item>
@@ -347,8 +347,8 @@
<div class="box-title-text">
<div class="title-text">
<span class="Required" v-if="item.Required">*</span>
<span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>
<span :class="{'title-text-text':false}">{{item.db_field_txt}}</span>
<!-- <span :class="{'title-text-text':false}">{{item.db_field_en_name}}</span><br>-->
<span class="title-text-text">{{item.db_field_txt}}</span>
</div>
<a-form-model-item class="itemModel" :prop="item.db_field_name">
<Standardselection :query="item"
@@ -647,7 +647,7 @@
font-size: 16px;
font-weight: bold;
margin-left: 15px;
border-bottom: 1px #d9d9d9 dashed;
/*border-bottom: 1px #d9d9d9 dashed;*/
height: 30px;
margin-bottom: 30px;
}
@@ -655,4 +655,12 @@
.formAdd {
margin-bottom: 40px;
}
.button-text{
height: 38px;
width: calc(100% - 120px);
line-height: 38px;
background: #fff;
border: 1px #00B3BE solid;
color: #00B3BE;
}
</style>
+10 -8
View File
@@ -5,7 +5,7 @@
<template v-if="index < 2">
<div class="box-title-text" v-if="item.field_show_type == 'text'">
<div class="title-text">
<span>{{item.db_field_en_name}}</span><br>
<!-- <span>{{item.db_field_en_name}}</span><br>-->
<span>{{item.db_field_txt}}</span>
</div>
<a-input class="box-input" :placeholder="item.placeholder"
@@ -13,7 +13,7 @@
</div>
<div class="box-title-text" v-else-if="item.field_show_type == 'list_multi'">
<div class="title-text">
<span>{{item.db_field_en_name}}</span><br>
<!-- <span>{{item.db_field_en_name}}</span><br>-->
<span>{{item.db_field_txt}}</span>
</div>
<j-multi-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
@@ -22,14 +22,14 @@
</div>
<div class="box-title-text" v-else-if="item.field_show_type == 'date'">
<div class="title-text">
<span>{{item.db_field_en_name}}</span><br>
<!-- <span>{{item.db_field_en_name}}</span><br>-->
<span>{{item.db_field_txt}}</span>
</div>
<a-date-picker class="box-input" v-model="queryParam[item.db_field_name]"/>
</div>
<div class="box-title-text" v-else-if="item.field_show_type == 'list'">
<div class="title-text">
<span>{{item.db_field_en_name}}</span><br>
<!-- <span>{{item.db_field_en_name}}</span><br>-->
<span>{{item.db_field_txt}}</span>
</div>
<j-dict-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
@@ -40,7 +40,7 @@
<template v-if="toggleSearchStatus && index >= 2">
<div class="box-title-text" v-if="item.field_show_type == 'text'">
<div class="title-text">
<span>{{item.db_field_en_name}}</span><br>
<!-- <span>{{item.db_field_en_name}}</span><br>-->
<span>{{item.db_field_txt}}</span>
</div>
<a-input class="box-input" :placeholder="item.placeholder"
@@ -48,7 +48,7 @@
</div>
<div class="box-title-text" v-else-if="item.field_show_type == 'list_multi'">
<div class="title-text">
<span>{{item.db_field_en_name}}</span><br>
<!-- <span>{{item.db_field_en_name}}</span><br>-->
<span>{{item.db_field_txt}}</span>
</div>
<j-multi-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
@@ -57,14 +57,14 @@
</div>
<div class="box-title-text" v-else-if="item.field_show_type == 'date'">
<div class="title-text">
<span>{{item.db_field_en_name}}</span><br>
<!-- <span>{{item.db_field_en_name}}</span><br>-->
<span>{{item.db_field_txt}}</span>
</div>
<a-date-picker class="box-input" v-model="queryParam[item.db_field_name]"/>
</div>
<div class="box-title-text" v-else-if="item.field_show_type == 'list'">
<div class="title-text">
<span>{{item.db_field_en_name}}</span><br>
<!-- <span>{{item.db_field_en_name}}</span><br>-->
<span>{{item.db_field_txt}}</span>
</div>
<j-dict-select-tag class="box-input" v-model="queryParam[item.db_field_name]"
@@ -153,6 +153,8 @@
font-weight: bold;
font-size: 14px;
margin-right: 16px;
margin-top: 3px;
text-align: right;
}
.box-input {
+61 -54
View File
@@ -1,39 +1,29 @@
<template>
<div style="height: 100%">
<div class="box">
<table class="box-table" cellpadding="0" cellspacing="0">
<thead>
<tr id="table_thead_tr">
<th class="checkbox" style="margin-top: 24px;display: inline-block">
<a-checkbox :checked="tableAll" :indeterminate="indeterminate" @change="checkboxAll($event)"></a-checkbox>
</th>
</tr>
</thead>
<tbody id="table_tbody_tr">
<a-checkbox-group @change="checkboxChange" style="display: contents" v-model="checkboxList">
<tr v-for="item in jsonBody">
<td class="checkbox">
<a-checkbox :value="item.id"></a-checkbox>
</td>
<td v-for="val in Object.keys(item)" v-if="val != 'id'" class="box-td" :title="item[val]">
{{item[val]}}
</td>
<td class="box-td box-th-po" v-if="isOperation">
<a class="text" v-for="(ol,index) in OperationList" @click="OperationClick(ol,item)">{{ol.text}}</a>
</td>
</tr>
</a-checkbox-group>
</tbody>
</table>
<a-table
class="table"
:row-selection="{ selectedRowKeys: selectedRowKeys, onChange: onSelectChange }"
:columns="columns"
:pagination="false"
:data-source="dataSource"
:loading="loading"
>
<span slot="operation" slot-scope="record" class="table-operation">
<a class="text" v-for="(ol,index) in OperationList"
@click="OperationClick(ol,record)">{{ol.text}}</a>
</span>
</a-table>
</div>
<div class="page" v-if="jsonBody.length > 0">
<div class="page" v-if="dataSource.length > 0">
<a-pagination
:show-total="total => ` ${total} `"
show-quick-jumper
show-size-changer
:page-size.sync="pageSize"
:total="500"
:total="total"
@change="onChange"
@showSizeChange="SizeChange"
/>
</div>
</div>
@@ -68,18 +58,27 @@
},
data() {
return {
pageSize: 20,
jsonBody: [],
checkboxList: [],
tableAll: false,
indeterminate: false,
columns: [],
selectedRowKeys: [],
dataSource: [],
pageNo: 1,
pageSize: 10,
total: 0,
searchParmes: {},
loading:false,
}
},
mounted() {
eventBUs.$on('searchQuery', search => {
this.searchParmes = search
this.getTableList(search)
})
eventBUs.$on('searchReset', target => {
this.searchParmes = {}
this.getTableList()
})
this.getData()
@@ -93,42 +92,46 @@
getAction(this.url.tableHeader, params).then((res) => {
if (res.success) {
var jsonHead = res.result
for (var i = 0; i < jsonHead.length; i++) {
$('#table_thead_tr').append('<th class="box-th">' + jsonHead[i].db_field_en_name + '</br>' + jsonHead[i].db_field_txt + '</th>')
}
if (this.isOperation) {
let th = '<th class="box-th box-th-po">' + 'Operation ' + '</br>' + '操作' + '</th>'
$('#table_thead_tr').append(th)
}
}
})
},
checkboxChange(checkedList) {
this.indeterminate = !!checkedList.length && checkedList.length < this.jsonBody.length
this.tableAll = checkedList.length === this.jsonBody.length
},
checkboxAll(event) {
this.tableAll = event.target.checked
this.checkboxList = []
if (this.tableAll) {
if (this.jsonBody.length > 0){
this.jsonBody.forEach(res => {
this.checkboxList.push(res.id)
jsonHead.forEach(res => {
this.columns.push({
title: res.db_field_txt,
dataIndex: res.db_field_name,
align: 'center'
})
})
this.columns.push({
title: '操作',
align: 'center',
fixed: 'right',
scopedSlots: { customRender: 'operation' }
})
}
}
})
},
getTableList(search) {
getTableList() {
let params = {
...search,
...this.searchParmes,
pageNo: this.pageNo,
pageSize: this.pageSize
}
this.loading = true
getAction(this.url.tableList, params).then((res) => {
if (res.success) {
this.jsonBody = res.result.records
this.dataSource = res.result.records
this.total = res.result.total
this.loading = false
}
})
},
onChange() {
onChange(page, pageSize) {
this.pageNo = page
this.getTableList()
},
SizeChange(page, pageSize) {
this.pageSize = pageSize
this.getTableList()
},
onSelectChange() {
},
OperationClick(ol, item) {
@@ -137,7 +140,11 @@
}
}
</script>
<style>
.table .ant-table-column-title {
font-weight: bold;
}
</style>
<style scoped>
.box {
width: 100%;
@@ -37,7 +37,7 @@
data() {
return {
title: '添加',
drawerWidth: 1000,
drawerWidth: 900,
visible: false,
confirmLoading: false,
isDisplayType:false,
+2 -2
View File
@@ -71,8 +71,8 @@ module.exports = {
less: {
modifyVars: {
/* less 变量覆盖,用于自定义 ant design 主题 */
'primary-color': '#1890FF',
'link-color': '#1890FF',
'primary-color': '#00B3BE',
'link-color': '#00B3BE',
'border-radius-base': '4px',
},
javascriptEnabled: true,