feat: 实现工作展示模块并优化环境配置

hejianhao

2026-01-23 bbe8dcad6b963984524784321f0df09a07e6d34b

feat: 实现工作展示模块并优化环境配置

- 新增工作展示列表页面，支持增删改查及图片上传预览
- 优化首页事故简讯和工作展示轮播的数据对接
- 修复环境配置中的图片基础URL路径
- 改进登录认证后的页面跳转逻辑
- 调整事故消息设置界面的数据显示字段

 estate-frontend-v2024/src/views/screenSetting/accidentMessageSetting.jsx

@@ -120,8 +120,8 @@
            <Column
              title="事故类型"
              width={120}
              dataIndex="classifyId" // 暂时显示ID，或者需要后端返回名称
              key="classifyId"
              dataIndex="classifyName"
              key="classifyName"
              align="center"
            />
            <Column

 screen/.env.development

@@ -1,3 +1,3 @@
VUE_APP_BASE_URL=http://192.168.110.111:9908
# VUE_APP_BASE_URL=http://221.182.45.100:8180
VUE_APP_IMAGE_BASE_URL=http://192.168.110.111:11225/images/
VUE_APP_IMAGE_BASE_URL=http://221.182.45.100:11225/images/files/

 screen/.env.production

@@ -1,2 +1,2 @@
VUE_APP_BASE_URL=https://rhljsq.pzhsoar.com/manage
VUE_APP_IMAGE_BASE_URL=https://rhljsq.pzhsoar.com/images
VUE_APP_IMAGE_BASE_URL=http://47.108.113.190:8181/public/file/download/

 screen/src/components/customPreview.vue

@@ -1,7 +1,7 @@
<template>
  <div>
    <CustomDialog title="图片预览" :visible.sync="visible" width="1420px" @close="$emit('close')">
      <div style="height: 691px">
      <div style="height: 691px" class="oa flex a-center flex-column gap--20">
        <div v-for="(item, index) in imgArr" :key="index">
          <img :src="item" style="width: 100%; height: 100%" />
        </div>

 screen/src/utils/request.js

