Source/plt-web/plt-web-ui/src/views/processTemplate/customType/index.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,202 @@
<template>
  <!--流程模板分类-->
  <basic-container>
    <avue-crud
      ref="crud"
      v-model="form"
      :data="tableData"
      :option="option"
      :table-loading="tableLoading"
      @on-load="getTableList"
      @refresh-change="getTableList"
      @row-save="rowSaveHandler"
      @row-update="rowUpdateHandler"
      @row-click="rowClickHandler"
      @selection-change="selectionChange"
    >
      <template slot="menuLeft" slot-scope="scope">
        <el-button v-if="permissionList.addBtn" class="button-custom-icon" size="small" type="primary"
                   @click="$refs.crud.rowAdd()">
          <icon-show :name="permissionList.addBtn.source"></icon-show>
          æ–° å¢ž
        </el-button>
        <el-button v-if="permissionList.exportBtn" class="button-custom-icon" plain size="small" type="primary" @click="exportClickHandler">
          <icon-show :name="permissionList.exportBtn.source"></icon-show>
          å¯¼å‡º
        </el-button>
      </template>
      <template slot="menu" slot-scope="{ row, index }">
        <el-button
          v-if="permissionList.editBtn"
          size="small"
          type="text"
          @click="handleEdit(row, index)"
        >
          <icon-show :name="permissionList.editBtn.source"></icon-show>
          ç¼–辑
        </el-button>
        <el-button
          v-if="permissionList.delBtn"
          size="small"
          type="text"
          @click="handleDel(row, index)"
        >
          <icon-show :name="permissionList.delBtn.source"></icon-show>
          åˆ é™¤
        </el-button>
      </template>
    </avue-crud>
  </basic-container>
</template>

<script>
import {mapGetters} from "vuex";
import basicOption from "@/util/basic-option";
import {getTypeList, saveType, updateType, deleteType} from "@/api/processTemplate/type";
import func from "@/util/func";

export default {
  name: "index",
  data: function () {
    return {
      form:{},
      tableLoading: false,
      tableData: [],
      currentRow:null,
      selectionList: [],
    }
  },
  computed: {
    ids() {
      let ids = [];
      this.selectionList.forEach(ele => {
        ids.push(ele.id);
      });
      return ids.join(",");
    },
    ...mapGetters(["permission"]),
    permissionList() {
      return {
        addBtn: this.vaildData(this.permission[this.$route.query.id].ADD, false),
        delBtn: this.vaildData(this.permission[this.$route.query.id].DELETE, false),
        editBtn: this.vaildData(this.permission[this.$route.query.id].EDIT, false),
      };
    },
    option(){
      return  {
        ...basicOption,
        addBtn:false,
        editBtn:false,
        delBtn:false,
        calcHeight: -60,
        align:'left',
        headerAlign:'center',
        menuWidth:160,
        dialogMenuPosition: 'right',
        dialogWidth:600,
        column: [
          {
            label: '分类名称',
            prop: 'name',
            span: 24,
            rules: [{ required: true, message: '请输入分类名称', trigger: 'blur' }]
          },{
            label: '描述',
            prop: 'desc',
            span: 24,
            type:'textarea'
          }]
      }
    }
  },
  methods: {
    // è¡¨æ ¼è¯·æ±‚
    getTableList() {
      this.tableLoading = true;
      getTypeList().then(res => {
        this.tableData = res.data.data;
        this.tableLoading = false;
      })
    },

    // æ–°å¢ž
    rowSaveHandler(row, done, loading) {
      saveType(row).then(res => {
        if (res.data.code === 200) {
          this.$message.success(res.data.obj);
          this.getTableList();
          done();
        }
      }).catch(err => {
        loading()
      });
    },

    handleEdit(row,index){
      this.$refs.crud.rowEdit(row, index);
    },

    // ç¼–辑
    rowUpdateHandler(row, index, done, loading) {
      updateType(row).then(res => {
        if (res.data.code === 200) {
          this.$message.success(res.data.obj);
          this.getTableList();
          done()
        }
      }).catch(err => {
        loading()
      });
    },

    // åˆ é™¤
    handleDel(row,index) {
      let params = {
        ids: row.id
      }

      this.$confirm('您确定要删除当前的分类吗？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        deleteType(params).then(res => {
          if (res.data.code === 200) {
            this.$message.success(res.data.obj);
            this.getTableList();
          }
        });
      }).catch(() => {
        this.$message({
          type: 'info',
          message: '已取消删除'
        });
      });
    },

    //选择的行
    selectionChange(list) {
      this.selectionList = list;
    },

    // è¡Œå•é€‰
    rowClickHandler(row) {
      func.rowClickHandler(
        row,
        this.$refs.crud,
        this.lastIndex,
        (newIndex) => {
          this.lastIndex = newIndex;
        },
        () => {
          this.selectionList = [row];
        }
      );
    },
  }
}
</script>

<style scoped>

</style>