soc_web/src/views/scorestatistics/index.vue

<template>
  <div class="app-container">
    <el-row >
      <!--用户数据-->
      <el-col>
        <div class="main-search-box">
           <!--    搜索条件    -->
        <el-form
          :model="queryParams"
          ref="queryForm"
          size="small"
          :inline="true"
          v-show="showSearch"
          label-width="100px"
        >
          <el-form-item label="组织机构" class="formTreeItem">
            <tree-select
              v-model="queryParams.orgId"
              :options="deptOptions"
              :show-count="true"
              :normalizer="tenantIdnormalizer"
              :props="{ checkStrictly: true, label: 'name' }"
              placeholder="请选择归属机构"
              clearValueText="清除"
              :noChildrenText="''"
              noOptionsText="没有数据"
              noResultsText="没有搜索结果"
            />
          </el-form-item>
          <el-form-item label="年月">
            <el-date-picker
              type="month"
              v-model="queryParams.date"
              placeholder="选择年月"
              value-format="yyyy-MM"
            >
            </el-date-picker>
          </el-form-item>
          <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 icon="el-icon-refresh" size="mini" @click="resetQuery"
            >重置</el-button
          >
              </el-col>
            </el-row>
        </el-form>
        
        </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="年月"
            
            :formatter="formatterScore"
          />
          <el-table-column label="机构名称" prop="orgName" />
          <el-table-column label=">90 低" prop="level_gt90" />
          <el-table-column label="80-90 中" prop="level_80_90" />
          <el-table-column label="70-80 高" prop="level_70_80" />
          
          <el-table-column label="70及以下 极高" prop="level_lt70" >
          </el-table-column>

          <el-table-column
            label="操作"
            width="180"
            fixed="right"
            class-name="small-padding fixed-width"
          >
            <template slot-scope="{ row }">
              <el-button
                size="mini"
                @click="editHandler(row)"
                type="text"
                class="el-icon-view"
                >查看</el-button
              ><el-button
                size="mini"
                @click="anewHandler(row)"
                type="text"
                class="el-icon-edit-outline"
                >重新计算</el-button
              >
              
            </template>
          </el-table-column>
        </el-table>

        <pagination
          v-show="total > 0"
          :total="total"
          :page.sync="queryParams.page"
          :limit.sync="queryParams.size"
          @pagination="getList"
        />
      </el-col>
    </el-row>

    <scorestatisticsDialog
      ref="Evaluate"
      :targetList="targetList"
      @success="getList()"
    ></scorestatisticsDialog>
  </div>
</template>
<script>
import { mapGetters } from "vuex";
import { findAllRole } from "@/api/system/role";
import {
  list,
  anewDetail,
} from "@/api/scorestatistics/scorestatistics.js";
import OrgTree from "@/components/orgTree";
import { newDateMonth } from "@/utils/index.js";
import scorestatisticsDialog from "./scorestatisticsDialog.vue";
import { deptTreeSelect } from "@/api/system/public";
export default {
  name: "SocWebIndex",
  dicts: ["sys_org_type", "plan_status"],

  components: {
    OrgTree,
    scorestatisticsDialog,
  },
  data() {
    const { params, query } = this.$route;
    return {
      targetList: [],
      targetListChild: [],
      targetListGrandson: [],
      loading: false,
      selectedValues: [],
      planRoles: [],

      queryParams: {
        orgId: null,
        date: newDateMonth('','1'),

        page: 1,
        size: 10,
      },
      // 显示搜索条件
      showSearch: true,
      total: 0,
      dataList: [],
      deptOptions: [], //机构数组
    };
  },
  created() {
    this.queryParams.orgId = this.orgId
    this.getList();
    this.getDeptTree();
  },
  mounted() {},
  computed: {
    ...mapGetters(["orgId"]),
  },
  methods: {
    /** 查询机构树数据 */
    getDeptTree() {
      deptTreeSelect().then((response) => {
        this.deptOptions = response.data;
      });
    },
    /** treeSelect组件自定义数据*/
    tenantIdnormalizer(node, instanceId) {
      if (node.children && !node.children.length) {
        delete node.children;
      }
      return {
        id: node.id,
        label: node.shortName,
        children: node.children,
      };
    },
    formatterScore({ dataYear,dataMonth }) {
      return dataYear+'-'+dataMonth
    },

    //获取列表
    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);
    },

    anewHandler(row) {
      this.$modal
        .confirm("重新计算将会等待一段时间，你确定要重新计算吗?")
        .then(function () {})
        .then(() => {
          anewDetail({month:row.dataMonth,year:row.dataYear,orgId:row.orgId}).then((res) => {
            let { code, msg } = res;
            if (code == 200) {
              this.getList();
              this.$modal.msgSuccess("计算成功");
            } else {
              this.$modal.msgSuccess(msg);
            }
          });
        });
    },
    
   

    /** 搜索按钮操作 */
    handleQuery() {
      this.queryParams.page = 1;
      this.getList();
    },
    /** 重置按钮操作 */
    resetQuery() {
      this.queryParams = {
        orgId: null,
        date: "",
        page: 1,
        size: 10,
      };

      this.getList();
    },
  },
};
</script>
<style lang="scss" scoped>
::v-deep.formTreeItem {
  .el-form-item__content {
    width: 264px;
  }
}
</style>