liu_li
/
yxk-storeroom-system
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

系统字段管理，文件字段管理添加

master
z_yu 3 years ago
parent
88da6e132a
commit
0a3208b58e
5 changed files with 461 additions and 11 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      src/views/archivesConfig/commonFields/index.vue
  2. 139
      src/views/archivesConfig/electronicFields/index.vue
  3. 96
      src/views/archivesConfig/electronicFields/module/form.vue
  4. 139
      src/views/archivesConfig/systemFields/index.vue
  5. 96
      src/views/archivesConfig/systemFields/module/form.vue

2
src/views/archivesConfig/commonFields/index.vue
View File

@ -7,7 +7,7 @@
<crudOperation :permission="permission" />
</div>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" height="calc(100vh - 290px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
<el-table-column type="selection" width="55" />
<el-table-column type="index" label="序号" width="55" />
<el-table-column prop="field_cn_name" label="中文名称" />

139
src/views/archivesConfig/electronicFields/index.vue
View File

@ -1,21 +1,150 @@
<template>
<div class="app-container">电子文件字段管理</div>
<div class="app-container container-wrap">
<span class="right-top-line" />
<span class="left-bottom-line" />
<!--工具栏-->
<div class="head-container">
<crudOperation :permission="permission" />
</div>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" height="calc(100vh - 290px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
<el-table-column type="selection" width="55" />
<el-table-column type="index" label="序号" width="55" />
<el-table-column prop="field_cn_name" label="中文名称" />
<el-table-column prop="field_name" label="字段标识" />
<el-table-column label="数据类型">
<template slot-scope="scope">
<span v-if="scope.row.is_data_type === 1">字符</span>
<span v-if="scope.row.is_data_type === 2">数字</span>
</template>
</el-table-column>
<el-table-column prop="is_column_length" label="字段长度" />
<el-table-column label="默认值">
<template slot-scope="scope">
<span v-if="scope.row.is_default_value === ''">-</span>
<span v-else>{{ scope.row.is_default_value }}</span>
</template>
</el-table-column>
</el-table>
<!--表单渲染-->
<eForm />
<el-dialog title="关键提示" :visible.sync="verifyDialogVisible" width="35%" :before-close="handleClose">
<span class="dialog-right-top" />
<span class="dialog-left-bottom" />
<div class="setting-dialog">
<p><span>这里为技术人员维护系统时使用，用户无需设置</span></p>
<p><span style="color:red;">注意：强行修改会导致系统数据异常或丢失！如因用户强行修改，本系统不负责因此导致的相关后果！</span></p>
<el-form :model="form">
<el-form-item label="技术维护验证码" :label-width="formLabelWidth">
<el-input v-model="form.verifyCode" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click.native="handleConfirm">确定验证</el-button>
</span>
</div>
</el-dialog>
</div>
</template>
<script>
import crudFields from '@/api/archivesConfig/field'
import eForm from './module/form'
import CRUD, { presenter } from '@crud/crud'
import crudOperation from '@crud/CRUD.operation'
export default {
name: 'ElectronicFields',
name: 'CommonFields',
components: { eForm, crudOperation },
cruds() {
return CRUD({
title: '电子文件字段',
url: 'api/field/findGroupType',
crudMethod: { ...crudFields },
optShow: {
add: true,
edit: true,
del: false,
download: false,
group: false
},
query: {
is_type: 3
}
})
},
mixins: [presenter()],
data() {
return {
permission: {
add: ['admin', 'electronicFields:add'],
edit: ['admin', 'electronicFields:edit']
},
verifyDialogVisible: false,
form: {
verifyCode: ''
},
formLabelWidth: '110px',
btn: '',
showVerifyDialog: true
}
},
mounted: function() {
},
methods: {
[CRUD.HOOK.beforeToCU](crud, form, btn) {
console.log(btn)
if (this.showVerifyDialog) {
// 打开输入验证码对话框
this.verifyDialogVisible = true
this.btn = btn
return false
}
},
handleConfirm() {
if (this.form.verifyCode === '123') {
// 关闭输入验证码对话框
this.verifyDialogVisible = false
this.form.verifyCode = ''
this.showVerifyDialog = false
if (this.btn === 'add') {
this.crud.toAdd()
} else if (this.btn === 'edit') {
this.crud.toEdit(this.crud.selections[0])
}
this.showVerifyDialog = true
} else {
this.$message.error('验证码错误！')
}
},
handleClose(done) {
this.form.verifyCode = ''
done()
},
clickRowHandler(row) {
this.$refs.table.clearSelection()
this.$refs.table.toggleRowSelection(row)
},
selectionChangeHandler(val) {
if (val.length > 1) {
// 取出最后val的最后一个返回出来
const finalVal = val.pop()
// 清除所有选中
this.$refs.table.clearSelection()
// 给最后一个加上选中
this.$refs.table.toggleRowSelection(finalVal)
this.crud.selectionChangeHandler([finalVal])
} else {
this.crud.selectionChangeHandler(val)
}
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep thead .el-table-column--selection .cell {
display: none;
}
::v-deep div.el-dialog__footer {
text-align: center;
}
</style>

96
src/views/archivesConfig/electronicFields/module/form.vue
View File

@ -0,0 +1,96 @@
<template>
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title" width="500px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="中文名称" prop="field_cn_name">
<el-input v-model="form.field_cn_name" style="width: 370px;" />
</el-form-item>
<el-form-item label="字段标识" prop="field_name">
<el-input v-model="form.field_name" style="width: 370px;" />
</el-form-item>
<el-form-item label="数据类型" prop="is_data_type">
<el-select v-model="form.is_data_type" 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="is_column_length">
<el-input-number v-model="form.is_column_length" controls-position="right" style="width: 370px;" />
</el-form-item>
<el-form-item label="默认值" prop="is_default_value">
<el-input v-model="form.is_default_value" style="width: 370px;" />
</el-form-item>
</el-form>
<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>
</div>
</el-dialog>
</template>
<script>
import { form } from '@crud/crud'
const defaultForm = {
id: null,
field_cn_name: '',
field_name: '',
is_data_type: 1,
is_column_length: 100,
is_default_value: ''
}
export default {
mixins: [form(defaultForm)],
data() {
var checkMaxLength = (rule, value, callback) => {
if (!Number.isInteger(value) || value <= 0) {
callback(new Error('请输入正整数数字值'))
} else {
if (this.form.is_data_type === 1 && value > 2000) {
callback(new Error('字符最大长度不能超过2000位'))
} else if (this.form.is_data_type === 2 && value > 11) {
callback(new Error('数字最大长度不能超过11位'))
} else {
callback()
}
}
}
return {
rules: {
field_cn_name: [
{ required: true, message: '请输入中文名称', trigger: 'blur' }
],
field_name: [
{ required: true, message: '请输入字段标识', trigger: 'blur' }
],
is_data_type: [
{ required: true, message: '请选择数据类型', trigger: 'blur' }
],
is_column_length: [
{ validator: checkMaxLength, trigger: 'blur' }
]
},
options: [
{
value: 1,
label: '字符',
maxlength: 2000
},
{
value: 2,
label: '数字',
maxlength: 11
}
]
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
</style>

139
src/views/archivesConfig/systemFields/index.vue
View File

@ -1,21 +1,150 @@
<template>
<div class="app-container">系统字段管理</div>
<div class="app-container container-wrap">
<span class="right-top-line" />
<span class="left-bottom-line" />
<!--工具栏-->
<div class="head-container">
<crudOperation :permission="permission" />
</div>
<!--表格渲染-->
<el-table ref="table" v-loading="crud.loading" :data="crud.data" style="width: 100%;" height="calc(100vh - 290px)" @selection-change="selectionChangeHandler" @row-click="clickRowHandler">
<el-table-column type="selection" width="55" />
<el-table-column type="index" label="序号" width="55" />
<el-table-column prop="field_cn_name" label="中文名称" />
<el-table-column prop="field_name" label="字段标识" />
<el-table-column label="数据类型">
<template slot-scope="scope">
<span v-if="scope.row.is_data_type === 1">字符</span>
<span v-if="scope.row.is_data_type === 2">数字</span>
</template>
</el-table-column>
<el-table-column prop="is_column_length" label="字段长度" />
<el-table-column label="默认值">
<template slot-scope="scope">
<span v-if="scope.row.is_default_value === ''">-</span>
<span v-else>{{ scope.row.is_default_value }}</span>
</template>
</el-table-column>
</el-table>
<!--表单渲染-->
<eForm />
<el-dialog title="关键提示" :visible.sync="verifyDialogVisible" width="35%" :before-close="handleClose">
<span class="dialog-right-top" />
<span class="dialog-left-bottom" />
<div class="setting-dialog">
<p><span>这里为技术人员维护系统时使用，用户无需设置</span></p>
<p><span style="color:red;">注意：强行修改会导致系统数据异常或丢失！如因用户强行修改，本系统不负责因此导致的相关后果！</span></p>
<el-form :model="form">
<el-form-item label="技术维护验证码" :label-width="formLabelWidth">
<el-input v-model="form.verifyCode" />
</el-form-item>
</el-form>
<span slot="footer" class="dialog-footer">
<el-button type="primary" @click.native="handleConfirm">确定验证</el-button>
</span>
</div>
</el-dialog>
</div>
</template>
<script>
import crudFields from '@/api/archivesConfig/field'
import eForm from './module/form'
import CRUD, { presenter } from '@crud/crud'
import crudOperation from '@crud/CRUD.operation'
export default {
name: 'SystemFields',
name: 'CommonFields',
components: { eForm, crudOperation },
cruds() {
return CRUD({
title: '系统字段',
url: 'api/field/findGroupType',
crudMethod: { ...crudFields },
optShow: {
add: true,
edit: true,
del: false,
download: false,
group: false
},
query: {
is_type: 1
}
})
},
mixins: [presenter()],
data() {
return {
permission: {
add: ['admin', 'systemFields:add'],
edit: ['admin', 'systemFields:edit']
},
verifyDialogVisible: false,
form: {
verifyCode: ''
},
formLabelWidth: '110px',
btn: '',
showVerifyDialog: true
}
},
mounted: function() {
},
methods: {
[CRUD.HOOK.beforeToCU](crud, form, btn) {
console.log(btn)
if (this.showVerifyDialog) {
// 打开输入验证码对话框
this.verifyDialogVisible = true
this.btn = btn
return false
}
},
handleConfirm() {
if (this.form.verifyCode === '123') {
// 关闭输入验证码对话框
this.verifyDialogVisible = false
this.form.verifyCode = ''
this.showVerifyDialog = false
if (this.btn === 'add') {
this.crud.toAdd()
} else if (this.btn === 'edit') {
this.crud.toEdit(this.crud.selections[0])
}
this.showVerifyDialog = true
} else {
this.$message.error('验证码错误！')
}
},
handleClose(done) {
this.form.verifyCode = ''
done()
},
clickRowHandler(row) {
this.$refs.table.clearSelection()
this.$refs.table.toggleRowSelection(row)
},
selectionChangeHandler(val) {
if (val.length > 1) {
// 取出最后val的最后一个返回出来
const finalVal = val.pop()
// 清除所有选中
this.$refs.table.clearSelection()
// 给最后一个加上选中
this.$refs.table.toggleRowSelection(finalVal)
this.crud.selectionChangeHandler([finalVal])
} else {
this.crud.selectionChangeHandler(val)
}
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep thead .el-table-column--selection .cell {
display: none;
}
::v-deep div.el-dialog__footer {
text-align: center;
}
</style>

96
src/views/archivesConfig/systemFields/module/form.vue
View File

@ -0,0 +1,96 @@
<template>
<el-dialog :close-on-click-modal="false" :before-close="crud.cancelCU" :visible="crud.status.cu > 0" :title="crud.status.title" width="500px">
<el-form ref="form" :model="form" :rules="rules" size="small" label-width="80px">
<el-form-item label="中文名称" prop="field_cn_name">
<el-input v-model="form.field_cn_name" style="width: 370px;" />
</el-form-item>
<el-form-item label="字段标识" prop="field_name">
<el-input v-model="form.field_name" style="width: 370px;" />
</el-form-item>
<el-form-item label="数据类型" prop="is_data_type">
<el-select v-model="form.is_data_type" 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="is_column_length">
<el-input-number v-model="form.is_column_length" controls-position="right" style="width: 370px;" />
</el-form-item>
<el-form-item label="默认值" prop="is_default_value">
<el-input v-model="form.is_default_value" style="width: 370px;" />
</el-form-item>
</el-form>
<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>
</div>
</el-dialog>
</template>
<script>
import { form } from '@crud/crud'
const defaultForm = {
id: null,
field_cn_name: '',
field_name: '',
is_data_type: 1,
is_column_length: 100,
is_default_value: ''
}
export default {
mixins: [form(defaultForm)],
data() {
var checkMaxLength = (rule, value, callback) => {
if (!Number.isInteger(value) || value <= 0) {
callback(new Error('请输入正整数数字值'))
} else {
if (this.form.is_data_type === 1 && value > 2000) {
callback(new Error('字符最大长度不能超过2000位'))
} else if (this.form.is_data_type === 2 && value > 11) {
callback(new Error('数字最大长度不能超过11位'))
} else {
callback()
}
}
}
return {
rules: {
field_cn_name: [
{ required: true, message: '请输入中文名称', trigger: 'blur' }
],
field_name: [
{ required: true, message: '请输入字段标识', trigger: 'blur' }
],
is_data_type: [
{ required: true, message: '请选择数据类型', trigger: 'blur' }
],
is_column_length: [
{ validator: checkMaxLength, trigger: 'blur' }
]
},
options: [
{
value: 1,
label: '字符',
maxlength: 2000
},
{
value: 2,
label: '数字',
maxlength: 11
}
]
}
}
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
::v-deep .el-input-number .el-input__inner {
text-align: left;
}
</style>
Write Preview
Loading…
Cancel
Save