Smart_platform_ui/src/views/approveData/index.vue

<template>
  <basic-container>
    <avue-crud
      :option="option"
      :data="dataList"
      ref="crud"
      v-model="form"
      :page.sync="page"
      :search.sync="search"
      :table-loading="loading"
      :cell-style="cellStyle"
      @search-change="searchChange"
      @search-reset="searchReset"
      @selection-change="selectionChange"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
    >
      <template slot="corpsIdSearch">
        <select-component
          v-model="search.corpsId"
          :configuration="configuration"
        ></select-component>
      </template>
      <template slot-scope="scope" slot="checkType">
        <span v-if="scope.row.checkType == 'ffsq'">付费申请</span>
        <span v-else-if="scope.row.checkType == 'xsqh'">销售请核</span>
        <span v-else-if="scope.row.checkType == 'cgqh'">采购请核</span>
        <span v-else-if="scope.row.checkType == 'xsgz'">小学部工资审批</span>
        <span v-else-if="scope.row.checkType == 'czgz'">初中部工资审批</span>
        <span v-else-if="scope.row.checkType == 'gzgz'">高中部工资审批</span>
        <span v-else-if="scope.row.checkType == 'hqgz'">后勤工资审批</span>
        <span v-else-if="scope.row.checkType == 'ocg'">办公用品采购审批</span>
        <span v-else-if="scope.row.checkType == 'oly'">办公用品领用审批</span>
        <span v-else-if="scope.row.checkType == 'fybx'">费用报销审批</span>
        <span v-else-if="scope.row.checkType == 'jjd'">交接单审批</span>
        <span v-else-if="scope.row.checkType == 'xstpqh'">销售特批请核</span>
      </template>
      <template slot="menuLeft">
        <el-button
          size="small"
          type="success"
          :disabled="selectionList.length == 0"
          @click.stop="batchCheck"
          >批量审批
        </el-button>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button
          type="text"
          size="small"
          :disabled="scope.row.operate"
          @click.stop="jumpPage(scope.row)"
          >查看
        </el-button>
        <el-button
          type="text"
          size="small"
          :disabled="scope.row.auditStatus != 'S'"
          @click.stop="openCheck(scope.row)"
          >审批
        </el-button>
        <el-button
          type="text"
          size="small"
          @click.stop="openCheckSchedule(scope.row)"
          >审批流程
        </el-button>
      </template>
    </avue-crud>
    <el-dialog
      append-to-body
      title="审批进度"
      class="el-dialogDeep"
      :visible.sync="checkScheduleDialog"
      width="40%"
      :close-on-click-modal="false"
      :destroy-on-close="true"
      :close-on-press-escape="false"
      v-dialog-drag
    >
      <check-schedule
        :checkId="checkId"
        :batchNo="batchNo"
        @choceScheduleFun="choceScheduleFun"
      >
      </check-schedule>
    </el-dialog>
    <el-dialog
      append-to-body
      title="审批"
      class="el-dialogDeep"
      :visible.sync="checkDialog"
      width="50%"
      :close-on-click-modal="false"
      :destroy-on-close="true"
      :close-on-press-escape="false"
      v-dialog-drag
    >
      <check
        :checkData="checkData"
        :checkDetail="true"
        :idList="idList"
        @operationType="operationType"
        @choceCheckFun="choceCheckFun"
      >
      </check>
    </el-dialog>
  </basic-container>
</template>

