13 changed files with 1631 additions and 1135 deletions
-
3src/views/archivesConfig/dict/dictDetail.vue
-
3src/views/category/fieldManage/module/form.vue
-
95src/views/category/fileNoFormat/index.vue
-
117src/views/category/fileNoFormat/module/form.vue
-
19src/views/category/fileNoFormat/module/sortDialog.vue
-
1src/views/category/index.vue
-
4src/views/category/listBrowsing/module/form.vue
-
2072src/views/category/orderingRule/data1.json
-
142src/views/category/orderingRule/data2.json
-
113src/views/category/orderingRule/index.vue
-
119src/views/category/orderingRule/module/form.vue
-
63src/views/category/orderingRule/module/sortDialog.vue
-
15src/views/category/sortDialog.vue
@ -1,107 +1,54 @@ |
|||
<template> |
|||
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title"> |
|||
<el-dialog :close-on-click-modal="false" :visible.sync="cuDialogVisible" title="修改字段"> |
|||
<span class="dialog-right-top" /> |
|||
<span class="dialog-left-bottom" /> |
|||
<div class="setting-dialog"> |
|||
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px"> |
|||
<el-form-item label="中文名称" prop="fieldCnName"> |
|||
<el-input v-model="form.fieldCnName" style="width: 370px;" /> |
|||
</el-form-item> |
|||
<el-form-item label="字段标识" prop="fieldName"> |
|||
<el-input v-model="form.fieldName" style="width: 370px;" /> |
|||
</el-form-item> |
|||
<el-form-item label="数据类型" prop="isDataType"> |
|||
<el-select v-model="form.isDataType" placeholder="请选择"> |
|||
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" /> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="字段长度" prop="isColumnLength"> |
|||
<el-input-number v-model="form.isColumnLength" controls-position="right" style="width: 370px;" /> |
|||
</el-form-item> |
|||
<el-form-item label="默认值" prop="isDefaultValue"> |
|||
<el-input v-model="form.isDefaultValue" style="width: 370px;" /> |
|||
</el-form-item> |
|||
</el-form> |
|||
<div class="fields-list"> |
|||
<el-form ref="form" :model="formData" size="small" label-width="75px"> |
|||
<el-row v-for="(item) in formData.fields" :key="item.id" :gutter="10"> |
|||
<el-col :span="14"> |
|||
<el-form-item label="组成字段"> |
|||
<el-input v-if="item.fieldCnName" v-model="item.fieldCnName" :disabled="true" /> |
|||
<el-input v-if="item.ikFieldName" v-model="item.ikFieldName" :disabled="true" /> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="9"> |
|||
<el-form-item label="组成符号"> |
|||
<el-input v-model="item.ikConnector" /> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="text" @click="crud.cancelCU"> |
|||
取消 |
|||
</el-button> |
|||
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU"> |
|||
确认 |
|||
</el-button> |
|||
<el-button type="primary" @click="submitCU">保存</el-button> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
import { form } from '@crud/crud' |
|||
|
|||
const defaultForm = { |
|||
id: null, |
|||
fieldCnName: '', |
|||
fieldName: '', |
|||
isDataType: 1, |
|||
isColumnLength: 100, |
|||
isDefaultValue: '' |
|||
} |
|||
export default { |
|||
mixins: [form(defaultForm)], |
|||
data() { |
|||
var checkMaxLength = (rule, value, callback) => { |
|||
if (value !== undefined && (!Number.isInteger(value) || value <= 0)) { |
|||
callback(new Error('请输入正整数数字值')) |
|||
} else { |
|||
if (this.form.isDataType === 1 && value > 2000) { |
|||
callback(new Error('字符最大长度不能超过2000位')) |
|||
} else if (this.form.isDataType === 2 && value > 11) { |
|||
callback(new Error('数字最大长度不能超过11位')) |
|||
} else { |
|||
callback() |
|||
} |
|||
} |
|||
} |
|||
var checkFieldName = (rule, value, callback) => { |
|||
const reg = /^[A-Za-z][A-Za-z_]+[a-zA-Z]*$/ |
|||
if (reg.test(value)) { |
|||
callback() |
|||
} else { |
|||
callback(new Error('字段标识只能由字母、字符“_”组成,并且必须以字母开头和结尾')) |
|||
} |
|||
} |
|||
return { |
|||
rules: { |
|||
fieldCnName: [ |
|||
{ required: true, message: '请输入中文名称', trigger: 'blur' } |
|||
], |
|||
fieldName: [ |
|||
{ required: true, message: '请选择字段标识', trigger: 'blur' }, |
|||
{ validator: checkFieldName, trigger: 'blur' } |
|||
], |
|||
isDataType: [ |
|||
{ required: true, message: '请选择数据类型', trigger: 'blur' } |
|||
], |
|||
isColumnLength: [ |
|||
{ validator: checkMaxLength, trigger: 'blur' } |
|||
] |
|||
}, |
|||
options: [ |
|||
{ |
|||
value: 1, |
|||
label: '字符' |
|||
}, |
|||
{ |
|||
value: 2, |
|||
label: '数字' |
|||
} |
|||
] |
|||
cuDialogVisible: false, |
|||
formData: {} |
|||
} |
|||
}, |
|||
methods: { |
|||
submitCU() { |
|||
console.log(2) |
|||
// this.cuDialogVisible = false |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style rel="stylesheet/scss" lang="scss" scoped> |
|||
::v-deep .el-input-number .el-input__inner { |
|||
text-align: left; |
|||
.fields-list { |
|||
max-height: calc(100vh - 312px); |
|||
overflow-x: hidden; |
|||
overflow-y: auto; |
|||
position: relative; |
|||
} |
|||
</style> |
2072
src/views/category/orderingRule/data1.json
File diff suppressed because it is too large
View File
File diff suppressed because it is too large
View File
@ -1,56 +1,102 @@ |
|||
{ |
|||
"total":0, |
|||
"total":1, |
|||
"rows":[ |
|||
{ |
|||
"id":"a38da83350114b459ef3469340ffe577", |
|||
"ikFieldName":"全宗号", |
|||
"fieldYingName":"fonds_no", |
|||
"ikConnector":"-", |
|||
"ikSequence":1, |
|||
"ikFiledId":"3d6d548d30db426ea3d95d63f589b294", |
|||
"ikCategoryId":"f88a8b3960ac476b8d94e63961bbeabe", |
|||
"ikInputClass":"easyui-combobox" |
|||
"id":"53e68102f0bc44a98704e478565cd414", |
|||
"fieldName":"archive_no", |
|||
"fieldCnName":"档号1", |
|||
"isDefaultValue":"", |
|||
"isDefaultValueType":"", |
|||
"isPattern":null, |
|||
"isPrecept":null, |
|||
"isDataType":1, |
|||
"isColumnLength":100, |
|||
"isMaxlength":null, |
|||
"isMinlength":null, |
|||
"isSequence":9, |
|||
"isType":4, |
|||
"isGlobal":null, |
|||
"isSystem":1, |
|||
"isAccede":null, |
|||
"isAutoaccountvalue":null, |
|||
"isOperate":null, |
|||
"isSearch":null, |
|||
"isCategoryId":"f88a8b3960ac476b8d94e63961bbeabe", |
|||
"createTime":1502689066000, |
|||
"isOrder":1, |
|||
"isOrderSeq":1, |
|||
"isOrderType":"asc", |
|||
"isDisplay":1, |
|||
"isDisplayWidth":170, |
|||
"isDisplayOrder":2, |
|||
"isDisplayAlign":"center", |
|||
"isInputClass":"easyui-textbox", |
|||
"isInput":1, |
|||
"isInputLength":245, |
|||
"isFullrow":0, |
|||
"isRequired":0, |
|||
"isInherit":0, |
|||
"isIncrease":null, |
|||
"isAuto":1, |
|||
"isAutoField":0, |
|||
"isDosearchCard":1, |
|||
"isSupplement":0, |
|||
"isSupplementNum":null, |
|||
"isNoRepetition":1, |
|||
"isAdjust":0, |
|||
"isAdjustSeq":0, |
|||
"isAdjustWidth":0, |
|||
"isRelevance":null, |
|||
"relevanceSeq":null |
|||
}, |
|||
{ |
|||
"id":"c669f176ba80402d865f899b2976ffd8", |
|||
"ikFieldName":"归档年度", |
|||
"fieldYingName":"filing_year", |
|||
"ikConnector":"-", |
|||
"ikSequence":2, |
|||
"ikFiledId":"d173c2d2e6ab49e0a38e1c46343e69b1", |
|||
"ikCategoryId":"f88a8b3960ac476b8d94e63961bbeabe", |
|||
"ikInputClass":"easyui-numberbox" |
|||
}, |
|||
{ |
|||
"id":"a61508d47433421a989fed6385facd17", |
|||
"ikFieldName":"机构(问题)", |
|||
"fieldYingName":"archive_ctg_no", |
|||
"ikConnector":"-", |
|||
"ikSequence":3, |
|||
"ikFiledId":"01b22836d0d1442094e2ecb78210306c", |
|||
"ikCategoryId":"f88a8b3960ac476b8d94e63961bbeabe", |
|||
"ikInputClass":"easyui-combobox" |
|||
}, |
|||
{ |
|||
"id":"6dc035b5f60a4f4dba256e96877a9541", |
|||
"ikFieldName":"保管期限", |
|||
"fieldYingName":"retention", |
|||
"ikConnector":"-", |
|||
"ikSequence":4, |
|||
"ikFiledId":"ebc2ceda16ff40ebab0d3c82d2721002", |
|||
"ikCategoryId":"f88a8b3960ac476b8d94e63961bbeabe", |
|||
"ikInputClass":"easyui-combobox" |
|||
}, |
|||
{ |
|||
"id":"3deb020b78dc4770b95b9b484e965f84", |
|||
"ikFieldName":"件号", |
|||
"fieldYingName":"piece_no", |
|||
"ikConnector":"", |
|||
"ikSequence":5, |
|||
"ikFiledId":"8a1700abf5c346fda9a3f898569039d3", |
|||
"ikCategoryId":"f88a8b3960ac476b8d94e63961bbeabe", |
|||
"ikInputClass":"easyui-numberbox" |
|||
} |
|||
"id":"53e68102f0bc44a98704e478565cd415", |
|||
"fieldName":"archive_no", |
|||
"fieldCnName":"档号2", |
|||
"isDefaultValue":"", |
|||
"isDefaultValueType":"", |
|||
"isPattern":null, |
|||
"isPrecept":null, |
|||
"isDataType":1, |
|||
"isColumnLength":100, |
|||
"isMaxlength":null, |
|||
"isMinlength":null, |
|||
"isSequence":9, |
|||
"isType":4, |
|||
"isGlobal":null, |
|||
"isSystem":1, |
|||
"isAccede":null, |
|||
"isAutoaccountvalue":null, |
|||
"isOperate":null, |
|||
"isSearch":null, |
|||
"isCategoryId":"f88a8b3960ac476b8d94e63961bbeabe", |
|||
"createTime":1502689066000, |
|||
"isOrder":1, |
|||
"isOrderSeq":1, |
|||
"isOrderType":"asc", |
|||
"isDisplay":1, |
|||
"isDisplayWidth":170, |
|||
"isDisplayOrder":2, |
|||
"isDisplayAlign":"center", |
|||
"isInputClass":"easyui-textbox", |
|||
"isInput":1, |
|||
"isInputLength":245, |
|||
"isFullrow":0, |
|||
"isRequired":0, |
|||
"isInherit":0, |
|||
"isIncrease":null, |
|||
"isAuto":1, |
|||
"isAutoField":0, |
|||
"isDosearchCard":1, |
|||
"isSupplement":0, |
|||
"isSupplementNum":null, |
|||
"isNoRepetition":1, |
|||
"isAdjust":0, |
|||
"isAdjustSeq":0, |
|||
"isAdjustWidth":0, |
|||
"isRelevance":null, |
|||
"relevanceSeq":null |
|||
} |
|||
], |
|||
"footer":null, |
|||
"postparam":null |
@ -1,107 +1,56 @@ |
|||
<template> |
|||
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title"> |
|||
<el-dialog :close-on-click-modal="false" :visible.sync="cuDialogVisible" title="修改字段"> |
|||
<span class="dialog-right-top" /> |
|||
<span class="dialog-left-bottom" /> |
|||
<div class="setting-dialog"> |
|||
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px"> |
|||
<el-form-item label="中文名称" prop="fieldCnName"> |
|||
<el-input v-model="form.fieldCnName" style="width: 370px;" /> |
|||
</el-form-item> |
|||
<el-form-item label="字段标识" prop="fieldName"> |
|||
<el-input v-model="form.fieldName" style="width: 370px;" /> |
|||
</el-form-item> |
|||
<el-form-item label="数据类型" prop="isDataType"> |
|||
<el-select v-model="form.isDataType" placeholder="请选择"> |
|||
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" /> |
|||
</el-select> |
|||
</el-form-item> |
|||
<el-form-item label="字段长度" prop="isColumnLength"> |
|||
<el-input-number v-model="form.isColumnLength" controls-position="right" style="width: 370px;" /> |
|||
</el-form-item> |
|||
<el-form-item label="默认值" prop="isDefaultValue"> |
|||
<el-input v-model="form.isDefaultValue" style="width: 370px;" /> |
|||
</el-form-item> |
|||
</el-form> |
|||
<div class="fields-list"> |
|||
<el-form ref="form" :model="formData" size="small" label-width="75px"> |
|||
<el-row v-for="(item, index) in formData.fields" :key="item.id" :gutter="10"> |
|||
<el-col :span="13"> |
|||
<el-form-item label="组成字段"> |
|||
<el-input v-model="item.fieldCnName" :disabled="true" /> |
|||
</el-form-item> |
|||
</el-col> |
|||
<el-col :span="10"> |
|||
<el-form-item label="排序方式"> |
|||
<el-radio-group> |
|||
<el-radio v-model="formData.fields[index].isOrderType" :label="asc">升序</el-radio> |
|||
<el-radio v-model="formData.fields[index].isOrderType" :label="desc">降序</el-radio> |
|||
</el-radio-group> |
|||
</el-form-item> |
|||
</el-col> |
|||
</el-row> |
|||
</el-form> |
|||
</div> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="text" @click="crud.cancelCU"> |
|||
取消 |
|||
</el-button> |
|||
<el-button :loading="crud.status.cu === 2" type="primary" @click="crud.submitCU"> |
|||
确认 |
|||
</el-button> |
|||
<el-button type="primary" @click="submitCU">保存</el-button> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
import { form } from '@crud/crud' |
|||
|
|||
const defaultForm = { |
|||
id: null, |
|||
fieldCnName: '', |
|||
fieldName: '', |
|||
isDataType: 1, |
|||
isColumnLength: 100, |
|||
isDefaultValue: '' |
|||
} |
|||
export default { |
|||
mixins: [form(defaultForm)], |
|||
data() { |
|||
var checkMaxLength = (rule, value, callback) => { |
|||
if (value !== undefined && (!Number.isInteger(value) || value <= 0)) { |
|||
callback(new Error('请输入正整数数字值')) |
|||
} else { |
|||
if (this.form.isDataType === 1 && value > 2000) { |
|||
callback(new Error('字符最大长度不能超过2000位')) |
|||
} else if (this.form.isDataType === 2 && value > 11) { |
|||
callback(new Error('数字最大长度不能超过11位')) |
|||
} else { |
|||
callback() |
|||
} |
|||
} |
|||
} |
|||
var checkFieldName = (rule, value, callback) => { |
|||
const reg = /^[A-Za-z][A-Za-z_]+[a-zA-Z]*$/ |
|||
if (reg.test(value)) { |
|||
callback() |
|||
} else { |
|||
callback(new Error('字段标识只能由字母、字符“_”组成,并且必须以字母开头和结尾')) |
|||
} |
|||
} |
|||
return { |
|||
rules: { |
|||
fieldCnName: [ |
|||
{ required: true, message: '请输入中文名称', trigger: 'blur' } |
|||
], |
|||
fieldName: [ |
|||
{ required: true, message: '请选择字段标识', trigger: 'blur' }, |
|||
{ validator: checkFieldName, trigger: 'blur' } |
|||
], |
|||
isDataType: [ |
|||
{ required: true, message: '请选择数据类型', trigger: 'blur' } |
|||
], |
|||
isColumnLength: [ |
|||
{ validator: checkMaxLength, trigger: 'blur' } |
|||
] |
|||
}, |
|||
options: [ |
|||
{ |
|||
value: 1, |
|||
label: '字符' |
|||
}, |
|||
{ |
|||
value: 2, |
|||
label: '数字' |
|||
} |
|||
] |
|||
cuDialogVisible: false, |
|||
formData: {} |
|||
} |
|||
}, |
|||
methods: { |
|||
submitCU() { |
|||
console.log(2) |
|||
// this.cuDialogVisible = false |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style rel="stylesheet/scss" lang="scss" scoped> |
|||
::v-deep .el-input-number .el-input__inner { |
|||
text-align: left; |
|||
.fields-list { |
|||
max-height: calc(100vh - 312px); |
|||
overflow-x: hidden; |
|||
overflow-y: auto; |
|||
position: relative; |
|||
} |
|||
</style> |
@ -0,0 +1,63 @@ |
|||
<template> |
|||
<!--表单组件--> |
|||
<el-dialog title="排序" :visible.sync="sortVisible" @opened="opened"> |
|||
<span class="dialog-right-top" /> |
|||
<span class="dialog-left-bottom" /> |
|||
<div class="setting-dialog"> |
|||
<i class="drag-tip">提示:请通过拖动鼠标来调整当前顺序</i> |
|||
<el-table :data="sortTableData" class="ordering-rule-sort" style="width: 100%;max-height: 70vh;" row-key="id"> |
|||
<el-table-column type="index" label="序号" width="100" align="center" /> |
|||
<el-table-column prop="fieldCnName" label="字段名称" /> |
|||
</el-table> |
|||
<div slot="footer" class="dialog-footer"> |
|||
<el-button type="primary" @click.native="handleSort">保存</el-button> |
|||
</div> |
|||
</div> |
|||
</el-dialog> |
|||
</template> |
|||
|
|||
<script> |
|||
import Sortable from 'sortablejs' |
|||
|
|||
export default { |
|||
data() { |
|||
return { |
|||
sortVisible: false, |
|||
sortTableData: [] |
|||
} |
|||
}, |
|||
methods: { |
|||
// 行拖拽 |
|||
rowDrop(className, targetName) { |
|||
// 此时找到的元素是要拖拽元素的父容器 |
|||
const tbody = document.querySelector('.' + className + ' .el-table__body-wrapper tbody') |
|||
const that = this |
|||
Sortable.create(tbody, { |
|||
// 指定父元素下可被拖拽的子元素 |
|||
draggable: '.el-table__row', |
|||
onEnd({ newIndex, oldIndex }) { |
|||
if (newIndex === oldIndex) return |
|||
that[targetName].splice(newIndex, 0, that[targetName].splice(oldIndex, 1)[0]) |
|||
} |
|||
}) |
|||
}, |
|||
opened() { |
|||
this.rowDrop('ordering-rule-sort', 'sortTableData') |
|||
}, |
|||
handleSort() { |
|||
|
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.drag-tip { |
|||
display: block; |
|||
padding-left: 20px; |
|||
padding-bottom: 10px; |
|||
font-style: normal; |
|||
font-weight: bold; |
|||
color: #fff; |
|||
} |
|||
</style> |
Write
Preview
Loading…
Cancel
Save
Reference in new issue