前端-政府采购投诉数据处理管理

zhangwei

3 天以前 019b6cf4ccaa06fc5ca8f5dc5663975eb027d360

 Web/src/views/fb_p_complaints/procurementComplaint/index.vue

@@ -1,13 +1,13 @@
<script lang="ts" setup name="procurementComplaint">
import { ref, reactive, onMounted } from "vue";
import { ref, reactive, onMounted } from 'vue';
import { auth } from '/@/utils/authFunction';
import { ElMessageBox, ElMessage } from "element-plus";
import { downloadStreamFile } from "/@/utils/download";
import { ElMessageBox, ElMessage } from 'element-plus';
import { downloadStreamFile } from '/@/utils/download';
import { useProcurementComplaintApi } from '/@/api/fb_p_complaints/procurementComplaint';
import editDialog from '/@/views/fb_p_complaints/procurementComplaint/component/editDialog.vue'
import printDialog from '/@/views/system/print/component/hiprint/preview.vue'
import editDialog from '/@/views/fb_p_complaints/procurementComplaint/component/editDialog.vue';
import printDialog from '/@/views/system/print/component/hiprint/preview.vue';
import ModifyRecord from '/@/components/table/modifyRecord.vue';
import ImportData from "/@/components/table/importData.vue";
import ImportData from '/@/components/table/importData.vue';

const procurementComplaintApi = useProcurementComplaintApi();
const printDialogRef = ref();
@@ -33,14 +33,13 @@
});

// 页面加载时
onMounted(async () => {
});
onMounted(async () => {});

// 查询操作
const handleQuery = async (params: any = {}) => {
  state.tableLoading = true;
  state.tableParams = Object.assign(state.tableParams, params);
  const result = await procurementComplaintApi.page(Object.assign(state.tableQueryParams, state.tableParams)).then(res => res.data.result);
   const result = await procurementComplaintApi.page(Object.assign(state.tableQueryParams, state.tableParams)).then((res) => res.data.result);
  state.tableParams.total = result?.total;
  state.tableData = result?.items ?? [];
  state.tableLoading = false;
@@ -55,29 +54,33 @@

// 删除
const delProcurementComplaint = (row: any) => {
  ElMessageBox.confirm(`确定要删除吗?`, "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  }).then(async () => {
   ElMessageBox.confirm(`确定要删除吗?`, '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
   })
      .then(async () => {
    await procurementComplaintApi.delete({ id: row.id });
    handleQuery();
    ElMessage.success("删除成功");
  }).catch(() => {});
         ElMessage.success('删除成功');
      })
      .catch(() => {});
};

// 批量删除
const batchDelProcurementComplaint = () => {
  ElMessageBox.confirm(`确定要删除${state.selectData.length}条记录吗?`, "提示", {
    confirmButtonText: "确定",
    cancelButtonText: "取消",
    type: "warning",
  }).then(async () => {
    await procurementComplaintApi.batchDelete(state.selectData.map(u => ({ id: u.id }) )).then(res => {
   ElMessageBox.confirm(`确定要删除${state.selectData.length}条记录吗?`, '提示', {
      confirmButtonText: '确定',
      cancelButtonText: '取消',
      type: 'warning',
   })
      .then(async () => {
         await procurementComplaintApi.batchDelete(state.selectData.map((u) => ({ id: u.id }))).then((res) => {
      ElMessage.success(`成功批量删除${res.data.result}条记录`);
      handleQuery();
    });
  }).catch(() => {});
      })
      .catch(() => {});
};

// 导出数据
@@ -85,19 +88,19 @@
  try {
    state.exportLoading = true;
    if (command === 'select') {
      const params = Object.assign({}, state.tableQueryParams, state.tableParams, { selectKeyList: state.selectData.map(u => u.id) });
      await procurementComplaintApi.exportData(params).then(res => downloadStreamFile(res));
         const params = Object.assign({}, state.tableQueryParams, state.tableParams, { selectKeyList: state.selectData.map((u) => u.id) });
         await procurementComplaintApi.exportData(params).then((res) => downloadStreamFile(res));
    } else if (command === 'current') {
      const params = Object.assign({}, state.tableQueryParams, state.tableParams);
      await procurementComplaintApi.exportData(params).then(res => downloadStreamFile(res));
         await procurementComplaintApi.exportData(params).then((res) => downloadStreamFile(res));
    } else if (command === 'all') {
      const params = Object.assign({}, state.tableQueryParams, state.tableParams, { page: 1, pageSize: 99999999 });
      await procurementComplaintApi.exportData(params).then(res => downloadStreamFile(res));
         await procurementComplaintApi.exportData(params).then((res) => downloadStreamFile(res));
    }
  } finally {
    state.exportLoading = false;
  }
}
};

