| | |
| | | <template> |
| | | <div> |
| | | <div class="body" :style="{height:mainHeight+'px'}"> |
| | | <div style="padding: 10px 5px 0 0"> |
| | | <div class="bodyTopFormGroup"> |
| | | <el-form |
| | | ref="form" |
| | | :model="form" |
| | | label-width="80px" |
| | | label-width="100px" |
| | | inline |
| | | style="display: flex;justify-content: space-between" |
| | | > |
| | | <div class="elForm"> |
| | | <el-form-item label="编码名称" style=" display: flex;"> |
| | | <div class="elForm" style="justify-content: flex-start"> |
| | | <el-form-item label="编码名称" label-width="70px" style=" display: flex;"> |
| | | <el-input v-model="form.rightname" placeholder="请输入" style="width: 200px" /> |
| | | </el-form-item> |
| | | <el-form-item label="固定字符" style=" display: flex;"> |
| | |
| | | <el-button type="info" icon="el-icon-refresh" @click="reset">重置</el-button> |
| | | </div> |
| | | </el-form> |
| | | <div |
| | | class="bodyTopFormExpand" |
| | | /> |
| | | </div> |
| | | <el-divider /> |
| | | |
| | | <div style="margin-left: 10px;display: flex"> |
| | | <!-- <el-button type="primary" icon="el-icon-circle-plus-outline" @click="add('add')">新增</el-button>--> |
| | | <!-- <el-button type="primary" icon="el-icon-upload2" @click="upload">导入</el-button>--> |
| | |
| | | <!-- <el-divider />--> |
| | | <div class="elTableDiv"> |
| | | <el-table |
| | | ref="tableDataRef" |
| | | class="tableFixed" |
| | | :data="tableData" |
| | | :height="tableHeight" |
| | | border |
| | | stripe |
| | | :row-class-name="tableRowClassName" |
| | | :style="{width: 100+'%',height:tableHeight+'px',}" |
| | | highlight-current-row |
| | | :header-cell-style="this.$headerCellStyle" |
| | |
| | | prop="RowNum" |
| | | width="50" |
| | | label="序号" |
| | | fixed |
| | | /> |
| | | <el-table-column |
| | | prop="right_code" |
| | | label="编码" |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="right_name" |
| | |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="Type" |
| | | label="类型" |
| | | sortable="custom" |
| | | /> |
| | | <el-table-column |
| | | prop="prefix" |
| | | label="前缀" |
| | | label="固定字符" |
| | | sortable="custom" |
| | | > |
| | | <template slot-scope="{row}"> |
| | |
| | | </el-table-column> |
| | | <el-table-column |
| | | label="操作" |
| | | fixed="right" |
| | | width="120" |
| | | > |
| | | <template slot-scope="{row}"> |
| | | <div class="operationClass"> |
| | | <el-button type="text" @click="edit('edit',row)">修改</el-button> |
| | | <el-tooltip class="item" effect="dark" content="编辑" placement="top"> |
| | | <i class="el-icon-edit-outline" @click="edit('edit',row)" /> |
| | | </el-tooltip> |
| | | <!-- <el-button type="text" @click="edit('edit',row)">编辑</el-button>--> |
| | | <!-- <el-button type="text" @click="del(row)">删除</el-button>--> |
| | | </div> |
| | | </template> |
| | |
| | | </div> |
| | | <!--分页--> |
| | | <pagination |
| | | v-show="total>0" |
| | | :total="total" |
| | | :page.sync="form.page" |
| | | :limit.sync="form.rows" |
| | | align="right" |
| | | layout="prev, pager, next,sizes" |
| | | layout="total,prev, pager, next,sizes" |
| | | popper-class="select_bottom" |
| | | @pagination="getEncodingRules" |
| | | /> |
| | |
| | | > |
| | | <el-form ref="dialogForm" :rules="dialogFormRules" :model="dialogForm" label-width="80px"> |
| | | |
| | | <el-form-item label="固定字符" prop="OrgName"> |
| | | <el-input v-model="dialogForm.OrgName" style="width: 220px" /> |
| | | <el-form-item label="固定字符" prop="prefix"> |
| | | <el-input v-model="dialogForm.prefix" style="width: 220px" /> |
| | | </el-form-item> |
| | | <el-form-item prop="SupUnit" label="提交日期"> |
| | | <el-form-item prop="filingdate" label="提交日期"> |
| | | <el-select |
| | | v-model="dialogForm.SupUnit" |
| | | v-model="dialogForm.filingdate" |
| | | style="width: 220px" |
| | | filterable |
| | | placeholder="请选择" |
| | | :popper-append-to-body="false" |
| | | > |
| | |
| | | /> |
| | | </el-select> |
| | | </el-form-item> |
| | | <el-form-item label="自增位数" prop="OrgName"> |
| | | <el-input v-model="dialogForm.OrgName" style="width: 220px" /> |
| | | <el-form-item label="自增位数" prop="incbit"> |
| | | <!-- @change="handleChange"--> |
| | | <!-- <el-input-number v-model="dialogForm.incbit" :min="1" :max="100" label="描述文字" />--> |
| | | |
| | | <el-input |
| | | v-model="dialogForm.incbit" |
| | | oninput="value=value.replace(/[^0-9]/g,'')" |
| | | style="width: 220px" |
| | | /> |
| | | </el-form-item> |
| | | <el-form-item label="编码预览"> |
| | | <!-- <el-input v-model="dialogForm.OrgName" style="width: 220px" />--> |
| | | xxxx |
| | | {{ encodingPre }} |
| | | </el-form-item> |
| | | </el-form> |
| | | |
| | |
| | | |
| | | <script> |
| | | import Pagination from '@/components/Pagination' |
| | | import { AddUpdateOrganization, DeleteOrganization, OrganizationSearch, PrentOrganization } from '@/api/jcsz' |
| | | import { getCookie } from '@/utils/auth' |
| | | import { EncodingRules } from '@/api/xtsz' |
| | | import { EncodingRules, SaveEncodingRules } from '@/api/xtsz' |
| | | |
| | | const SER_HZ = /^[\u4e00-\u9fa5]+$/ |
| | | export default { |
| | | name: 'Zzjg', |
| | | name: 'BMGZ', |
| | | components: { |
| | | Pagination |
| | | }, |
| | |
| | | rows: 20 // 每页多少条 |
| | | }, |
| | | dateType: [ |
| | | { label: '年', value: 'Y' }, |
| | | { label: '月', value: 'M' }, |
| | | { label: '日', value: 'D' } |
| | | { label: '年月日', value: 'YMD' }, |
| | | { label: '年月', value: 'YM' }, |
| | | { label: '年', value: 'Y' } |
| | | ], |
| | | |
| | | total: 10, |
| | | tableData: [], |
| | | dialogVisible: false, |
| | | dialogForm: { |
| | | OrgType: '', |
| | | OrgCode: '', |
| | | OrgName: '', |
| | | SupUnit: ''// 上级单位 |
| | | rightcode: '', // 功能编码 |
| | | rightname: '', // 功能名称 |
| | | prefix: '', // 固定字符 |
| | | filingdate: '', // 提交日期 |
| | | incbit: '' // 自增位数 |
| | | }, |
| | | operation: '', |
| | | encodingPre: '', // 编码预览 |
| | | dialogFormRules: { |
| | | // OrgCode: [ |
| | | // { required: true, validator: validateName, trigger: ['blur', 'change'] } |
| | | // ], |
| | | OrgName: [ |
| | | { required: true, message: '请输入名称', trigger: ['blur', 'change'] } |
| | | ] |
| | | // OrgName: [ |
| | | // { required: true, message: '请输入名称', trigger: ['blur', 'change'] } |
| | | // ] |
| | | } |
| | | |
| | | } |
| | | }, |
| | | watch: { |
| | | dialogForm: { |
| | | handler(newValue, oldValue) { |
| | | const date = new Date() |
| | | let newDate = '' |
| | | if (newValue.filingdate === 'YMD') { |
| | | newDate = date.getFullYear().toString().substring(2, 4) + '' + (date.getMonth() + 1 + '').padStart(2, '0') + '' + (date.getDate() + '').padStart(2, '0') |
| | | } else if (newValue.filingdate === 'YM') { |
| | | newDate = date.getFullYear().toString().substring(2, 4) + '' + (date.getMonth() + 1 + '').padStart(2, '0') |
| | | } else if (newValue.filingdate === 'Y') { |
| | | newDate = date.getFullYear().toString().substring(2, 4) + '' |
| | | } |
| | | this.encodingPre = newValue.prefix + '' + newDate + '' + (1 + '').padStart(newValue.incbit, '0') |
| | | }, |
| | | immediate: true, |
| | | deep: true |
| | | } |
| | | }, |
| | | created() { |
| | |
| | | this.getHeight() |
| | | }, |
| | | methods: { |
| | | tableRowClassName({ row, rowIndex }) { |
| | | return 'custom-row' |
| | | }, |
| | | async getEncodingRules() { |
| | | const res = await EncodingRules(this.form) |
| | | this.tableData = res.data |
| | | this.total = res.count |
| | | // this.tableData = [ |
| | | // { code: 123, name: 'xxx1' } |
| | | // ] |
| | | // this.total = 10 |
| | | }, |
| | | // 排序改变时 |
| | | sortChange({ column, prop, order }) { |
| | |
| | | }, |
| | | // 重置 |
| | | reset() { |
| | | this.form.OrgCode = '' |
| | | this.form.OrgName = '' |
| | | this.form.OrgType = '' |
| | | this.form.UserName = '' |
| | | this.form.rightname = '' |
| | | this.form.prefix = '' |
| | | this.getEncodingRules() |
| | | }, |
| | | |
| | |
| | | this.dialogVisible = true |
| | | |
| | | this.$nextTick(() => { |
| | | this.dialogForm.OrgCode = row.org_code |
| | | this.dialogForm.OrgName = row.org_name |
| | | this.dialogForm.SupUnit = row.parent_id |
| | | this.dialogForm.rightcode = row.right_code |
| | | this.dialogForm.rightname = row.right_name |
| | | this.dialogForm.filingdate = this.dateType.find(item => item.label === row.filingdate).value |
| | | this.dialogForm.incbit = row.incbit |
| | | this.dialogForm.prefix = row.prefix |
| | | }) |
| | | }, |
| | | // 删除按钮 |
| | | async del(row) { |
| | | this.$confirm('是否确认删除?', '提示', { |
| | | confirmButtonText: '确定', |
| | | cancelButtonText: '取消', |
| | | type: 'warning' |
| | | }).then(() => { |
| | | DeleteOrganization({ orgid: row.code }).then(res => { |
| | | if (res.code === '200') { |
| | | this.$message.success('删除成功!') |
| | | this.getEncodingRules() |
| | | } |
| | | }) |
| | | }).catch(() => { |
| | | this.$message.info('已取消删除') |
| | | }) |
| | | // this.$confirm('是否确认删除?', '提示', { |
| | | // confirmButtonText: '确定', |
| | | // cancelButtonText: '取消', |
| | | // type: 'warning' |
| | | // }).then(() => { |
| | | // DeleteOrganization({ orgid: row.code }).then(res => { |
| | | // if (res.code === '200') { |
| | | // this.$message.success('删除成功!') |
| | | // this.getEncodingRules() |
| | | // } |
| | | // }) |
| | | // }).catch(() => { |
| | | // this.$message.info('已取消删除') |
| | | // }) |
| | | }, |
| | | // 对话框关闭事件 |
| | | handleClose() { |
| | | this.dialogForm.OrgType = '' |
| | | this.dialogForm.OrgCode = '' |
| | | this.dialogForm.OrgName = '' |
| | | this.dialogForm.SupUnit = '' |
| | | this.dialogForm.rightcode = '' |
| | | this.dialogForm.rightname = '' |
| | | this.dialogForm.filingdate = '' |
| | | this.dialogForm.incbit = '' |
| | | this.dialogForm.prefix = '' |
| | | this.$refs.dialogForm.clearValidate() |
| | | }, |
| | | // 对话框取消 |
| | |
| | | this.$refs.dialogForm.validate(valid => { |
| | | if (valid) { |
| | | const data = { |
| | | OrganCode: this.dialogForm.OrgCode, |
| | | OrganName: this.dialogForm.OrgName, |
| | | OperType: this.operation === 'add' ? 'Add' : 'Update', |
| | | Operator: getCookie('admin') |
| | | rightcode: this.dialogForm.rightcode, |
| | | rightname: this.dialogForm.rightname, |
| | | incbit: this.dialogForm.incbit, |
| | | // filingdate: this.dialogForm.filingdate, |
| | | filingdate: this.dateType.find(item => item.value === this.dialogForm.filingdate).label, |
| | | prefix: this.dialogForm.prefix |
| | | } |
| | | AddUpdateOrganization(data).then(res => { |
| | | console.log(data) |
| | | SaveEncodingRules(data).then(res => { |
| | | if (res.code === '200') { |
| | | this.$message.success(this.operation === 'add' ? '添加成功!' : '修改成功!') |
| | | this.dialogVisible = false |
| | |
| | | // 获取页面高度 |
| | | getHeight() { |
| | | this.$nextTick(() => { |
| | | this.mainHeight = window.innerHeight - 250 |
| | | this.tableHeight = this.mainHeight |
| | | this.mainHeight = window.innerHeight - 85 |
| | | this.tableHeight = this.mainHeight - 135 |
| | | this.$refs.tableDataRef.doLayout() |
| | | }) |
| | | } |
| | | } |
| | |
| | | |
| | | <style lang="scss" scoped> |
| | | $main_color: #42b983; |
| | | ::v-deep .el-button--primary { |
| | | background-color: $main_color !important; |
| | | height: 30px; |
| | | display: flex; |
| | | align-items: center; |
| | | //border: 1px solid $main_color; |
| | | border: none; |
| | | padding: 0 20px; |
| | | } |
| | | ::v-deep .el-button--primary:hover { |
| | | border: none; |
| | | } |
| | | ::v-deep .el-button--info { |
| | | height: 30px; |
| | | display: flex; |
| | | align-items: center; |
| | | padding: 0 20px; |
| | | |
| | | ::v-deep .el-input-number__decrease,::v-deep .el-input-number__increase { |
| | | background-color: $main_color; |
| | | color: #FFFFFF; |
| | | line-height: 31px; |
| | | height: 31px; |
| | | margin-top: 3px; |
| | | } |
| | | |
| | | ::v-deep .el-pagination.is-background .el-pager li:not(.disabled).active { |
| | | background-color: $main_color !important; |
| | | </style> |
| | | |
| | | <!--公共页面样式--> |
| | | <style lang="scss" scoped> |
| | | $main_color: #42b983; |
| | | .el-icon-share ,.el-icon-delete,.el-icon-edit-outline{ |
| | | color: $main_color; |
| | | cursor: pointer; |
| | | } |
| | | .el-icon-edit-outline{ |
| | | margin-right: 15px; |
| | | } |
| | | |
| | | ::v-deep .el-button--primary, .el-button--default, .el-button--info { |
| | | height: 34px; |
| | | display: flex; |
| | | align-items: center; |
| | | padding: 0 15px; |
| | | } |
| | | |
| | | ::v-deep .el-button--primary { |
| | | //background-color: $main_color !important; |
| | | } |
| | | |
| | | ::v-deep .el-button--default { |
| | | background-color: #f8f8fa; |
| | | border: none; |
| | | } |
| | | |
| | | ::v-deep .el-input__inner { |
| | | height: 34px; |
| | | line-height: 34px; |
| | | //color: #a7a7a7; |
| | | } |
| | | |
| | | ::v-deep .el-dialog__body { |
| | | padding: 20px 100px !important; |
| | | } |
| | | |
| | | ::v-deep .dialogVisibleRoles .el-dialog__body { |
| | | padding: 20px 20px !important; |
| | | } |
| | | |
| | | ::v-deep .importPickerClass .el-dialog__body { |
| | | padding: 20px 20px !important; |
| | | } |
| | | |
| | | ::v-deep .el-dialog__footer { |
| | |
| | | justify-content: flex-end; |
| | | } |
| | | |
| | | .footerButton { |
| | | display: flex; |
| | | justify-content: end; |
| | | } |
| | | |
| | | ::v-deep .el-button--default { |
| | | background-color: #ffffff !important; |
| | | height: 30px; |
| | | display: flex; |
| | | align-items: center; |
| | | padding: 0 20px; |
| | | } |
| | | |
| | | ::v-deep .el-button--default:hover { |
| | | color: #606266; |
| | | } |
| | | |
| | | ::v-deep .el-dialog__body { |
| | | padding: 20px 100px !important; |
| | | } |
| | | |
| | | ::v-deep .el-radio__input.is-checked .el-radio__inner { |
| | | background-color: $main_color; |
| | | border-color: $main_color; |
| | | } |
| | | |
| | | ::v-deep .el-radio__input.is-checked + .el-radio__label { |
| | | color: $main_color !important; |
| | | } |
| | | |
| | | ::v-deep .el-checkbox__input.is-checked .el-checkbox__inner { |
| | | border-color: $main_color; |
| | | background-color: $main_color; |
| | | } |
| | | |
| | | ::v-deep .el-input__inner { |
| | | height: 30px; |
| | | line-height: 30px; |
| | | } |
| | | ::v-deep .el-input__inner:focus { |
| | | border-color: $main_color; |
| | | } |
| | | |
| | | ::v-deep .el-table .caret-wrapper { |
| | | transform: scale(0.8); |
| | | } |
| | | |
| | | ::v-deep .cell { |
| | | display: flex !important; |
| | | align-items: center !important; |
| | | justify-content: space-between !important; |
| | | } |
| | | |
| | | ::v-deep .el-button--text { |
| | | color: $main_color; |
| | | font-size: 14px; |
| | | cursor: pointer; |
| | | } |
| | | |
| | | .operationClass { |
| | | height: 23px; |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | justify-content: space-between; |
| | | } |
| | | |
| | | .el-icon-share { |
| | | color: $main_color; |
| | | cursor: pointer; |
| | | ::v-deep .el-table::before { |
| | | height: 0; |
| | | } |
| | | |
| | | .el-checkbox.is-bordered.is-checked { |
| | | border-color: $main_color; |
| | | ::v-deep .el-table__body-wrapper { |
| | | background-color: #f8f8fa; |
| | | } |
| | | |
| | | ::v-deep .el-radio__input.is-checked .el-radio__inner { |
| | | border-color: $main_color; |
| | | background: $main_color; |
| | | ::v-deep .el-table__body .el-table__row.hover-row td{ |
| | | background-color: #eaecef ; |
| | | } |
| | | |
| | | ::v-deep .el-checkbox__input.is-indeterminate .el-checkbox__inner { |
| | | border-color: $main_color; |
| | | background: $main_color; |
| | | } |
| | | |
| | | ::v-deep .el-checkbox__input.is-checked + .el-checkbox__label { |
| | | color: $main_color !important; |
| | | } |
| | | |
| | | ::v-deep .el-checkbox.is-bordered + .el-checkbox.is-bordered { |
| | | margin: 10px 30px 0px 0; |
| | | } |
| | | |
| | | ::v-deep .el-radio__input.is-checked + .el-radio__label { |
| | | color: $main_color; |
| | | } |
| | | |
| | | ::v-deep .el-radio.is-bordered + .el-radio.is-bordered { |
| | | margin: 10px 30px 0px 0; |
| | | ::v-deep .el-form--inline .el-form-item__label { |
| | | color: #a7a7a7; |
| | | } |
| | | |
| | | .body ::v-deep .el-divider { |
| | |
| | | .body ::v-deep .el-form-item { |
| | | margin-bottom: 0; |
| | | } |
| | | .userDialogVisible ::v-deep .el-form-item { |
| | | margin-bottom: 0; |
| | | } |
| | | .tableFixed{ |
| | | ::v-deep .el-table__fixed-right{ |
| | | height: 100% !important; |
| | | } |
| | | ::v-deep .el-table__fixed{ |
| | | height: 100% !important; |
| | | } |
| | | } |
| | | </style> |
| | | <style> |
| | | |
| | | ::v-deep .el-input__inner:focus { |
| | | border-color: $main_color; |
| | | .el-table .custom-row { |
| | | background: #f8f8fa; |
| | | } |
| | | |
| | | ::v-deep .el-select .el-input__inner:focus{ |
| | | border-color: $main_color; |
| | | } |
| | | |
| | | ::v-deep .el-select-dropdown__item.selected{ |
| | | color: $main_color; |
| | | } |
| | | ::v-deep .el-checkbox__inner:hover{ |
| | | border-color: $main_color; |
| | | } |
| | | ::v-deep .el-textarea__inner:focus{ |
| | | border-color: $main_color; |
| | | } |
| | | |
| | | </style> |