@@ -37,9 +37,7 @@
    } else {
      if (res.data.code === 401) {
        localStorage.clear()
        this.$router.replace({
          path: "/",
        });
        window.location.replace('/');
      }
      if (res.data.code === 500) {
        return Promise.reject(res.data.data)

 screen/src/view/header/index.vue

@@ -5,7 +5,11 @@
      class="flex a-center c-fff absolute adress1 cursor-pointer"
    >
      <img
        :src="clientLogo || '../../assets/img/logo.png'"
        :src="
          clientLogo
            ? VUE_APP_IMAGE_BASE_URL + clientLogo
            : '../../assets/img/logo.png'
        "
        class="w--30 h--30 shrink0 mr--10"
      />
      <div class="color2 lh--30 fs--30 SHSBold">
@@ -37,6 +41,7 @@
      currentDate: "",
      clientName: localStorage.getItem("clientName"),
      clientLogo: localStorage.getItem("clientLogo"),
      VUE_APP_IMAGE_BASE_URL: process.env.VUE_APP_IMAGE_BASE_URL,
    };
  },
  mounted() {

 screen/src/view/home/index.vue

@@ -185,10 +185,10 @@
      >
        <el-select filterable v-model="projectId" placeholder="请输入项目名称">
          <el-option
            v-for="item in [1, 2]"
            :key="item"
            :label="item"
            :value="item"
            v-for="item in projectList"
            :key="item.id"
            :label="item.name"
            :value="item.id"
          >
          </el-option>
        </el-select>
@@ -438,15 +438,27 @@
        <TitleBox>
          <template #title> 事故简讯 </template>
          <template #right>
            <div
              @click="toAccidentCaseList"
              class="flex a-center py--6 pl--10 pr--8 br--4 bgcolor5 cursor-pointer"
            >
              <div class="fs--12 lh--12 c-fff mr--4 SHSR">详情</div>
              <img
                src="../../assets/img/home/13@2x.png"
                class="w--14 h--14 shrink0"
              />
            <div class="flex a-center gap--10">
              <div class="flex a-center searchTabs">
                <div
                  @click="handleTabClick(item)"
                  v-for="item in searchTabs"
                  :key="item"
                  :class="{ activeTabs: item === activeTabs }"
                >
                  {{ item }}
                </div>
              </div>
              <div
                @click="toAccidentCaseList"
                class="flex a-center py--6 pl--10 pr--8 br--4 bgcolor5 cursor-pointer"
              >
                <div class="fs--12 lh--12 c-fff mr--4 SHSR">详情</div>
                <img
                  src="../../assets/img/home/13@2x.png"
                  class="w--14 h--14 shrink0"
                />
              </div>
            </div>
          </template>
          <template #content>
@@ -469,7 +481,7 @@
                  <div
                    class="absolute lh--20 fs--12 SHSBold bgcolor6 px--6 top0 right0"
                  >
                    {{ item.type }}
                    {{ item.classifyName }}
                  </div>
                  <div class="fs--16 lh--16 SHSBold">
                    {{ item.title }}
@@ -479,7 +491,9 @@
                      src="../../assets/img/home/Shape@2x (2).png"
                      class="w--8 h--10 shrink0 mr--7"
                    />
                    <div class="SHSN fs--12 lh--12">{{ item.location }}</div>
                    <div class="SHSN fs--12 lh--12">
                      {{ item.province + item.city + item.area }}
                    </div>
                  </div>
                  <div class="flex a-center j-between mt--8 pr--76">
                    <div class="flex a-center">
@@ -487,7 +501,7 @@
                        src="../../assets/img/home/Shape@2x (3).png"
                        class="w--10 h--9 shrink0 mr--7"
                      />
                      <div class="SHSN fs--12 lh--12">{{ item.date }}</div>
                      <div class="SHSN fs--12 lh--12">{{ item.time }}</div>
                    </div>
                    <div class="flex a-center">
                      <img
@@ -533,16 +547,13 @@
                ref="carousel"
                @change="handleChangeCarousel"
              >
                <el-carousel-item v-for="(item, index) in 4" :key="index">
                <el-carousel-item v-for="item in workListData" :key="item.id">
                  <div @click="toWorkDetail(item)" class="cursor-pointer">
                    <img
                      src="https://huishou-1323682843.cos.ap-nanjing.myqcloud.com/images/1bcd9db5-c909-4edc-a3d2-61cc33c54462.jpg"
                      class="w100 h--290"
                    />
                    <img :src="item.img.split(',')[0]" class="w100 h--290" />
                    <div
                      class="fs--18 lh--24 SHSBold py--10 pl--20 pr--14 c-fff"
                    >
                      德国模德机床中国总部及研发生产基地项目落户成都东部新区
                      {{ item.title }}
                    </div>
                  </div>
                </el-carousel-item>
@@ -550,15 +561,15 @@
              <div class="flex a-center justify-center mt--9">
                <div class="flex a-center gap--3">
                  <img
                    v-for="(item, index) in 4"
                    :key="index"
                    v-for="item in workListData"
                    :key="item.id"
                    :src="
                      activeIndex === index
                      activeIndex === item.id
                        ? require('../../assets/img/home/Rectangle@2x.png')
                        : require('../../assets/img/home/Rectangle@2x (1).png')
                    "
                    class="w--18 h--4 shrink0 cursor-pointer"
                    @click="changeActiveIndex(index)"
                    @click="changeActiveIndex(item.id)"
                  />
                </div>
              </div>
@@ -582,7 +593,12 @@
import z1 from "../../assets/img/home/assets1.png";
import z2 from "../../assets/img/home/assets2.png";
import z3 from "../../assets/img/home/assets3.png";
import { getStatistics } from "./service";
import {
  getStatistics,
  getStoryList,
  getProjectSelect,
  getWorkPresentationList,
} from "./service";

export default {
  components: {
@@ -616,6 +632,10 @@
      // 9各分项隐患趋势 10隐患数量 11设备数量 12查看报告入口 13人员在岗率 14重大风险源 15 项目风险趋势
      permissionProject: JSON.parse(localStorage.getItem("permissionProject")),
      screenData: {},
      searchTabs: ["本周", "本月", "本季度", "本年"],
      activeTabs: "本周",
      workListData: [],
      VUE_APP_IMAGE_BASE_URL: process.env.VUE_APP_IMAGE_BASE_URL,
    };
  },
  watch: {
@@ -640,6 +660,20 @@
      version: "2.0",
    });
    this.getScreenData();
    this.getStoryData();
    getProjectSelect({ clientId: localStorage.getItem("clientId") }).then(
      (res) => {
        this.projectList = res;
      }
    );
    getWorkPresentationList({
      clientId: localStorage.getItem("clientId"),
      state: 1,
      pageNum: 1,
      pageSize: 9999,
    }).then((res) => {
      this.workListData = res.records;
    });
  },
  mounted() {
    this.$nextTick(() => {
@@ -651,10 +685,38 @@
    this.stopAutoScroll();
  },
  methods: {
    handleTabClick(tab) {
      this.activeTabs = tab;
      this.getStoryData();
    },
    changeTab(type) {
      if (this.activeTab == type) return;
      this.activeTab = type;
      this.getScreenData();
    },
    getStoryData() {
      let startTime = moment();
      let endTime = moment();
      if (this.activeTabs == "本周") {
        startTime = moment().startOf("isoWeek");
        endTime = moment().endOf("isoWeek");
      } else if (this.activeTabs == "本月") {
        startTime = moment().startOf("month");
        endTime = moment().endOf("month");
      } else if (this.activeTabs == "本季度") {
        startTime = moment().startOf("quarter");
        endTime = moment().endOf("quarter");
      } else if (this.activeTabs == "本年") {
        startTime = moment().startOf("year");
        endTime = moment().endOf("year");
      }
      let time =
        startTime.format("YYYY-MM-DD") + " - " + endTime.format("YYYY-MM-DD");
      getStoryList({
        time: time,
      }).then((res) => {
        this.scrollData = res;
      });
    },
    getScreenData() {
      let params = {
@@ -686,7 +748,7 @@
      this.$router.push({
        path: "/workList/detail",
        query: {
          id: item.id,
          id: item,
        },
      });
    },
@@ -1332,4 +1394,32 @@
.thisBox:hover .hoverBox {
  display: block;
}

.searchTabs {
  background: rgba(2, 0, 77, 0.8);
  box-shadow: inset 0px 0px 34px 0px rgba(17, 40, 255, 0.66);
  font-size: 12px;
  color: rgba(255, 255, 255, 0.8);
  font-family: "Source Han Sans CN Normal";
  text-align: center;
  flex-shrink: 0;

  div {
    padding: 2px;
    width: 50px;
    cursor: pointer;
    line-height: 24px;
    border: 1px solid #0d53b7;

    &:hover {
      background: #017be7;
      color: #ffffff;
    }
  }

  .activeTabs {
    background: #017be7;
    color: #ffffff;
  }
}
</style>

 screen/src/view/home/service.js

@@ -5,4 +5,25 @@
    method: 'post',
    data
  })
}

export const getStoryList = async (data) => {
  return request(`/dashboard-statistics/getStoryList`, {
    method: 'post',
    data
  })
}

export const getWorkPresentationList = async (data) => {
  return request(`/work-presentation/getWorkPresentationList`, {
    method: 'post',
    data
  })
}

export const getProjectSelect = async (params) => {
  return request(`/project/list`, {
    method: 'get',
    params
  })
}

 screen/src/view/login/index.vue

@@ -348,6 +348,7 @@
                    );
                    localStorage.setItem("clientName", r.name);
                    localStorage.setItem("clientLogo", r.logo);
                    localStorage.setItem("clientId", re[0].id);
                    localStorage.setItem(
                      "permissionProject",
                      JSON.stringify(
@@ -428,6 +429,7 @@
          );
          localStorage.setItem("clientName", re.name);
          localStorage.setItem("clientLogo", re.logo);
          localStorage.setItem("clientId", account.id);
          localStorage.setItem(
            "permissionProject",
            JSON.stringify(

 screen/src/view/workList/index.vue

@@ -36,81 +36,49 @@
            />
          </div>
          <div
            @click="handleClick(1)"
            class="flex a-center j-between px--20 w--300 h--40 relative bgcolor1 picker"
            @click="handleClick"
            class="flex a-center j-between px--20 w--350 h--40 relative bgcolor1 picker"
          >
            <el-date-picker
              v-model="dateTime"
              ref="datetime1"
              type="datetime"
              v-model="monthrange"
              ref="monthrangeRef"
              type="daterange"
              placeholder=""
            >
            </el-date-picker>
            <div
              class="absolute w100 h100 flex a-center c-fff fs--14 SHS"
              style="width: calc(100% - 20px)"
              v-if="dateTxt"
            >
              {{ dateTxt }}
            <div class="absolute w100 h100 flex a-center c-fff fs--14 SHS">
              <div class="flex a-center flex1 shrink0 gap--13">
                <img
                  src="../../assets/img/home/Shape@2x (6).png"
                  class="w--13 h--13 shrink0"
                />
                <div style="width: calc(100% - 20px)" v-if="dateTxt1">
                  {{ dateTxt1 }}
                </div>
                <div v-else>请选择日期</div>
              </div>
              <div class="flex a-center flex1 shrink0 gap--13">
                <img
                  src="../../assets/img/home/Shape@2x (6).png"
                  class="w--13 h--13 shrink0"
                />
                <div style="width: calc(100% - 20px)" v-if="dateTxt2">
                  {{ dateTxt2 }}
                </div>
                <div v-else>请选择日期</div>
              </div>
            </div>
            <div
              v-else
              class="absolute w100 h100 flex a-center c-fff fs--14 SHSR"
            >
              请选择日期
            </div>
            <img
              src="../../assets/img/home/Shape@2x (6).png"
              class="w--13 h--13 shrink0"
            />
          </div>
          <div
            @click="handleClick(2)"
            class="flex a-center j-between px--20 w--300 h--40 relative bgcolor1 picker"
          >
            <el-date-picker
              v-model="dateTime"
              ref="datetime2"
              type="datetime"
              placeholder=""
            >
            </el-date-picker>
            <div
              class="absolute w100 h100 flex a-center c-fff fs--14 SHS"
              style="width: calc(100% - 20px)"
              v-if="dateTxt"
            >
              {{ dateTxt }}
            </div>
            <div
              v-else
              class="absolute w100 h100 flex a-center c-fff fs--14 SHSR"
            >
              请选择日期
            </div>
            <img
              src="../../assets/img/home/Shape@2x (6).png"
              class="w--13 h--13 shrink0"
            />
          </div>
          <div
            class="flex a-center j-between w--300 pl--20 h--40 relative bgcolor1 searchBox"
          >
            <el-select
            <el-input
              filterable
              v-model="projectId"
              v-model="searchParams.content"
              placeholder="请输入搜索内容"
              class="flex1"
            >
              <el-option
                v-for="item in [1, 2]"
                :key="item"
                :label="item"
                :value="item"
              >
              </el-option>
            </el-select>
            <div class="btn SHSR">搜索</div>
            />
            <div @click="getlist" class="btn SHSR">搜索</div>
          </div>
        </div>
        <div
@@ -126,7 +94,7 @@
      </div>
      <!-- 表格 -->
      <CustomTable
        :data="[{ projectName: '项目777' }, { projectName: '项目2' }]"
        :data="listData"
        height="800"
        style="border: 2px solid #3d7fff"
      >
@@ -135,46 +103,56 @@
            {{ $index + 1 }}
          </template>
        </el-table-column>
        <el-table-column label="标题" prop="projectName" />
        <el-table-column label="简介" prop="projectName" />
        <el-table-column label="图片" prop="projectName">
        <el-table-column label="标题" prop="title" />
        <el-table-column label="简介" prop="intro" />
        <el-table-column label="图片" prop="img">
          <template #default="{ row }"
            ><div
              class="btnColor cursor-pointer"
              :class="false && 'disableColor'"
              @click="previewVisible = true"
              :class="!row.img && 'disableColor'"
              @click="openImgDialog(row.img)"
            >
              1张
              {{ row.img.split(",").length }}张
            </div>
          </template>
        </el-table-column>
        <el-table-column label="类型" prop="projectName" />
        <el-table-column label="上传时间" prop="projectName" />
        <el-table-column label="状态" prop="projectName" />
        <el-table-column label="类型">
          <template> 视察工作 </template>
        </el-table-column>
        <el-table-column label="上传时间" prop="createTime" />
        <el-table-column label="状态" prop="state">
          <template #default="{ row }">
            <div>{{ ["展示", "隐藏"][row.state - 1] }}</div>
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template #default="{ row }">
            <el-button type="text" class="btnColor" @click="toDetail(row)"
              >详情</el-button
            >
            <el-button type="text" class="btnColor" @click="editForm(row)">编辑</el-button>
            <el-button type="text" class="btnColor" @click="editForm(row)"
              >编辑</el-button
            >
            <el-button type="text" class="btnColor">删除</el-button>
            <el-button type="text" class="btnColor">隐藏</el-button>
          </template>
        </el-table-column>
      </CustomTable>
      <CustomPagination
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page="currentPage"
        :page-sizes="[100, 200, 300, 400]"
        :page-size="10"
        :total="400"
      />
      <div v-if="totalSizes">
        <CustomPagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[100, 200, 300, 400]"
          :page-size="searchParams.pageSize"
          :total="totalSizes"
        />
      </div>
    </div>
    <!-- 图片预览 -->
    <CustomPreview
      :show="previewVisible"
      :imgArr="[]"
      :imgArr="imgArr"
      @close="previewVisible = false"
    />
    <!-- 新增/编辑 -->
@@ -188,7 +166,7 @@
        <div>
          <div class="SHSR fs--16 lh--16 mb--17 color1">工作标题：</div>
          <input
            v-model="peopleName"
            v-model="formData.title"
            placeholder="请输入"
            class="w100 h--60 fs--14 SHSR py--23 px--21 bgcolor5 c-fff"
          />
@@ -200,15 +178,15 @@
          >
            <el-select
              filterable
              v-model="projectId"
              v-model="formData.type"
              placeholder="请选择工作类型"
              class="formSelect flex1"
            >
              <el-option
                v-for="item in [1, 2]"
                :key="item"
                :label="item"
                :value="item"
                v-for="item in [{ label: '视察工作', value: 1 }]"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
@@ -221,38 +199,54 @@
        <div class="mt--30">
          <div class="SHSR fs--16 lh--16 mb--17 color1">工作简介：</div>
          <textarea
            v-model="peopleName"
            v-model="formData.intro"
            placeholder="请输入"
            class="w100 h--120 fs--14 SHSR py--23 px--21 bgcolor5 c-fff"
          />
        </div>
        <div class="mt--30">
          <div class="SHSR fs--16 lh--16 mb--17 color1">工作图片：</div>
          <div class="flex gap--10">
            <el-image
              v-for="(item, index) in fileList"
              :key="index"
              :src="item.url"
              class="w--100 h--100 fileListBox"
              :preview-src-list="[item.url]"
          <div class="SHSR fs--16 lh--16 mb--17 color1">是否展示：</div>
          <div
            class="flex a-center j-between w100 pl--18 pr--15 h--60 SHSR fs--14 c-fff bgcolor5 searchBox"
          >
            <el-select
              filterable
              v-model="formData.state"
              placeholder="请选择是否展示"
              class="formSelect flex1"
            >
              <el-option
                v-for="item in [
                  { label: '展示', value: 1 },
                  { label: '隐藏', value: 2 },
                ]"
                :key="item.value"
                :label="item.label"
                :value="item.value"
              >
              </el-option>
            </el-select>
            <img
              src="../../assets/img/down-circle@2x.png"
              class="w--15 h--16 shrink0"
            />
          </div>
        </div>
        <div class="mt--30">
          <div class="SHSR fs--16 lh--16 mb--17 color1">工作图片：</div>
          <div class="">
            <el-upload
              action="https://jsonplaceholder.typicode.com/posts/"
              :action="VUE_APP_BASE_URL + '/open/file/upload'"
              :headers="uploadHeaders"
              :before-upload="beforeUpload"
              :limit="5"
              accept="image/png, image/jpeg, image/gif"
              :show-file-list="false"
              :on-success="handleSuccess"
              :on-preview="handlePictureCardPreview"
              :on-remove="handleRemove"
              list-type="picture-card"
              :file-list="fileList"
            >
              <div
                class="flex a-center flex-column gap--15 px--20 py--20 border1 br--8 uploadBox"
              >
                <img
                  src="../../assets/img/home/89Combined Shape@2x.png"
                  class="w--18 h--18"
                />
                <div class="c-fff fs--16">上传图片</div>
              </div>
            </el-upload>
          </div>
          <div class="color1 mt--10 fs--16 SHSR">
@@ -275,45 +269,159 @@
        </div>
      </div>
    </CustomDialog>
    <el-dialog :visible.sync="dialogVisible">
      <img width="100%" :src="dialogImageUrl" alt="" />
    </el-dialog>
  </div>
</template>

<script>
import HeaderBox from "../header/index.vue";
import moment from "moment";
import { getWorkPresentationList, addWorkPresentation } from "./service";
export default {
  components: { HeaderBox },
  props: {},
  data() {
    return {
      dateTime: null,
      VUE_APP_BASE_URL: process.env.VUE_APP_BASE_URL,
      uploadHeaders: {
        Authorization: localStorage.getItem("token"),
      },
      monthrange: null,
      dateTxt1: "",
      dateTxt2: "",
      projectId: null,
      dateTxt: "",
      currentPage: 1,
      previewVisible: false,
      imgArr: [],
      formVisible: false,
      peopleName: "",
      fileList: [],
      totalSizes: null,
      searchParams: {
        pageNum: 1,
        pageSize: 10,
        state: "",
        time: "",
        type: "",
        clientId: localStorage.getItem("clientId"),
        content: "",
      },
      formData: {},
      listData: [],
      dialogImageUrl: "",
      dialogVisible: false,
    };
  },
  computed: {},
  watch: {
    dateTime: {
    monthrange: {
      handler(newVal, oldVal) {
        if (newVal) {
          this.dateTxt = moment(newVal).format("YYYY年MM月DD日 HH:mm:ss");
        if (newVal && newVal.length === 2) {
          this.dateTxt1 = moment(newVal[0]).format("YYYY年MM月DD日");
          this.dateTxt2 = moment(newVal[1]).format("YYYY年MM月DD日");
          this.searchParams.time =
            moment(newVal[0]).format("YYYY-MM-DD") +
            " - " +
            moment(newVal[1]).format("YYYY-MM-DD");
        } else {
          this.dateTxt1 = "";
          this.dateTxt2 = "";
          this.searchParams.time = "";
        }
      },
      immediate: true,
    },
  },
  created() {},
  created() {
    this.getlist();
  },
  mounted() {},
  methods: {
    openImgDialog(img) {
      this.imgArr = img.split(",");
      this.previewVisible = true;
    },

    saveForm() {
      if (!this.formData.title) {
        Message({
          message: "请输入工作标题",
          type: "warning",
          duration: 1500,
        });
        return;
      }
      if (!this.formData.type) {
        Message({
          message: "请选择工作类型",
          type: "warning",
          duration: 1500,
        });
        return;
      }
      if (!this.formData.intro) {
        Message({
          message: "请输入工作标简介",
          type: "warning",
          duration: 1500,
        });
        return;
      }
      if (!this.formData.state) {
        Message({
          message: "请选择展示状态",
          type: "warning",
          duration: 1500,
        });
        return;
      }
      if (!this.fileList.length) {
        Message({
          message: "请上传工作图片",
          type: "warning",
          duration: 1500,
        });
        return;
      }

      let obj = {
        ...this.formData,
        clientId: localStorage.getItem("clientId"),
      };
      obj.img = this.fileList.map((item) => item.url).join(",");
      addWorkPresentation(obj).then((res) => {
        this.closeForm();
        this.getlist();
      });
    },

    getlist() {
      getWorkPresentationList(this.searchParams).then((res) => {
        this.totalSizes = res.total;
        this.listData = res.records;
      });
    },

    handleRemove(file, fileList) {
      console.log(file, fileList);
      this.fileList = this.fileList.filter((item) => {
        return item.url != file.url;
      });
    },

    handlePictureCardPreview(file) {
      this.dialogImageUrl = file.url;
      this.dialogVisible = true;
    },

    handleSuccess(response, file, fileList) {
      console.log(response, file, fileList);
      this.fileList = fileList;
      this.fileList.push({
        url: process.env.VUE_APP_IMAGE_BASE_URL + response.data,
      });
      this.$message.success("上传成功");
    },

@@ -329,15 +437,19 @@
    },

    editForm(row) {
      this.formData = { ...row };
      this.fileList = row.img.split(",").map((item) => {
        return {
          url: item,
        };
      });
      this.formVisible = true;
    },

    closeForm() {
      this.formVisible = false;
    },

    saveForm() {
      this.closeForm();
      this.formData = {};
      this.fileList = [];
    },

    toDetail(row) {
@@ -360,15 +472,15 @@
    },

    handleSizeChange(val) {
      console.log(`每页 ${val} 条`);
      this.searchParams.pageSize = val;
    },

    handleCurrentChange(val) {
      console.log(`当前页: ${val}`);
      this.searchParams.pageNum = val;
    },

    handleClick(type) {
      this.$refs[`datetime${type}`].focus();
      this.$refs.monthrangeRef.focus();
    },

    backFun() {
@@ -378,6 +490,31 @@
};
</script>
<style scoped lang="less">
// <div
//   class="flex a-center flex-column gap--15 px--20 py--20 border1 br--8 uploadBox"
// >
//   <img
//     src="../../assets/img/home/89Combined Shape@2x.png"
//     class="w--18 h--18"
//   />
//   <div class="c-fff fs--16">上传图片</div>
// </div>

::v-deep .el-upload--picture-card {
  border: 2px dashed #8c939d;
  background-color: transparent;

  &:hover {
    border-color: #00ebfc !important;
  }

  &::after {
    content: "上传图片";
    color: #fff;
    font-size: 16px;
    line-height: 16px;
  }
}
.border1 {
  border: 2px dashed #8c939d;
}

 screen/src/view/workList/service.js

New file
@@ -0,0 +1,15 @@
import request from '@/utils/request'

export const getWorkPresentationList = async (data) => {
  return request(`/work-presentation/getWorkPresentationList`, {
    method: 'post',
    data
  })
}

export const addWorkPresentation = async (data) => {
  return request(`/work-presentation/addWorkPresentation`, {
    method: 'post',
    data
  })
}