handleQuery();
</script>
@@ -106,71 +109,93 @@
    <el-card shadow="hover" :body-style="{ paddingBottom: '0' }"> 
      <el-form :model="state.tableQueryParams" ref="queryForm" labelWidth="90">
        <el-row>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
            <el-form-item label="关键字">
              <el-input v-model="state.tableQueryParams.keyword" clearable placeholder="请输入模糊查询关键字"/>
          <el-col :xs="24" :sm="12" :md="12" :lg="5" :xl="4" class="mb10">
            <el-form-item label="决定日期">
              <el-date-picker type="daterange" v-model="state.tableQueryParams.decisionDateRange"
                value-format="YYYY-MM-DD HH:mm:ss" start-placeholder="开始日期" end-placeholder="结束日期"
                :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="项目编号">
              <el-input v-model="state.tableQueryParams.projectCode" clearable placeholder="请输入项目编号"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <el-col :xs="24" :sm="12" :md="12" :lg="4" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="项目名称">
              <el-input v-model="state.tableQueryParams.projectName" clearable placeholder="请输入项目名称"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="决定日期">
              <el-date-picker type="daterange" v-model="state.tableQueryParams.decisionDateRange"  value-format="YYYY-MM-DD HH:mm:ss" start-placeholder="开始日期" end-placeholder="结束日期" :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]" />
          <el-col :xs="24" :sm="12" :md="12" :lg="4" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="项目编号">
              <el-input v-model="state.tableQueryParams.projectCode" clearable placeholder="请输入项目编号" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <el-col :xs="24" :sm="12" :md="12" :lg="4" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="采购人">
              <el-input v-model="state.tableQueryParams.purchaser" clearable placeholder="请输入采购人"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <el-col :xs="24" :sm="12" :md="12" :lg="4" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="采购代理机构">
              <el-input v-model="state.tableQueryParams.procurementAgency" clearable placeholder="请输入采购代理机构"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
          <el-col :xs="24" :sm="12" :md="12" :lg="5" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="采购监督部门">
              <el-input v-model="state.tableQueryParams.procurementSupervisionDepartment" clearable
                placeholder="请输入采购监督部门" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="4" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="投诉人">
              <el-input v-model="state.tableQueryParams.complainant" clearable placeholder="请输入投诉人"/>
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="采购监督部门">
              <el-input v-model="state.tableQueryParams.procurementSupervisionDepartment" clearable placeholder="请输入采购监督部门"/>
          <el-col :xs="24" :sm="12" :md="12" :lg="4" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="投诉事项">
              <el-input v-model="state.tableQueryParams.keyword" clearable placeholder="请输入投诉事项" />
            </el-form-item>
          </el-col>
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="线上地址">
              <el-input v-model="state.tableQueryParams.url" clearable placeholder="请输入线上地址"/>
          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="4" :xl="4" class="mb10" v-if="state.showAdvanceQueryUI">
            <el-form-item label="是否成立">
              <el-select v-model="state.tableQueryParams.status" placeholder="请选择" clearable>
                <el-option label="是" :value="200" />
                <el-option label="否" :value="400" />
              </el-select>
            </el-form-item>
          </el-col>
          </el-col> -->

          <!-- <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
            <el-form-item label="关键字">
              <el-input v-model="state.tableQueryParams.keyword" clearable placeholder="请输入模糊查询关键字"/>
            </el-form-item>
          </el-col> -->
          <el-col :xs="24" :sm="12" :md="12" :lg="8" :xl="4" class="mb10">
            <el-form-item >
              <el-button-group style="display: flex; align-items: center;">
                <el-button type="primary"  icon="ele-Search" @click="handleQuery" v-auth="'procurementComplaint:page'" v-reclick="1000"> 查询 </el-button>
                <el-button type="primary" icon="ele-Search" @click="handleQuery" v-auth="'procurementComplaint:page'"
                  v-reclick="1000"> 查询 </el-button>
                <el-button icon="ele-Refresh" @click="() => state.tableQueryParams = {}"> 重置 </el-button>
                <el-button icon="ele-ZoomIn" @click="() => state.showAdvanceQueryUI = true" v-if="!state.showAdvanceQueryUI" style="margin-left:5px;"> 高级查询 </el-button>
                <el-button icon="ele-ZoomOut" @click="() => state.showAdvanceQueryUI = false" v-if="state.showAdvanceQueryUI" style="margin-left:5px;"> 隐藏 </el-button>
                <el-button type="danger" style="margin-left:5px;" icon="ele-Delete" @click="batchDelProcurementComplaint" :disabled="state.selectData.length == 0" v-auth="'procurementComplaint:batchDelete'"> 删除 </el-button>
                <el-button type="primary" style="margin-left:5px;" icon="ele-Plus" @click="editDialogRef.openDialog(null, '新增政府采购投诉数据处理')" v-auth="'procurementComplaint:add'"> 新增 </el-button>
                <el-dropdown :show-timeout="70" :hide-timeout="50" @command="exportProcurementComplaintCommand">
                  <el-button type="primary" style="margin-left:5px;" icon="ele-FolderOpened" v-reclick="20000" v-auth="'procurementComplaint:export'"> 导出 </el-button>
                <el-button icon="ele-ZoomIn" @click="() => state.showAdvanceQueryUI = true"
                  v-if="!state.showAdvanceQueryUI" style="margin-left:5px;"> 高级查询 </el-button>
                <el-button icon="ele-ZoomOut" @click="() => state.showAdvanceQueryUI = false"
                  v-if="state.showAdvanceQueryUI" style="margin-left:5px;"> 隐藏 </el-button>
                <el-button type="danger" style="margin-left:5px;" icon="ele-Delete"
                  @click="batchDelProcurementComplaint" :disabled="state.selectData.length == 0"
                  v-auth="'procurementComplaint:batchDelete'"> 删除 </el-button>
                <el-button type="primary" style="margin-left:5px;" icon="ele-Plus"
                  @click="editDialogRef.openDialog(null, '新增政府采购投诉数据处理')" v-auth="'procurementComplaint:add'"> 新增
                </el-button>
                <!-- <el-dropdown :show-timeout="70" :hide-timeout="50" @command="exportProcurementComplaintCommand">
                  <el-button type="primary" style="margin-left:5px;" icon="ele-FolderOpened" v-reclick="20000"
                    v-auth="'procurementComplaint:export'"> 导出 </el-button>
                  <template #dropdown>
                    <el-dropdown-menu>
                      <el-dropdown-item command="select" :disabled="state.selectData.length == 0">导出选中</el-dropdown-item>
                      <el-dropdown-item command="select"
                        :disabled="state.selectData.length == 0">导出选中</el-dropdown-item>
                      <el-dropdown-item command="current">导出本页</el-dropdown-item>
                      <el-dropdown-item command="all">导出全部</el-dropdown-item>
                    </el-dropdown-menu>
                  </template>
                </el-dropdown>
                <el-button type="warning" style="margin-left:5px;" icon="ele-MostlyCloudy" @click="importDataRef.openDialog()" v-auth="'procurementComplaint:import'"> 导入 </el-button>
                <el-button type="warning" style="margin-left:5px;" icon="ele-MostlyCloudy"
                  @click="importDataRef.openDialog()" v-auth="'procurementComplaint:import'"> 导入 </el-button> -->
              </el-button-group>
            </el-form-item>
          </el-col>