<script>
import option from "./configuration/mainList.json";
import option2 from "./configuration/mainList2.json";
import { getList, approvePass } from "@/api/approveData/main";
import checkSchedule from "@/components/check/checkSchedule";
import check from "@/components/check/check";
import { getUserInfo } from "@/api/system/user";
let previousRouterName = "";
let checkRefresh = "";
export default {
  components: {
    check,
    checkSchedule
  },
  data() {
    return {
      loading: false,
      form: {},
      search: {},
      show: true,
      checkDialog: false,
      checkId: "",
      batchNo: "",
      checkScheduleDialog: false,
      detailData: {},
      option: {},
      parentId: 0,
      checkData: {},
      dataList: [],
      idList: [],
      selectionList: [],
      page: {
        pageSize: 10,
        pagerCount: 5,
        total: 0
      },
      query: {},
      configuration: {
        multipleChoices: false,
        multiple: false,
        disabled: false,
        searchShow: true,
        collapseTags: false,
        clearable: true,
        placeholder: "请点击右边按钮选择",
        dicData: []
      }
    };
  },
  created() {
    getUserInfo().then(res => {
      if (res.data.data.billType==1) {
        this.option = option2;
      } else {
        this.option = option;
      }
      this.getWorkDicts("auditStatus").then(res => {
      this.findObject(this.option.column, "auditStatus").dicData =
        res.data.data;
      });
    });
  },
  mounted() {
    // option.height = window.innerHeight - 200 ;
  },
  activated() {
    if (this.$route.query.check === "refresh") {
      this.onLoad(this.page, this.search);
    }
  },
  methods: {
    batchCheck() {
      for (let i = 0; i < this.selectionList.length; i++) {
        if (this.selectionList[i].auditStatus != "S") {
          return this.$message.error("审核状态必须都为待审核状态!");
        } else {
          this.idList.push(this.selectionList[i].id);
        }
      }
      //打开cheack
      this.checkDialog = true;
    },
    operationType() {
      this.checkDialog = false;
      this.refreshChange();
      this.idList = [];
    },
    //跳转页面
    jumpPage(row) {
      if (row.url) {
        if (eval("(" + row.pageStatus + ")")) {
          this.$alert(
            "" +
              row.pageLabel +
              "页面已存在,请关闭" +
              row.pageLabel +
              "页面再进行操作",
            "温馨提示",
            {
              confirmButtonText: "确定",
              type: "warning",
              callback: action => {}
            }
          );
        } else {
          this.$router.$avueRouter.closeTag(row.url);
          this.$router.push({
            path: row.url,
            query: { check: row }
          });
        }
      }
    },
    //审批通过
    pass(row, operate) {
      row.operate = operate;
      this.loading = true;
      approvePass(row)
        .then(res => {
          this.$message.success("操作成功!");
          this.refreshChange();
        })
        .finally(() => {
          this.loading = false;
        });
    },
    openCheck(row) {
      this.batch = false; //单条操作
      this.checkDialog = true;
      this.checkData = row;
    },
    choceCheckFun() {
      this.checkDialog = false;
      this.refreshChange();
    },
    openCheckSchedule(row) {
      this.checkId = row.srcBillId;
      this.batchNo = row.batchNo;
      this.checkScheduleDialog = true;
    },
    //关闭审批流程页面
    choceScheduleFun() {
      this.checkScheduleDialog = false;
    },
    //新单打开
    addReceipt(row) {},
    //编辑打开
    editOpen(row, status) {
      this.detailData = {
        id: row.id,
        status: status
      };
      this.show = false;
    },
    //点击搜索按钮触发
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    searchReset() {
      console.log("1");
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    currentChange(val) {
      this.page.currentPage = val;
    },
    sizeChange() {
      console.log("1");
    },
    refreshChange(params) {
      this.onLoad(this.page, params);
    },
    paramsAdjustment(params) {
      params = Object.assign({}, this.search);
      if (!params.auditStatus && params.auditStatus !== "") {
        params.auditStatus = "S";
      }
      return params;
    },
    onLoad(page, params) {
      this.loading = true;
      params = this.paramsAdjustment(params);

      getList(page.currentPage, page.pageSize, params)
        .then(res => {
          this.dataList = res.data.data.records;
          this.page.total = res.data.data.total;
        })
        .finally(() => {
          this.loading = false;
        });
    },
    cellStyle() {
      return "padding:0;height:40px;";
    }
  }
};
</script>

<style scoped></style>