<template>
  <!-- 督导任务 -->
  <div class="ddrwContent">
    <div class="d-flex flex-between">
      <div>
        <el-button type="success" size="medium" @click="createNew" v-if="isDuDao">
          <span class="d-in-block v-mid el-icon-plus font-size-16"></span>
          <span class="d-in-block v-mid font-size-16">新建督导任务</span>
        </el-button>
      </div>
      <el-form label-width="100px" :inline="true">
        <el-form-item prop="jdd_ddlx">
          <el-select v-model="searchForm.jdd_ddlx" placeholder="请选择" v-if="selectObj.jdd_ddlx" @change="getListData">
            <el-option label="全部" value=""></el-option>
            <el-option v-for="item in selectObj.jdd_ddlx.option" :key="item.v" :label="item.n" :value="item.v"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item prop="keyword">
          <el-input placeholder="请输入搜索关键字" v-model="searchForm.keyword" clearable @clear="getListData"></el-input>
        </el-form-item>
        <el-button type="primary" class="ml5" @click="getListData">搜索</el-button>
      </el-form>
    </div>

    <el-tabs v-model="activeName" @tab-click="getListData">
      <el-tab-pane label="我新建的" name="1"></el-tab-pane>
      <el-tab-pane label="我提交的" name="2"></el-tab-pane>
    </el-tabs>

    <el-table :data="tableData" tooltip-effect="dark" v-loading="loading" style="width: 100%">
      <el-table-column label="序号" align="center" type="index" width="50"></el-table-column>
      <el-table-column v-for="(item, index) in columnData" :key="index" :label="item.name" show-overflow-tooltip :prop="item.key" width="auto"></el-table-column>
      <el-table-column label="操作" v-if="isDuDao || activeName==2">
        <template slot-scope="scope">
          <el-popover placement="bottom-end" trigger="hover" v-if="activeName==1">
            <div>
              <el-button type="text" @click="handleSummary(scope.row)" v-if="scope.row.jdd_status_option_k==3 && scope.row.jdd_ddzs_status_option_k==2">生成督导综述</el-button>
              <el-link :underline="false" type="info" v-if="scope.row.jdd_status_option_k==3 && scope.row.jdd_ddzs_status_option_k==1" style="margin-right: 10px;">已生成督导综述</el-link>
              <el-button type="text" @click="lookDetail(scope.row)">详情</el-button>
              <el-button type="text" @click="editData(scope.row)" v-if="scope.row.jdd_status_option_k!=3">编辑</el-button>
              <el-button type="text" @click="handleSend(scope.row)" v-if="scope.row.jdd_status_option_k!=3">下发</el-button>
              <el-button type="text" @click="addIndicator(scope.row)" v-if="(scope.row.jdd_ddlx_option_k==2 || scope.row.jdd_ddlx_option_k==4) && scope.row.jdd_status_option_k!=3">添加指标</el-button>
              <el-button type="text" @click="delData(scope.row)" v-if="scope.row.jdd_status_option_k!=3">删除</el-button>
            </div>
            <i style="transform: rotate(90deg);" class="el-icon-more" slot="reference"></i>
          </el-popover>
          <el-button type="text" @click="lookDetail(scope.row)" v-if="activeName==2">详情</el-button>
        </template>
      </el-table-column>
    </el-table>
    <footer class="flex-item-none" style="display: flex; justify-content: flex-end; margin-top: 30px">
      <el-pagination background layout="total,prev, pager, next" :page-size="limit" :total="total" :current-page.sync="cur_page" @current-change="handleCurrentChange"></el-pagination>
    </footer>

    <el-dialog :title="dialogTitle" :visible.sync="dialogFormVisible" width="600px" :close-on-click-modal="false" @close="handleClose">
      <add-and-edit v-if="dialogType==1" ref="addAndEdit" :currentId="currentId" :selectObj="selectObj" @close="handleClose"></add-and-edit>
      <div v-if="dialogType==2" class="d-flex flex-v-mid">
        <div><span style="color: red;">*</span>下发对象：</div>
        <el-select v-model="mineStatus" placeholder="请选择" multiple filterable @change="selectChange" style="flex: 1;">
          <el-option :value="mineStatusValue" style="height: auto">
            <el-tree default-expand-all :data="treeData" show-checkbox node-key="id" ref="tree" highlight-current :default-checked-keys="sendData" :props="defaultProps" @check-change="handleCheckChange"></el-tree>
          </el-option>
        </el-select>
      </div>
      <div slot="footer">
        <el-button @click="handleClose">取消</el-button>
        <el-button type="primary" @click="formSubmit">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { ddrwList, ddrwDelete, orgList, orgListTree, xfdxAdd, ddrwSend, xfdxList, ddrwEdit } from "./api";
