spfm-market-front/src/pages/main/performance/department.vue

<template>
  <div>
    <div class="simple-container">
      <simple-form :form="table_form" @search="handleSearch">
        <!-- :handle="table_handle"
      @add="handleRulesVisible"
      @class="handleDrawer('class')"
      @download="handleDownload" -->
      </simple-form>
      <simple-table
        :list="table_list"
        :config="table_config"
        :loading="table_loading"
        :handle-row="table_handle_row"
        @check="handleCheck"
        @edit="handleEdit"
      ></simple-table>
      <simple-pagination
        :page="page"
        :total="total"
        @change="handleChange"
      ></simple-pagination>
    </div>
    <simple-dialog
      fullscreen
      title="文件收集"
      :visible="visible"
      :reload="reload"
      width="1200px"
      @cancel="handleCancel('visible')"
    >
      <template>
        <!-- 按钮部分 -->
        <div class="flex-justify-between padding-right-20 padding-left-20">
          <div>
            <template v-if="edit_visible">
              <!-- 转派按钮 科室经理 7、分管副总 2、总经理 1可见   -->
              <el-button
                type="primary"
                v-if="
                  edit_form.status === '0' &&
                  (duty === '7' || duty === '2' || duty === '1')
                "
                @click="handleTransfer"
                >转派</el-button
              >
              <!-- 提交按钮 科员可见 9  -->
              <el-button
                type="primary"
                v-if="edit_form.status === '1' && duty === '9'"
                @click="handleSubmit"
                >提交</el-button
              >
              <!-- 审批按钮 科室经理、分管副总、总经理可见  -->
              <el-button
                type="primary"
                v-if="
                  edit_form.status === '2' &&
                  (duty === '7' || duty === '2' || duty === '1')
                "
                @click="handleApprove"
                >审批</el-button
              >
            </template>
            <!-- <el-button type="primary" @click="handleTrack">流程跟踪</el-button>
            <el-button type="primary">导出</el-button> -->
          </div>
          <!-- <div>
            <el-button @click="handleCancel('visible')" type="primary"
              >返回</el-button
            >
          </div> -->
        </div>
        <!-- 主体部分 -->
        <simple-sheet
          v-if="visible"
          :id="edit_form.id"
          :type="edit_visible ? 'edit' : 'view'"
          attribute="file"
        />
        <!-- <analysis
          :edit="edit_form.department_status === '待处理' && edit_visible"
        /> -->
      </template>
      <template v-slot:footer><div></div></template>
    </simple-dialog>
    <simple-dialog
      title="审批"
      :visible="approve_visible"
      :reload="reload"
      width="500px"
      @cancel="handleCancel('approve_visible')"
    >
      <el-form :model="approveForm" ref="approveForm"
        ><el-form-item label="审批意见" prop="comments" label-width="80px"
          ><el-input
            type="textarea"
            v-model="approveForm.comments"
            autosize /></el-form-item
      ></el-form>
      <template v-slot:footer
        ><div>
          <div v-if="type === '1'">
            <el-button @click="handleTurn('finish')">结束</el-button>
            <el-button @click="handleTurn('transfer')" type="primary"
              >转副总审批</el-button
            >
          </div>
          <div v-else-if="type === '2'">
            <el-button @click="handleTurn('finish')">结束</el-button>
            <el-button @click="handleTurn('back')">打回</el-button>
            <el-button @click="handleTurn('transfer')" type="primary"
              >转总经理审批</el-button
            >
          </div>
          <div v-else>
            <el-button @click="handleTurn('back')">打回</el-button>
            <el-button @click="handleTurn('agree')" type="primary"
              >同意</el-button
            >
          </div>
        </div>
      </template>
    </simple-dialog>
    <simple-dialog
      title="转派"
      :visible="transfer_visible"
      :reload="reload"
      width="500px"
      @confirm="transferConfirm"
      @cancel="handleCancel('transfer_visible')"
    >
      <el-form
        :model="transfer_form"
        :rules="transfer_rules"
        ref="transfer_form"
      >
        <el-form-item label="转派人员" prop="personnel">
          <el-select
            v-model="transfer_form.personnel"
            placeholder="请选择转派人员"
          >
            <el-option
              v-for="(item, index) in transfer_list"
              :key="index"
              :label="item.label"
              :value="item.loginNoStr"
            >
            </el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="可编辑行" prop="rows">
          <el-select
            v-model="transfer_form.rows"
            placeholder="可编辑行"
            multiple
          >
            <el-option
              v-for="(item, index) in transfer_rows"
              :key="index"
              :label="item.label"
              :value="item.value"
            >
            </el-option>
          </el-select>
        </el-form-item>
      </el-form>
    </simple-dialog>
    <!-- <simple-dialog
      title="流程跟踪"
      :visible="track_visible"
      :reload="reload"
      width="600px"
      props="track_visible"
      @confirm="handleConfirm"
      @cancel="handleCancel('track_visible')"
    >
      <el-table :data="trackList" border>
        <el-table-column
          prop="link"
          label="流程环节"
          align="center"
          width="180"
        >
        </el-table-column>
        <el-table-column
          prop="creatperson"
          label="处理人"
          align="center"
          width="180"
        >
        </el-table-column>
        <el-table-column prop="explain" label="审批说明" align="center">
        </el-table-column>
      </el-table>
    </simple-dialog> -->
  </div>
