Pārlūkot izejas kodu

上传文件返回文件名,然后课程规则可以上下移动

xw 1 mēnesi atpakaļ
vecāks
revīzija
60c867d2ea
1 mainītis faili ar 157 papildinājumiem un 8 dzēšanām
  1. 157 8
      src/views/qw/sopTemp/updateSopTemp.vue

+ 157 - 8
src/views/qw/sopTemp/updateSopTemp.vue

@@ -567,9 +567,36 @@
                                       </el-form>
                                     </el-col>
                                     <el-col :span="1" :offset="1">
-                                      <i class="el-icon-delete" @click="delSetList(index,contentIndex,setIndex)"
-                                         style="margin-top: 20px;"
-                                         v-if="content.setting.length>1 && (formType != 3 && form.templateType != 1) && roles.includes('del_sop_temp_content') && !(form.sendType == 11 && setIndex == 0)"></i>
+                                      <div style="display: flex; flex-direction: column; align-items: center; margin-top: 20px; gap: 8px;">
+                                        <el-button
+                                          class="move-btn move-up-btn"
+                                          icon="el-icon-arrow-up"
+                                          size="mini"
+                                          circle
+                                          @click="moveSetListUp(index,contentIndex,setIndex)"
+                                          v-if="setIndex > 0 && (formType != 3 && form.templateType != 1) && roles.includes('edit_sop_temp_content')"
+                                          title="上移">
+                                        </el-button>
+                                        <el-button
+                                          class="move-btn move-down-btn"
+                                          icon="el-icon-arrow-down"
+                                          size="mini"
+                                          circle
+                                          @click="moveSetListDown(index,contentIndex,setIndex)"
+                                          v-if="setIndex < content.setting.length - 1 && (formType != 3 && form.templateType != 1) && roles.includes('edit_sop_temp_content')"
+                                          title="下移">
+                                        </el-button>
+                                        <el-button
+                                          class="delete-btn"
+                                          icon="el-icon-delete"
+                                          type="danger"
+                                          size="mini"
+                                          circle
+                                          @click="delSetList(index,contentIndex,setIndex)"
+                                          v-if="content.setting.length>1 && (formType != 3 && form.templateType != 1) && roles.includes('del_sop_temp_content') && !(form.sendType == 11 && setIndex == 0)"
+                                          title="删除">
+                                        </el-button>
+                                      </div>
                                     </el-col>
                                   </el-row>
                                 </div>
@@ -580,9 +607,36 @@
                               </el-form>
                             </el-col>
                             <el-col :span="1" :offset="1">
-                              <i class="el-icon-delete" @click="delContent(index,contentIndex)"
-                                 style="margin-top: 20px;"
-                                 v-if="item.content.length>1 && formType != 3 && form.templateType != 1 && roles.includes('del_sop_temp_rule')"></i>
+                              <div style="display: flex; flex-direction: column; align-items: center; margin-top: 20px; gap: 8px;">
+                                <el-button
+                                  class="move-btn move-up-btn"
+                                  icon="el-icon-arrow-up"
+                                  size="mini"
+                                  circle
+                                  @click="moveContentUp(index,contentIndex)"
+                                  v-if="contentIndex > 0 && formType != 3 && form.templateType != 1 && roles.includes('edit_sop_temp_rule')"
+                                  title="上移">
+                                </el-button>
+                                <el-button
+                                  class="move-btn move-down-btn"
+                                  icon="el-icon-arrow-down"
+                                  size="mini"
+                                  circle
+                                  @click="moveContentDown(index,contentIndex)"
+                                  v-if="contentIndex < item.content.length - 1 && formType != 3 && form.templateType != 1 && roles.includes('edit_sop_temp_rule')"
+                                  title="下移">
+                                </el-button>
+                                <el-button
+                                  class="delete-btn"
+                                  icon="el-icon-delete"
+                                  type="danger"
+                                  size="mini"
+                                  circle
+                                  @click="delContent(index,contentIndex)"
+                                  v-if="item.content.length>1 && formType != 3 && form.templateType != 1 && roles.includes('del_sop_temp_rule')"
+                                  title="删除">
+                                </el-button>
+                              </div>
                             </el-col>
                           </el-row>
                         </div>
@@ -665,6 +719,47 @@
   cursor: pointer;
 }
 