@@ -178,47 +203,53 @@
      </el-form>
    </el-card>
    <el-card class="full-table" shadow="hover" style="margin-top: 5px">
      <el-table :data="state.tableData" @selection-change="(val: any[]) => { state.selectData = val; }" style="width: 100%" v-loading="state.tableLoading" tooltip-effect="light" row-key="id" @sort-change="sortChange" border>
        <el-table-column type="selection" width="40" align="center" v-if="auth('procurementComplaint:batchDelete') || auth('procurementComplaint:export')" />
      <el-table :data="state.tableData" @selection-change="(val: any[]) => { state.selectData = val; }" 
        style="width: 100%" v-loading="state.tableLoading" tooltip-effect="light" row-key="id" @sort-change="sortChange"
        border>
        <el-table-column type="selection" width="40" align="center"
          v-if="auth('procurementComplaint:batchDelete') || auth('procurementComplaint:export')" />
        <el-table-column type="index" label="序号" width="55" align="center"/>
        <el-table-column prop='projectCode' label='项目编号' show-overflow-tooltip />
        <el-table-column prop='projectName' label='项目名称' show-overflow-tooltip />
        <el-table-column prop='decisionDate' label='决定日期' show-overflow-tooltip />
        <el-table-column prop='projectName' label='项目名称' show-overflow-tooltip />
        <el-table-column prop='projectCode' label='项目编号' show-overflow-tooltip />
        <el-table-column prop='purchaser' label='采购人' show-overflow-tooltip />
        <el-table-column prop='procurementAgency' label='采购代理机构' show-overflow-tooltip />
        <el-table-column prop='complainant' label='投诉人' show-overflow-tooltip />
        <el-table-column prop='procurementSupervisionDepartment' label='采购监督部门' show-overflow-tooltip />
        <!-- <el-table-column prop='complaints' label='是否成立' show-overflow-tooltip /> -->
        <el-table-column prop='url' label='线上地址' show-overflow-tooltip />
        <el-table-column label="修改记录" width="100" align="center" show-overflow-tooltip>
          <template #default="scope">
            <ModifyRecord :data="scope.row" />
          </template>
        </el-table-column>
        <el-table-column label="操作" width="140" align="center" fixed="right" show-overflow-tooltip v-if="auth('procurementComplaint:update') || auth('procurementComplaint:delete')">
        <el-table-column label="操作" width="140" align="center" fixed="right" show-overflow-tooltip
          v-if="auth('procurementComplaint:update') || auth('procurementComplaint:delete')">
          <template #default="scope">
            <el-button icon="ele-Edit" size="small" text type="primary" @click="editDialogRef.openDialog(scope.row, '编辑政府采购投诉数据处理')" v-auth="'procurementComplaint:update'"> 编辑 </el-button>
            <el-button icon="ele-Delete" size="small" text type="primary" @click="delProcurementComplaint(scope.row)" v-auth="'procurementComplaint:delete'"> 删除 </el-button>
            <el-button icon="ele-Edit" size="small" text type="primary"
              @click="editDialogRef.openDialog(scope.row, '编辑政府采购投诉数据处理')" v-auth="'procurementComplaint:update'"> 编辑
            </el-button>
            <el-button icon="ele-Delete" size="small" text type="primary" @click="delProcurementComplaint(scope.row)"
              v-auth="'procurementComplaint:delete'"> 删除 </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination 
              v-model:currentPage="state.tableParams.page"
              v-model:page-size="state.tableParams.pageSize"
      <el-pagination v-model:currentPage="state.tableParams.page" v-model:page-size="state.tableParams.pageSize"
              @size-change="(val: any) => handleQuery({ pageSize: val })"
              @current-change="(val: any) => handleQuery({ page: val })"
              layout="total, sizes, prev, pager, next, jumper"
              :page-sizes="[10, 20, 50, 100, 200, 500]"
              :total="state.tableParams.total"
              size="small"
              background />
      <ImportData ref="importDataRef" :import="procurementComplaintApi.importData" :download="procurementComplaintApi.downloadTemplate" v-auth="'procurementComplaint:import'" @refresh="handleQuery"/>
        @current-change="(val: any) => handleQuery({ page: val })" layout="total, sizes, prev, pager, next, jumper"
        :page-sizes="[10, 20, 50, 100, 200, 500]" :total="state.tableParams.total" size="small" background />
      <ImportData ref="importDataRef" :import="procurementComplaintApi.importData"
        :download="procurementComplaintApi.downloadTemplate" v-auth="'procurementComplaint:import'"
        @refresh="handleQuery" />
      <printDialog ref="printDialogRef" :title="'打印政府采购投诉数据处理'" @reloadTable="handleQuery" />
      <editDialog ref="editDialogRef" @reloadTable="handleQuery" />
    </el-card>
  </div>
</template>
<style scoped>
:deep(.el-input), :deep(.el-select), :deep(.el-input-number) {
:deep(.el-input),
:deep(.el-select),
:deep(.el-input-number) {
  width: 100%;
}
</style>