首页公告管理

src/api/home/homeimg/index.ts

@@ -0,0 +1,46 @@
+import request from '@/config/axios'
+
+// 公告管理 VO
+export interface imgVO {
+  imgId: number // 公告id
+  imgName: string // 公告名称
+  imgCreatetime: Date // 发布时间
+  imgImg: string // 轮换图片
+  imgContent: string // 发布内容
+  contentType: number // 公告分类
+  imgStatus: number // 公告图片状态
+  contentStatus: number // 公告状态
+}
+
+// 公告管理 API
+export const imgApi = {
+  // 查询公告管理分页
+  getimgPage: async (params: any) => {
+    return await request.get({ url: `/home/img/page`, params })
+  },
+
+  // 查询公告管理详情
+  getimg: async (id: number) => {
+    return await request.get({ url: `/home/img/get?id=` + id })
+  },
+
+  // 新增公告管理
+  createimg: async (data: imgVO) => {
+    return await request.post({ url: `/home/img/create`, data })
+  },
+
+  // 修改公告管理
+  updateimg: async (data: imgVO) => {
+    return await request.put({ url: `/home/img/update`, data })
+  },
+
+  // 删除公告管理
+  deleteimg: async (id: number) => {
+    return await request.delete({ url: `/home/img/delete?id=` + id })
+  },
+
+  // 导出公告管理 Excel
+  exportimg: async (params) => {
+    return await request.download({ url: `/home/img/export-excel`, params })
+  },
+}

src/views/Home/Index.vue

@@ -2,8 +2,8 @@
   <div>
     <el-card shadow="never" style="margin-bottom: 10px;height: 300px">
       <el-carousel :interval="4000" type="card" height="300px">
-        <el-carousel-item v-for="item in image" :key="item.id">
+        <el-carousel-item v-for="item in filteredList"  :key="item.imgId">
-          <el-image style="width: 100%; height: 100%" :src="item.src" alt="无图片" :title="item.name"/>
+          <el-image  style="width: 100%; height: 100%" :src="imgUrl+item.imgImg" alt="无图片" :title="item.imgName"/>
         </el-carousel-item>
       </el-carousel>
     </el-card>
@@ -77,14 +77,14 @@
           <div class="h-3 flex justify-between">
 <!--            <span>{{ t('workplace.project') }}</span>-->
             <span>数据统计</span>
-            <el-link
+<!--            <el-link-->
-              type="primary"
+<!--              type="primary"-->
-              :underline="false"
+<!--              :underline="false"-->
-              href="http://localhost/index"
+<!--              href="http://localhost/index"-->
-              target="_blank"
+<!--              target="_blank"-->
-            >
+<!--            >-->
-              {{ t('action.more') }}
+<!--              {{ t('action.more') }}-->
-            </el-link>
+<!--            </el-link>-->
           </div>
         </template>
         <el-skeleton :loading="loading" animated>
@@ -132,7 +132,7 @@
                 </el-skeleton>
               </el-card>
             </el-col>
-            <el-col :xl="24" :lg="24" :md="24" :sm="24" :xs="24">
+            <el-col :xl="14" :lg="14" :md="24" :sm="24" :xs="24">
               <el-card shadow="hover" class="mb-8px">
                 <el-skeleton :loading="loading" animated>
                   <Echart :options="barOptionsData" :height="280" />
@@ -142,6 +142,71 @@
           </el-row>
         </el-skeleton>
       </el-card>
