soc_web/src/views/safetycheck/plan/index.vue

<template>
  <div class="app-container">
    <el-row :gutter="10">
      <!--机构数据-->
      <!-- <el-col :span="4" :xs="24"


      >
        <org-tree
          v-model="queryParams.orgId"
          @defaultKey="getDefaultKey"
          @checkChange="checkChange"
          @click="clickTreeNode"
          hangsheTree
          :defaultCheckSub="false"
        ></org-tree>
      </el-col> -->

      <el-col :span="24" :xs="24">
        <!--    搜索条件    -->
        <div class="main-right-box">
          <div class="main-search-box">
            <el-form
              :model="queryParams"
              ref="search"
              size="small"
              :inline="true"
              v-show="showSearch"
            >
              <el-row>
                <el-form-item label="行社名称">
                  <org-tree
                    v-model="queryParams.orgId"
                    @defaultKey="getDefaultKey"
                    @checkChange="checkChange"
                    @click="clickTreeNode"
                    hangsheTree
                    :defaultCheckSub="false"
                    ref="orgTree"
                  ></org-tree>
                </el-form-item>
                <el-form-item prop="checkType" label="任务类型">
                  <el-select
                    prop="checkType"
                    label="任务类型"
                    v-model="queryParams.checkType"
                    placeholder="请选择任务类型"
                    clearable
                  >
                    <el-option
                      v-for="dict in dict.type.check_type"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    />
                  </el-select>
                </el-form-item>
                <el-form-item
                  prop="execOrgType"
                  label="检查机构类型"
                  v-if="false"
                >
                  <el-select
                    prop="execOrgType"
                    label="检查机构类型"
                    v-model="queryParams.execOrgType"
                    placeholder="请选择检查机构类型"
                    clearable
                  >
                    <el-option
                      v-for="dict in dict.type.sys_org_type"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    />
                  </el-select>
                </el-form-item>
                <el-form-item
                  prop="checkOrgType"
                  label="受检机构类型"
                  v-if="false"
                >
                  <el-select
                    prop="checkOrgType"
                    label="受检机构类型"
                    v-model="queryParams.checkOrgType"
                    placeholder="请选择受检机构类型"
                    clearable
                  >
                    <el-option
                      v-for="dict in dict.type.sys_org_type"
                      :key="dict.value"
                      :label="dict.label"
                      :value="dict.value"
                    />
                  </el-select>
                </el-form-item>

                <el-form-item prop="checkRole" label="检查人员">
                  <el-select
                    @visible-change="getRolesByOrg"
                    prop="checkRole"
                    label="检查人员"
                    v-model="queryParams.checkRole"
                    placeholder="请选择用户角色"
                    clearable
                  >
                    <el-option
                      v-for="dict in resumptionRoles"
                      :key="dict.index"
                      :label="dict.roleName"
                      :value="dict.id"
                    />
                  </el-select>
                </el-form-item>
                <el-form-item prop="planCycle" label="任务周期">
                  <el-select
                    prop="planCycle"
                    label="任务周期"
                    v-model="queryParams.planCycle"
                    placeholder="请选择任务周期"
                    clearable
                  >
                    <el-option
                      v-for="item in dict.type.check_cycle"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item prop="planStatus" label="任务状态">
                  <el-select
                    prop="planStatus"
                    label="任务状态"
                    v-model="queryParams.planStatus"
                    placeholder="请选择任务状态"
                    clearable
                  >
                    <el-option
                      v-for="item in dict.type.check_status"
                      :key="item.value"
                      :label="item.label"
                      :value="item.value"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
                <el-form-item prop="planName" label="任务名称">
                  <el-input
                    v-model="queryParams.planName"
                    :maxlength="50"
                    name="planName"
                    placeholder="请输入关键字"
                    clearable
                  />
                </el-form-item>
              </el-row>
              <el-row> </el-row>
            </el-form>
            <el-row :gutter="10">
              <el-col :span="1.5">
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="mini"
                  @click="getList"
                  >搜索</el-button
                >
              </el-col>
              <el-col :span="1.5">
                <el-button
                  type="primary"
                  icon="el-icon-refresh"
                  size="mini"
                  @click="resetQuery"
                  >重置</el-button
                >
              </el-col>
              <el-col :span="1.5">
                <el-button
                  type="primary"
                  icon="el-icon-plus"
                  size="mini"
                  @click="handleAdd()"
                  v-hasPermi="['core:checkplan:add']"
                  >新增任务</el-button
                >
              </el-col>

              <right-toolbar
                :showSearch.sync="showSearch"
                @queryTable="getList"
              ></right-toolbar>
            </el-row>
          </div>
          <el-table
            border
            height="596"
            size="small"
            v-loading="loading"
            :data="pageData"
            @selection-change="handleSelectionChange"
            row-key="id"
            :tree-props="{ children: 'children' }"
          >
            <el-table-column
              type="index"
              label="序号"
              align="center"
              width="80px"
              v-if="columns[0].visible"
            ></el-table-column>
            <el-table-column
              prop="planName"
              label="任务名称"
              align="center"
              width="250px"
              show-overflow-tooltip
              v-if="columns[1].visible"
            ></el-table-column>

            <el-table-column
              prop="checkType"
              label="任务类型"
              align="center"
              width="300px"
              v-if="columns[2].visible"
            >
              <template slot-scope="r"
                >{{ getLabel(dict.type.check_type, `${r.row.checkType}`) }}
              </template>
            </el-table-column>
            <el-table-column
              prop="planCreateOrgName"
              label="创建机构"
              align="center"
              width="150px"
              show-overflow-tooltip
              v-if="columns[3].visible"
            >
            </el-table-column>
            <el-table-column
              prop="planOfOrgName"
              label="行社名称"
              align="center"
              width="150px"
              show-overflow-tooltip
              v-if="columns[4].visible"
            >
            </el-table-column>

            <el-table-column
              prop="execOrgType"
              align="center"
              width="150px"
              label="检查主体"
              v-if="columns[5].visible"
            >
              <template slot-scope="r"
                >{{ getLabel(dict.type.sys_org_type, `${r.row.execOrgType}`) }}
              </template>
            </el-table-column>

            <el-table-column
              prop="typeNames"
              align="center"
              width="150px"
              label="受检机构"
              v-if="columns[6].visible"
            >
              <!-- <template slot-scope="r"
                >{{ getLabel(dict.type.sys_org_type, `${r.row.checkOrgType}`) }}
              </template> -->
            </el-table-column>

            <el-table-column
              prop="roleNames"
              align="center"
              width="200px"
              label="检查人员"
              show-overflow-tooltip
              v-if="columns[7].visible"
            >
              <template slot-scope="scope">
                <template v-for="item in splitRoleNames(scope.row.roleNames)">
                  {{ item }}
                </template> </template
            ></el-table-column>
            <el-table-column
              prop="planCycle"
              label="任务周期"
              align="center"
              width="120px"
              v-if="columns[8].visible"
            >
              <template slot-scope="r"
                >{{ getLabel(dict.type.check_cycle, `${r.row.planCycle}`) }}
              </template>
            </el-table-column>

            <el-table-column
              prop="count"
              label="任务次数"
              align="center"
              width="120px"
              v-if="columns[9].visible"
            ></el-table-column>

            <el-table-column
              prop="planStatus"
              label="任务状态"
              align="center"
              width="120px"
              v-if="columns[10].visible"
            >
              <template slot-scope="r"
                >{{ getLabel(dict.type.check_status, `${r.row.planStatus}`) }}
              </template>
            </el-table-column>

            <el-table-column
              prop="modifiedName"
              label="修改人"
              v-if="false"
            ></el-table-column>

            <el-table-column
              prop="updateTime"
              label="修改时间"
              width="80px"
              v-if="false"
            >
              <template slot-scope="scope">
                <span>{{
                  formatTime(scope.row.updateTime, "YYYY-MM-DD")
                }}</span>
              </template>
            </el-table-column>

            <el-table-column
              label="操作"
              width="200"
              fixed="right"
              align="center"
            >
              <template slot-scope="r">
                <el-button
                  type="text"
                  size="mini"
                  icon="el-icon-arrow-down"
                  v-if="showPublish(r.row)"
                  @click="showDialogDistribute(r.row)"
                  v-hasPermi="['core:checkplan:distribute']"
                  >下发</el-button
                >

                <el-button
                  type="text"
                  icon="el-icon-top-left"
                  size="mini"
                  v-if="showWithDraw(r.row)"
                  @click="chhuile(r.row)"
                  v-hasPermi="['core:checkplan:distribute']"
                  >撤回</el-button
                >
                <el-button
                  v-if="eqOrg(r.row)"
                  size="mini"
                  type="text"
                  icon="el-icon-edit-outline"
                  @click="onEdit(r.row.id)"
                  v-hasPermi="['core:checkplan:edit']"
                  >编辑</el-button
                >
                <el-button
                  v-if="showDelete(r.row)"
                  size="mini"
                  type="text"
                  icon="el-icon-delete"
                  @click="onDel(r.row)"
                  v-hasPermi="['core:checkplan:remove']"
                  >删除</el-button
                >
              </template>
            </el-table-column>
          </el-table>

          <pagination
            v-show="total > 0"
            :total="total"
            :page.sync="queryParams.pageNum"
            :limit.sync="queryParams.pageSize"
            @pagination="getList"
          />
        </div>
      </el-col>
    </el-row>
    <dialog-edit
      ref="editDialog"
      @success="getList()"
      :orgTypeOptions="orgTypeOptions"
      :ruleTypeOptions="dict.type.rule_type"
    ></dialog-edit>
    <DialogDistribute ref="dialogDistribute" @select="sel"></DialogDistribute>
    <DialogThreeState ref="DialogThreeState"> </DialogThreeState>
  </div>
