工程现场 大屏界面修改

src/views/pad/engineering/issueDealDia.vue

@@ -1,306 +1,320 @@
 <template>
-    <div class="issueDia">
-      <div style="width: 100%;height: 35px;margin-bottom: 20px;display: flex;justify-content: center">
-        <img src="../../../assets/zhang/engineer/issueTitle.png">
-        <div class="myTitle">问题处理</div>
-        <div style=""></div>
-        <div style="width: 20px;height: 20px;position: absolute;top: 5px;right: 15px" @click="close">
-          <img src="../../../assets/zhang/engineer/ownCloseBtn.png">
-        </div>
-      </div>
-      <div v-if="dialogVisible" style="z-index: 10000;display: flex;justify-content: center;align-items: center;background-color: transparent;position: absolute;width: 100%;height: 100%" @click="handleCloseView">
-        <img width="600px" :src="dialogImageUrl" alt="">
+  <div class="issueDia">
+    <div style="width: 100%;height: 35px;margin-bottom: 20px;display: flex;justify-content: center">
+      <img src="../../../assets/zhang/engineer/issueTitle.png">
+      <div class="myTitle">问题处理</div>
+      <div style=""></div>
+      <div style="width: 20px;height: 20px;position: absolute;top: 5px;right: 15px" @click="close">
+        <img src="../../../assets/zhang/engineer/ownCloseBtn.png">
       </div>
+    </div>
+    <div v-if="dialogVisible" style="z-index: 10000;display: flex;justify-content: center;align-items: center;background-color: transparent;position: absolute;width: 100%;height: 100%" @click="handleCloseView">
+      <img width="600px" :src="dialogImageUrl" alt="">
+    </div>
 
 
-      <div class="me">
-        <div style="width: 35%;color: #00ffff;">
-          <!--        <div style="text-align: right;margin-bottom: 10px;height: 32px;line-height: 32px">时间：</div>-->
-          <div style="text-align: right;margin-bottom: 25px;height: 32px;line-height: 32px">标题：</div>
-          <div style="text-align: right;margin-bottom: 125px;">内容：</div>
-          <div style="text-align: right">反馈资料清单：</div>
+    <div class="me">
+      <div style="width: 35%;color: #00ffff;">
+        <div style="text-align: right;margin-bottom: 10px;height: 32px;line-height: 32px">时间：</div>
+        <div style="text-align: right;margin-bottom: 25px;height: 32px;line-height: 32px">标题：</div>
+        <div style="text-align: right;margin-bottom: 125px;">内容：</div>
+        <div style="text-align: right">反馈资料清单：</div>
+      </div>
+      <div style="width: 65%;">
+        <el-date-picker
+          style="margin-bottom: 10px"
+          v-model="value"
+          type="date"
+          placeholder="选择日期"
+          readonly
+        >
+        </el-date-picker>
+        <div>
+          <el-input v-model="title" placeholder="请输入标题" style="margin-bottom: 20px;width: 220px" readonly ></el-input>
         </div>
-        <div style="width: 65%;">
-                  <el-date-picker
-                    style="margin-bottom: 10px"
-                    v-model="value"
-                    type="date"
-                    placeholder="选择日期">
-                  </el-date-picker>
-          <div>
-            <el-input placeholder="请输入标题" style="margin-bottom: 20px;width: 220px"></el-input>
-          </div>
 
-          <el-input type="textarea" :rows=6 placeholder="请输入内容" resize="none" style="margin-bottom: 20px;width: 350px"></el-input>
-
-          <div style="width: 130px;height: 130px;background: rgba(15, 86, 86, 0.54);margin-bottom: 10px;border-radius: 8px;color: #00ffff;position: relative;font-size: 45px;display: flex;align-items: center;border: 1px solid #00ffff4d;">
-            <i v-if="!fileFlag" class="el-icon-plus" style="position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);"></i>
-            <input v-if="!fileFlag" type="file" ref="fileInput" @change="handleFileChange" style="display: none;position: absolute;left: -1000px"/>
-            <div v-if="!fileFlag" @click="triggerFileInput" style="width: 100%;height: 100%;cursor: pointer;position: absolute;"></div>
-            <div class="sth" v-if="fileFlag">
-              <div style="width: 0;height: 0;border-left: 30px solid transparent;border-top: 30px solid #000000;position: absolute;top: 0;right: 0">
-              </div>
-              <div class="close-icon" @click="handleRemove"></div>
-              <div style="width: 100%;height: 50%">
-                <div style="width: 100%;height: 50%;display: flex;justify-content: center;align-items: start">
-                  <i class="el-icon-view" @click="handlePictureCardPreview"></i>
-                </div>
-                <div style="width: 100%;height: 50%;display: flex;justify-content: center;color: #00FFFF;font-size: 14px;align-items: end">预览</div>
-              </div>
+        <el-input v-model="description" type="textarea" :rows=6 placeholder="请输入内容" resize="none" style="margin-bottom: 20px;width: 350px" readonly></el-input>
+
+        <div style="width: 130px;height: 130px;background: rgba(15, 86, 86, 0.54);margin-bottom: 10px;border-radius: 8px;color: #00ffff;position: relative;font-size: 45px;display: flex;align-items: center;border: 1px solid #00ffff4d;">
+          <i v-if="!fileFlag"  class="el-icon-plus" style="position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);"></i>
+          <input type="file" ref="fileInput" @change="handleFileChange" style="display: none"  accept=".docx,.xlsx"/>
+          <div @click="triggerFileInput" style="width: 100%;height: 100%;cursor: pointer;position: absolute;"></div>
+          <div class="sth" v-if="fileFlag">
+            <div style="width: 0;height: 0;border-left: 30px solid transparent;border-top: 30px solid #000000;position: absolute;top: 0;right: 0"></div>
+            <div class="close-icon" @click="handleRemove"></div>
+            <div style="width: 100%;height: 100%;display: flex;align-items: center;justify-content: center">
+              <div style="color: #00FFFF;font-size: 14px">{{ fileName }}</div>
             </div>