+      <el-card shadow="never">
+        <template #header>
+          <div class="h-3 flex justify-between">
+            <!--            <span>{{ t('workplace.shortcutOperation') }}</span>-->
+            <span>未完成项目</span>
+          </div>
+        </template>
+        <el-skeleton :loading="loading" animated>
+          <el-row>
+            <!--            <el-col v-for="item in shortcut" :key="`team-${item.name}`" :span="8" class="mb-8px">-->
+            <el-col>
+              <div class="flex items-center">
+                <!--                <Icon :icon="item.icon" class="mr-8px" />-->
+                <!--                <el-link type="default" :underline="false" @click="setWatermark(item.name)">-->
+                <!--&lt;!&ndash;                  {{ item.name }}&ndash;&gt;-->
+                <!--                  Test-->
+                <!--                </el-link>-->
+                <el-table
+                  :data="list2"
+                  :row-class-name="tableRowClassName"
+                  stripe
+                  style="width:100%"
+                  height="300"
+                >
+                  <el-table-column
+                    fixed
+                    prop="pjEtime"
+                    label="预计日期"
+                    align="center"
+                    :formatter="dateFormatter2"
+                    style="width: 20%"
+                  />
+                  <el-table-column
+                    prop="pjName"
+                    label="标题"
+                    style="width: 30%"
+                  />
+                  <el-table-column
+                    prop="pjType"
+                    label="类别"
+                    style="width: 20%"
+                  >
+                    <template #default="scope">
+                      <dict-tag :type="DICT_TYPE.HOME_PJ_TYPE" :value="scope.row.pjType" />
+                    </template>
+                  </el-table-column>
+                  <el-table-column
+                    prop="pjDept"
+                    label="部门"
+                    style="width: 20%">
+                    <template #default="scope">
+                      <dict-tag :type="DICT_TYPE.HOME_PJ_DEPT" :value="scope.row.pjDept" />
+                    </template>
+                  </el-table-column>
+                  <el-table-column
+                    prop="pjNumber"
+                    label="人数"
+                    style="width: 10%"
+                  />
+                </el-table>
+              </div>
+            </el-col>
+          </el-row>
+        </el-skeleton>
+      </el-card>
     </el-col>
 
 
@@ -151,23 +216,22 @@
         <template #header>
           <div class="h-3 flex justify-between">
             <span>{{ t('workplace.notice') }}</span>
-            <el-link type="primary" :underline="false">{{ t('action.more') }}</el-link>
+<!--            <el-link type="primary" :underline="false">{{ t('action.more') }}</el-link>-->
           </div>
         </template>
         <el-skeleton :loading="loading" animated>
-          <div v-for="(item, index) in notice" :key="`dynamics-${index}`">
+          <div v-for="(item, index) in filteredList2" :key="`dynamics-${index}`">
             <div class="flex items-center">
 <!--              <el-avatar :src="avatar" :size="35" class="mr-16px">-->
 <!--                <img src="@/assets/imgs/avatar.gif" alt="" />-->
 <!--              </el-avatar>-->
               <div>
-                <div class="text-14px">
+                <div class="text-14px" @click="openDialog(item.contentType,item.imgId)">
-                  <Highlight :keys="item.keys.map((v) => t(v))">
+                    <dict-tag :type="DICT_TYPE.HOME_CONTENT_STATUS" :value="item.contentType" /> :
-                    {{ item.type }} : {{ item.title }}
+                    {{ item.imgName }}
-                  </Highlight>
                 </div>
                 <div class="mt-16px text-12px text-gray-400">
-                  {{ formatTime(item.date, 'yyyy-MM-dd') }}
+                  {{ formatTime(item.imgCreatetime, 'yyyy-MM-dd') }}
                 </div>
               </div>
             </div>
@@ -203,72 +267,7 @@
                   prop="pjEtime"
                   label="完成日期"
                   align="center"
-                  :formatter="dateFormatter"
+                  :formatter="dateFormatter2"
-                  style="width: 20%"
-                />
-                  <el-table-column
-                    prop="pjName"
-                    label="标题"
-                    style="width: 30%"
-                  />
-                  <el-table-column
-                    prop="pjType"
-                    label="类别"
-                    style="width: 20%"
-                  >
-                    <template #default="scope">
-                      <dict-tag :type="DICT_TYPE.HOME_PJ_TYPE" :value="scope.row.pjType" />
-                    </template>
-                  </el-table-column>
-                  <el-table-column
-                    prop="pjDept"
-                    label="部门"
-                    style="width: 20%">
-                    <template #default="scope">
-                      <dict-tag :type="DICT_TYPE.HOME_PJ_DEPT" :value="scope.row.pjDept" />
-                    </template>
-                  </el-table-column>
-                  <el-table-column
-                    prop="pjNumber"
-                    label="人数"
-                    style="width: 10%"
-                  />
-                </el-table>
-              </div>
-            </el-col>
-          </el-row>
-        </el-skeleton>
-      </el-card>
-      <el-card shadow="never">
-        <template #header>
-          <div class="h-3 flex justify-between">
-            <!--            <span>{{ t('workplace.shortcutOperation') }}</span>-->
-            <span>未完成项目</span>
-          </div>
-        </template>
-        <el-skeleton :loading="loading" animated>
-          <el-row>
-            <!--            <el-col v-for="item in shortcut" :key="`team-${item.name}`" :span="8" class="mb-8px">-->
-            <el-col>
-              <div class="flex items-center">
-                <!--                <Icon :icon="item.icon" class="mr-8px" />-->
-                <!--                <el-link type="default" :underline="false" @click="setWatermark(item.name)">-->
-                <!--&lt;!&ndash;                  {{ item.name }}&ndash;&gt;-->
-                <!--                  Test-->
-                <!--                </el-link>-->
-                <el-table
-                  :data="list2"
-                  :row-class-name="tableRowClassName"
-                  stripe
-                  style="width:100%"
-                  height="300"
-                >
-                  <el-table-column
-                    fixed
-                    prop="pjEtime"
-                    label="预计日期"
-                    align="center"
-                    :formatter="dateFormatter"
                   style="width: 20%"
                 />
                   <el-table-column
