页面处理

wjt

2024-06-24 69a9c21a3c4559e5ce9ec88c30955b38118e0693

 src/views/infomanger/complating/index.vue

@@ -1,20 +1,22 @@
<template>
  <div  class="app-container">
    <el-form inline ref="formRef" :model="form.queryParams" label-width="80px">
    <el-form inline ref="formRef" :model="form.quparams" label-width="80px">
      <el-form-item label="投诉内容" prop="content">
        <el-input placeholder="请输入" v-model="form.queryParams.content"></el-input>
        <el-input placeholder="请输入" v-model="form.quparams.complaintReason"></el-input>
      </el-form-item>
      <el-form-item label="投诉对象">
        <el-input placeholder="请输入"></el-input>
      <el-form-item label="投诉对象" prop="executeDeptName">
        <el-input placeholder="请输入" v-model="form.quparams.executeDeptName"></el-input>
      </el-form-item>
      <el-form-item label="投诉人">
        <el-input placeholder="请输入"></el-input>
      <el-form-item label="投诉人" prop="companyUser">
        <el-input placeholder="请输入" v-model="form.quparams.companyUser"></el-input>
      </el-form-item>
      <el-form-item label="执法记录">
        <el-input placeholder="请输入"></el-input>
      <el-form-item label="执法主题" prop="enforceReason">
        <el-input placeholder="请输入" v-model="form.quparams.enforceReason"></el-input>
      </el-form-item>
      <el-form-item label="办理状态">
        <el-input placeholder="请输入"></el-input>
      <el-form-item label="办理状态" prop="complaintStatus">
        <el-select style="width: 180px;" v-model="form.quparams.complaintStatus" placeholder="请选择">
          <el-option v-for="(item,index) in form.status" :key="index" :label="item" :value="index"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
@@ -26,31 +28,119 @@
        <el-button icon="Download" type="primary" plain>导出</el-button>
      </el-col>
    </el-row>
    <el-table>
      <el-table-column label="投诉企业"></el-table-column>
      <el-table-column label="投诉对象"></el-table-column>
      <el-table-column label="投诉类型"></el-table-column>
      <el-table-column label="投诉内容"></el-table-column>
      <el-table-column label="执法主题"></el-table-column>
      <el-table-column label="办理状态"></el-table-column>
      <el-table-column label="操作"></el-table-column>
    <el-table :data="form.tableData">
      <el-table-column label="投诉企业" prop="companyName"></el-table-column>
      <el-table-column label="投诉对象" prop="executeDeptName">
        <template #default="scope">
         {{ scope.row.executeUser }} ({{ scope.row.executeDeptName }})
        </template>
      </el-table-column>
      <el-table-column label="投诉类型">
        <template #default="scope">
          {{ dispImgType(scope.row.complaintType) }}
        </template>
      </el-table-column>
      <el-table-column label="投诉内容" prop="complaintReason"></el-table-column>
      <el-table-column label="执法主题" prop="enforceReason">
        <template #default="scope">
          <el-link type="primary" @click="look(scope.row)">{{ scope.row.enforceReason }}</el-link>
        </template>
      </el-table-column>
      <el-table-column label="办理状态" prop="complaintStatus">
        <template #default="scope">
          {{ form.status[scope.row.complaintStatus] }}
        </template>
      </el-table-column>
      <el-table-column label="操作">
        <template #default="scope">
          <el-link type="primary" v-if="scope.row.complaintStatus == 2 || scope.row.complaintStatus == -1"  @click="look(scope.row)">查看</el-link>
          <el-link type="primary" v-if="scope.row.complaintStatus == 0" @click="inComplaintLogHandler(scope.row)">响应</el-link>
          <el-link type="primary"  @click="handlerRes(scope.row)"  v-if="scope.row.complaintStatus == 1">办结</el-link> 
        </template>
      </el-table-column>
    </el-table>
    <pagination v-show="form.quparams.total > 0" :total="form.quparams.total" v-model:page="form.quparams.pageNum" v-model:limit="form.quparams.pageSize" @pagination="getList" />
      <handlerCom ref="handlerComRef"></handlerCom>
      <orderDetails ref="orderDetailsRef"></orderDetails>
  </div>
</template>

<script lang="ts" setup>
import { listComplaint, inComplaintLog } from '@/api/system/company/company'
import { ElMessageBox  } from 'element-plus'
import handlerCom from './component/index.vue'
import orderDetails from '@/views/infomanger/enforcement/component/details.vue'
const { proxy } = getCurrentInstance()
const { complaint_type } = proxy.useDictPer("complaint_type");
console.log(complaint_type)
const handlerComRef = ref()
const orderDetailsRef = ref()
const formRef = ref()
const form = reactive({
  queryParams: {
    content: ''
  quparams: {
    content: '',
    pageSize: 10,
    pageNum: 1,
    total: 0,
    complaintReason: '',
    executeDeptName: '',
    complaintStatus: ''
  },
  tableData: [],
  status: {
    "-1":"已驳回",0:"待响应",1:"处理中",2:"已办结"	
  }
})
const dispImgType = (e: string) => {
  return complaint_type.value.find((f: any) => f.value == e)?.label;
};
function handleQuery() {

  form.quparams.pageNum = 1
  listComplaintHttp()
}
function resetQuery() {
  formRef.value.resetFields()
  form.quparams.pageNum = 1
  listComplaintHttp()
}
function listComplaintHttp() {
  listComplaint(form.quparams).then((res: any) => {
    // console.log(res.rows)
    form.tableData = res.rows
    form.quparams.total = res.total
  })
}
function handlerRes(item) {
  handlerComRef.value.openDialog(item)
}
function look(item) {
  orderDetailsRef.value.openDialog(item)
}
function inComplaintLogHandler(item) {
  ElMessageBox.confirm(
    '确认响应该条数据?',
    '提示',
    {
      confirmButtonText: '确认',
      cancelButtonText: '取消',
      type: 'warning',
    }
  )
    .then(() => {
       inComplaintLog({id: item.id}).then((res: any) => {
        // console.log(res)
        listComplaintHttp()
      })
    })
    
 
}
function getList(e: { limit: number; page: number }) {
  form.quparams.pageSize = e.limit
  form.quparams.pageNum = e.page
  listComplaintHttp()
}
listComplaintHttp()
</script>

<style scoped lang="scss">