-            <img width="100%" :src="dialogImageUrl" v-if="fileFlag" style="height: 100%;object-fit: cover;">
           </div>
+          <!-- <img width="100%" :src="dialogImageUrl" v-if="fileFlag" style="height: 100%;object-fit: cover;"> -->
+        </div>
 
-          <div style="margin-bottom: 20px;color: #00ffff80;font-family: PingFangSC-Regular;font-weight: 400;font-size: 14px;">支持.docx、.xlsx格式</div>
+        <div style="margin-bottom: 20px;color: #00ffff80;font-family: PingFangSC-Regular;font-weight: 400;font-size: 14px;">支持.docx、.xlsx格式</div>
 
-          <el-button @click="changeIssueStatus" style="width: 100px;margin-top: 10px;margin-right: 10px;border: 1px solid #00FFFF;border-radius: 2px;">提交</el-button>
-          <el-button @click="close" style="width: 100px;margin-top: 10px;background: rgba(15, 86, 86, 0.54);color: #00ffff;border: 1px solid #00FFFF;border-radius: 2px;">取消</el-button>
-        </div>
+        <el-button @click="changeIssueStatus" style="width: 100px;margin-top: 10px;margin-right: 10px;border: 1px solid #00FFFF;border-radius: 2px;">提交</el-button>
+        <el-button @click="close" style="width: 100px;margin-top: 10px;background: rgba(15, 86, 86, 0.54);color: #00ffff;border: 1px solid #00FFFF;border-radius: 2px;">取消</el-button>
       </div>
     </div>