+/* 移动按钮样式 */
+.move-btn {
+  width: 32px;
+  height: 32px;
+  padding: 0;
+  border: 2px solid #409EFF;
+  background-color: #ecf5ff;
+  color: #409EFF;
+  font-size: 16px;
+  transition: all 0.3s;
+}
+
+.move-btn:hover {
+  background-color: #409EFF;
+  color: white;
+  transform: scale(1.1);
+  box-shadow: 0 2px 8px rgba(64, 158, 255, 0.4);
+}
+
+.move-up-btn:hover {
+  transform: translateY(-2px) scale(1.1);
+}
+
+.move-down-btn:hover {
+  transform: translateY(2px) scale(1.1);
+}
+
+/* 删除按钮样式 */
+.delete-btn {
+  width: 32px;
+  height: 32px;
+  padding: 0;
+  font-size: 16px;
+  transition: all 0.3s;
+}
+
+.delete-btn:hover {
+  transform: scale(1.1);
+  box-shadow: 0 2px 8px rgba(245, 108, 108, 0.4);
+}
+
 /deep/ .el-badge__content.is-fixed {
   top: 10px !important;
   right: 0 !important;
@@ -1057,7 +1152,16 @@ export default {
         data.dayNum = e.dayNum;
         e.contentType = e.type;
         e.settingList = e.setting;
-        e.settingList.forEach(e => e.content = JSON.stringify(e));
+        // 在序列化之前,清理 null 值,避免后端接收到字符串 "null"
+        e.settingList.forEach(setting => {
+          // 将所有值为 null 的字段删除或设置为 undefined
+          Object.keys(setting).forEach(key => {
+            if (setting[key] === null) {
+              delete setting[key];
+            }
+          });
+          setting.content = JSON.stringify(setting);
+        });
         if (e.addTag != null) {
           e.addTag = JSON.stringify(e.addTag);
         }
@@ -1299,7 +1403,24 @@ export default {
     },
     delSetList(index, contentIndex, setIndex) {
       this.setting[index].content[contentIndex].setting.splice(setIndex, 1)
-
+    },
+    // 上移内容项
+    moveSetListUp(index, contentIndex, setIndex) {
+      if (setIndex > 0) {
+        const setting = this.setting[index].content[contentIndex].setting;
+        // 交换数组元素
+        [setting[setIndex - 1], setting[setIndex]] = [setting[setIndex], setting[setIndex - 1]];
+        this.$forceUpdate();
+      }
+    },
+    // 下移内容项
+    moveSetListDown(index, contentIndex, setIndex) {
+      const setting = this.setting[index].content[contentIndex].setting;
+      if (setIndex < setting.length - 1) {
+        // 交换数组元素
+        [setting[setIndex], setting[setIndex + 1]] = [setting[setIndex + 1], setting[setIndex]];
+        this.$forceUpdate();
+      }
     },
 
     addContent(index) {
@@ -1337,6 +1458,30 @@ export default {
       this.videoList.splice(contentIndex, 1)
       this.addTag.splice(contentIndex, 1)
     },
+    // 上移规则
+    moveContentUp(index, contentIndex) {
+      if (contentIndex > 0) {
+        const content = this.setting[index].content;
+        // 交换数组元素
+        [content[contentIndex - 1], content[contentIndex]] = [content[contentIndex], content[contentIndex - 1]];
+        // 同步交换 videoList 和 addTag
+        [this.videoList[contentIndex - 1], this.videoList[contentIndex]] = [this.videoList[contentIndex], this.videoList[contentIndex - 1]];
+        [this.addTag[contentIndex - 1], this.addTag[contentIndex]] = [this.addTag[contentIndex], this.addTag[contentIndex - 1]];
+        this.$forceUpdate();
+      }
+    },
+    // 下移规则
+    moveContentDown(index, contentIndex) {
+      const content = this.setting[index].content;
+      if (contentIndex < content.length - 1) {
+        // 交换数组元素
+        [content[contentIndex], content[contentIndex + 1]] = [content[contentIndex + 1], content[contentIndex]];
+        // 同步交换 videoList 和 addTag
+        [this.videoList[contentIndex], this.videoList[contentIndex + 1]] = [this.videoList[contentIndex + 1], this.videoList[contentIndex]];
+        [this.addTag[contentIndex], this.addTag[contentIndex + 1]] = [this.addTag[contentIndex + 1], this.addTag[contentIndex]];
+        this.$forceUpdate();
+      }
+    },
     addSetting() {
       let content = [{type: this.defaultContentType, contentType: '1', setting: [{contentType: '1', value: "",}]}];
       if (this.form.sendType == 4) {
@@ -1650,6 +1795,10 @@ export default {
       if (res.code === 200) {
         // 使用 $set 确保响应式更新
         this.$set(content, 'fileUrl', res.url);
+        // 保存文件名
+        if (res.fileName) {
+          this.$set(content, 'fileName', res.fileName);
+        }
       } else {
         this.msgError(res.msg);
       }