@@ -306,22 +305,38 @@
       </el-card>
     </el-col>
   </el-row>
+  <Dialog :title="dialogTitle" v-model="dialogVisible" style="width: 85%">
+    <el-form >
+      <el-form-item >
+        <span style="font-size: 20px; font-weight: bold;">{{formData.imgName}}</span>
+        <el-divider style="border-top: none; margin: 0;"/>
+        <span style="font-size: 12px">发布时间: {{formatTime(formData.imgCreatetime,'yyyy-MM-dd')}}</span>
+        <el-divider style="margin-top: 10px"/>
+        <span style="line-height: 1.2" v-html="formData.imgContent"></span>
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button @click="dialogVisible = false">确 定</el-button>
+    </template>
+  </Dialog>
 </template>
 <script lang="ts" setup>
 import { set } from 'lodash-es'
 import { EChartsOption } from 'echarts'
 import { formatTime } from '@/utils'
-import mn2 from '@/assets/imgs/Home-image/02.png'
+// import mn2 from '@/assets/imgs/Home-image/02.png'
-import mn3 from '@/assets/imgs/Home-image/03.png'
+// import mn3 from '@/assets/imgs/Home-image/03.png'
-import mn4 from '@/assets/imgs/Home-image/04.png'
+// import mn4 from '@/assets/imgs/Home-image/04.png'
 import { useUserStore } from '@/store/modules/user'
 // import { useWatermark } from '@/hooks/web/useWatermark'
 import type { WorkplaceTotal, Project, Notice, Shortcut } from './types'
 import { pieOptions, barOptions } from './echarts-data'
 import {DataInfoApi, DataInfoVO} from "@/api/home/datainfo";
 import {pjApi, pjVO} from "@/api/home/homepj";
-import {dateFormatter} from "@/utils/formatTime";
+import {dateFormatter, dateFormatter2} from "@/utils/formatTime";
-import {DICT_TYPE} from "@/utils/dict";
+import {DICT_TYPE, getIntDictOptions} from "@/utils/dict";
+import {imgApi, imgVO} from "@/api/home/homeimg";
+import a from "../../../dist/assets/a-Bqc4tEO8";
 
 defineOptions({ name: 'Home' })
 
@@ -332,6 +347,7 @@ const userStore = useUserStore()
 const loading = ref(false)
 const list = ref<DataInfoVO[]>([]) // 列表的数据
 const list2 = ref<pjVO[]>([]) // 列表的数据
+const list3 = ref<imgVO[]>([]) // 列表的数据
 const total = ref(0) // 列表的总页数
 const avatar = userStore.getUser.avatar
 const username = userStore.getUser.nickname
@@ -344,6 +360,45 @@ let totalSate = reactive<WorkplaceTotal>({
   access: 0,
   todo: 0
 })
