feat: 基础信息 新增、编辑增加防重提交 列表也优化

石广澎

2023-12-01 9cb389b74302ce6b0a2333328922e7c462234a56

feat: 基础信息
新增、编辑增加防重提交
列表也优化

 admin-web/src/views/foundation/classification/edit.vue

@@ -1,33 +1,35 @@
<template>
  <win-sm :title="setting.title" @close="close" :width="'800px'">
  <win-sm :title="setting.title" @close="close" :width="'800px'" :loading="loading">
    <el-form ref="ruleForm" :model="formData" :rules="rules" class="demo-ruleForm" label-width="100px">
      <el-form-item v-if="setting.pid" label="上级分类" prop="fatherCategoryName" :key="key">
        <el-input
          v-model="formData.fatherCategoryName"
          clearable
          maxlength="20"
          show-word-limit
          style="width: 100%"
          disabled
            v-model="formData.fatherCategoryName"
            clearable
            maxlength="20"
            show-word-limit
            style="width: 100%"
            disabled
        />
      </el-form-item>
      <el-form-item label="分类名称" prop="categoryName">
        <el-input v-model="formData.categoryName" clearable maxlength="20" show-word-limit style="width: 100%" />
        <el-input v-model="formData.categoryName" placeholder="请输入分类名称" clearable maxlength="20" show-word-limit
                  style="width: 100%"/>
      </el-form-item>
      <!-- 只有第三级分类信息维护时需要选类别 -->
      <el-form-item label="类别" prop="classification" v-if="plevels==2">
        <el-select v-model="formData.classification" placeholder="" clearable style="width: 100%">
          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"> </el-option>
      <el-form-item label="价值类别" prop="classification" v-if="plevels==2">
        <el-select v-model="formData.classification" placeholder="请选择价值类别" clearable style="width: 100%">
          <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="顺序" prop="orderNumber">
        <el-input
          type="number"
          v-model="formData.orderNumber"
          clearable
          maxlength="20"
          show-word-limit
          style="width: 100%"
            type="number"
            v-model="formData.orderNumber"
            placeholder="请填写顺序号"
            clearable
            maxlength="20"
            show-word-limit
            style="width: 100%"
        />
      </el-form-item>
      <el-form-item label="状态" prop="states">
@@ -38,8 +40,8 @@
      </el-form-item>
    </el-form>
    <div slot="footer" align="center" class="dialog-footer">
      <my-button name="取消" site="form" @click="close" />
      <my-button name="保存" site="form" @click="save" />
      <my-button name="取消" site="form" @click="close"/>
      <my-button name="保存" site="form" @click="save"/>
    </div>
  </win-sm>
</template>
@@ -52,15 +54,17 @@
import {getCategoryDetail} from '@/api/foudation/classification';

