Browse Source

修改目录及模块布局

yangg 6 tháng trước cách đây
mục cha
commit
6212c7252a

+ 83 - 70
ui/src/views/system/document/com/editor.vue

@@ -20,30 +20,16 @@
             class="layers"
             :class="comIndex == index ? 'active-layer' : ''"
           >
-            <div class="drag-handle" draggable>
+           <!--  <div class="drag-handle" draggable>
               <img src="@/icons/svg/drag.svg" style="width: 20px;" icon-class="drag" />
-            </div>
+            </div> -->
             <!-- :options="categoryList":props="props" -->
-            <div style="padding: 10px 0">
+           <!--  <div style="padding: 10px 0">
               <el-form label-position="left" class="inline-form">
                 <el-row :gutter="24" style="margin-left: 0; margin-right: 0">
-                 <!--  <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
-                    <el-form-item label="模块分类:">
-                      <span @click="enableSelect(it)" style="cursor: pointer">{{
-                        getCategory(it.category_id)
-                      }}</span>
-                    </el-form-item>
-                  </el-col>
-                  <el-col :xs="24" :sm="24" :md="12" :lg="8" :xl="8">
-                    <el-form-item label="模块名称:">
-                      <span @click="enableName(it)" style="cursor: pointer">{{
-                        it.dcb_name
-                      }}</span>
-                    </el-form-item>
-                  </el-col> -->
                   <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                     <el-form-item
-                      ><!-- v-if="$store.state.user.roleInfo.id == 1" -->
+                      >
                       <div class="btn-save">
                         <el-tooltip
                           v-if="type !== 'document'"
@@ -59,28 +45,12 @@
                           >
                           </el-button>
                         </el-tooltip>
-                        <!--  <el-tooltip
-                          class="item"
-                          effect="dark"
-                          content="另存为"
-                          placement="top"
-                        >
-                          <el-button
-                            circle
-                            size="mini"
-                            @click="onSaveAs(it)"
-                            v-if="it.id > 0"
-                            icon="el-icon-document-copy"
-                          >
-                          </el-button>
-                        </el-tooltip> && type !== 'document'-->
                         <el-button
                           circle
                           v-if="it.isEdit !== 1"
                           @click="onEdit(index, 1)"
                           icon="el-icon-edit"
                         >
-                          <!-- <svg-icon icon-class="edit" /> -->
                         </el-button>
                         <el-button
                           circle
@@ -89,7 +59,6 @@
                           v-else
                         >
                         </el-button>
-                        <!--  v-if="!templateId && type !== 'document'" -->
                         <el-tooltip
                           class="item"
                           effect="dark"
@@ -100,9 +69,7 @@
                             circle
                             @click="onRemove(index)"
                             icon="el-icon-delete"
-                          >
-                            <!--  <svg-icon icon-class="el-icon-delete" 
-                          />--></el-button
+                          ></el-button
                           >
                         </el-tooltip>
                       </div>
@@ -110,7 +77,7 @@
                   </el-col>
                 </el-row>
               </el-form>
-            </div>
+            </div> -->
             <div class="main" @click="onSetActive(index)">
               <component
                 :is="it.type"
