soc_web/src/views/resumptionEvaluate/evaluate/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"
        ></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="queryForm"
              size="small"
              :inline="true"
              v-show="showSearch"
            >
              <el-form-item label="创建机构">
                <org-tree
                  v-model="queryParams.orgId"
                  @defaultKey="getDefaultKey"
                  @checkChange="checkChange"
                  @click="clickTreeNode"
                ></org-tree>
              </el-form-item>
              <el-form-item label="外包评价名称" prop="evaluateName">
                <el-input
                  :maxlength="20"
                  v-model="queryParams.evaluateName"
                  placeholder="请输入外包评价名称"
                  clearable
                  @keyup.enter.native="handleQuery"
                />
              </el-form-item>
              <el-form-item label="状态" prop="status">
                <el-select
                  v-model="queryParams.status"
                  placeholder="请选择状态"
                  clearable
                >
                  <el-option
                    v-for="dict in dict.type.plan_status"
                    :key="dict.value"
                    :label="dict.label"
                    :value="dict.value"
                  />
                </el-select>
              </el-form-item>
              <el-form-item label="评价机构类型">
                <el-select
                  @change="cleanExecOrgList"
                  prop="orgType"
                  label="评价机构类型"
                  v-model="queryParams.orgType"
                  placeholder="请选择评价机构类型"
                  clearable
                >
                  <el-option
                    v-for="item in dict.type.sys_org_type"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  >
                  </el-option>
                </el-select>
              </el-form-item>
              <el-form-item>
                <el-form-item prop="roleId" label="评价角色">
                  <el-select
                    @visible-change="getRolesByOrg"
                    label="评价角色"
                    v-model="queryParams.roleId"
                    placeholder="请选择评价角色"
                    filterable
                    @change="handleRolesChange"
                  >
                    <el-option
                      v-for="item in planRoles"
                      :key="item.id"
                      :label="item.name"
                      :value="item.id"
                    >
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-form-item>
            </el-form>

            <!--    按纽    -->
            <el-row :gutter="10" class="mb8">
              <el-col :span="1.5">
                <el-button
                  type="primary"
                  icon="el-icon-search"
                  size="mini"
                  @click="handleQuery"
                  >搜索</el-button
                >
                <el-button
                  type="primary"
                  icon="el-icon-refresh"
                  size="mini"
                  @click="resetQuery"
                  >重置</el-button
                >
                <el-button
                  type="primary"
                  icon="el-icon-plus"
                  size="mini"
                  @click="handleAdd"
                  v-hasPermi="['system:user:add']"
                  >新增</el-button
                >
              </el-col>
            </el-row>
          </div>
          <el-table
            border
            height="650"
            size="small"
            v-loading="loading"
            :data="dataList"
            align="center"
            fixed
            @selection-change="handleSelectionChange"
          >
            <el-table-column
              label="序号"
              type="index"
              width="100"
            ></el-table-column>
            <el-table-column label="创建机构" prop="orgName" />
            <el-table-column label="外包评价名称" prop="evaluateName" />
            <el-table-column label="评价机构类型" prop="orgType" />
            <el-table-column label="评价角色" prop="roleName" />
            <el-table-column label="评价周期" prop="evaluateCycle" />
            <el-table-column label="创建人" prop="createBy" />
            <el-table-column label="创建时间" prop="createTime" />
            <el-table-column label="状态" width="150">
              <template slot-scope="{ row }">
                <el-switch
                  v-model="row.status"
                  active-text="启用"
                  active-value="0"
                  inactive-text="停用"
                  inactive-value="1"
                  active-color="#3bbca9"
                  inactive-color="#d7000f"
                  @change="swtichChangeHandler(row)"
                >
                </el-switch>
              </template>
            </el-table-column>
            <el-table-column
              label="操作"
              width="200"
              fixed="right"
              class-name="small-padding fixed-width"
            >
              <template slot-scope="{ row }">
                <!-- publishEvaluate -->
                <el-button
                  size="mini"
                  @click="publishHandler(row)"
                  type="text"
                  v-if="row.orgId == isEdit"
                  :class="
                    row.isDistribute == 0
                      ? 'el-icon-arrow-down'
                      : 'el-icon-top-left'
                  "
                  >{{ row.isDistribute == "0" ? "" : "取消" }}发布</el-button
                >
                <el-button
                  size="mini"
                  @click="editHandler(row)"
                  type="text"
                  v-if="row.orgId == isEdit"
                  class="el-icon-edit-outline"
                  >编辑</el-button
                ><el-button
                  size="mini"
                  @click="deleteHandler(row)"
                  type="text"
                  v-if="row.orgId == isEdit"
                  class="el-icon-delete"
                  >删除</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>

    <editEvaluate ref="Evaluate" @success="getList()"></editEvaluate>
  </div>
