soc_web/src/views/resumption/evaluate/index.vue

<template>
  <div class="app-container">
    <layoutCom>
      <org-tree
        slot="leftBar"
        v-model="queryParams.orgId"
        @defaultKey="getDefaultKey"
        @checkChange="checkChange"
        @click="clickTreeNode"
      ></org-tree>
      <el-row slot="rightBar">
        <!--用户数据-->
        <el-col>
          <!--    搜索条件    -->
          <el-form
            :model="queryParams"
            ref="queryForm"
            size="small"
            :inline="true"
            v-show="showSearch"
            label-width="100px"
          >
            <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-button
                type="primary"
                icon="el-icon-search"
                size="mini"
                @click="handleQuery"
                >搜索</el-button
              >
              <el-button icon="el-icon-refresh" size="mini" @click="resetQuery"
                >重置</el-button
              >
            </el-form-item>
          </el-form>

          <!--    按纽    -->
          <el-row :gutter="10" class="mb8">
            <el-col :span="1.5">
              <el-button
                type="primary"
                plain
                icon="el-icon-plus"
                size="mini"
                @click="handleAdd"
                v-hasPermi="['system:user:add']"
                >新增</el-button
              >
            </el-col>
          </el-row>
          <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="50"
            ></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"
                  @change="swtichChangeHandler(row)"
                >
                </el-switch>
              </template>
            </el-table-column>
            <el-table-column
              label="操作"
              width="180"
              fixed="right"
              class-name="small-padding fixed-width"
            >
              <template slot-scope="{ row }">
                <!-- publishEvaluate -->
                <el-button
                  size="mini"
                  @click="publishHandler(row)"
                  type="text"
                  icon="el-icon-plus"
                  >发布</el-button
                >
                <el-button
                  size="mini"
                  @click="editHandler(row)"
                  type="text"
                  icon="el-icon-plus"
                  >编辑</el-button
                ><el-button
                  size="mini"
                  @click="deleteHandler(row)"
                  type="text"
                  icon="el-icon-plus"
                  >删除</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"
          />
        </el-col>
      </el-row>
    </layoutCom>
    <editEvaluate ref="Evaluate" @success="getList()"></editEvaluate>
  </div>
</template>
<script>
import { mapGetters } from "vuex";
import { findAllRole } from "@/api/system/role";
import {
  list,
  swtichHandler,
  delelteEvaluate,
  publishEvaluate,
} from "@/api/resumption/outsourcing.js";
import OrgTree from "@/components/orgTree";
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,
      },
      // 显示搜索条件
      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?.rows || [];
        this.total = res?.total || [];
        this.loading = false;
      });
    },
    // 多选框选中数据
    handleSelectionChange(selection) {},
    /** 新增按钮操作 */
    handleAdd() {
      this.$refs.Evaluate.show();
    },
    editHandler(row) {
      this.$refs.Evaluate.show(row.id);
    },
    //发布
    publishHandler(row) {
      // publishEvaluate
      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: null,
      };
      findAllRole(params).then((res) => {
        this.planRoles = res.data;
      });
    },
    cleanExecOrgList() {
      this.execOrgIds = null;
      this.queryParams.execOrgList = [];
    },
    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.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>