@@ -636,51 +603,82 @@ export default {
     },
     async onEdit(e, state) {
       try {
-        // 如果是切换到预览模式,先等待保存完成
+        // 如果是切换到预览模式
         if (state === 2) {
-          console.log("isEditor:",'001');
-          this.isSaving = true; // 设置保存状态
+          this.isSaving = true;
+          
+          // 获取组件引用并添加详细日志
           const componentRef = this.$refs[`component_${e}`];
-          if (componentRef && componentRef.save) {
-            // 等待保存完成
-            await componentRef.save();
+          console.log("componentRef:", componentRef);
+          
+          // 检查组件引用是否正确
+          if (!componentRef || !componentRef[0]) {
+            console.error(`组件引用获取失败: component_${e}`);
+            throw new Error('组件引用不存在');
+          }
+
+          // 检查 save 方法是否存在
+          if (typeof componentRef[0].save !== 'function') {
+            console.error('组件没有 save 方法:', componentRef[0]);
+            throw new Error('组件 save 方法不存在');
+          }
+
+          try {
+            // 1. 等待组件内容保存
+            console.log('开始保存组件内容...');
+            await componentRef[0].save();
+            console.log('组件内容保存完成');
+            
+            // 2. 等待父组件的更新完成
+            console.log('开始更新父组件...');
+            await new Promise(resolve => {
+              this.$nextTick(async () => {
+                await this.$emit("onRebuild", this.comList);
+                resolve();
+              });
+            });
+            console.log('父组件更新完成');
             
-            // 在保存完成后,手动更新组件状态
+            // 3. 更新编辑状态
+            console.log('更新编辑状态...');
             this.$set(this.comList[e], 'isEdit', 2);
             
-            // 立即触发更新
+            // 4. 确保视图更新完成
             await this.$nextTick();
+            console.log('视图更新完成');
             
-            // 通知父组件更新
-            this.$emit("onRebuild", this.comList);
-            
-            this.isSaving = false; // 重置保存状态
-            return; // 直接返回,不执行后续的批量更新
+          } catch (error) {
+            console.error('保存过程中出错:', error);
+            this.$message.error('保存失败:' + error.message);
+            throw error;
           }
-        }
+        } else {
+          // 编辑模式的处理...
+          console.log('切换到编辑模式...');
+          this.comList = this.comList.map((it, index) => {
+            it.isEdit = 2;
+            if (index === e && state === 1) {
+              this.filterAttrs(it);
+            }
+            return it;
+          });
 
-        // 如果是切换到编辑模式,执行原有逻辑
-        this.comList = this.comList.map((it, index) => {
-          it.isEdit = 2;
-          
-          if (index === e && state === 1) {
-            this.filterAttrs(it);
+          if (state === 1) {
+            this.comList[e].isEdit = 1;
+            this.onSetActive(e);
           }
-          return it;
-        });
-
-        if (state === 1) {
-          this.comList[e].isEdit = 1;
-          this.onSetActive(e);
         }
 
-        this.$emit("onRebuild", this.comList);
+        // 触发重建
+        await this.$emit("onRebuild", this.comList);
+        console.log('重建完成');
 
       } catch (error) {
-        console.error('保存失败:', error);
-        this.$message.error('切换模式失败,请重试');
+        console.error('切换模式失败:', error);
+        this.$message.error('切换模式失败:' + error.message);
       } finally {
-        this.isSaving = false; // 确保在出错时也重置保存状态
+        this.isSaving = false;
+        console.log('操作完成,isSaving 重置为 false');
       }
     },
 
@@ -714,13 +712,28 @@ export default {
     onSetActive(e) {
       this.$emit("onSetActiveIndex", e);
     },
+    // 添加一个辅助方法来验证组件引用
+    validateComponentRef(ref, index) {
+      if (!ref) {
+        throw new Error(`组件引用为空 (index: ${index})`);
+      }
+      if (!Array.isArray(ref)) {
+        throw new Error(`组件引用不是数组 (index: ${index})`);
+      }
+      if (!ref[0]) {
+        throw new Error(`组件引用数组为空 (index: ${index})`);
+      }
+      if (!ref[0].save) {
+        throw new Error(`组件没有 save 方法 (index: ${index})`);
+      }
+    }
   },
 };
 </script>
 <style lang="scss">
 @import "./editor.scss";
 .layers {
-  margin-left: 26px;
+ // margin-left: 26px;
   .drag-handle {
     position: absolute;
     top: 0;

+ 4 - 0
ui/src/views/system/document/create.scss

@@ -297,6 +297,10 @@
          }
       }
     }
+    .leftContent{
+      margin-top: 110px;
+      width:200px;
+    }
     .editor-main{
       width:56%;
       overflow: hidden;

Những thai đổi đã bị hủy bỏ vì nó quá lớn
+ 777 - 103
ui/src/views/system/document/create.vue


Một số tệp đã không được hiển thị bởi vì quá nhiều tập tin thay đổi trong này khác