-  </template>
-
-  <script>
-  import { changeIssueStatus, getFoodsList } from '@/api/screen/service'
-  import pinyin from "../data/pinyin.js";
-
-  export default {
-    data() {
-      return {
-        fileFlag: false,
-        fileList: [],
-        dialogImageUrl: '',
-        dialogVisible: false,
-        disabled: false,
-        value:"2020-01-01",
-        check:false,
-        checked:false
-      };
+  </div>
+</template>
+
+<script>
+import { changeIssueStatus } from "@/api/screen/service";
+import pinyin from "../data/pinyin.js";
+
+export default {
+  props: {
+    getProList: {
+      type: String,
+      default: '',
     },
-    mounted() {},
-    methods: {
-      triggerFileInput(){
-        this.$refs.fileInput.click();
-      },
-
-      changeIssueStatus() {
-        if (this.file == null){
-          return
-        }
-        // 添加二次校验
-        if (!this.fileName.endsWith('.docx') && !this.fileName.endsWith('.xlsx')) {
-          this.$message.error('文件格式不符合要求');
-          return;
-        }
-        const issueData = {
-          createDate:this.value,
-          title:this.title,
-          description:this.description,
-          id:this.getProList.id,
-          status: 1,
-        };
-
-        const formData = new FormData();
-        formData.append("file", this.file);
-        formData.append("issue", new Blob([JSON.stringify(issueData)], { type: "application/json" }));
-
-        changeIssueStatus(formData).then((res) => {
-          if (Number(res.code) === 200) {
-            this.close();
-          }
-        }).catch((err) => {
-          console.error("提交失败：", err);
-        });
-      },
-
-      handleFileChange(event) {
-        const file = event.target.files[0];
-        if (!file) return;
-
-        // 添加文件类型白名单
-        const allowedExtensions = ['.docx', '.xlsx'];
-        const fileName = file.name.toLowerCase();
-
-        // 校验文件后缀
-        const isValidFile = allowedExtensions.some(ext => fileName.endsWith(ext));
-
-        if (!isValidFile) {
-          this.$message.error('仅支持上传.docx和.xlsx格式文件');
-          this.handleRemove(); // 清空错误文件
-          return;
-        }
+  },
+  data() {
+    return {
+      fileFlag: false,
+      fileList: [],
+      dialogImageUrl: '',
+      dialogVisible: false,
+      disabled: false,
+      value:'',
+      check:false,
+      checked:false,
+      // 新增fileName用于显示文件名
+      fileName: '',
+      // 保存原始File对象
+      selectedFile: null
+    };
+  },
+  mounted() {
+    this.cl()
+
+  },
+  methods: {
+    cl(){
+      // alert(1)
+      this.title = this.getProList.title
+      this.description = this.getProList.description
 
-        // 更新文件状态
-        this.fileName = file.name;
-        this.file = file;
-        this.fileFlag = true;
-
-        // 移除图片预览相关代码
-        this.dialogImageUrl = URL.createObjectURL(file) // 删除这行
-      },
-      handleRemove() {
-        this.fileFlag = false
-        this.dialogImageUrl = ''
-      },
-      handlePictureCardPreview() {
-        this.dialogVisible = true;
-      },
-      handleCloseView() {
-        this.dialogVisible = false;
-      },
-
-      change(){
-        this.checked = !this.check
-      },
-      changed(){
-        this.check = !this.checked
-      },
-      choose(){
-        this.$emit("choose");
-      },
-
-      close() {
-        this.$emit("close");
-      },
+      this.value = this.getProList.createDate
     },
-  };
-  </script>
-
-  <style lang="scss" scoped>
-  .close-icon {
-    position: absolute;
-    right: 2px;
-    top: 3px;
-    width: 15px;
-    height: 15px;
-    cursor: pointer;
-  }
+    triggerFileInput(){
+      this.$refs.fileInput.click();
+    },
+    changeIssueStatus() {
+      if (this.file == null){
+        return
+      }
+      // 添加二次校验
+      if (!this.fileName.endsWith('.docx') && !this.fileName.endsWith('.xlsx')) {
+        this.$message.error('文件格式不符合要求');
+        return;
+      }
+      const issueData = {
+        createDate:this.value,
+        title:this.title,
+        description:this.description,
+        id:this.getProList.id,
+        status: 1,
+      };
 
-  .close-icon::before,
-  .close-icon::after {
-    content: '';
-    position: absolute;
-    top: 50%;
-    left: 50%;
-    width: 10px;
-    height: 1px;
-    background-color: #00FFFF;
-    transform-origin: center;
-    transform: translate(-50%, -50%);
-  }
+      const formData = new FormData();
+      formData.append("file", this.file);
+      formData.append("issue", new Blob([JSON.stringify(issueData)], { type: "application/json" }));
 
-  .close-icon::before {
-    transform: translate(-50%, -50%) rotate(45deg); /* 旋转 45 度 */
-  }
+      changeIssueStatus(formData).then((res) => {
+        if (Number(res.code) === 200) {
+          this.close();
+        }
+      }).catch((err) => {
+        console.error("提交失败：", err);
+      });
+    },
 
-  .close-icon::after {
-    transform: translate(-50%, -50%) rotate(-45deg); /* 旋转 -45 度 */
-  }
+    handleFileChange(event) {
+      const file = event.target.files[0];
+      if (!file) return;
 
-  .myTitle{
-    color: #00F6EC;
-    font-size: 16px;
-    position: absolute;
-    left: 40px;
-    top: 6px;
-  }
-  .me{
-    display: flex;flex-wrap: wrap;justify-content: space-around;height: 100%;overflow: auto;
-  }
-  .me::-webkit-scrollbar {
-    display: none;
-  }
-  .sth{
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    font-size: 22px;
-    cursor: pointer;
-    opacity: 0;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    flex-wrap: wrap;
-    transition: background-color 0.5s ease;
-  }
-  .sth:hover{
-    opacity: 1;
-    background: rgba(5, 28, 38, 0.58);
-  }
+      // 添加文件类型白名单
+      const allowedExtensions = ['.docx', '.xlsx'];
+      const fileName = file.name.toLowerCase();
 
-  .el-scrollbar {
-    background: #15696b;
-    border: 1px solid #00ffff;
-    ul {
-      li {
-        color: #fff;
+      // 校验文件后缀
+      const isValidFile = allowedExtensions.some(ext => fileName.endsWith(ext));
+
+      if (!isValidFile) {
+        this.$message.error('仅支持上传.docx和.xlsx格式文件');
+        this.handleRemove(); // 清空错误文件
+        return;
       }
+
+      // 更新文件状态
+      this.fileName = file.name;
+      this.file = file;
+      this.fileFlag = true;
+
+      // 移除图片预览相关代码
+      this.dialogImageUrl = URL.createObjectURL(file) // 删除这行
+    },
+
+    handleRemove() {
+      this.fileFlag = false;
+      this.fileName = '';
+      this.selectedFile = null;
+      this.$refs.fileInput.value = ''; // 清空文件输入
+    },
+
+    // 移除图片预览相关方法
+
+    handlePictureCardPreview() {
+      this.dialogVisible = true;
+    },
+    handleCloseView() {
+      this.dialogVisible = false;
+    },
+
+    change(){
+      this.checked = !this.check
+    },
+    changed(){
+      this.check = !this.checked
+    },
+    choose(){
+      this.$emit("choose");
+    },
+
+    close() {
+      this.$emit("close");
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.close-icon {
+  position: absolute;
+  right: 2px;
+  top: 3px;
+  width: 15px;
+  height: 15px;
+  cursor: pointer;
+}
+
+.close-icon::before,
+.close-icon::after {
+  content: '';
+  position: absolute;
+  top: 50%;
+  left: 50%;
+  width: 10px;
+  height: 1px;
+  background-color: #00FFFF;
+  transform-origin: center;
+  transform: translate(-50%, -50%);
+}
+
+.close-icon::before {
+  transform: translate(-50%, -50%) rotate(45deg); /* 旋转 45 度 */
+}
+
+.close-icon::after {
+  transform: translate(-50%, -50%) rotate(-45deg); /* 旋转 -45 度 */
+}
+
+.myTitle{
+  color: #00F6EC;
+  font-size: 16px;
+  position: absolute;
+  left: 40px;
+  top: 6px;
+}
+.me{
+  display: flex;flex-wrap: wrap;justify-content: space-around;height: 100%;overflow: auto;
+}
+.me::-webkit-scrollbar {
+  display: none;
+}
+.sth {
+  background: rgba(5, 28, 38, 0.78); // 加深背景提高文字可读性
+
+}
+.sth:hover{
+  opacity: 1;
+  background: rgba(5, 28, 38, 0.58);
+}
+
+.el-scrollbar {
+  background: #15696b;
+  border: 1px solid #00ffff;
+  ul {
+    li {
+      color: #fff;
     }
   }
-  .el-select-dropdown__item.hover,
-  .el-select-dropdown__item:hover {
-    background: #15696b;
-    color: #00ffff;
-  }
-  .el-select-dropdown__item.selected {
-    color: #00ffff;
-  }
-  .el-select .el-input .el-select__caret {
-    display: none;
-  }
-  .issueDia {
-    position: relative;
-    width: 640px;
-    height: 708px;
-    background-size: cover;
+}
+.el-select-dropdown__item.hover,
+.el-select-dropdown__item:hover {
+  background: #15696b;
+  color: #00ffff;
+}
+.el-select-dropdown__item.selected {
+  color: #00ffff;
+}
+.el-select .el-input .el-select__caret {
+  display: none;
+}
+.issueDia {
+  position: relative;
+  width: 640px;
+  height: 708px;
+  background-size: cover;
 
-    background-image: radial-gradient(circle at 50% 50%, #031417b3 0%, #0C1A1A 84%);
-  }
+  background-image: radial-gradient(circle at 50% 50%, #031417b3 0%, #0C1A1A 84%);
+}
 
-  ::v-deep .el-input__inner{
-    color: #00ffff;
-    background-color: rgba(15, 86, 86, 0.54);
-    border: 1px solid #00ffff4d;
-  }
-  ::v-deep .el-textarea__inner{
-    color: #00ffff;
-    background-color: rgba(15, 86, 86, 0.54);
-    border: 1px solid #00ffff4d;
-  }
-  ::v-deep .el-button{
-    font-weight: bold;
-    color: rgba(2, 24, 24, 0.71);
-    background-color: #00ffff;
-  }
-  ::v-deep .el-checkbox__inner{
-    background-color: #15696b;
-  }
-  ::v-deep .is-checked .el-checkbox__inner{
-    color: #00ffff;
-    background-color: #00ffff;
-  }
-  ::v-deep .el-checkbox__inner::after{
-    border-color: rgba(2, 24, 24, 0.71);
-    border-width: 2px;
-  }
-  ::v-deep .el-checkbox__label{
-    color: #15696b;
-  }
-  ::v-deep .is-checked .el-checkbox__label{
-    color: #00ffff;
-  }
-  ::v-deep .el-input__prefix{
-    color: #00F6EC;
-  }
-  ::v-deep .el-input__suffix{
-    color: #00F6EC;
-  }
-  ::v-deep .el-input__inner::placeholder{
-    color: #199294;
-  }
-  ::v-deep .el-textarea__inner::placeholder{
-    color: #199294;
-  }
-  </style>
+::v-deep .el-input__inner{
+  color: #00ffff;
+  background-color: rgba(15, 86, 86, 0.54);
+  border: 1px solid #00ffff4d;
+}
+::v-deep .el-textarea__inner{
+  color: #00ffff;
+  background-color: rgba(15, 86, 86, 0.54);
+  border: 1px solid #00ffff4d;
+}
+::v-deep .el-button{
+  font-weight: bold;
+  color: rgba(2, 24, 24, 0.71);
+  background-color: #00ffff;
+}
+::v-deep .el-checkbox__inner{
+  background-color: #15696b;
+}
+::v-deep .is-checked .el-checkbox__inner{
+  color: #00ffff;
+  background-color: #00ffff;
+}
+::v-deep .el-checkbox__inner::after{
+  border-color: rgba(2, 24, 24, 0.71);
+  border-width: 2px;
+}
+::v-deep .el-checkbox__label{
+  color: #15696b;
+}
+::v-deep .is-checked .el-checkbox__label{
+  color: #00ffff;
+}
+::v-deep .el-input__prefix{
+  color: #00F6EC;
+}
+::v-deep .el-input__suffix{
+  color: #00F6EC;
+}
+::v-deep .el-input__inner::placeholder{
+  color: #199294;
+}
+::v-deep .el-textarea__inner::placeholder{
+  color: #199294;
+}
+</style>
 
 

src/views/pad/engineering/issueListDia.vue

@@ -1,297 +1,301 @@
 <template>
-    <div class="myDia">
-      <!-- 日期选择器和其他操作 -->
-      <div style="margin-bottom: 26px;display: flex;position: relative;width: 100%" class="dataPlicker">
-        <el-date-picker
-          v-model="value"
-          type="date"
-          placeholder="选择日期"
-          @change="handleDateChange">
-        </el-date-picker>
-        <!-- <div style="border: 1px #00ffff solid;display: flex;justify-content: center;align-items: center;margin-left: 10px;width: 100px;color: #00ffff;cursor: pointer" @click="choose">
-          <i class="el-icon-plus"><span style="margin-left: 10px">上报问题</span></i>
-        </div> -->
-        <div style="position: absolute;right: 10px;color: #00ffff;font-size: 25px;cursor: pointer" @click="close">
-          <img src="../../../assets/zhang/engineer/ownCloseBtn.png">
-        </div>
+  <div class="myDia">
+    <!-- 日期选择器和其他操作 -->
+    <div style="margin-bottom: 26px;display: flex;position: relative;width: 100%" class="dataPlicker">
+      <el-date-picker
+        v-model="value"
+        type="date"
+        placeholder="选择日期"
+        @change="handleDateChange">
+      </el-date-picker>
+      <!-- <div style="border: 1px #00ffff solid;display: flex;justify-content: center;align-items: center;margin-left: 10px;width: 100px;color: #00ffff;cursor: pointer" @click="choose">
+        <i class="el-icon-plus"><span style="margin-left: 10px">上报问题</span></i>
+      </div> -->
+      <div style="position: absolute;right: 10px;color: #00ffff;font-size: 25px;cursor: pointer" @click="close">
+        <img src="../../../assets/zhang/engineer/ownCloseBtn.png">
       </div>
+    </div>
 
-      <!-- 表格数据 -->
-      <div class="flex-container">
-        <div class="header">
-          <div class="flex-column" style="width: 15%">时间</div>
-          <div class="flex-column" style="width: 15%">标题</div>
-          <div class="flex-column" style="width: 30%">问题内容</div>
-          <div class="flex-column" style="width: 15%">发起人</div>
-          <div class="flex-column" style="width: 10%">问题状态</div>
-          <div class="flex-column" style="width: 15%">操作</div>
+    <!-- 表格数据 -->
+    <div class="flex-container">
+      <div class="header">
+        <div class="flex-column" style="width: 15%">时间</div>
+        <div class="flex-column" style="width: 15%">标题</div>
+        <div class="flex-column" style="width: 30%">问题内容</div>
+        <div class="flex-column" style="width: 15%">发起人</div>
+        <div class="flex-column" style="width: 10%">问题状态</div>
+        <div class="flex-column" style="width: 15%">操作</div>
+      </div>
+      <div class="flex-row" v-for="(item, index) in paginatedData" :key="index">
+        <div class="flex-column" style="width: 15%">{{ item.createDate }}</div>
+        <div class="flex-column" style="width: 15%">{{ item.title }}</div>
+        <div class="flex-column" style="width: 30%">{{ item.description }}</div>
+        <div class="flex-column" style="width: 15%">{{ item.person }}</div>
+        <div class="flex-column" style="width: 10%">
+          <span v-if="item.status == 1"><span style="color: #67C23A">●</span> 已完结</span>
+          <span v-if="item.status == 0"><span style="color: #FAAD14">●</span> 处理中</span>
         </div>
-        <div class="flex-row" v-for="(item, index) in paginatedData" :key="index">
-          <div class="flex-column" style="width: 15%">{{ item.createDate }}</div>
-          <div class="flex-column" style="width: 15%">{{ item.title }}</div>
-          <div class="flex-column" style="width: 30%">{{ item.description }}</div>
-          <div class="flex-column" style="width: 15%">{{ item.person }}</div>
-          <div class="flex-column" style="width: 10%">
-            <span v-if="item.status == 1"><span style="color: #67C23A">●</span> 已完结</span>
-            <span v-if="item.status == 0"><span style="color: #FAAD14">●</span> 处理中</span>
-          </div>
-          <div class="flex-column" style="width: 15%">
-            <span v-if="item.status == 1"></span>
-            <span v-if="item.status == 0" style="color: #00FFFF;cursor: pointer" @click="togglePost(item)">变更状态</span>
-            <div v-if="item.status == 0&&item.isShowPost" class="wanjie" @click="changeIssueStatus(item.id)">已完结</div>
-          </div>
+        <div class="flex-column" style="width: 15%">
+          <span v-if="item.status == 1"></span>
+          <span v-if="item.status == 0" style="color: #00FFFF;cursor: pointer" @click="dealIssue(item)">变更状态</span>
+          <div v-if="item.status == 0&&item.isShowPost" class="wanjie" @click="changeIssueStatus(item.id)">已完结</div>
         </div>
       </div>
+    </div>
 
-      <!-- 分页组件 -->
-      <div style="width: 100%;display: flex;justify-content: center;align-items: center;margin-top: 10px;">
-        <el-pagination
-          background
-          layout="prev, pager, next"
-          :current-page="currentPage"
-          :page-size="pageSize"
-          :total="total"
-          @current-change="handlePageChange">
-        </el-pagination>
-      </div>
+    <!-- 分页组件 -->
+    <div style="width: 100%;display: flex;justify-content: center;align-items: center;margin-top: 10px;">
+      <el-pagination
+        background
+        layout="prev, pager, next"
+        :current-page="currentPage"
+        :page-size="pageSize"
+        :total="total"
+        @current-change="handlePageChange">
+      </el-pagination>
     </div>
-  </template>
+  </div>
+</template>
 
-  <script>
-  import { getIssueListLastWeek,changeIssueStatus } from '@/api/screen/service';
+<script>
+import { getIssueListLastWeek,changeIssueStatus } from '@/api/screen/service';
 
-  export default {
-    name: "UnitCamera",
-    props: {
-      appOrg: {
-        type: String,
-        default: "10001",
-      },
-    },
-    data() {
-      return {
-        value: null,
-        getProList: [],
-        // showPost:false,
-        currentPage: 1,
-        pageSize: 10,
-        total: 0,
-      };
+export default {
+  name: "UnitCamera",
+  props: {
+    appOrg: {
+      type: String,
+      default: "10001",
     },
-    computed: {
-      paginatedData() {
-        const start = (this.currentPage - 1) * this.pageSize;
-        const end = start + this.pageSize;
-        return this.getProList.slice(start, end);
-      },
-    },
-    created() {
-      this.getIssueListLastWeek();
+  },
+  data() {
+    return {
+      value: null,
+      getProList: [],
+      // showPost:false,
+      currentPage: 1,
+      pageSize: 10,
+      total: 0,
+    };
+  },
+  computed: {
+    paginatedData() {
+      const start = (this.currentPage - 1) * this.pageSize;
+      const end = start + this.pageSize;
+      return this.getProList.slice(start, end);
     },
-    mounted() {
+  },
+  created() {
+    this.getIssueListLastWeek();
+  },
+  mounted() {
     const style = document.createElement('style');
     style.innerHTML = `
-      .el-picker-panel.el-date-picker {
-        background: #062223 !important;
-      }
-    `;
+    .el-picker-panel.el-date-picker {
+      background: #062223 !important;
+    }
+  `;
     document.head.appendChild(style);
   },
   methods: {
-      // 获取近一周问题列表
-      getIssueListLastWeek() {
-        if (this.value) {
-          const selectedDate = this.formatDate(this.value);
-          getIssueListLastWeek(this.$props.appOrg, selectedDate).then((res) => {
-            if (Number(res.code) === 200) {
-              this.getProList = (res.data || []).map(item => ({
-                ...item,
-                isShowPost: false
-              }));
-              this.total = this.getProList.length;
-            }
-          });
-        } else {
-          getIssueListLastWeek(this.$props.appOrg).then((res) => {
-            if (Number(res.code) === 200) {
-              this.getProList = (res.data || []).map(item => ({
-                ...item,
-                isShowPost: false
-              }));
-              this.total = this.getProList.length;
-            }
-          });
-        }
-      },
-      // 日期格式化方法
-      formatDate(date) {
-        const d = new Date(date);
-        const year = d.getFullYear();
-        const month = String(d.getMonth() + 1).padStart(2, "0");
-        const day = String(d.getDate()).padStart(2, "0");
-        return `${year}-${month}-${day}`;
-      },
-      // 处理日期选择器变化
-      handleDateChange() {
-        this.currentPage = 1; // 重置分页
-        this.getIssueListLastWeek(); // 刷新数据
-      },
-      togglePost(item) {
-        // 关闭所有其他条目
-        this.getProList.forEach(i => {
-          if (i.id !== item.id) i.isShowPost = false;
-        });
-        // 切换当前条目状态
-        item.isShowPost = !item.isShowPost;
-      },
-      changeIssueStatus(f) {
-        const issueData = {
-          id: f,
-          status: 1,
-        };
+    dealIssue(y){
+      this.$emit('dealIssue',y)
+    },
 
-        changeIssueStatus(issueData).then((res) => {
+    // 获取近一周问题列表
+    getIssueListLastWeek() {
+      if (this.value) {
+        const selectedDate = this.formatDate(this.value);
+        getIssueListLastWeek(this.$props.appOrg, selectedDate).then((res) => {
+          if (Number(res.code) === 200) {
+            this.getProList = (res.data || []).map(item => ({
+              ...item,
+              isShowPost: false
+            }));
+            this.total = this.getProList.length;
+          }
+        });
+      } else {
+        getIssueListLastWeek(this.$props.appOrg).then((res) => {
           if (Number(res.code) === 200) {
-            this.getIssueListLastWeek(); // 刷新数据
+            this.getProList = (res.data || []).map(item => ({
+              ...item,
+              isShowPost: false
+            }));
+            this.total = this.getProList.length;
           }
-        }).catch((err) => {
-          console.error("修改状态失败：", err);
         });
-      },
-      close() {
-        this.$emit("close");
-      },
-      handlePageChange(page) {
-        this.currentPage = page; // 更新当前页码
-      },
+      }
     },
-  };
-  </script>
-  <style lang="scss" scoped>
-  .me{
-    display: flex;flex-wrap: wrap;justify-content: space-around;height: 380px;overflow: auto;
-  }
-  .me::-webkit-scrollbar {
-    display: none;
-  }
+    // 日期格式化方法
+    formatDate(date) {
+      const d = new Date(date);
+      const year = d.getFullYear();
+      const month = String(d.getMonth() + 1).padStart(2, "0");
+      const day = String(d.getDate()).padStart(2, "0");
+      return `${year}-${month}-${day}`;
+    },
+    // 处理日期选择器变化
+    handleDateChange() {
+      this.currentPage = 1; // 重置分页
+      this.getIssueListLastWeek(); // 刷新数据
+    },
+    togglePost(item) {
+      // 关闭所有其他条目
+      this.getProList.forEach(i => {
+        if (i.id !== item.id) i.isShowPost = false;
+      });
+      // 切换当前条目状态
+      item.isShowPost = !item.isShowPost;
+    },
+    changeIssueStatus(f) {
+      const issueData = {
+        id: f,
+        status: 1,
+      };
 
-  .flex-container {
-    width: 100%;
-    height: 566px;
-    font-family: PingFangSC-Medium;
-    font-weight: 500;
-  }
+      changeIssueStatus(issueData).then((res) => {
+        if (Number(res.code) === 200) {
+          this.getIssueListLastWeek(); // 刷新数据
+        }
+      }).catch((err) => {
+        console.error("修改状态失败：", err);
+      });
+    },
+    close() {
+      this.$emit("close");
+    },
+    handlePageChange(page) {
+      this.currentPage = page; // 更新当前页码
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.me{
+  display: flex;flex-wrap: wrap;justify-content: space-around;height: 380px;overflow: auto;
+}
+.me::-webkit-scrollbar {
+  display: none;
+}
 
-  .header{
-    display: flex;  /* 每行使用 flexbox 布局 */
-    position: relative;
-    background-color: rgba(21, 105, 107, 0.5);
-  }
+.flex-container {
+  width: 100%;
+  height: 566px;
+  font-family: PingFangSC-Medium;
+  font-weight: 500;
+}
 
-  .flex-row {
-    display: flex;  /* 每行使用 flexbox 布局 */
-    position: relative;
-  }
+.header{
+  display: flex;  /* 每行使用 flexbox 布局 */
+  position: relative;
+  background-color: rgba(21, 105, 107, 0.5);
+}
 
-  .flex-row::before{
-    content: "";
-    height: 15px;
-    border-left: 2px #00FFFF solid;
-    position: absolute;
-    left: 0;
-    top: 15px
-  }
+.flex-row {
+  display: flex;  /* 每行使用 flexbox 布局 */
+  position: relative;
+}
 
-  .flex-column {
-    display: flex;
-    justify-content: center;
-    height: 46px;
-    padding: 8px 12px;
-    text-align: left;  /* 左对齐文本 */
-    color: white;
-  }
+.flex-row::before{
+  content: "";
+  height: 15px;
+  border-left: 2px #00FFFF solid;
+  position: absolute;
+  left: 0;
+  top: 15px
+}
 
-  .header .flex-column {
-    color: #00ffff;
-  }
+.flex-column {
+  display: flex;
+  justify-content: center;
+  height: 46px;
+  padding: 8px 12px;
+  text-align: left;  /* 左对齐文本 */
+  color: white;
+}
 
-  .el-scrollbar {
-    background: #15696b;
-    border: 1px solid #00ffff;
-    ul {
-      li {
-        color: #fff;
-      }
+.header .flex-column {
+  color: #00ffff;
+}
+
+.el-scrollbar {
+  background: #15696b;
+  border: 1px solid #00ffff;
+  ul {
+    li {
+      color: #fff;
     }
   }
-  .el-select-dropdown__item.hover,
-  .el-select-dropdown__item:hover {
-    background: #15696b;
-    color: #00ffff;
-  }
-  .el-select-dropdown__item.selected {
-    color: #00ffff;
-  }
-  .el-select .el-input .el-select__caret {
-    display: none;
-  }
-  .myDia{
-    width: 1050px;
-    height: 710px;
-    padding: 24px 35px ;
-    background-image: radial-gradient(circle at 50% 50%, #031417b3 0%, #0C1A1A 84%);
-  }
-  .myDia ::v-deep .el-picker-panel.el-date-picker {
-      background: #062223 !important;
-  }
-  .wanjie{
-    position: absolute;
-      /* left: 30px; */
-      margin-left: 75px;
-      top: 25px;
-      width: 120px;
-      height: 60px;
-      background: #0017168f;
-      box-shadow: inset 0 0 17px 0 #05ffff7a;
-      background: #44f1ff1a;
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      color: #00F0ff;
-      cursor: pointer;
-  }
+}
+.el-select-dropdown__item.hover,
+.el-select-dropdown__item:hover {
+  background: #15696b;
+  color: #00ffff;
+}
+.el-select-dropdown__item.selected {
+  color: #00ffff;
+}
+.el-select .el-input .el-select__caret {
+  display: none;
+}
+.myDia{
+  width: 1050px;
+  height: 710px;
+  padding: 24px 35px ;
+  background-image: radial-gradient(circle at 50% 50%, #031417b3 0%, #0C1A1A 84%);
+}
+.myDia ::v-deep .el-picker-panel.el-date-picker {
+  background: #062223 !important;
+}
+.wanjie{
+  position: absolute;
+  /* left: 30px; */
+  margin-left: 75px;
+  top: 25px;
+  width: 120px;
+  height: 60px;
+  background: #0017168f;
+  box-shadow: inset 0 0 17px 0 #05ffff7a;
+  background: #44f1ff1a;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  color: #00F0ff;
+  cursor: pointer;
+}
 
-  ::v-deep .el-input__inner{
-    color: #00ffff;
-    background-color: rgba(15, 86, 86, 0.54);
-    border: 1px solid #00ffff4d;
-  }
-  ::v-deep .el-input__prefix{
-    color: #00F6EC;
-  }
-  ::v-deep .el-input__suffix{
-    color: #00F6EC;
-  }
-  ::v-deep .el-input__inner::placeholder{
-    color: #199294;
-  }
-  ::v-deep .btn-prev{
-    color: #00F6EC !important;
-    background-color: rgba(21, 105, 107, 0.35) !important;
-    border: 1px #15696b solid;
-  }
-  ::v-deep .btn-next{
-    color: #00F6EC !important;
-    background-color: rgba(21, 105, 107, 0.35) !important;
-    border: 1px #15696b solid;
-  }
-  ::v-deep .el-pager li.active{
-    background-color: #00ffff !important;
-    color: rgba(9, 8, 8, 0.68) !important;
-  }
-  ::v-deep .el-pager li{
-    background-color: rgba(21, 105, 107, 0.35) !important;
-    color: #00ffff !important;
-  }
-  </style>
+::v-deep .el-input__inner{
+  color: #00ffff;
+  background-color: rgba(15, 86, 86, 0.54);
+  border: 1px solid #00ffff4d;
+}
+::v-deep .el-input__prefix{
+  color: #00F6EC;
+}
+::v-deep .el-input__suffix{
+  color: #00F6EC;
+}
+::v-deep .el-input__inner::placeholder{
+  color: #199294;
+}
+::v-deep .btn-prev{
+  color: #00F6EC !important;
+  background-color: rgba(21, 105, 107, 0.35) !important;
+  border: 1px #15696b solid;
+}
+::v-deep .btn-next{
+  color: #00F6EC !important;
+  background-color: rgba(21, 105, 107, 0.35) !important;
+  border: 1px #15696b solid;
+}
+::v-deep .el-pager li.active{
+  background-color: #00ffff !important;
+  color: rgba(9, 8, 8, 0.68) !important;
+}
+::v-deep .el-pager li{
+  background-color: rgba(21, 105, 107, 0.35) !important;
+  color: #00ffff !important;
+}
+</style>
 

src/views/pad/engineering/main.vue

@@ -213,6 +213,7 @@
         </issue-sub-dia>
         <issue-deal-dia
           v-if="showIssueDeal === 1"
+          :getProList="getProList"
           @close="onCloseIssueDeal"
           :monitorInfo="this.monitorInfo">
         </issue-deal-dia>
@@ -299,6 +300,7 @@ export default {
   props: {},
   data() {
     return {
+      getProList:null,
       appOrg: "10001",
       num: 0,
       parest:[
@@ -529,7 +531,8 @@ export default {
       this.showIssueSub = 1
       this.showIssue = 0
     },
-    onDealIssue(){
+    onDealIssue(u){
+      this.getProList=u
       this.showIssueDeal = 1
       this.showIssue = 0
     },