</template>
<script>
import { mapGetters } from "vuex";
import { findAllRole } from "@/api/system/role";
import {
  list,
  swtichHandler,
  delelteEvaluate,
  publishEvaluate,
  withdraw,
} from "@/api/resumption/outsourcing.js";
import OrgTree from "@/components/orgTree/orgQuerySelector.vue";
import editEvaluate from "./editDialog.vue";
export default {
  name: "SocWebIndex",
  dicts: ["sys_org_type", "plan_status"],
  components: {
    OrgTree,
    editEvaluate,
  },
  data() {
    const { params, query } = this.$route;
    return {
      loading: false,
      selectedValues: [],
      planRoles: [],
      queryParams: this.reset(),
      queryParams: {
        orgId: null,
        evaluateName: null,
        status: null,
        orgType: null,
        checkSub: true,
        roleId: "",
        pageNum: 1,
        pageSize: 10,
        ...query,
      },
      isEdit: null,
      // 显示搜索条件
      showSearch: true,
      total: 0,
      dataList: [],
    };
  },
  created() {},
  mounted() {},
  computed: {
    ...mapGetters(["orgId"]),
  },
  methods: {
    //开关启用停用
    swtichChangeHandler(row) {
      swtichHandler({
        id: row.id,
        status: row.status,
      }).then((res) => {
        let { code, msg } = res;
        if (code == 200) {
          this.$message.success(msg);
          this.getList();
        } else {
          this.$message.error(msg);
        }
      });
    },
    //获取列表
    getList() {
      this.loading = true;
      // this.queryParams.orgId=this.orgId
      list(this.queryParams).then((res) => {
        this.dataList = res?.data.rows || [];
        this.isEdit = res?.isEdit;
        this.total = res.data.total || [];
        this.loading = false;
      });
    },
    // 多选框选中数据
    handleSelectionChange(selection) {},
    /** 新增按钮操作 */
    handleAdd() {
      this.$refs.Evaluate.show();
    },
    editHandler(row) {
      this.$refs.Evaluate.show(row.id,row.isDistribute);
    },
    //发布
    publishHandler(row) {
      //0未 //1已
      if (row.isDistribute == "1") {
        this.$modal
          .confirm("是否取消发布？")
          .then(function () {})
          .then(() => {
            withdraw(row.id).then((res) => {
              let { code, msg } = res;
              if (code == 200) {
                this.getList();
                this.$modal.msgSuccess("取消发布成功");
              } else {
                this.$modal.msgSuccess(msg);
              }
            });
          });
      } else {
        this.$modal
          .confirm("是否确认发布？")
          .then(function () {})
          .then(() => {
            publishEvaluate(row.id).then((res) => {
              let { code, msg } = res;
              if (code == 200) {
                this.getList();
                this.$modal.msgSuccess("发布成功");
              } else {
                this.$modal.msgSuccess(msg);
              }
            });
          });
      }
    },
    deleteHandler(row) {
      this.$modal
        .confirm("是否确认删除？")
        .then(function () {})
        .then(() => {
          delelteEvaluate(row.id).then((res) => {
            let { code, msg } = res;
            if (code == 200) {
              this.getList();
              this.$modal.msgSuccess("删除成功");
            } else {
              this.$modal.msgSuccess(msg);
            }
          });
        });
    },
    //单选框状态改变
    checkChange(state) {
      this.queryParams.checkSub = state;
      this.getList();
    },
    // 节点单击事件
    clickTreeNode(data) {
      this.queryParams.orgId = data.id;
      this.getList();
    },
    getRolesByOrg() {
      let params = {
        orgType: this.queryParams.orgType || null,
      };
      findAllRole(params).then((res) => {
        this.planRoles = res.data;
        if (!this.queryParams.orgType) {
          this.planRoles = [];
          this.queryParams.roleId = [];
        }
      });
    },
    cleanExecOrgList() {
      this.execOrgIds = null;
      this.queryParams.roleId = [];
      this.queryParams.execOrgList = [];
      this.getRolesByOrg();
    },
    handleRolesChange(val) {
      this.selectedValues = val.toString().split(",");
    },
    getDefaultKey(key) {
      this.queryParams.orgId = key;
      this.getList();
    },
    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.pageNum = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.resetForm("queryForm");
      this.queryParams.onlyManager = false;
      this.queryParams.orgType = null;
      this.handleQuery();
    },
    reset() {
      return {
        planName: null,
        planType: null,
        planCycle: null,
        planStatus: null,
        orgType: null,
        roleNames: null,
        count: null,
        description: null,
        tableData: null,
        itemList: null,
        planExec: null,
        count: 0,
        note: null,
        planCreateOrgId: null,
        planCreateOrgName: null,
        roleList: null,
        roleId: null,
        execOrg: null,
        checkOrg: null,
        buildTaskNow: false,
        checkOrgList: [],
        execOrgList: [],
        rulePointList: null,
        checkOrgIds: null,
        execOrgIds: null,
        rulePointIds: null,
        checkOrgType: null,
        checkType: null,
      };
    },
  },
};
</script>
<style lang="scss" scoped></style>