epmet-work-pc-chengyang/src/views/dataBoard/overview/dissatisfiedProblemNumber/12345Hotline.vue

<template>
  <div>
    <Breadcrumb :list="breadcrumbList"/>
    <div class="table">
      <el-table v-loading="loading"
                :data="list"
                element-loading-background="rgba(0,0,0,0.5)"
                element-loading-spinner="el-icon-loading"
                element-loading-text="加载中..."
      >
        <el-table-column label="序号" type="index" width="80"/>

        <el-table-column label="所属网格" prop="gridName"/>
        <el-table-column label="接收时间" prop="happenTime"/>
        <el-table-column label="问题描述" prop="eventContent" show-overflow-tooltip width="220px"/>
        <el-table-column label="办结时限" prop="closeCaseTime"/>
        <el-table-column label="联系人" prop="name"/>
        <el-table-column label="联系人电话" prop="mobile">
          <template slot-scope="scope">
            {{ $sensitive(scope.row.mobile, 3, 7) }}
          </template>
        </el-table-column>
        <el-table-column label="状态" prop="operationTypeName"/>
        <el-table-column label="操作" min-width="150px">
          <template slot-scope="{row}">
            <CallPhone text="拨打电话"/>
            <span class="handle" @click="handleDispatch(row)">处理</span>
            <span class="view" @click="handleView(row)">查看</span>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <Pagination v-show="total > 0" :limit.sync="queryParams.pageSize" :page.sync="queryParams.pageNo" :total="total"
                @pagination="getList"/>
    <sjwjj :id="rowId" :showDialog="showDialog" @close="close"/>
    <EventDispatchOrder v-if="isEventDispatchOrder" ref="EventDispatchOrder" @close="isEventDispatchOrder = false"
                        @ok="handleSure"/>
  </div>
</template>

<script>
import Breadcrumb from "@/views/dataBoard/satisfactionEval/components/Breadcrumb";
import Pagination from "@/views/dataBoard/satisfactionEval/components/Pagination";
import Title from "@/views/dataBoard/satisfactionEval/components/Title";
import sjwjj from "@/views/dataBoard/overview/components/EventDetail.vue";
import CallPhone from '@/views/dataBoard/cpts/CallPhone.vue'
import EventDispatchOrder from "@/views/dataBoard/overview/components/EventDispatchOrder.vue";
import { requestPost } from "@/js/dai/request";

export default {
  name: "12345Hotline",
  components: {Breadcrumb, Pagination, Title, sjwjj, CallPhone, EventDispatchOrder},
  data() {
    return {
      queryParams: {
        agencyId: this.$route.query.id,
        pageNo: 1,
        pageSize: 10,
        satisfactionSource: "satisfaction_12345"
      },
      total: 0,
      breadcrumbList: [
        {
          path: "/dataBoard/overview/index",
          name: "书记看板",
        },
        {
          path: "",
          name: "12345投诉列表",
        },
      ],
      list: [],
      showDialog: false,
      rowId: "",
      loading: true,
      isEventDispatchOrder: false
    };
  },
  activated() {
    this.queryParams.reportUserId = this.$route.query.reportUserId;
    this.queryParams.pageNo = 1;
    this.getList();
  },
  methods: {
    search() {
      this.queryParams.pageNo = 1;
      this.getList();
    },
    handleSure() {
      this.queryParams.pageNo = 1;
      this.getList();
    },
    handleDispatch({icEventId}) {
      this.$http
          .post("/governance/icEvent/detail", {icEventId})
          .then((res) => {
            const {code, data, msg} = res.data;
            if (code === 0) {
              this.loading = false;
              this.isEventDispatchOrder = true
              this.$nextTick(() => {
                this.$refs.EventDispatchOrder.open(data || {});
              })
            } else {
              this.loading = false;
              this.$message.error(msg);
            }
          });
    },
    async getList() {
      this.loading = true

      const url = "/governance/icEvent/list";

      const formData={
        agencyId:this.queryParams.agencyId
      };
      const pageSize = this.queryParams.pageSize;
      const pageNo = this.queryParams.pageNo;
      const { data, code, msg } = await requestPost(url, {
          pageSize,
          pageNo,
          ...formData,
      });
      if (code === 0) {
          this.list = data.list;
          this.total = data.total;
          this.loading = false
      }

    },
    handleView({icEventId}) {
      this.showDialog = true;
      this.rowId = icEventId;
    },
    close() {
      this.showDialog = false;
    },
  },
};
</script>

<style lang="scss" scoped>
@import "@/assets/scss/dataBoard/table.scss";

.table {
  margin-top: 40px;
}

.handle {
  font-size: 14px;
  margin-left: 10px;
  color: #9A69EC;
  cursor: pointer;
}

.view {
  font-size: 14px;
  margin-left: 10px;
  color: #007FF1;
  cursor: pointer;
}
</style>