|
|
@@ -0,0 +1,249 @@
|
|
|
+<template>
|
|
|
+ <div class="app-container">
|
|
|
+ <div v-show="!informationDetailState.show">
|
|
|
+ <transition name="fade">
|
|
|
+ <div v-show="showSearch">
|
|
|
+ <el-form ref="queryFormRef" :model="queryParams" label-width="100px">
|
|
|
+ <el-row :gutter="20">
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item label="处理状态：">
|
|
|
+ <el-select v-model="queryParams.disposeStatus" placeholder="全部" clearable>
|
|
|
+ <el-option v-for="item in disposeStatusOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item label="发布单位：">
|
|
|
+ <el-input v-model="queryParams.publishUnit" placeholder="请输入内容" clearable></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item label="发布状态：">
|
|
|
+ <el-select v-model="queryParams.publishStatus" placeholder="请选择">
|
|
|
+ <el-option v-for="item in publishStatusOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="5">
|
|
|
+ <el-form-item label="审批状态：">
|
|
|
+ <el-select v-model="queryParams.approvalStatus" placeholder="请选择">
|
|
|
+ <el-option v-for="item in approvalStatusOptions" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ <el-col :span="4">
|
|
|
+ <el-form-item>
|
|
|
+ <el-button type="primary" @click="handleSearch">查询</el-button>
|
|
|
+ <el-button @click="resetSearch">重置</el-button>
|
|
|
+ </el-form-item>
|
|
|
+ </el-col>
|
|
|
+ </el-row>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ </transition>
|
|
|
+ <!-- 表格组件 -->
|
|
|
+ <el-table ref="multipleTable" v-loading="loading" :data="tableData" @selection-change="handleSelectionChange">
|
|
|
+ <el-table-column label="序号" align="center" prop="id" />
|
|
|
+ <el-table-column label="发布单位" align="center" prop="publishUnit" />
|
|
|
+ <el-table-column label="信息内容" align="center" prop="informationContent" />
|
|
|
+ <el-table-column label="发布时间" align="center" prop="publishTime" />
|
|
|
+ <el-table-column label="发布渠道" align="center" prop="publishChannel" />
|
|
|
+ <el-table-column label="发布申请人" align="center" prop="applyPerson" />
|
|
|
+ <el-table-column label="待处理人" align="center" prop="pendingPerson" />
|
|
|
+ <el-table-column label="发布状态" align="center" prop="publishStatus">
|
|
|
+ <template #default="scope">
|
|
|
+ <div class="common-flex">
|
|
|
+ <i :class="getStatusClass(scope.row.publishStatus)"></i>
|
|
|
+ <dict-tag :options="publishStatusOptions" :value="scope.row.publishStatus" />
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="审批状态" align="center" prop="approvalStatus">
|
|
|
+ <template #default="scope">
|
|
|
+ <div class="common-flex">
|
|
|
+ <i :class="getStatusClass2(scope.row.approvalStatus)"></i>
|
|
|
+ <dict-tag :options="approvalStatusOptions" :value="scope.row.approvalStatus" />
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="发布统计" align="center" prop="statistics">
|
|
|
+ <template #default="scope">
|
|
|
+ <div class="statistics-container">
|
|
|
+ <p>选择人数: {{ scope.row.userCount }}</p>
|
|
|
+ <p>成功: {{ scope.row.successCount }}</p>
|
|
|
+ <p>失败: {{ scope.row.errorCount }}</p>
|
|
|
+ <p>发送中: {{ scope.row.sendingCount }}</p>
|
|
|
+ </div>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column label="操作" align="center" class-name="small-padding fixed-width">
|
|
|
+ <template #default="scope">
|
|
|
+ <el-text class="common-btn-text-primary" @click="handleView(scope.row)">查看</el-text>
|
|
|
+ <el-text class="common-btn-text-primary" @click="handleUpdate(scope.row)">编辑</el-text>
|
|
|
+ <el-text class="common-btn-text-primary" @click="handleClose(scope.row)">审批</el-text>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <pagination v-show="total > 0" v-model:page="queryParams.page" v-model:limit="queryParams.page_size" :total="total" @pagination="tableData" />
|
|
|
+ </div>
|
|
|
+ <InformationDetail v-if="informationDetailState.show" :event-id="informationDetailState.eventId" />
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script setup lang="ts">
|
|
|
+import { ref, reactive, toRefs, onMounted } from 'vue';
|
|
|
+import { getInformation } from '@/api/duty/eventing'; // 假设 getInformation 已经定义好
|
|
|
+import InformationDetail from './informationDetail.vue';
|
|
|
+const showSearch = ref(true);
|
|
|
+const queryFormRef = ref();
|
|
|
+const tableData = ref([]);
|
|
|
+const loading = ref(true);
|
|
|
+const ids = ref([]);
|
|
|
+const selectedRow = ref(null);
|
|
|
+const initFormData = reactive({
|
|
|
+ publishUnit: '',
|
|
|
+ publishStatus: '',
|
|
|
+ approvalStatus: '',
|
|
|
+ disposeStatus: '',
|
|
|
+ informationContent: '',
|
|
|
+ publishTime: '',
|
|
|
+ publishChannel: '',
|
|
|
+ applyPerson: '',
|
|
|
+ pendingPerson: '',
|
|
|
+ userCount: '',
|
|
|
+ successCount: '',
|
|
|
+ errorCount: '',
|
|
|
+ sendingCount: ''
|
|
|
+});
|
|
|
+// 表单数据
|
|
|
+const data = reactive({
|
|
|
+ form: { ...initFormData },
|
|
|
+ queryParams: {
|
|
|
+ page: 1,
|
|
|
+ page_size: 10,
|
|
|
+ publishUnit: '',
|
|
|
+ publishStatus: '',
|
|
|
+ approvalStatus: '',
|
|
|
+ disposeStatus: ''
|
|
|
+ }
|
|
|
+});
|
|
|
+const { queryParams, form } = toRefs(data);
|
|
|
+const total = ref(0);
|
|
|
+
|
|
|
+const publishStatusOptions = reactive([
|
|
|
+ { value: '发布中', label: '发布中' },
|
|
|
+ { value: '已发布', label: '已发布' },
|
|
|
+ { value: '未提交', label: '未提交' }
|
|
|
+]);
|
|
|
+
|
|
|
+const approvalStatusOptions = reactive([
|
|
|
+ { value: '审批通过', label: '审批通过' },
|
|
|
+ { value: '待审批', label: '待审批' },
|
|
|
+ { value: '审批中', label: '审批中' },
|
|
|
+ { value: '未提交', label: '未提交' }
|
|
|
+]);
|
|
|
+const disposeStatusOptions = reactive([
|
|
|
+ { value: '全部', label: '全部' },
|
|
|
+ { value: '待处理', label: '待处理' },
|
|
|
+ { value: '已处理', label: '已处理' }
|
|
|
+]);
|
|
|
+
|
|
|
+const getStatusClass = (value) => {
|
|
|
+ if (['发布中', '已发布'].includes(value)) {
|
|
|
+ return 'dot-green';
|
|
|
+ } else if (value === '未提交') {
|
|
|
+ return 'dot-orange';
|
|
|
+ } else if (value === '审批中') {
|
|
|
+ return 'dot-red';
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+const getStatusClass2 = (value) => {
|
|
|
+ if (['审批通过'].includes(value)) {
|
|
|
+ return 'dot-green';
|
|
|
+ } else if (value === '待审批') {
|
|
|
+ return 'dot-blue';
|
|
|
+ } else if (['审批中'].includes(value)) {
|
|
|
+ return 'dot-red';
|
|
|
+ } else if (['未提交'].includes(value)) {
|
|
|
+ return 'dot-grey';
|
|
|
+ }
|
|
|
+};
|
|
|
+const handleSearch = () => {
|
|
|
+ queryParams.value.page = 1;
|
|
|
+ getList();
|
|
|
+};
|
|
|
+
|
|
|
+const resetSearch = () => {
|
|
|
+ queryParams.value = { page: 1, page_size: 10, publishUnit: '', publishStatus: '', approvalStatus: '' };
|
|
|
+ handleSearch();
|
|
|
+};
|
|
|
+
|
|
|
+const handleSelectionChange = (selection) => {
|
|
|
+ ids.value = selection.map((item) => item.eventId);
|
|
|
+ selectedRow.value = selection.length === 1 ? selection[0] : null;
|
|
|
+ single.value = selection.length != 1;
|
|
|
+ multiple.value = !selection.length;
|
|
|
+};
|
|
|
+
|
|
|
+const handleUpdate = (row) => {
|
|
|
+ // Implement update functionality
|
|
|
+};
|
|
|
+
|
|
|
+const handleClose = (row) => {
|
|
|
+ // Implement close functionality
|
|
|
+};
|
|
|
+
|
|
|
+let informationDetailState = reactive({
|
|
|
+ show: false,
|
|
|
+ eventId: ''
|
|
|
+});
|
|
|
+
|
|
|
+const handleView = (row) => {
|
|
|
+ if (row) {
|
|
|
+ informationDetailState.eventId = row.id; // 假设eventId是id字段
|
|
|
+ informationDetailState.show = true;
|
|
|
+ }
|
|
|
+};
|
|
|
+
|
|
|
+const getList = () => {
|
|
|
+ loading.value = true;
|
|
|
+ getInformation(queryParams.value) // 假设 getInformation 已经定义好
|
|
|
+ .then((res) => {
|
|
|
+ if (res.code === 200) {
|
|
|
+ // 映射返回的数据到 tableData
|
|
|
+ tableData.value = res.data.map((item) => ({
|
|
|
+ id: item.id,
|
|
|
+ publishUnit: item.publish_group || '未知',
|
|
|
+ informationContent: item.content || '未知',
|
|
|
+ publishTime: item.publish_time || '未知',
|
|
|
+ publishChannel: item.publish_channel || '未知',
|
|
|
+ applyPerson: item.nick_name || '未知',
|
|
|
+ pendingPerson: item.dept_name || '未知',
|
|
|
+ publishStatus: item.publish_status,
|
|
|
+ approvalStatus: item.examine_status,
|
|
|
+ userCount: item.user_count || 0,
|
|
|
+ successCount: item.user_ok_count || 0,
|
|
|
+ errorCount: item.user_err_count || 0,
|
|
|
+ sendingCount: item.user_sending_count || 0
|
|
|
+ }));
|
|
|
+ total.value = res.total;
|
|
|
+ } else {
|
|
|
+ console.error(res.msg);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch((error) => {
|
|
|
+ console.error('请求错误:', error);
|
|
|
+ })
|
|
|
+ .finally(() => {
|
|
|
+ loading.value = false;
|
|
|
+ });
|
|
|
+};
|
|
|
+
|
|
|
+onMounted(() => {
|
|
|
+ getList();
|
|
|
+});
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped>
|
|
|
+/* Add your custom styles here */
|
|
|
+</style>
|
zhangyihao