export default {
  components: { winSm, myButton },
  components: {winSm, myButton},
  props: {
    setting: {
      type: Object,
      default: () => {},
      default: () => {
      },
    },
  },
  data() {
    return {
      loading: false,
      checkAll: false,
      checkedList: [],
      options: [], // 类别列表
@@ -73,13 +77,13 @@
        states: 1, // 状态
      },
      rules: {
        fatherCategoryName: [{ required: true, message: '请输入', trigger: 'blur' }],
        categoryName: [{ required: true, message: '请输入', trigger: 'blur' }],
        classification: [{ required: true, message: '请选择', trigger: 'change' }],
        orderNumber: [{ required: true, message: '请输入', trigger: 'blur' }],
        fatherCategoryName: [{required: true, message: '请输入', trigger: 'blur'}],
        categoryName: [{required: true, message: '请输入', trigger: 'blur'}],
        classification: [{required: true, message: '请选择', trigger: 'change'}],
        orderNumber: [{required: true, message: '请输入', trigger: 'blur'}],
      },
      key: Math.random(),
      plevels:1
      plevels: 1
    };
  },
  created() {
@@ -98,11 +102,12 @@
    });
  },
  methods: {
    getEditInfo(id) {},
    getEditInfo(id) {
    },
    // 分类名称获取
    getCategoryName() {
      if(!this.formData.fatherCategoryId) return
      getCategoryDetail({ id: this.formData.fatherCategoryId }).then((res) => {
      if (!this.formData.fatherCategoryId) return
      getCategoryDetail({id: this.formData.fatherCategoryId}).then((res) => {
        this.formData.fatherCategoryName = res.categoryName;
        this.key = Math.random();
        this.plevels = res.levels
@@ -115,27 +120,32 @@
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          const params = Object.assign({}, this.formData);
          if (this.loading) return
          this.loading = true
          if (this.setting.id) {
            debugger;
            // 编辑接口
            finsystenant.edit(params).then((res) => {
              this.loading = false
              this.$message.success('保存成功！');
              this.close();
              this.$emit('search');
            }).catch((err) => {
              this.loading = false
            });
          } else {
            params.orgId = this.setting.orgId;
            console.log(params);
            finsystenant
              .add(params)
              .then((res) => {
                this.$message.success('保存成功！');
                this.close();
                this.$emit('search');
              })
              .catch((err) => {
                console.log('err', err);
              });
                .add(params)
                .then((res) => {
                  this.loading = false
                  this.$message.success('保存成功！');
                  this.close();
                  this.$emit('search');
                })
                .catch((err) => {
                  this.loading = false
                });
          }
        } else {
          this.$message.error('校验未通过，请检查。');

 admin-web/src/views/foundation/classification/index.vue

@@ -114,9 +114,9 @@
        },
        // 列信息
        columns: [
          { title: '分类名称', field: 'categoryName', align: 'center' },
          { title: '类别', field: 'classification', align: 'left' },
          { title: '显示顺序', field: 'orderNumber', align: 'center', width: '80px' },
          { title: '分类名称', field: 'categoryName', align: 'left', minWidth: 140 },
          { title: '类别', field: 'classification', align: 'center', width: 100 },
          { title: '显示顺序', field: 'orderNumber', align: 'center', width: 100 },
          {
            field: 'states',
            title: '状态',
@@ -149,7 +149,7 @@
        // 操作信息
        operation: {
          show: true, // 显示操作列
          width: '150', // 列宽
          width: '160', // 列宽
          attr: [
            {
              title: '编辑',
@@ -207,8 +207,6 @@
    // 左侧树初始化
    initTreeData() {
      getTree().then((res) => {
        console.log(res, 'restree');
        console.log(this.importSetting, 'this.importSetting');
        const content = res || [];
        // this.treeDataList.splice(0, this.treeDataList.length)
        this.treeDataList = content;
@@ -264,7 +262,6 @@
      this.editSetting.show = true;
    },
    nodeClick(param) {
      console.log(param, 'param');
      param = param || {};
      this.p = Object.assign(
        {},

 admin-web/src/views/foundation/material/edit.vue

@@ -1,27 +1,45 @@
<template>
  <win-md :title="setting.title" @close="close" :width="'800px'">
  <win-md :title="setting.title" @close="close" :width="'800px'" :loading="loading">
    <el-form ref="ruleForm" :model="formData" :rules="rules" class="demo-ruleForm" label-width="100px">
      <el-form-item label="物品编号">
        <el-input v-model="formData.goodsCode" disabled clearable maxlength="20" show-word-limit style="width: 100%"/>
      </el-form-item>
      <!--      <el-form-item label="物品编号">
              <el-input v-model="formData.goodsCode" disabled clearable maxlength="20" show-word-limit style="width: 100%"/>
            </el-form-item>-->
      <el-form-item label="物品名称" prop="goodsName">
        <el-input v-model="formData.goodsName" clearable maxlength="20" show-word-limit style="width: 100%"/>
        <el-input v-model="formData.goodsName" placeholder="请输入物品名称" clearable maxlength="20" show-word-limit
                  style="width: 100%"/>
      </el-form-item>
      <el-form-item label="分类" prop="categoryId">
        <el-select v-model="formData.categoryId" clearable placeholder="请选择"  style="width: 100%">
          <el-option v-for="item in categoryList" :key="item.id" :label="item.categoryName" :value="item.id"></el-option>
        </el-select>
      <el-form-item label="物品分类" prop="categoryId">
        <!--        <el-select v-model="formData.categoryId" clearable placeholder="请选择" style="width: 100%">
                  <el-option v-for="item in categoryList" :key="item.id" :label="item.categoryName"
                             :value="item.id"></el-option>
                </el-select>-->
        <el-cascader
            clearable
            filterable
            placeholder="请选择物品分类"
            v-model="formData.categoryId"
            :options="categoryList"
            :props="{emitPath: false,value: 'id'}"
            style="width: 100%"/>
      </el-form-item>
      <el-form-item style="margin-left: -100px;" v-for="(m, i) in formData.models">
        <el-form-item label="规格型号" prop="modelName" style="float: left;">
          <el-input v-model="m.modelName" clearable maxlength="20" show-word-limit style="width: 100%"/>
        </el-form-item>
        <el-form-item label="单位" prop="unit" style="float: left;">
          <el-input v-model="m.unit" clearable maxlength="20" show-word-limit style="width: 100%"/>
        </el-form-item>
        <my-button name="新增型号" type="" @click="addCode"/>
        <my-button name="删除" type="" @click="delCode(i)"/>
      </el-form-item>
      <el-row :gutter="20" v-for="(m, i) in formData.models">
        <el-col :span="9">
          <el-form-item label="规格型号" :prop="`models.${i}.modelName`" :rules="rules.modelName">
            <el-input v-model="m.modelName" placeholder="请输入规格型号名称" clearable maxlength="20" show-word-limit
                      style="width: 100%"/>
          </el-form-item>
        </el-col>
        <el-col :span="9">
          <el-form-item label="单位" :prop="`models.${i}.unit`" :rules="rules.unit">
            <el-input v-model="m.unit" placeholder="请输入单位" clearable maxlength="20" show-word-limit
                      style="width: 100%"/>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <my-button :key="'d'+i" v-if="formData.models.length>1" name="删除" type="danger" @click="delCode(i)"/>
          <my-button :key="'a'+i" v-if="i===formData.models.length-1" name="新增型号" type="" @click="addCode"/>
        </el-col>
      </el-row>
      <el-form-item label="状态" prop="states">
        <el-radio-group v-model="formData.states">
          <el-radio :label="1" border>启用</el-radio>
@@ -40,6 +58,7 @@
import winMd from '@/components/win/win-md'
import myButton from '@/components/myButton/myButton'
import * as finsystenant from '@/api/baseSetting/finsystenant'
import {getTree} from '@/api/foudation/classification';
import {mapGetters} from 'vuex'

export default {
@@ -53,66 +72,76 @@
  },
  data() {
    return {
      categoryList:[],
      loading: true,
      categoryList: [],
      checkAll: false,
      checkedList: [],
      formData: {
        radio1: '',
        code: '',
        name: '',
        goodsName: '',
        states: 1,
        summary: '',
        categoryId: null,
        agencyId:'',
        agencyName:'',
        models:[
        agencyId: '',
        agencyName: '',
        models: [
          {
            modelName:'',
            unit:''
            modelName: '',
            unit: ''
          }
        ]
      },
      rules: {
        name: [
        goodsName: [
          {required: true, message: '请输入物品名称', trigger: 'blur'}
        ],
        categoryId: [
          {required: true, message: '请选择物品分类', trigger: 'blur'}
        ],
        modelName: [
          {required: true, message: '请输入规格名称', trigger: 'blur'}
        ],
        unit: [
          {required: true, message: '请输入单位', trigger: 'blur'}
        ]
      }
    }
  },
  computed:{
  computed: {
    ...mapGetters(['userInfo'])
  },
  created() {
    this.tree_List()
    if(this.setting.info){
      this.formData = Object.assign({},JSON.parse(this.setting.info))
  async created() {
    if (this.setting.id) {
      await finsystenant.editmaterial(this.setting.id).then(res => {
        this.formData = res
        if (!this.formData.agencyId) {
          this.formData.agencyId = this.userInfo.tenantId
          this.formData.agencyName = this.userInfo.tenantName
        }
      })
    }
    if(!this.formData.agencyId) {
      this.formData.agencyId = this.userInfo.tenantId
      this.formData.agencyName = this.userInfo.tenantName
    }
    await this.tree_List()
    this.loading = false
  },
  methods: {
    tree_List (){
      finsystenant.treeList().then(res => {
    async tree_List() {
      await getTree().then(res => {
        if (res) {
          console.log(res,'res');
          this.categoryList = res
        }
      })
    },
    addCode(){
    addCode() {
      this.formData.models.push(
        {
          modelName:'',
          unit:''
        }
          {
            modelName: '',
            unit: ''
          }
      )
    },
    delCode(index){
    delCode(index) {
      this.formData.models.splice(index, 1)
    },
    getEditInfo(id){
    getEditInfo(id) {

    },
    close() {
@@ -122,9 +151,12 @@
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          const params = Object.assign({}, this.formData)
          if(this.setting.id){
          if (this.loading) return
          this.loading = true
          if (this.setting.id) {
            // 编辑接口
            finsystenant.editcode(params).then(res => {
              this.loading = false
              if (res) {
                this.$message.success('保存成功！')
                this.close()
@@ -132,10 +164,13 @@
              } else {
                this.$message.error('保存失败')
              }
            })
          }else{
            }).catch(() => {
              this.loading = false
            });
          } else {
            params.orgId = this.setting.orgId
            finsystenant.addcode(params).then(res => {
              this.loading = false
              if (res) {
                this.$message.success('保存成功！')
                this.close()
@@ -143,7 +178,9 @@
              } else {
                this.$message.error('保存失败')
              }
            })
            }).catch(() => {
              this.loading = false
            });
          }
        } else {
          this.$message.error('校验未通过，请检查。')

 admin-web/src/views/foundation/material/index.vue

@@ -159,12 +159,12 @@
        },
        // 列信息
        columns: [
          {title: '物品编号', field: 'goodsCode', align: 'center'},
          {title: '物品名称', field: 'goodsName', align: 'center'},
          {title: '分类', field: 'categoryName', align: 'center'},
          {title: '类别', field: 'classification', align: 'center'},
          {title: '物品编号', field: 'goodsCode', align: 'center', width: 120},
          {title: '物品名称', field: 'goodsName', align: 'left', minWidth: 140},
          {title: '分类', field: 'categoryName', align: 'left', minWidth: 140},
          {title: '类别', field: 'classification', align: 'center', width: 80},
          // {title: '采购类型', field: 'categoryId', align: 'center'},
          {title: '所属机构', field: 'agencyName', align: 'center'},
          {title: '所属机构', field: 'agencyName', align: 'left', minWidth: 140},
          {
            title: '创建时间',
            field: 'createDate',
@@ -205,7 +205,7 @@
        // 操作信息
        operation: {
          show: true, // 显示操作列
          width: '250', // 列宽
          width: 160, // 列宽
          attr: [
            {
              title: '编辑',
@@ -290,19 +290,14 @@
      //   this.$message.warning('请先选择左侧机构')
      // } else {
        this.editSetting.id = null;
        this.editSetting.info = null;
        this.editSetting.title = '新增';
        this.editSetting.show = true;
      // }
    },
    showAudit(row) {
      finsystenant.editmaterial(row.id).then(res => {
        // console.log(res,'res');
        this.editSetting.id = res.id;
        this.editSetting.info = JSON.stringify(res);
        this.editSetting.title = '编辑';
        this.editSetting.show = true;
      })
      this.editSetting.id = row.id;
      this.editSetting.title = '编辑';
      this.editSetting.show = true;
    },
    // 查询table列表
    search(pageNum) {

 admin-web/src/views/foundation/store/edit.vue

@@ -1,27 +1,41 @@
<template>
  <win-sm :title="setting.title" @close="close" :width="'800px'">
  <win-sm :title="setting.title" @close="close" :width="'800px'" :loading="loading">
    <el-form ref="ruleForm" :model="formData" :rules="rules" class="demo-ruleForm" label-width="100px">
      <el-form-item label="编号" prop="warehouseCode">
        <el-input disabled v-model="formData.warehouseCode" clearable maxlength="20" show-word-limit style="width: 100%" />
      </el-form-item>
      <!--      <el-form-item label="编号" prop="warehouseCode">
              <el-input disabled v-model="formData.warehouseCode" clearable maxlength="20" show-word-limit style="width: 100%" />
            </el-form-item>-->
      <el-form-item label="仓库名称" prop="warehouseName">
        <el-input v-model="formData.warehouseName" clearable maxlength="20" show-word-limit style="width: 100%" />
        <el-input v-model="formData.warehouseName" placeholder="请输入仓库名称" clearable maxlength="20" show-word-limit
                  style="width: 100%"/>
      </el-form-item>
      <el-form-item label="仓库类型" prop="classificationCode">
        <el-select v-model="formData.classificationCode" clearable placeholder="请选择" style="width: 100%">
        <el-select v-model="formData.classificationCode" clearable placeholder="请选择仓库类型" style="width: 100%">
          <el-option
            v-for="item in classList"
            :key="item.dict_code"
            :label="item.dict_label"
            :value="item.dict_code"
              v-for="item in classList"
              :key="item.dict_code"
              :label="item.dict_label"
              :value="item.dict_code"
          ></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="所属机构" prop="agencyIds">
          <el-cascader v-model="formData.agencyIds" :options="treeList" :props="{checkStrictly: true,value:'id'}" @change="handleChange" style="width: 100%"></el-cascader>
      <el-form-item label="所属机构" prop="agencyId">
        <el-cascader
            v-model="formData.agencyId"
            placeholder="请选择所属机构"
            :options="treeList"
            :props="{checkStrictly: true,emitPath: false,value:'id'}"
            style="width: 100%"></el-cascader>
      </el-form-item>
      <el-form-item label="地址">
        <el-input v-model="formData.adress" clearable maxlength="20" show-word-limit style="width: 100%" />
        <el-input
            style="width: 100%"
            maxlength="200"
            show-word-limit
            type="textarea"
            :rows="3"
            placeholder="请输入内容"
            v-model="formData.adress"/>

      </el-form-item>
      <el-form-item label="状态" prop="states">
        <el-radio-group v-model="formData.states">
@@ -31,8 +45,8 @@
      </el-form-item>
    </el-form>
    <div slot="footer" align="center" class="dialog-footer">
      <my-button name="取消" site="form" @click="close" />
      <my-button name="保存" site="form" @click="save" />
      <my-button name="取消" site="form" @click="close"/>
      <my-button name="保存" site="form" @click="save"/>
    </div>
  </win-sm>
</template>
@@ -44,63 +58,65 @@
import {findParentIds} from '@/utils/index';

export default {
  components: { winSm, myButton },
  components: {winSm, myButton},
  props: {
    setting: {
      type: Object,
      default: () => {},
      default: () => {
      },
    },
  },
  data() {
    return {
      loading: true,
      classList: [],
      treeList: [],
      checkAll: false,
      checkedList: [],
      formData: {
        warehouseCode:null,
        warehouseCode: null,
        classificationId: null,
        classificationCode:null,
        classificationCode: null,
        states: 1,
        agencyIds:[],
        agencyId:''
        agencyId: ''
      },
      rules: {
        warehouseName: [{ required: true, message: '请输入', trigger: 'blur' }],
        classificationCode: [{ required: true, message: '请选择', trigger: 'blur' }],
        agencyIds: [{ required: true, message: '请选择', trigger: 'blur' }],
        states: [{ required: true, message: '请选择状态', trigger: 'blur' }],
        warehouseName: [{required: true, message: '请输入', trigger: 'blur'}],
        classificationCode: [{required: true, message: '请选择', trigger: 'blur'}],
        agencyId: [{required: true, message: '请选择', trigger: ['blur', 'change']}],
        states: [{required: true, message: '请选择状态', trigger: 'blur'}],
      },
    };
  },
  created() {
    this.class_List();
    this.tree_List();
  async created() {
    await this.class_List();
    await this.tree_List();
    this.loading = false
    if (this.setting.info) {
      this.formData = Object.assign({}, JSON.parse(this.setting.info));
    }
  },
  methods: {
    class_List() {
      finsystenant.classList().then((res) => {
    async class_List() {
      await finsystenant.classList().then((res) => {
        if (res) {
          console.log(res, 'res');
          res.map(item => {
            item.dict_code = item.dict_code.toString()
          })
          this.classList = res;
        }
      });
    },
    tree_List() {
      finsystenant.getTree().then((res) => {
    async tree_List() {
      await finsystenant.getTree().then((res) => {
        if (res) {
          this.treeList = res;
          this.$set(this.formData,'agencyIds',findParentIds(this.treeList,this.formData.agencyId))
          this.$set(this.formData, 'agencyIds', findParentIds(this.treeList, this.formData.agencyId))
        }
      });
    },
    handleChange(e){
      this.formData.agencyId = e[e.length-1]
    getEditInfo(id) {
    },
    getEditInfo(id) {},
    close() {
      this.$emit('close');
    },
@@ -108,9 +124,12 @@
      this.$refs.ruleForm.validate((valid) => {
        if (valid) {
          const params = Object.assign({}, this.formData);
          if (this.loading) return
          this.loading = true
          if (this.setting.id) {
            // 编辑接口
            finsystenant.editstore(params).then((res) => {
              this.loading = false
              if (res) {
                this.$message.success('保存成功！');
                this.close();
@@ -118,10 +137,13 @@
              } else {
                this.$message.error('保存失败');
              }
            }).catch(()=>{
              this.loading = false
            });
          } else {
            params.orgId = this.setting.orgId;
            finsystenant.addstore(params).then((res) => {
              this.loading = false
              if (res) {
                this.$message.success('保存成功！');
                this.close();
@@ -129,6 +151,8 @@
              } else {
                this.$message.error('保存失败');
              }
            }).catch(()=>{
              this.loading = false
            });
          }
        } else {

 admin-web/src/views/foundation/store/index.vue

@@ -133,10 +133,10 @@
        },
        // 列信息
        columns: [
          {title: '名称仓库', field: 'warehouseName', align: 'left',},
          {title: '编号', field: 'warehouseCode', align: 'center'},
          {title: '类型', field: 'classificationName', align: 'center', },
          {title: '地址', field: 'adress', align: 'center', },
          {title: '仓库名称', field: 'warehouseName', align: 'left', minWidth: 140},
          {title: '编号', field: 'warehouseCode', align: 'center', width: 120},
          {title: '类型', field: 'classificationName', align: 'center', width: 120 },
          {title: '地址', field: 'adress', align: 'left', minWidth: 140 },
          // {title: '所属机构', field: 'summary', align: 'left',},
          {
            field: 'states',
@@ -169,7 +169,7 @@
        // 操作信息
        operation: {
          show: true, // 显示操作列
          width: '250', // 列宽
          width: 240, // 列宽
          attr: [
            {
              title: '编辑',