管道基础大数据平台系统开发-【前端】-新系統界面
Surpriseplus
2022-11-24 a7199e5a4f3e34b14d395e319a552c5c3b8b3a4d
src/views/datamanage/styleManage.vue
@@ -31,7 +31,7 @@
            >{{ $t('common.empty') }}</el-button
          >
          <el-button  v-if="btnStatus.insert"
            @click="InsertFormdialog = true"
            @click="setInsertShow()"
            icon="el-icon-edit"
            type="success"
            size="small"
@@ -258,7 +258,13 @@
          :label="$t('dataManage.styleObj.dirid')"
          :label-width="formLabelWidth"
        >
          <el-input
         <el-cascader
              v-model="upform.dirid"
              :options="editcatalogOption"
              @change="catalogChange"
              :props="cascader" style="width:730px"
            ></el-cascader>
          <!-- <el-input
            v-model="upform.dirValue"
            disabled
            autocomplete="off"
@@ -268,13 +274,20 @@
            @click="showDirTree(1)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
          ></el-link> -->
        </el-form-item>
        <el-form-item
          :label="$t('dataManage.styleObj.depid')"
          :label-width="formLabelWidth"
        >
          <el-input
          <el-cascader
              v-model="upform.depid"
              :options="editCompanyOption"
              @change="editcompanyChange"
              :props="cascader"
              style="width:730px"
            ></el-cascader>
          <!-- <el-input
            v-model="upform.depValue"
            disabled
            autocomplete="off"
@@ -284,7 +297,7 @@
            @click="showDepTree(1)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
          ></el-link> -->
        </el-form-item>
        <el-form-item
          :label="$t('dataManage.styleObj.ver')"
@@ -417,7 +430,14 @@
          :label="$t('dataManage.styleObj.dirid')"
          :label-width="formLabelWidth"
        >
          <el-input
        <el-cascader
              v-model="insertform.dirid"
              :options="catalogOption"
              @change="catalogChange"
              :props="cascader"
              style="width:730px"
            ></el-cascader>
          <!-- <el-input
            v-model="insertform.dirValue"
            disabled
            autocomplete="off"
@@ -427,13 +447,20 @@
            @click="showDirTree(0)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
          ></el-link> -->
        </el-form-item>
        <el-form-item
          :label="$t('dataManage.styleObj.depid')"
          :label-width="formLabelWidth"
        >
          <el-input
          <el-cascader
              v-model="insertform.depid"
              :options="companyOption"
              @change="companyChange"
              :props="cascader"
              style="width:730px"
            ></el-cascader>
          <!-- <el-input
            v-model="insertform.depValue"
            disabled
            autocomplete="off"
@@ -443,7 +470,7 @@
            @click="showDepTree(0)"
            style="margin-left: 10px"
            ><i class="el-icon-plus"></i
          ></el-link>
          ></el-link> -->
        </el-form-item>
        <el-form-item
          :label="$t('dataManage.styleObj.ver')"
@@ -595,6 +622,8 @@
  deleteStyles,
  updateStyle,
  upload_style,
  queryDepTree,
  selectdirTab
} from "../../api/api";
export default {
  name: "styleManage",
@@ -641,11 +670,24 @@
        insert: false,
        update: false,
      },
      companyOption:[],
      catalogOption:[],
      editCompanyOption:[],
      editcatalogOption:[],
       cascader: {
        label: 'name',
        value: 'id',
        children: 'children',
        checkStrictly: true,
        emitPath: false,
      },
    };
  },
  created() {
    this.getRoleTabelData();
    this.showPermsBtn();
     this.getQueryDepTree();this.getSelectdirTab();
  },
  methods: {
    showPermsBtn() {
@@ -1092,7 +1134,7 @@
      this.upflag = false;
      this.dialogFormVisible = false;
      this.upform = {};
      this.filesReset();
      // this.filesReset();
    },
    submitForm(formName) {
      this.getRoleTabelData();
@@ -1129,6 +1171,7 @@
    },
    handleEdit(index, row) {
      this.upflag = true;
      this.dialogFormVisible = true;
      this.upform = row;
@@ -1161,6 +1204,56 @@
        "height=800, width=1500, top=150, left=350, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no"
      );
    },
     catalogChange(res) {
      this.insertform.dirid = res;
      this.upform.dirid =res;
    },
    editcompanyChange(res){
this.upform.depid = res;
    },
    companyChange(res){
        this.insertform.depid = res;
    },
    //新增数据
    setInsertShow(){
this.InsertFormdialog = true;
    },
    //目录列表获取
    async getSelectdirTab() {
      const res = await selectdirTab();
      if (res.code != 200) {
        this.$message.error('目录列表获取失败');
        return;
      }
      this.insertform.dirid = 1;
      this.upform.dirid = 1;
 this.catalogOption = this.treeData(res.result);
 this.editcatalogOption= this.treeData(res.result);
    },
      //单位列表获取
    async getQueryDepTree() {
      const res = await queryDepTree();
      if (res.code != 200) {
        this.$message.error('单位列表获取失败');
        return;
      }
      this.insertform.depid = 1;
            this.upform.depid = 1;
      this.companyOption = this.treeData(res.result);
      this.editCompanyOption= this.treeData(res.result);
    },
    //树列表生成
    treeData(source) {
      let cloneData = JSON.parse(JSON.stringify(source)); // 对源数据深度克隆
      return cloneData.filter((father) => {
        // 循环所有项
        let branchArr = cloneData.filter((child) => father.id == child.pid); // 对比ID,分别上下级菜单,并返回数据
        branchArr.length > 0 ? (father.children = branchArr) : ''; // 给父级添加一个children属性,并赋值
        return father.pid == 0; // 返回一级菜单
      });
    },
  },
};
</script>