</template>

<script>
import simpleForm from "./components/form.vue";
import simpleTable from "./components/table.vue";
import simplePagination from "./components/pagination.vue";
import simpleDialog from "./components/dialog.vue";
// import analysis from "./analysis.vue";
import simpleSheet from "./components/sheet.vue";
export default {
  components: {
    simpleForm,
    simpleTable,
    simplePagination,
    simpleDialog,
    simpleSheet,
  },
  data() {
    return {
      page: 1,
      rows: 10,
      total: 0,
      isCheck: false,
      // 职位判断转派用
      duty: "",
      //   搜索参数
      table_search: {},
      //   dialog 参数
      transfer_visible: false,
      visible: false,
      edit_visible: false,
      approve_visible: false,
      track_visible: false,
      edit_form: {},
      transfer_list: [],
      transfer_rows: [],
      transfer_form: {
        personnel: "", // 转派人员
        rows: [],
      },
      reload: 0,
      // 判断类型
      type: "3",
      approverules: {
        comments: [
          {
            required: true,
            message: "请输入审批意见",
            trigger: "blur",
          },
        ],
      },
      // 转派规则
      transfer_rules: {
        personnel: [
          {
            required: true,
            message: "请选择转派人员",
            trigger: "change",
          },
        ],
        rows: [
          {
            required: true,
            message: "请选择行",
            trigger: "change",
          },
        ],
      },
      // 审批意见
      approveForm: { comments: "" },
      trackList: [],
      //   顶部form
      table_form: [
        {
          label: "模板名称",
          props: "name",
          type: "input",
        },
        {
          label: "下发月份",
          props: "issuedDate",
          type: "month",
        },
        {
          label: "状态",
          props: "status",
          type: "select",
          // 0.待处理  1.待汇总 2.待审批  3.已完成
          dictionary: [
            {
              label: "待处理",
              value: "0",
            },
            {
              label: "待汇总",
              value: "1",
            },
            {
              label: "待审批",
              value: "2",
            },
            {
              label: "已完成",
              value: "3",
            },
          ],
        },
      ],
      //   列表数据
      table_list: [],
      table_loading: false,
      //   表格里的操作按钮
      table_handle_row: [
        {
          label: "查看",
          props: "check",
        },
        {
          label: "处理",
          props: "edit",
          visible: {
            status: ["0", "1", "2"],
          },
        },
      ],
      //  表头配置
      table_config: [
        {
          label: "模板名称",
          props: "templateName",
        },
        {
          label: "填报事由",
          props: "reason",
        },
        {
          label: "填报注意事项",
          props: "precautions",
        },
        {
          label: "截止时间",
          props: "endTime",
          type: "date",
        },
        {
          label: "发起人",
          props: "loginNameStr",
        },
        {
          label: "状态",
          props: "status",
          type: "dictionary",
          dictionary: { 0: "待处理", 1: "待汇总", 2: "待审批", 3: "已完成" },
        },
      ],
    };
  },
  mounted() {
    this.handleInit({
      ...this.table_search,
      page: this.page,
      pageSize: this.rows,
    });
    // 职位
    this.duty = JSON.parse(sessionStorage.userInfo).duty;
    // 根据职位判定  科室经理7、分管副总 2 、总经理 1 、职员 9
    console.log(this.duty, "duty");
    switch (this.duty) {
      // 科室经理
      case "7":
        this.type = "1";
        break;
      // 分管副总
      case "2":
        this.type = "2";
        break;
      // 总经理
      case "1":
        this.type = "3";
        break;
    }
  },
  methods: {
    //   初始化
    handleInit(data) {
      this.$http({
        url: "/market/CMKIssued/CMKIssuedListByUser",
        method: "post",
        headers: {
          "Content-Type": "application/json",
        },
        data: data,
      }).then(({ data: { count, data } }) => {
        this.total = count;
        this.table_list = data;
        // this.table_list = [
        //   {
        //     id: 10,
        //     templateName: "模板名称",
        //     loginNameStr: "发起人",
        //     status: "0",
        //     reason: "填报事由",
        //     precautions: "填报注意事项",
        //     endTime: new Date(),
        //   },
        //   {
        //     id: 11,
        //     templateName: "模板名称",
        //     loginNameStr: "发起人",
        //     status: "1",
        //     reason: "填报事由",
        //     precautions: "填报注意事项",
        //     endTime: new Date(),
        //   },
        //   {
        //     id: 12,
        //     templateName: "模板名称",
        //     loginNameStr: "发起人",
        //     status: "2",
        //     reason: "填报事由",
        //     precautions: "填报注意事项",
        //     endTime: new Date(),
        //   },
        //   {
        //     id: 13,
        //     templateName: "模板名称",
        //     loginNameStr: "发起人",
        //     status: "3",
        //     reason: "填报事由",
        //     precautions: "填报注意事项",
        //     endTime: new Date(),
        //   },
        // ];
      });
    },
    handleChange(page) {
      this.page = page;
      this.handleInit({
        ...this.table_search,
        page: this.page,
        pageSize: this.rows,
      });
    },
    // 搜索事件
    handleSearch(data) {
      this.table_search = data;
      this.page = 1;
      this.handleInit({ ...data, page: this.page, pageSize: this.rows });
    },
    // 编辑按钮
    handleEdit(row) {
      console.log(row, "row");
      this.visible = true;
      this.edit_visible = true;
      this.edit_form = row;
    },
    // 查看按钮
    handleCheck(row) {
      console.log(row, "row");
      this.visible = true;
      this.edit_visible = false;
      this.edit_form = row;
    },
    handleDelete() {},
    // dialog事件
    //权限管理事件
    handleApprove() {
      this.approve_visible = true;
    },
    handleTrack() {
      this.track_visible = true;
    },
    // 转派的同意事件
    transferConfirm() {
      this.$refs["transfer_form"].validate((valid) => {
        if (valid) {
          let obj = {};
          this.transfer_form.rows.forEach((el) => {
            obj = {
              ...obj,
              [el]: this.transfer_form.personnel,
            };
          });
          let reqdata = {
            forward: JSON.stringify(obj),
            issuedId: this.edit_form.id,
          };
          this.$http({
            url: "/market/CMKIssued/CMKIssuedTransfer",
            method: "post",
            headers: {
              "Content-Type": "application/json",
            },
            data: reqdata,
          }).then(({ data: { desc } }) => {
            if (desc === "转派成功") {
              this.$message({
                type: "success",
                message: desc,
              });
              this.transfer_visible = false;
              this.handleCancel("visible");
            }
          });
        }
      });
    },
    async handleTransfer() {
      console.log(this.edit_form, "prams");
      let loginNoStr = JSON.parse(sessionStorage.userInfo).loginNoStr;
      let groupId = JSON.parse(sessionStorage.userInfo).groupId;
      await this.$http({
        url: "/sysmgr/sysuserinfo/queryList",
        method: "post",
        headers: {
          "Content-Type": "application/json",
        },
        data: {
          groupId,
        },
      }).then(({ data }) => {
        this.transfer_list = data
          .filter((el) => {
            return el.loginNoStr !== loginNoStr;
          })
          .map((el) => ({
            ...el,
            label: el.loginNameStr,
          }));
        // 可编辑行
      });
      await this.$http({
        url: "/market/CMKIssued/CMKIssuedRow",
        method: "post",
        headers: {
          "Content-Type": "application/json",
        },
        data: {
          id: this.edit_form.id,
        },
      }).then(({ data }) => {
        console.log(data);
        this.transfer_rows = data.map((el) => ({
          label: el,
          value: el,
        }));
      });
      this.transfer_visible = true;
    },
    handleTurn(type) {
      // finish 结束 transfer 转派 back //打回 // agree 同意
      let request = 0;
      let reqdata = {
        id: this.edit_form.id,
        reviewOpinion: this.approveForm.comments,
      };
      switch (type) {
        case "finish":
          // status 0.打回 3.结束
          reqdata.status = "3";
          break;
        case "transfer":
          // reviewType 2.副总经理 3.经理
          if (this.duty === "7") {
            reqdata.reviewType = 2;
          } else {
            reqdata.reviewType = 3;
          }
          break;
        case "back":
          reqdata.status = "0";
          break;
        case "agree":
          reqdata.status = "3";
          break;
      }
      console.log(reqdata, "reqdata");
      this.handleInit({
        ...this.table_search,
        page: this.page,
        pageSize: this.rows,
      });
      this.handleCancel("visible");
      this.handleCancel("approve_visible");
      if (request) {
        // 这里调接口
        this.$http({
          url: "/market/CMKIssued/CMKIssuedCheck",
          method: "post",
          headers: {
            "Content-Type": "application/json",
          },
          data: reqdata,
        }).then((res) => {
          console.log(res, "res");
        });
      }
      // this.$http({
      //   url: "/market/CMKIssued/CMKIssuedCheck",
      //   method: "post",
      //   headers: {
      //     "Content-Type": "application/json",
      //   },
      //   data: {
      //     groupId,
      //   },
      // }).then((res) => {
      //   console.log(res, "res");
      //  this.handleInit()
      // this.handleCancel("visible");
      // this.handleCancel("approve_visible");
      // });
    },

    handleConfirm(visible) {
      console.log(visible);
      this.track_visible = visible;
    },
    // 关闭方法
    handleCancel(data) {
      switch (data) {
        case "visible":
          this.visible = false;
          break;
        case "approve_visible":
          this.approveForm.comments = "";
          this.approve_visible = false;
          break;
        case "track_visible":
          this.track_visible = false;
          break;
        case "transfer_visible":
          this.transfer_visible = false;
          break;
      }
    },
    // handleBack() {
    //   const object = {
    //     ...JSON.parse(sessionStorage.global_data)[0],
    //     department_status: "待处理",
    //   };
    //   sessionStorage.setItem("global_data", JSON.stringify([object]));
    //   const process_array = JSON.parse(sessionStorage.global_process);
    //   process_array.push({
    //     link: "审批驳回",
    //     creatperson: `ADMIN ${this.$formatDate(new Date(), "YYYY-MM-DD")}`,
    //     explain: this.approveForm.comments,
    //   });
    //   sessionStorage.setItem("global_process", JSON.stringify(process_array));

    //   // this.handleInit();
    //   // this.$message.success("打回成功");
    //   // this.handleCancel("visible");
    //   // this.handleCancel("approve_visible");
    // },
    // handleAgree() {
    //   const object = {
    //     ...JSON.parse(sessionStorage.global_data)[0],
    //     department_status: "已完成",
    //   };
    //   sessionStorage.setItem("global_data", JSON.stringify([object]));
    //   const process_array = JSON.parse(sessionStorage.global_process);
    //   process_array.push({
    //     link: "审批通过",
    //     creatperson: `ADMIN ${this.$formatDate(new Date(), "YYYY-MM-DD")}`,
    //     explain: this.approveForm.comments,
    //   });
    //   sessionStorage.setItem("global_process", JSON.stringify(process_array));
    //   this.handleInit();
    //   this.$message.success("审批成功");
    //   this.handleCancel("visible");
    //   this.handleCancel("approve_visible");
    // },
    handleSubmit() {
      // 提交好了
      let reqdata = {
        id: this.edit_form.id,
        templateContent: "asdad",
      };
      this.$http({
        url: "/CMKIssued/CMKIssuedSubmit",
        method: "post",
        headers: {
          "Content-Type": "application/json",
        },
        data: reqdata,
      }).then(({ data }) => {
        console.log(data, "data");
        if (data) {
          this.$message.success("提交成功");
          this.handleCancel("visible");
        } else {
            this.$message.error("提交失败");
        }
      });
    },
  },
};
</script>

<style></style>