</template>

<script>
import DialogDistribute from "./distribute.vue";
import OrgTree from "@/components/orgTree/orgQuerySelector.vue";
import { mapState, mapMutations, mapGetters } from "vuex";
import DialogEdit from "./dialog.edit";
import * as api from "@/api/safetycheck/plan";
import { statusOptions, getLabel } from "@/views/commonOption";
import { listRole } from "@/api/system/role";
import DialogThreeState from "@/components/message/threeStateMessageBox.vue";
export default {
  name: "resumptionplan",
  dicts: [
    "sys_org_type",
    "rule_type",
    "check_cycle",
    "check_status",
    "check_type",
  ],
  components: {
    DialogEdit,
    OrgTree,
    DialogDistribute,
    DialogThreeState,
  },
  data() {
    const { params, query } = this.$route;
    return {
      isShow: false,
      loading: false,
      ids: [],
      // 非单个停用
      single: true,
      // 非多个停用
      multiple: true,
      // 显示搜索条件
      showSearch: true,
      resumptionRoles: [],
      total: 0,
      queryParams: {
        id: null,
        planName: null,
        checkRole: null,
        planCycle: null,
        planCreateOrgId: null,
        checkType: null,
        planOfOrgId: null,
        execOrgType: null,
        checkOrgType: null,
        planStatus: null,
        pageSize: 10,
        pageNum: 1,
        checkSub: false,
        orgId: null,
        ...query,
      },
      pageData: [],
      // 列信息
      columns: [
        { key: 0, label: `序号`, visible: true },
        { key: 1, label: `任务名称`, visible: true },
        { key: 2, label: `任务类型`, visible: true },
        { key: 3, label: `创建机构`, visible: true },
        { key: 4, label: `行社名称`, visible: true },
        { key: 5, label: `检查主体`, visible: true },
        { key: 6, label: `受检机构`, visible: true },
        { key: 7, label: `检查人员`, visible: true },
        { key: 8, label: `任务周期`, visible: true },
        { key: 9, label: `任务次数`, visible: true },
        { key: 10, label: `任务状态`, visible: true },
      ],
    };
  },
  props: {},
  watch: {},
  computed: {
    ...mapState([]),
    ...mapGetters(["orgId", "orgName"]),
    orgTypeOptions() {
      if (!this.dict || !this.dict.type.sys_org_type == null) {
        return [];
      }

      return this.dict.type.sys_org_type.filter(
        (t) => !["7", "8"].includes(t.value)
      );
    },
  },
  methods: {
    ...mapMutations([]),

    //判断是否跟当前用户同机构
    eqOrg(row) {
      // console.log(row.planOfOrgId,"row.planOfOrgId");
      // console.log(this.orgId,"this.orgId");
      if (
        row != null &&
        row != undefined &&
        (row.planCreateOrgId == this.orgId ||
          (row.planOfOrgType == 3 && row.planOfOrgId == this.orgId))
      ) {
        return true;
      }
      return false;
    },
    showDialogDistribute(row) {
      //行社的计划，或检查机构类型是省联社、办事处，走单个下发
      if (
        row.planOfOrgType == 3 ||
        row.execOrgType == 1 ||
        row.execOrgType == 2
      ) {
        this.onSinglePlanDistribute(row);
      } else {
        this.$refs.dialogDistribute.show(row);
      }
    },

    onSinglePlanDistribute(row) {
      if (row.planStatus == 0) {
        if (row.planCycle == 6) {
          //无周期任务,
          let msg = "确定下发任务并立即生成任务?";
          this.$modal.confirm(msg).then(() => {
            this.distributeSingle(row.id, true);
          });
        } else {
          let msg = "请选择下发后立即生成或下周期生成任务";
          this.$refs["DialogThreeState"].show(
            msg,
            (state) => {
              if (state == 0 || state == 1) {
                this.distributeSingle(row.id, state == 1);
              }
            },
            {
              yesText: "立即生成",
              noText: "下周期",
              cancelText: "取消",
            }
          );
        }
      } else if (row.planStatus == 2) {
        let msg = "";

        if (row.planCycle == 6) {
          msg = "已存在已完成任务,是否确定下发?";
        } else {
          msg = "因存在已完成任务，是否确定从下周期生成任务？";
        }
        this.$modal
          .confirm(msg, {
            confirmButtonText: "确定",
            canelButtonText: "取消",
          })
          .then(() => {
            this.distributeSingle(row.id, false);
          });
      } else {
        this.distributeSingle(row.id, false);
      }
    },
    distributeSingle(id, immediateEffect) {
      this.loading = true;
      api
        .distributeSingle(id, immediateEffect)
        .then((response) => {
          // console.log(response, "then");
          if (response.data == 0) {
            this.loading = false;
          } else {
            this.getList();
            this.loading = false;
          }
        })
        .catch((response) => {
          // console.log(response, "catch");
          this.getList();
          this.loading = false;
        });
    },
    showPublish(row) {
      //有父计划且父计划不是使用中状态，不能下发
      if (row.parentStatus != 1 && row.parentId > 0) {
        return false;
      }
      //可以下发:本机构创建+状态为草稿、停用的计划
      if (
        row.planCreateOrgId == this.orgId &&
        (row.planStatus == 0 || row.planStatus == 2)
      ) {
        return true;
      }

      // if (
      //   row.planOfOrgId == this.orgId &&
      //   row.planCreateOrgId != this.orgId &&
      //   (row.planStatus == 0 || row.planStatus == 2) &&
      //   row.distributePlanStatus == 0
      // ) {
      //   return true;
      // }

      return false;
    },
    showDelete(row) {
      //本机构创建的计划，才能删除
      return row.planCreateOrgId == this.orgId && row.planOfOrgId == this.orgId;
    },
    showWithDraw(row) {
      //本机构创建是自己+状态为使用中
      if (row.planCreateOrgId == this.orgId && row.planStatus == 1) {
        return true;
      }

      // if (
      //   row.planOfOrgId == this.orgId &&
      //   row.planCreateOrgId != this.orgId &&
      //   row.planStatus == 1 &&
      //   row.distributePlanStatus == 0
      // ) {
      //   return true;
      // }

      return false;
    },
    splitRoleNames(val) {
      if (val != null && val != undefined) {
        return val.split(",");
      } else {
        return [];
      }
      // 使用逗号分割字符串，得到角色名称的数组
    },
    sel(selectList, row) {
      let msg = "";
      if (row.planStatus == 0) {
        if (row.planCycle == 6) {
          //无周期任务,
          let msg = "确定下发任务并立即生成任务?";
          this.$modal.confirm(msg).then(() => {
            this.distributeInner(selectList, true);
          });
        } else {
          msg = "请选择下发后立即生成或下周期生成任务。";
          this.$refs["DialogThreeState"].show(
            msg,
            (state) => {
              if (state == 0 || state == 1) {
                this.distributeInner(selectList, state == 1);
              }
            },
            {
              yesText: "立即生成",
              noText: "下周期",
              cancelText: "取消",
            }
          );
        }
      } else if (row.planStatus == 2) {
        if (row.planCycle == 6) {
          msg = "已存在已完成任务,是否确定下发?";
        } else {
          msg = "因存在已完成任务，是否确定从下周期生成任务？";
        }
        this.$modal.confirm(msg).then(() => {
          this.distributeInner(selectList, false);
        });
      } else {
        this.distributeInner(selectList, false);
      }
    },
    distributeInner(selectList, imme) {
      this.loading = true;
      api
        .distribute(selectList, imme)
        .then((response) => {
          this.getList();
          this.loading = false;
        })
        .catch(() => {
          this.loading = false;
        });
    },

    //开始撤回
    chhuile(row) {
      if (row.planCycle == "6" && row.taskHasCompleted == 1) {
        //无周期任务有已完成时，不能撤回
        this.$modal.alertSuccess(
          "存在已完成任务，无周期任务不允许撤回，如需删除下发任务请点击“删除”。"
        );
        return;
      }
      let msg;

      if (row.taskHasCompleted != 1) {
        msg = "因不存在已完成任务，撤回后将删除所有生成任务?";
      } else {
        msg = "因存在已完成任务，撤回后下周期起将不再生成任务?";
      }
      this.$modal
        .confirm(msg, "提示")
        .then(() => {
          // 用户点击了确认按钮
          // console.log("执行操作...");
          this.loading = true;
          api.cheHui(row.id).then((response) => {
            this.getList();
            this.loading = false;
          });
        })
        .catch(() => {
          // 用户点击了取消按钮
          // console.log("取消操作...");
        });
    },
    // //已下发的显示撤回
    // chehui(row) {
    //   if (row.distribute == 1 && row.planCreateOrgId == this.orgId) {
    //     return true;
    //   }
    //   return false;
    // },
    // showDialogDistribute(row) {
    //   console.log(row, "qqq");
    //   this.$refs.dialogDistribute.show(row);
    // },
    getRolesByOrg() {
      let params = {
        // orgId:this.queryParams.orgId
      };
      listRole(params).then((res) => {
        // console.info(res);
        this.resumptionRoles = res.rows;
      });
    },
    getList() {
      this.loading = true;
      console.info(this.dict.type);
      api
        .list(this.queryParams)
        .then((response) => {
          this.pageData = response.rows;
          this.total = response.total;
          this.loading = false;
        })
        .catch(() => {
          this.loading = false;
        });
    },
    getDefaultKey(key) {
      this.queryParams.orgId = key;
      this.getList();
    },
    handleAdd(id, other = {}) {
      id = null;
      this.$refs.editDialog.show(id, other);
    },
    onEdit(id, other = {}) {
      this.$refs.editDialog.show(id, other);
    },
    async onDel(row) {
      let msg = "";
      if (row.planStatus == 0) {
        msg = '是否确认删除名称为"' + row.planName + '"的任务？';
      } else if (row.planStatus == 1) {
        msg = "本次删除将强制删除当前任务时间及以后所有任务";
      } else if (row.planStatus == 2) {
        if (row.hasTaskCurrentCycle) {
          msg = "本次删除将强制删除当前任务时间及以后所有任务";
        } else {
          msg = '是否确认删除名称为"' + row.planName + '"的任务？';
        }
      }

      this.$modal
        .confirm(msg)
        .then(() => {
          // 用户点击了确认按钮
          // console.log("执行操作...");
          this.loading = true;
          api
            .delelte(row.id)
            .then(() => {
              this.getList();
              this.loading = false;
              this.$modal.msgSuccess("删除成功");
            })
            .catch(() => {
              this.loading = false;
            });
        })
        .catch((ex) => {
          console.error(ex);
          // 用户点击了取消按钮
          // console.log("取消操作...");
        });
    },
    // 多选框选中数据
    handleSelectionChange(selection) {
      this.ids = selection.map((item) => item.userId);
      this.single = selection.length != 1;
      this.multiple = !selection.length;
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("search");
      this.queryParams.orgId = this.orgId;
      this.queryParams.checkSub = false;
      this.$refs["orgTree"].setCheckSub(this.queryParams.checkSub);
      // this.$refs.tree.setCurrentKey(null);
      this.getList();
    },
    //单选框状态改变
    checkChange(state) {
      this.queryParams.checkSub = state;
      this.getList();
    },
    // 节点单击事件
    clickTreeNode(data) {
      this.queryParams.orgId = data.id;
      this.getList();
    },
    getStatusLabel(value) {
      return getLabel(statusOptions, value);
    },
    getLabel(options, value) {
      return getLabel(options, value);
    },
    //apimark//
  },
  mounted() {},
};
</script>

<style lang="scss" scoped>
.brand {
}
</style>