import AddAndEdit from "./AddAndEdit.vue";
import { useUserStore } from "@/stores/user";
const userInfo = useUserStore();
export default {
  data() {
    return {
      isDuDao: userInfo.uo_id == 386 || userInfo.userInfo.user_group_id == 100 ? true : false,
      searchForm: {
        jdd_ddlx: "",
        keyword: "",
      },
      loading: false,
      activeName: "1",
      sendData: [],
      treeData: [],
      treeData1: [],
      treeData2: [],
      mineStatus: [],
      mineStatusValue: [],
      defaultProps: {
        children: "children",
        label: "label"
      },
      columnData: [
        {
          name: "任务名称",
          key: "jdd_name"
        },
        {
          name: "督导类型",
          key: "jdd_ddlx"
        },
        {
          name: "督导对象",
          key: "jdd_dddx"
        },
        {
          name: "附件数",
          key: "jdd_fjs"
        },
        {
          name: "责任人",
          key: "jdd_zrr"
        },
        {
          name: "责任部门",
          key: "jdd_uo_name"
        },
        {
          name: "任务开始时间",
          key: "jdd_start_date"
        },
        {
          name: "任务结束时间",
          key: "jdd_end_date"
        },
        {
          name: "任务内容",
          key: "jdd_content"
        },
        {
          name: "状态",
          key: "jdd_status"
        }
      ],
      tableData: [],
      limit: 10,
      total: 0,
      cur_page: 1,
      dialogTitle: "",
      dialogType: "",
      dialogFormVisible: false,
      currentId: "",
      selectObj: [],
    }
  },
  components: { AddAndEdit },
  methods: {
    async initDepartmentData() {
      let data1 = await orgListTree();
      this.treeData1 = data1.one_info;

      let data2 = await orgListTree({ uo_pid: "1036" });
      this.treeData2 = data2.one_info;
    },
    async getListData(flag) {
      this.loading = true;
      let obj = {
        page: this.cur_page,
        limit: this.limit,
        jdd_ddlx: this.searchForm.jdd_ddlx,
        keyword: this.searchForm.keyword,
      }
      let data = {};
      if (this.activeName == 1) {
        data = await ddrwList(obj);
      } else if (this.activeName == 2) {
        obj.ptype = "2";
        obj.jddx_uo_id = userInfo.uo_id;
        data = await xfdxList(obj);
      }
      if (data) {
        this.tableData = data.page_data;
        this.cur_page = Number(data.page_now);
        this.total = Number(data.total_rows);
        this.loading = false;

        if (flag == 1) {
          for (let key in data.table_structure.field) {
            if (data.table_structure.field[key].type == "radio") {
              this.selectObj[key] = data.table_structure.field[key];
            }
          }
        }
      }
    },
    handleCurrentChange(val) {
      this.cur_page = val;
      this.getListData();
    },
    createNew() {
      this.dialogFormVisible = true;
      this.dialogTitle = "新建督导任务";
      this.dialogType = 1;
    },
    editData(data) {
      this.dialogFormVisible = true;
      this.dialogTitle = "编辑督导任务";
      this.currentId = data.jdd_id;
      this.dialogType = 1;
    },
    delData(data) {
      this.$confirm("是否确定删除当前数据？", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(async () => {
          let res = await ddrwDelete({ jdd_id: data.jdd_id });
          if (res) {
            this.$message.success("删除成功！");
            this.getListData();
          }
        })
        .catch(() => { });
    },
    handleClose(type) {
      this.dialogFormVisible = false;
      this.$refs.addAndEdit && this.$refs.addAndEdit.resetForm();
      this.currentId = "";
      this.dialogType = "";
      this.dialogTitle = "";
      if (type == 1) {
        this.getListData();
      }
    },
    formSubmit() {
      if (this.dialogType == 1) {
        this.$refs.addAndEdit.commitData();
      } else if (this.dialogType == 2) {
        this.submit();
      }
    },
    lookDetail(data) {
      if (this.activeName == 1) {
        this.$router.push({ name: "dddx-ddrw-detail-index", params: { id: data.jdd_id } })
      } else if (this.activeName == 2) {
        // 无指标
        if (data.jdd_ddlx_option_k == 1 || data.jdd_ddlx_option_k == 3) {
          this.$router.push({ name: "dddx-ddrw-noindicator-detail", params: { id: data.jdd_id, xfId: data.jddx_id } })
        } else {
          this.$router.push({ name: "dddx-ddrw-indicator-detail", params: { id: data.jdd_id, xfId: data.jddx_id } })
        }
      }
    },
    addIndicator(data) {
      this.$router.push({ name: "dddx-ddrw-tjzb", params: { id: data.jdd_id } })
    },
    async handleSend(data) {
      this.sendData = [];
      this.mineStatus = [];
      this.mineStatusValue = [];
      this.treeData = data.jdd_dddx_option_k == 2 ? [...this.treeData2] : [...this.treeData1];

      let obj = {
        jdd_id: data.jdd_id,
        jdd_ddlx: data.jdd_ddlx_option_k,
        site: "jnmf",
      }
      let res = await ddrwSend(obj)
      if (res) {
        for (let key in res) {
          this.sendData.push(key);
          this.mineStatus.push(res[key]);
        }

        this.dialogType = 2;
        this.dialogFormVisible = true;
        this.dialogTitle = "下发";
        this.currentId = data.jdd_id;

        this.$nextTick(() => {
          this.mineStatusValue = this.$refs.tree.getCheckedNodes(true, true);
        })
      }
    },
    selectChange(e) {
      var arrNew = [];
      var dataLength = this.mineStatusValue.length;
      var eleng = e.length;
      for (let i = 0; i < dataLength; i++) {
        for (let j = 0; j < eleng; j++) {
          if (e[j] === this.mineStatusValue[i].label) {
            arrNew.push(this.mineStatusValue[i])
          }
        }
      }
      this.$refs.tree.setCheckedNodes(arrNew); //设置勾选的值
    },
    handleCheckChange() {
      let res = this.$refs.tree.getCheckedNodes(true, true); //这里两个true，1. 是否只是叶子节点 2. 是否包含半选节点（就是使得选择的时候不包含父节点）
      this.mineStatus = [];
      res.forEach(item => {
        this.mineStatus.push(item.label);
      });
      this.mineStatusValue = [...res];
    },
    async submit() {
      if (this.mineStatusValue.length == 0) {
        this.$message.error("请选择下发对象！");
        return
      }
      let arr = [];
      this.mineStatusValue.map((item) => {
        arr.push({
          uo_id: item.id,
          uo_name: item.label
        })
      })
      let obj = {
        issubmit: '1',
        site: "jnmf",
        jdd_id: this.currentId,
        send_obj: arr
      }
      let res = await xfdxAdd(obj);
      if (res) {
        this.$message.success("下发成功！");
        this.handleClose(1);
      }
    },
    // 生成督导综述
    async handleSummary(data) {
      let obj = {
        issubmit: '1',
        jdd_id: data.jdd_id,
        jdbg_dddx_ddrw: {
          jdd_ddzs_status: "1"
        }
      }
      let res = await ddrwEdit(obj);
      if (res) {
        this.getListData();
        this.$message.success("生成督导综述成功！");
      }
    }
  },
  created() {
    this.initDepartmentData();
    this.getListData(1);
  }
}
</script>

<style>
</style>