+const formData = ref({
+  imgId: undefined,
+  imgName: undefined,
+  imgCreatetime: undefined,
+  imgImg: [],
+  imgContent: undefined,
+  contentType: undefined,
+  imgStatus: undefined,
+  contentStatus: undefined,
+})
+const dialogVisible = ref(false) // 弹窗的是否展示
+const dialogTitle = ref('') // 弹窗的标题
+const openDialog = async (type:number,id?:number) => {
+  dialogVisible.value = true
+  dialogTitle.value = type===1?'公告':'通知'
+  resetForm()
+  if (id) {
+    formData.value = await imgApi.getimg(id)
+  }
+}
+/** 重置表单 */
+const resetForm = () => {
+    formData.value = {
+      imgId: undefined,
+      imgName: undefined,
+      imgCreatetime: undefined,
+      imgImg: undefined,
+      imgContent: undefined,
+      contentType: undefined,
+      imgStatus: undefined,
+      contentStatus: undefined,
+    }
+  }
+const filteredList = computed(() => {
+  return list3.value.filter(item => item.imgStatus !== 0 && item.contentStatus!==0);
+});
+const filteredList2 = computed(() => {
+  return list3.value.filter(item => item.contentStatus !== 0 );
+});
 const queryParams2 = reactive({
   pageNo: 1,
   pageSize: 50,
@@ -358,17 +413,32 @@ const queryParams2 = reactive({
   pjNumber: undefined,
   createTime: [],
 })
+
+const queryParams3 = reactive({
+  pageNo: 1,
+  pageSize: 20,
+  imgId: undefined,
+  imgName: undefined,
+  imgCreatetime: [],
+  imgImg: undefined,
+  imgContent: undefined,
+  contentType: undefined,
+  imgStatus: undefined,
+  contentStatus: undefined,
+  createTime: [],
+})
 const tableRowClassName = ({ row }) => {
   return row.pjDone === 1 ? 'warning-row' : '';
 };
 const tableRowClassName2 = ({ row }) => {
   return row.pjDone === 0 ? 'warning-row' : '';
 };
-const image = [
+const imgUrl = "//images.weserv.nl/?url="
-  {id: 1, src: mn2, name: '02'},
+// const image = [
-  {id: 2, src: mn3, name: '03'},
+//   {id: 1, src: mn2, name: '02'},
-  {id: 3, src: mn4, name: '04'},
+//   {id: 2, src: mn3, name: '03'},
-]
+//   {id: 3, src: mn4, name: '04'},
+// ]
 const dataList = computed(() => [
   { name: '碳排放', infoCo2e: allData.value.infoCo2e, dAn: '吨', time: '2024-07-05', color: '#e6eae3' },
   { name: '用水量', infoCo2e: allData.value.infoWater, dAn: '吨', time: '2024-07-05', color: '#ecf5ff' },
@@ -388,10 +458,12 @@ const getList = async () => {
   try {
     const data = await DataInfoApi.getDataInfoPage(queryParams)
     const data2 = await pjApi.getpjPage(queryParams2)
+    const data3 = await imgApi.getimgPage(queryParams3)
     allData.value=data.list[0]
     allData2.value=data.list
     list.value = data.list
     list2.value = data2.list
+    list3.value = data3.list
     total.value = data.total
 
     await getWeeklyUserActivity()
@@ -481,21 +553,21 @@ const getNotice = async () => {
       title: '2024年4月7日，罗平县生态环境保护综合行政执法大队对你单位进行了调查，发现你单位实施了以下生态环境违法行为',
       // title: '系统支持 JDK 8/17/21，Vue 2/3',
       type: '通知',
-      keys: ['通知', '8', '17', '21', '2', '3'],
+      keys: ['通知'],
       date: new Date()
     },
     {
       title: '2024年4月7日，罗平县生态环境保护综合行政执法大队对你单位进行了调查，发现你单位实施了以下生态环境违法行为',
       // title: '后端提供 Spring Boot 2.7/3.2 + Cloud 双架构',
       type: '公告',
-      keys: ['公告', 'Boot', 'Cloud'],
+      keys: ['公告'],
       date: new Date()
     },
     {
       title: '2024年4月7日，罗平县生态环境保护综合行政执法大队对你单位进行了调查，发现你单位实施了以下生态环境违法行为',
       // title: '全部开源，个人与企业可 100% 直接使用，无需授权',
       type: '通知',
-      keys: ['通知', '无需授权'],
+      keys: ['通知'],
       date: new Date()
     },
     {
@@ -587,7 +659,6 @@ const getWeeklyUserActivity = async () => {
     'xAxis.data',
     data.map((v) => t(v.name))
   )
-  console.log("dataList2.value",dataList2.value)
   set(barOptionsData, 'series', [
     {
       name: '2022',

src/views/Home/datainfo/index.vue

@@ -141,7 +141,7 @@
 <!--        label="数据收集时间"-->
 <!--        align="center"-->
 <!--        prop="infoYear"-->
-<!--        :formatter="dateFormatter"-->
+<!--        :formatter="dateFormatter2"-->
 <!--        width="180px"-->
 <!--      />-->
       <el-table-column label="碳排放(吨CO2e)" align="center" prop="infoCo2e" />
@@ -192,7 +192,7 @@
 </template>
 
 <script setup lang="ts">
-import { dateFormatter } from '@/utils/formatTime'
+import {dateFormatter, dateFormatter2} from '@/utils/formatTime'
 import download from '@/utils/download'
 import { DataInfoApi, DataInfoVO } from '@/api/home/datainfo'
 import DataInfoForm from './DataInfoForm.vue'

src/views/Home/homeimg/imgForm.vue

@@ -0,0 +1,169 @@
+<template>
+  <Dialog :title="dialogTitle" v-model="dialogVisible" style="width: 85%">
+    <el-form
+      ref="formRef"
+      :model="formData"
+      :rules="formRules"
+      label-width="100px"
+      v-loading="formLoading"
+    >
+      <el-form-item label="公告名称" prop="imgName">
+        <el-input v-model="formData.imgName" placeholder="请输入公告名称" />
+      </el-form-item>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item label="图片状态" prop="imgStatus">
+            <el-select v-model="formData.imgStatus" placeholder="请选择图片状态">
+              <el-option
+                v-for="dict in getIntDictOptions(DICT_TYPE.HOME_IMG_STATUS)"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="公告状态" prop="contentStatus">
+            <el-select v-model="formData.contentStatus" placeholder="请选择公告状态">
+              <el-option
+                v-for="dict in getIntDictOptions(DICT_TYPE.HOME_CONTENT)"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+          <el-form-item label="发布时间" prop="imgCreatetime">
+            <el-date-picker
+              v-model="formData.imgCreatetime"
+              type="date"
+              value-format="x"
+              placeholder="选择发布时间"
+            />
+          </el-form-item>
+        </el-col>
+        <el-col :span="12">
+          <el-form-item label="公告分类" prop="contentType">
+            <el-select v-model="formData.contentType" placeholder="请选择公告分类">
+              <el-option
+                v-for="dict in getIntDictOptions(DICT_TYPE.HOME_CONTENT_STATUS)"
+                :key="dict.value"
+                :label="dict.label"
+                :value="dict.value"
+              />
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-form-item label="轮换图片" prop="imgImg">
+        <UploadImg v-model="formData.imgImg" />
+      </el-form-item>
+      <el-form-item label="发布内容" prop="imgContent">
+        <Editor v-model="formData.imgContent" height="150px" />
+      </el-form-item>
+    </el-form>
+    <template #footer>
+      <el-button @click="submitForm" type="primary" :disabled="formLoading">确 定</el-button>
+      <el-button @click="dialogVisible = false">取 消</el-button>
+    </template>
+  </Dialog>
+</template>
+<script setup lang="ts">
+import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
+import { imgApi, imgVO } from '@/api/home/homeimg'
+
+/** 公告管理 表单 */
+defineOptions({ name: 'imgForm' })
+
+const { t } = useI18n() // 国际化
+const message = useMessage() // 消息弹窗
+
+const dialogVisible = ref(false) // 弹窗的是否展示
+const dialogTitle = ref('') // 弹窗的标题
+const formLoading = ref(false) // 表单的加载中：1）修改时的数据加载；2）提交的按钮禁用
+const formType = ref('') // 表单的类型：create - 新增；update - 修改
+const formData = ref({
+  imgId: undefined,
+  imgName: undefined,
+  imgCreatetime: undefined,
+  imgImg: [],
+  imgContent: undefined,
+  contentType: undefined,
+  imgStatus: undefined,
+  contentStatus: undefined,
+})
+const formRules = reactive({
+  imgName: [{ required: true, message: '公告名称不能为空', trigger: 'blur' }],
+  imgImg: [{ required: true, message: '轮换图片不能为空', trigger: 'blur' }],
+  imgContent: [{ required: true, message: '公告内容不能为空', trigger: 'blur' }],
+  contentType: [{ required: true, message: '公告分类不能为空', trigger: 'change' }],
+  imgStatus: [{ required: true, message: '公告图片状态不能为空', trigger: 'change' }],
+  contentStatus: [{ required: true, message: '公告状态不能为空', trigger: 'change' }],
+})
+const formRef = ref() // 表单 Ref
+
+/** 打开弹窗 */
+const open = async (type: string, id?: number) => {
+  dialogVisible.value = true
+  dialogTitle.value = t('action.' + type)
+  formType.value = type
+  resetForm()
+  // 修改时，设置数据
+  if (id) {
+    formLoading.value = true
+    try {
+      formData.value = await imgApi.getimg(id)
+    } finally {
+      formLoading.value = false
+    }
+  }
+}
+defineExpose({ open }) // 提供 open 方法，用于打开弹窗
+
+/** 提交表单 */
+const emit = defineEmits(['success']) // 定义 success 事件，用于操作成功后的回调
+const submitForm = async () => {
+  // 校验表单
+  await formRef.value.validate()
+  // 提交请求
+  formLoading.value = true
+  try {
+    if (formData.value.imgImg.length==2){
+      formData.value.imgImg=formData.value.imgImg[1]
+    }
+    const data = formData.value as unknown as imgVO
+    if (formType.value === 'create') {
+      await imgApi.createimg(data)
+      message.success(t('common.createSuccess'))
+    } else {
+      await imgApi.updateimg(data)
+      message.success(t('common.updateSuccess'))
+    }
+    dialogVisible.value = false
+    // 发送操作成功的事件
+    emit('success')
+  } finally {
+    formLoading.value = false
+  }
+}
+
+/** 重置表单 */
+const resetForm = () => {
+  formData.value = {
+    imgId: undefined,
+    imgName: undefined,
+    imgCreatetime: undefined,
+    imgImg: undefined,
+    imgContent: undefined,
+    contentType: undefined,
+    imgStatus: undefined,
+    contentStatus: undefined,
+  }
+  formRef.value?.resetFields()
+}
+</script>

src/views/Home/homeimg/index.vue

@@ -0,0 +1,289 @@
+<template>
+  <ContentWrap>
+    <!-- 搜索工作栏 -->
+    <el-form
+      class="-mb-15px"
+      :model="queryParams"
+      ref="queryFormRef"
+      :inline="true"
+      label-width="68px"
+    >
+<!--      <el-form-item label="公告id" prop="imgId">-->
+<!--        <el-input-->
+<!--          v-model="queryParams.imgId"-->
+<!--          placeholder="请输入公告id"-->
+<!--          clearable-->
+<!--          @keyup.enter="handleQuery"-->
+<!--          class="!w-240px"-->
+<!--        />-->
+<!--      </el-form-item>-->
+      <el-form-item label="公告名称" prop="imgName">
+        <el-input
+          v-model="queryParams.imgName"
+          placeholder="请输入公告名称"
+          clearable
+          @keyup.enter="handleQuery"
+          class="!w-240px"
+        />
+      </el-form-item>
+<!--      <el-form-item label="发布时间" prop="imgCreatetime">-->
+<!--        <el-date-picker-->
+<!--          v-model="queryParams.imgCreatetime"-->
+<!--          value-format="YYYY-MM-DD HH:mm:ss"-->
+<!--          type="daterange"-->
+<!--          start-placeholder="开始日期"-->
+<!--          end-placeholder="结束日期"-->
+<!--          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"-->
+<!--          class="!w-240px"-->
+<!--        />-->
+<!--      </el-form-item>-->
+      <el-form-item label="公告分类" prop="contentType">
+        <el-select
+          v-model="queryParams.contentType"
+          placeholder="请选择公告分类"
+          clearable
+          class="!w-240px"
+        >
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.HOME_CONTENT_STATUS)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+<!--      <el-form-item label="公告图片状态" prop="imgStatus">-->
+<!--        <el-select-->
+<!--          v-model="queryParams.imgStatus"-->
+<!--          placeholder="请选择公告图片状态"-->
+<!--          clearable-->
+<!--          class="!w-240px"-->
+<!--        >-->
+<!--          <el-option-->
+<!--            v-for="dict in getIntDictOptions(DICT_TYPE.HOME_IMG_STATUS)"-->
+<!--            :key="dict.value"-->
+<!--            :label="dict.label"-->
+<!--            :value="dict.value"-->
+<!--          />-->
+<!--        </el-select>-->
+<!--      </el-form-item>-->
+      <el-form-item label="公告状态" prop="contentStatus">
+        <el-select
+          v-model="queryParams.contentStatus"
+          placeholder="请选择公告状态"
+          clearable
+          class="!w-240px"
+        >
+          <el-option
+            v-for="dict in getIntDictOptions(DICT_TYPE.HOME_CONTENT)"
+            :key="dict.value"
+            :label="dict.label"
+            :value="dict.value"
+          />
+        </el-select>
+      </el-form-item>
+<!--      <el-form-item label="创建时间" prop="createTime">-->
+<!--        <el-date-picker-->
+<!--          v-model="queryParams.createTime"-->
+<!--          value-format="YYYY-MM-DD HH:mm:ss"-->
+<!--          type="daterange"-->
+<!--          start-placeholder="开始日期"-->
+<!--          end-placeholder="结束日期"-->
+<!--          :default-time="[new Date('1 00:00:00'), new Date('1 23:59:59')]"-->
+<!--          class="!w-240px"-->
+<!--        />-->
+<!--      </el-form-item>-->
+      <el-form-item>
+        <el-button @click="handleQuery"><Icon icon="ep:search" class="mr-5px" /> 搜索</el-button>
+        <el-button @click="resetQuery"><Icon icon="ep:refresh" class="mr-5px" /> 重置</el-button>
+        <el-button
+          type="primary"
+          plain
+          @click="openForm('create')"
+          v-hasPermi="['home:img:create']"
+        >
+          <Icon icon="ep:plus" class="mr-5px" /> 新增
+        </el-button>
+        <el-button
+          type="success"
+          plain
+          @click="handleExport"
+          :loading="exportLoading"
+          v-hasPermi="['home:img:export']"
+        >
+          <Icon icon="ep:download" class="mr-5px" /> 导出
+        </el-button>
+      </el-form-item>
+    </el-form>
+  </ContentWrap>
+
+  <!-- 列表 -->
+  <ContentWrap>
+    <el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true">
+<!--      <el-table-column label="公告id" align="center" prop="imgId" />-->
+      <el-table-column label="公告名称" align="center" prop="imgName" />
+      <el-table-column
+        label="发布时间"
+        align="center"
+        prop="imgCreatetime"
+        :formatter="dateFormatter2"
+        width="180px"
+      />
+      <el-table-column label="轮换图片" align="center" prop="imgImg" >
+        <template #default="scope">
+          <el-image :src="imgUrl+scope.row.imgImg" style="width: 100%;height: 100%" alt="无图片"/>
+        </template>
+      </el-table-column>
+<!--      <el-table-column label="发布内容" align="center" prop="imgContent" />-->
+      <el-table-column label="公告分类" align="center" prop="contentType">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.HOME_CONTENT_STATUS" :value="scope.row.contentType" />
+        </template>
+      </el-table-column>
+      <el-table-column label="公告图片状态" align="center" prop="imgStatus">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.HOME_IMG_STATUS" :value="scope.row.imgStatus" />
+        </template>
+      </el-table-column>
+      <el-table-column label="公告状态" align="center" prop="contentStatus">
+        <template #default="scope">
+          <dict-tag :type="DICT_TYPE.HOME_CONTENT" :value="scope.row.contentStatus" />
+        </template>
+      </el-table-column>
+      <el-table-column
+        label="创建时间"
+        align="center"
+        prop="createTime"
+        :formatter="dateFormatter"
+        width="180px"
+      />
+      <el-table-column label="操作" align="center">
+        <template #default="scope">
+          <el-button
+            link
+            type="primary"
+            @click="openForm('update', scope.row.imgId)"
+            v-hasPermi="['home:img:update']"
+          >
+            编辑
+          </el-button>
+          <el-button
+            link
+            type="danger"
+            @click="handleDelete(scope.row.imgId)"
+            v-hasPermi="['home:img:delete']"
+          >
+            删除
+          </el-button>
+        </template>
+      </el-table-column>
+    </el-table>
+    <!-- 分页 -->
+    <Pagination
+      :total="total"
+      v-model:page="queryParams.pageNo"
+      v-model:limit="queryParams.pageSize"
+      @pagination="getList"
+    />
+  </ContentWrap>
+
+  <!-- 表单弹窗：添加/修改 -->
+  <imgForm ref="formRef" @success="getList" />
+</template>
+
+<script setup lang="ts">
+import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
+import {dateFormatter, dateFormatter2} from '@/utils/formatTime'
+import download from '@/utils/download'
+import { imgApi, imgVO } from '@/api/home/homeimg'
+import imgForm from './imgForm.vue'
+
+/** 公告管理 列表 */
+defineOptions({ name: 'Homeimg' })
+
+const message = useMessage() // 消息弹窗
+const { t } = useI18n() // 国际化
+
+const imgUrl = "//images.weserv.nl/?url="
+const loading = ref(true) // 列表的加载中
+const list = ref<imgVO[]>([]) // 列表的数据
+const total = ref(0) // 列表的总页数
+const queryParams = reactive({
+  pageNo: 1,
+  pageSize: 10,
+  imgId: undefined,
+  imgName: undefined,
+  imgCreatetime: [],
+  imgImg: undefined,
+  imgContent: undefined,
+  contentType: undefined,
+  imgStatus: undefined,
+  contentStatus: undefined,
+  createTime: [],
+})
+const queryFormRef = ref() // 搜索的表单
+const exportLoading = ref(false) // 导出的加载中
+
+/** 查询列表 */
+const getList = async () => {
+  loading.value = true
+  try {
+    const data = await imgApi.getimgPage(queryParams)
+    list.value = data.list
+    total.value = data.total
+  } finally {
+    loading.value = false
+  }
+}
+
+/** 搜索按钮操作 */
+const handleQuery = () => {
+  queryParams.pageNo = 1
+  getList()
+}
+
+/** 重置按钮操作 */
+const resetQuery = () => {
+  queryFormRef.value.resetFields()
+  handleQuery()
+}
+
+/** 添加/修改操作 */
+const formRef = ref()
+const openForm = (type: string, id?: number) => {
+  formRef.value.open(type, id)
+}
+
+/** 删除按钮操作 */
+const handleDelete = async (id: number) => {
+  try {
+    // 删除的二次确认
+    await message.delConfirm()
+    // 发起删除
+    await imgApi.deleteimg(id)
+    message.success(t('common.delSuccess'))
+    // 刷新列表
+    await getList()
+  } catch {}
+}
+
+/** 导出按钮操作 */
+const handleExport = async () => {
+  try {
+    // 导出的二次确认
+    await message.exportConfirm()
+    // 发起导出
+    exportLoading.value = true
+    const data = await imgApi.exportimg(queryParams)
+    download.excel(data, '公告管理.xls')
+  } catch {
+  } finally {
+    exportLoading.value = false
+  }
+}
+
+/** 初始化 **/
+onMounted(() => {
+  getList()
+})
+</script>

src/views/Home/homepj/index.vue

@@ -167,14 +167,14 @@
 <!--        label="预计完成时间"-->
 <!--        align="center"-->
 <!--        prop="pjEtime"-->
-<!--        :formatter="dateFormatter"-->
+<!--        :formatter="dateFormatter2"-->
 <!--        width="180px"-->
 <!--      />-->
 <!--      <el-table-column-->
 <!--        label="实际完成时间"-->
 <!--        align="center"-->
 <!--        prop="pjVtime"-->
-<!--        :formatter="dateFormatter"-->
+<!--        :formatter="dateFormatter2"-->
 <!--        width="180px"-->
 <!--      />-->
       <el-table-column label="参与部门" align="center" prop="pjDept">
@@ -226,7 +226,7 @@
 
 <script setup lang="ts">
 import { getIntDictOptions, DICT_TYPE } from '@/utils/dict'
-import { dateFormatter } from '@/utils/formatTime'
+import {dateFormatter, dateFormatter2} from '@/utils/formatTime'
 import download from '@/utils/download'
 import { pjApi, pjVO } from '@/api/home/homepj'
 import pjForm from './pjForm.vue'