|
|
@@ -1,476 +0,0 @@
|
|
|
-<!-- 字典编辑弹窗 -->
|
|
|
-<template>
|
|
|
- <ele-modal
|
|
|
- width="800px"
|
|
|
- :maxable="true"
|
|
|
- :visible="visible"
|
|
|
- :close-on-click-modal="true"
|
|
|
- :title="isUpdate ? '修改字典' : '添加字典'"
|
|
|
- @update:visible="updateVisible"
|
|
|
- >
|
|
|
- <div class="divider">
|
|
|
- <div class="title">
|
|
|
- <div class="ele-bg-primary"></div>
|
|
|
- <span>基本信息</span>
|
|
|
- </div>
|
|
|
- <div class="ele-bg-primary" style="width: 100%; height: 2px"></div>
|
|
|
- </div>
|
|
|
- <el-form
|
|
|
- ref="form"
|
|
|
- :model="form"
|
|
|
- :rules="rules"
|
|
|
- label-width="85px"
|
|
|
- style="margin-bottom: 10px"
|
|
|
- >
|
|
|
- <el-row>
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="字典名称:" prop="name">
|
|
|
- <el-input
|
|
|
- clearable
|
|
|
- :disabled="isUpdate"
|
|
|
- :maxlength="20"
|
|
|
- v-model="form.name"
|
|
|
- placeholder="请输入字典名称"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="字典值:" prop="code">
|
|
|
- <el-input
|
|
|
- clearable
|
|
|
- :disabled="isUpdate"
|
|
|
- :maxlength="20"
|
|
|
- v-model="form.code"
|
|
|
- placeholder="请输入字典值"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="应用类型:" prop="appType">
|
|
|
- <el-radio-group v-model="form.appType">
|
|
|
- <el-radio :label="1">业务字典</el-radio>
|
|
|
- <el-radio :label="2">数据字典</el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <el-col :span="12">
|
|
|
- <el-form-item label="是否启用:" prop="enable">
|
|
|
- <el-radio-group v-model="form.enable">
|
|
|
- <el-radio :label="1">是</el-radio>
|
|
|
- <el-radio :label="0">否</el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- <!-- <el-col :span="12">
|
|
|
- <el-form-item label="排序号:" prop="sortNumber">
|
|
|
- <el-input-number
|
|
|
- :min="0"
|
|
|
- :max="9999"
|
|
|
- v-model="form.sortNumber"
|
|
|
- controls-position="right"
|
|
|
- placeholder="请输入排序号"
|
|
|
- class="ele-fluid ele-text-left"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col> -->
|
|
|
-
|
|
|
- <el-col :span="24">
|
|
|
- <el-form-item label="备注:">
|
|
|
- <el-input
|
|
|
- :rows="4"
|
|
|
- type="textarea"
|
|
|
- :maxlength="200"
|
|
|
- v-model="form.remark"
|
|
|
- placeholder="请输入备注"
|
|
|
- />
|
|
|
- </el-form-item>
|
|
|
- </el-col>
|
|
|
- </el-row>
|
|
|
- </el-form>
|
|
|
- <div class="divider">
|
|
|
- <div class="title">
|
|
|
- <div class="ele-bg-primary"></div>
|
|
|
- <span>字典项配置</span>
|
|
|
- </div>
|
|
|
- <div class="ele-bg-primary" style="width: 100%; height: 2px"></div>
|
|
|
- </div>
|
|
|
- <div style="margin: 5px 0">
|
|
|
- <el-button
|
|
|
- size="small"
|
|
|
- type="primary"
|
|
|
- icon="el-icon-plus"
|
|
|
- class="ele-btn-icon"
|
|
|
- @click="pushArr"
|
|
|
- >
|
|
|
- 添加
|
|
|
- </el-button>
|
|
|
-
|
|
|
- <!-- <el-button
|
|
|
- size="small"
|
|
|
- type="danger"
|
|
|
- icon="el-icon-delete"
|
|
|
- class="ele-btn-icon"
|
|
|
- @click="removeArr"
|
|
|
- >
|
|
|
- 删除
|
|
|
- </el-button> -->
|
|
|
- </div>
|
|
|
- <el-table
|
|
|
- :data="tableData"
|
|
|
- border
|
|
|
- style="width: 100%"
|
|
|
- @selection-change="handleSelectionChange"
|
|
|
- >
|
|
|
- <el-table-column prop="code" label="字典项编码">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-input
|
|
|
- @blur="checkedValue(scope.row.code)"
|
|
|
- v-model="scope.row.code"
|
|
|
- placeholder=""
|
|
|
- ></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="name" label="字典项名称">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-input v-model="scope.row.name" placeholder=""></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="sort" label="排序">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-input
|
|
|
- v-model="scope.row.sort"
|
|
|
- @input="
|
|
|
- scope.row.sort = String(scope.row.sort).replace(/[^\d]/g, '')
|
|
|
- "
|
|
|
- ></el-input>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column prop="enable" label="启用">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-radio-group v-model="scope.row.enable">
|
|
|
- <el-radio :label="1">是</el-radio>
|
|
|
- <el-radio :label="0">否</el-radio>
|
|
|
- </el-radio-group>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- <el-table-column align="center" label="操作">
|
|
|
- <template slot-scope="scope">
|
|
|
- <el-popconfirm
|
|
|
- class="ele-action"
|
|
|
- title="确定要删除此字典项吗?"
|
|
|
- @confirm="removeArr(scope)"
|
|
|
- >
|
|
|
- <template v-slot:reference>
|
|
|
- <el-link type="danger" :underline="false" icon="el-icon-delete">
|
|
|
- 删除
|
|
|
- </el-link>
|
|
|
- </template>
|
|
|
- </el-popconfirm>
|
|
|
- </template>
|
|
|
- </el-table-column>
|
|
|
- </el-table>
|
|
|
-
|
|
|
- <template v-slot:footer>
|
|
|
- <el-button @click="updateVisible(false)">取消</el-button>
|
|
|
- <el-button type="primary" :loading="loading" @click="save">
|
|
|
- 保存
|
|
|
- </el-button>
|
|
|
- </template>
|
|
|
- </ele-modal>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script>
|
|
|
- import { addDictionary, updateDictionary } from '@/api/system/dictionary';
|
|
|
- import {
|
|
|
- pageDictionaryData,
|
|
|
- removeDictionaryData,
|
|
|
- removeDictionaryDataBatch
|
|
|
- } from '@/api/system/dictionary-data';
|
|
|
-
|
|
|
- export default {
|
|
|
- props: {
|
|
|
- // 弹窗是否打开
|
|
|
- visible: Boolean,
|
|
|
- // 修改回显的数据
|
|
|
- id: String | Number
|
|
|
- },
|
|
|
- data() {
|
|
|
- const defaultForm = {
|
|
|
- name: '',
|
|
|
- code: '',
|
|
|
- appType: 1,
|
|
|
- enable: 1,
|
|
|
- remark: '',
|
|
|
- dictStaticSubmitPOList: []
|
|
|
- };
|
|
|
- return {
|
|
|
- defaultForm,
|
|
|
- // 表单数据
|
|
|
- form: { ...defaultForm },
|
|
|
- // form: {
|
|
|
- // name: '',
|
|
|
- // code: '',
|
|
|
- // appType: 1,
|
|
|
- // enable: 1,
|
|
|
- // remark: ''
|
|
|
- // },
|
|
|
- // 表单验证规则
|
|
|
- rules: {
|
|
|
- name: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请输入字典名称',
|
|
|
- trigger: 'blur'
|
|
|
- }
|
|
|
- ],
|
|
|
- code: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请输入字典值',
|
|
|
- trigger: 'blur'
|
|
|
- }
|
|
|
- ],
|
|
|
- appType: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择应用类型',
|
|
|
- trigger: 'blur'
|
|
|
- }
|
|
|
- ],
|
|
|
- enable: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请选择是否启用',
|
|
|
- trigger: 'blur'
|
|
|
- }
|
|
|
- ],
|
|
|
- sort: [
|
|
|
- {
|
|
|
- required: true,
|
|
|
- message: '请输入排序号',
|
|
|
- trigger: 'blur'
|
|
|
- }
|
|
|
- ]
|
|
|
- },
|
|
|
- // 表格列配置
|
|
|
- columns: [
|
|
|
- {
|
|
|
- columnKey: 'selection',
|
|
|
- type: 'selection',
|
|
|
- width: 45,
|
|
|
- align: 'center'
|
|
|
- },
|
|
|
- {
|
|
|
- columnKey: 'index',
|
|
|
- type: 'index',
|
|
|
- width: 45,
|
|
|
- align: 'center',
|
|
|
- showOverflowTooltip: true
|
|
|
- },
|
|
|
- {
|
|
|
- prop: 'code',
|
|
|
- label: '字典编码',
|
|
|
- showOverflowTooltip: true
|
|
|
- },
|
|
|
- {
|
|
|
- prop: 'name',
|
|
|
- label: '字典名称',
|
|
|
-
|
|
|
- showOverflowTooltip: true
|
|
|
- },
|
|
|
- // {
|
|
|
- // prop: 'appType',
|
|
|
- // label: '字典类型',
|
|
|
-
|
|
|
- // showOverflowTooltip: true,
|
|
|
- // minWidth: 110
|
|
|
- // },
|
|
|
- {
|
|
|
- prop: 'appType',
|
|
|
- label: '应用类型',
|
|
|
-
|
|
|
- showOverflowTooltip: true
|
|
|
- },
|
|
|
- {
|
|
|
- prop: 'remark',
|
|
|
- label: '描述',
|
|
|
-
|
|
|
- showOverflowTooltip: true
|
|
|
- },
|
|
|
- {
|
|
|
- prop: 'createTime',
|
|
|
- label: '创建时间',
|
|
|
-
|
|
|
- showOverflowTooltip: true,
|
|
|
- minWidth: 110,
|
|
|
- formatter: (_row, _column, cellValue) => {
|
|
|
- return this.$util.toDateString(cellValue);
|
|
|
- }
|
|
|
- },
|
|
|
- {
|
|
|
- columnKey: 'action',
|
|
|
- label: '操作',
|
|
|
- width: 130,
|
|
|
- align: 'center',
|
|
|
- resizable: false,
|
|
|
- slot: 'action',
|
|
|
- showOverflowTooltip: true
|
|
|
- }
|
|
|
- ],
|
|
|
- tableData: [],
|
|
|
- // 表格选中数据
|
|
|
- selection: [],
|
|
|
- datasource: {
|
|
|
- list: []
|
|
|
- },
|
|
|
- // 提交状态
|
|
|
- loading: false,
|
|
|
- // 是否是修改
|
|
|
- isUpdate: false,
|
|
|
- delectId: 1
|
|
|
- };
|
|
|
- },
|
|
|
- created() {},
|
|
|
-
|
|
|
- methods: {
|
|
|
- pushArr() {
|
|
|
- this.form.dictStaticSubmitPOList.push({
|
|
|
- code: '',
|
|
|
- enable: 1,
|
|
|
- name: '',
|
|
|
- sort: '',
|
|
|
- delectId: this.delectId
|
|
|
- });
|
|
|
- this.delectId = this.delectId + 1;
|
|
|
- this.filterArr();
|
|
|
- },
|
|
|
- //
|
|
|
- checkedValue(val) {
|
|
|
- console.log(val);
|
|
|
- },
|
|
|
- removeArr(row) {
|
|
|
- console.log(row);
|
|
|
- if (row.row.id) {
|
|
|
- this.form.dictStaticSubmitPOList.forEach((item) => {
|
|
|
- if (item.id === row.row.id) {
|
|
|
- item.deleted = 1;
|
|
|
- }
|
|
|
- });
|
|
|
- this.filterArr();
|
|
|
- } else {
|
|
|
- let index = this.form.dictStaticSubmitPOList.findIndex(
|
|
|
- (item) => item.delectId === row.row.delectId
|
|
|
- );
|
|
|
- console.log(index);
|
|
|
- this.form.dictStaticSubmitPOList.splice(index, 1); // 在数组的指定位置移除对应的元素。 返回移除的
|
|
|
- this.filterArr();
|
|
|
- }
|
|
|
-
|
|
|
- // let falg = this.form.dictStaticSubmitPOList[row.$index].deleted === 0;
|
|
|
- // if (falg) {
|
|
|
- // this.form.dictStaticSubmitPOList[row.$index].deleted = 1;
|
|
|
- // this.filterArr();
|
|
|
- // } else {
|
|
|
- // this.form.dictStaticSubmitPOList.splice(row.$index, 1);
|
|
|
- // this.filterArr();
|
|
|
- // }
|
|
|
- },
|
|
|
- handleSelectionChange() {},
|
|
|
- /* 保存编辑 */
|
|
|
- save() {
|
|
|
- this.$refs.form.validate((valid) => {
|
|
|
- if (!valid) {
|
|
|
- return false;
|
|
|
- }
|
|
|
- let falg = this.form.dictStaticSubmitPOList.some(
|
|
|
- (item, index) => item.code.length === 0
|
|
|
- );
|
|
|
- if (falg) {
|
|
|
- this.$message({
|
|
|
- message: '字典项编码不能为空',
|
|
|
- type: 'warning'
|
|
|
- });
|
|
|
- return;
|
|
|
- }
|
|
|
- this.form.dictStaticSubmitPOList.forEach((item, index) => {
|
|
|
- if (item.delectId) {
|
|
|
- delete item.delectId;
|
|
|
- }
|
|
|
- });
|
|
|
-
|
|
|
- this.loading = true;
|
|
|
- const saveOrUpdate = this.isUpdate ? updateDictionary : addDictionary;
|
|
|
- saveOrUpdate(this.form)
|
|
|
- .then((msg) => {
|
|
|
- this.loading = false;
|
|
|
- this.$message.success(msg);
|
|
|
- this.updateVisible(false);
|
|
|
- this.$emit('done');
|
|
|
- })
|
|
|
- .catch((e) => {
|
|
|
- this.loading = false;
|
|
|
- // // this.$message.error(e.message);
|
|
|
- });
|
|
|
- });
|
|
|
- },
|
|
|
- filterArr() {
|
|
|
- this.tableData = this.form.dictStaticSubmitPOList.filter(
|
|
|
- (item) => item.deleted !== 1
|
|
|
- );
|
|
|
- },
|
|
|
- /* 更新visible */
|
|
|
- updateVisible(value) {
|
|
|
- this.$emit('update:visible', value);
|
|
|
- },
|
|
|
-
|
|
|
- async getDetail() {
|
|
|
- const res = await pageDictionaryData(this.id);
|
|
|
- this.form = res.data.dictInfoVO;
|
|
|
-
|
|
|
- this.form.dictStaticSubmitPOList = res.data.dictStaticVOList;
|
|
|
- if (this.form.dictStaticSubmitPOList.length > 0) {
|
|
|
- this.filterArr();
|
|
|
- } else {
|
|
|
- this.tableTata = [];
|
|
|
- }
|
|
|
- }
|
|
|
- },
|
|
|
- watch: {
|
|
|
- visible(visible) {
|
|
|
- if (visible) {
|
|
|
- if (this.id) {
|
|
|
- // this.$util.assignObject(this.form, this.data);
|
|
|
- this.isUpdate = true;
|
|
|
- this.getDetail();
|
|
|
- } else {
|
|
|
- this.isUpdate = false;
|
|
|
- }
|
|
|
- } else {
|
|
|
- this.$refs.form.clearValidate();
|
|
|
- this.form = { ...this.defaultForm };
|
|
|
- this.form.dictStaticSubmitPOList = []; // clear the list of the dictionary static push button. 描述变化的字段不会在push后
|
|
|
- this.tableData = []; // clear the list of the dictionary static push button. 描述变化的字段不会在push后。
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- };
|
|
|
-</script>
|
|
|
-<style lang="scss" scoped>
|
|
|
- .divider {
|
|
|
- margin-bottom: 20px;
|
|
|
-
|
|
|
- .title {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- margin-bottom: 10px;
|
|
|
- div {
|
|
|
- width: 8px;
|
|
|
- height: 20px;
|
|
|
- margin-right: 10px;
|
|
|
- }
|
|
|
- span {
|
|
|
- font-size: 20px;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-</style>
|