浏览代码

修改冲突

zhangwf 5 年之前
父节点
当前提交
7e90f696f1

+ 3 - 2
src/model/Page.js

@@ -3,7 +3,8 @@
  */
  */
 export default class Page {
 export default class Page {
   constructor(page = {}) {
   constructor(page = {}) {
-    this.elements = page.elements || [];
-    this.position = 0;
+    this.elements = page.elements || []; // 页面元素
+    this.questions = page.questions || []; // 页面关联问题
+    this.position = page.position || 0;
   }
   }
 }
 }

+ 28 - 11
src/views/h5editor/index.vue

@@ -7,7 +7,8 @@
     <!-- 内容区域 -->
     <!-- 内容区域 -->
     <section class="section">
     <section class="section">
       <!-- 左侧图层 -->
       <!-- 左侧图层 -->
-      <Overview ref='overview' class="overview" :testcaseId="testcaseId" :resultCount="resultPageCount" />
+      <Overview ref='overview' class="overview" :testcaseId="testcaseId" :resultCount="resultPageCount"
+        :questions="questions" />
       <!-- 编辑区域 -->
       <!-- 编辑区域 -->
       <div class="container" id="h5editor">
       <div class="container" id="h5editor">
         <elab-canvas v-show="animatedNameGlobal!=''" :width="750" :height="1334"
         <elab-canvas v-show="animatedNameGlobal!=''" :width="750" :height="1334"
@@ -310,7 +311,7 @@
             font-family:MicrosoftYaHei;display:block;
             font-family:MicrosoftYaHei;display:block;
             color:rgba(51,51,51,1); margin-bottom:14px;
             color:rgba(51,51,51,1); margin-bottom:14px;
             line-height:19px;">默认状态</span>
             line-height:19px;">默认状态</span>
-                 <div v-if="unSelectedButtom" :style="{ backgroundImage: 'url(' + buttonData.backgroundUnselectedImg + ')','width':'130px', 'height':'130px','background-repeat': 'no-repeat',
+            <div v-if="unSelectedButtom" :style="{ backgroundImage: 'url(' + buttonData.backgroundUnselectedImg + ')','width':'130px', 'height':'130px','background-repeat': 'no-repeat',
                  'background-position': 'center',
                  'background-position': 'center',
                  'background-size': 'contain'}"></div>
                  'background-size': 'contain'}"></div>
             <label class="lable" v-else>
             <label class="lable" v-else>
@@ -341,7 +342,7 @@
               font-family:MicrosoftYaHei;display:block;
               font-family:MicrosoftYaHei;display:block;
               color:rgba(51,51,51,1);margin-bottom:14px;
               color:rgba(51,51,51,1);margin-bottom:14px;
               line-height:19px;">选中状态</span>
               line-height:19px;">选中状态</span>
-              <div v-if="selectedButtom" :style="{ backgroundImage: 'url(' + buttonData.backgroundSelectedImg + ')','width':'130px', 'height':'130px','background-repeat': 'no-repeat',
+            <div v-if="selectedButtom" :style="{ backgroundImage: 'url(' + buttonData.backgroundSelectedImg + ')','width':'130px', 'height':'130px','background-repeat': 'no-repeat',
               'background-position': 'center',
               'background-position': 'center',
               'background-size': 'contain'}"></div>
               'background-size': 'contain'}"></div>
             <label class="lable" v-else>
             <label class="lable" v-else>
@@ -352,7 +353,7 @@
                     align-items: center;
                     align-items: center;
                     height:100%;
                     height:100%;
                     border:1px dashed rgba(100,107,129,1);">
                     border:1px dashed rgba(100,107,129,1);">
-                
+
                 <img style="width:16px;
                 <img style="width:16px;
                     height:16px;" src="../../assets/images/add-ele.png" />
                     height:16px;" src="../../assets/images/add-ele.png" />
                 <span style="font-size:12px;
                 <span style="font-size:12px;
@@ -364,7 +365,7 @@
               </div>
               </div>
               <input style="display: none;" type="file" @change="upload($event, true)">
               <input style="display: none;" type="file" @change="upload($event, true)">
             </label>
             </label>
-  
+
           </div>
           </div>
         </div>
         </div>
 
 
@@ -408,6 +409,7 @@
       return {
       return {
         itemId: null,
         itemId: null,
         testcaseId: null,
         testcaseId: null,
+        questions: [],
         panelState: 0,
         panelState: 0,
         canvasWidth: 750,
         canvasWidth: 750,
         canvasHeight: 504,
         canvasHeight: 504,
@@ -454,7 +456,7 @@
         dialogVisible: false,
         dialogVisible: false,
         buttonData: {},
         buttonData: {},
         unSelectedButtom: false,
         unSelectedButtom: false,
-        selectedButtom:false,
+        selectedButtom: false,
       };
       };
     },
     },
     watch: {
     watch: {
@@ -531,6 +533,21 @@
           this.$store.state.editor.editorTheme.animatedNameBackgroundGlobal || "";
           this.$store.state.editor.editorTheme.animatedNameBackgroundGlobal || "";
         this.title = this.$store.state.editor.editorTheme.title;
         this.title = this.$store.state.editor.editorTheme.title;
         this.gridTempField = this.$store.state.editor.gridTempField;
         this.gridTempField = this.$store.state.editor.gridTempField;
+        var pages = this.$store.state.editor.editorTheme.pages || [];
+        console.log("每页数据", pages);
+        this.questions = [];
+        for (var i = 1; i < pages.length; i++) {
+          if (pages[i].questions) {
+            console.log("每页数据", pages[i].questions);
+            var result = pages[i].questions.map(function (a) {
+              return a.questionId;
+            });
+            this.questions.push(result);
+          } else {
+            this.questions.push([]);
+          }
+        }
+        console.log("拼接数据", this.questions);
         return this.$store.state.editor.editorPage;
         return this.$store.state.editor.editorPage;
       },
       },
       element() {
       element() {
@@ -786,6 +803,7 @@
         ) {
         ) {
           this.deleteElement();
           this.deleteElement();
         }
         }
+
       },
       },
       deleteElement() {
       deleteElement() {
         this.$store.dispatch("deleteSelectedElement");
         this.$store.dispatch("deleteSelectedElement");
@@ -893,20 +911,20 @@
         });
         });
       },
       },
       handleClose(done) {
       handleClose(done) {
-        this.$confirm('确认关闭?')
+        this.$confirm("确认关闭?")
           .then(_ => {
           .then(_ => {
             done();
             done();
           })
           })
           .catch(_ => { });
           .catch(_ => { });
       },
       },
       uploadSelectedPicOrUnSelectedPic() {
       uploadSelectedPicOrUnSelectedPic() {
-        this.dialogVisible = true
+        this.dialogVisible = true;
       },
       },
-      closeUploadButton(){
+      closeUploadButton() {
         this.buttonData = {};
         this.buttonData = {};
         this.dialogVisible = false;
         this.dialogVisible = false;
         this.selectedButtom = false;
         this.selectedButtom = false;
-        this.unSelectedButtom = false;  
+        this.unSelectedButtom = false;
       },
       },
       async upload(event, isSelected) {
       async upload(event, isSelected) {
         var that = this;
         var that = this;
@@ -965,7 +983,6 @@
         that.selectedButtom = false;
         that.selectedButtom = false;
         that.unSelectedButtom = false;
         that.unSelectedButtom = false;
       }
       }
-
     },
     },
     components: {
     components: {
       Overview,
       Overview,

+ 73 - 6
src/views/h5editor/overview.vue

@@ -82,9 +82,12 @@
       </div>
       </div>
       <el-collapse-transition>
       <el-collapse-transition>
         <div v-show="showTopic">
         <div v-show="showTopic">
-          <el-checkbox-group v-model="checkList" class="topic-group">
-            <el-checkbox v-for="item in questionList" :label="item.name" :key="item.name"></el-checkbox>
-          </el-checkbox-group>
+          <div class="topic-group">
+            <el-checkbox v-for="(item, index) in questionList" :label="item.name" :key="index"
+              @change="checked=>selectCheckbox(checked,item,index)" :checked="isChecked(index)"
+              :disabled="isDisabled(index)">
+            </el-checkbox>
+          </div>
         </div>
         </div>
       </el-collapse-transition>
       </el-collapse-transition>
     </div>
     </div>
@@ -98,7 +101,8 @@ import editorApi from "../../api/editor";
 export default {
 export default {
   props: {
   props: {
     testcaseId: "",
     testcaseId: "",
-    resultCount: 0
+    resultCount: 0,
+    questions: []
   },
   },
   data() {
   data() {
     return {
     return {
@@ -111,11 +115,12 @@ export default {
       questionPages: [],
       questionPages: [],
       resultPageCount: this.resultCount,
       resultPageCount: this.resultCount,
       resultPages: [],
       resultPages: [],
-      checkList: ["4.选中且禁用"],
       showTopic: true,
       showTopic: true,
       topicIcon: "../../static/img/up-arrow.png",
       topicIcon: "../../static/img/up-arrow.png",
       questionList: [],
       questionList: [],
-      isShowQuestion: false
+      isShowQuestion: false,
+      currentPage: 0,
+      selectQuestions: this.questions
     };
     };
   },
   },
   mounted() {
   mounted() {
@@ -161,6 +166,57 @@ export default {
     }
     }
   },
   },
   methods: {
   methods: {
+    isChecked(index) {
+      var question = this.questionList[index].questionId;
+      var arrTemp = [];
+      this.selectQuestions.forEach(function(value, key, arr) {
+        arrTemp.push(...value);
+      });
+      return arrTemp.indexOf(question) != -1;
+    },
+    isDisabled(index) {
+      var question = this.questionList[index].questionId;
+      var arrTemp = [];
+      this.selectQuestions.forEach(function(value, key, arr) {
+        arrTemp.push(...value);
+      });
+      let questions = this.selectQuestions[this.currentPage - 1] || [];
+      if (questions.indexOf(question) == -1) {
+        if (questions.length == 2) {
+          return true;
+        } else {
+          return arrTemp.indexOf(question) != -1;
+        }
+      } else {
+        return false;
+      }
+    },
+    selectCheckbox(checked, item, index) {
+      console.log("选中", checked, item, index);
+      let questions = this.selectQuestions[this.currentPage - 1] || [];
+      if (checked) {
+        questions.push(item.questionId);
+        console.log("AAAAAAAAA", questions);
+      } else {
+        questions.splice(
+          questions.findIndex(itemTemp => itemTemp === item.questionId),
+          1
+        );
+        console.log("DDDDDDDDDD", questions);
+      }
+
+      var selecteQuestionList = [];
+      for (var i = 0; i < questions.length; i++) {
+        var selectQID = questions[i];
+        for (var n = 0; n < this.questionList.length; n++) {
+          if (this.questionList[n].questionId == selectQID) {
+            selecteQuestionList.push(this.questionList[n]);
+          }
+        }
+      }
+      console.log("RRRRRRRRRR", selecteQuestionList);
+      this.$store.dispatch("addQuestion", selecteQuestionList);
+    },
     isShow: function(index) {
     isShow: function(index) {
       var result = false;
       var result = false;
       if (index > 0) {
       if (index > 0) {
@@ -255,6 +311,8 @@ export default {
       var position = this.pages.length - this.resultPageCount;
       var position = this.pages.length - this.resultPageCount;
       this.$store.dispatch("addPagePosition", position);
       this.$store.dispatch("addPagePosition", position);
       this.isShowQuestion = true;
       this.isShowQuestion = true;
+      this.selectQuestions.push([]);
+      this.currentPage += 1;
     },
     },
     addResultPage() {
     addResultPage() {
       this.bodyBackgroundColor =
       this.bodyBackgroundColor =
@@ -265,6 +323,7 @@ export default {
       this.isShowQuestion = false;
       this.isShowQuestion = false;
     },
     },
     setEditingPage(page, index) {
     setEditingPage(page, index) {
+      this.currentPage = index;
       if (index == 0 || this.isShowResult(index)) {
       if (index == 0 || this.isShowResult(index)) {
         this.isShowQuestion = false;
         this.isShowQuestion = false;
       } else {
       } else {
@@ -293,6 +352,14 @@ export default {
     },
     },
     resultCount(val) {
     resultCount(val) {
       this.resultPageCount = val;
       this.resultPageCount = val;
+    },
+    questions(val) {
+      console.log("当前页数:", val);
+      this.selectQuestions = val;
+    },
+    currentPage(val) {
+      console.log("当前页数:", val);
+      this.questionList = this.questionList;
     }
     }
   }
   }
 };
 };

+ 9 - 0
src/vuex/editor/actions.js

@@ -87,6 +87,15 @@ export const addElement = ({ commit, state }, data) => {
   commit(types.SET_CUR_EDITOR_ELEMENT, state.editorPage.elements[lastIndex])
   commit(types.SET_CUR_EDITOR_ELEMENT, state.editorPage.elements[lastIndex])
 }
 }
 
 
+/**
+ * 添加页面问题
+ */
+export const addQuestion = ({ commit }, data) => {
+  commit(types.ADD_PAGE_QUESTION, data)
+  commit(types.SET_CUR_EDITOR_ELEMENT, null)
+}
+
+
 /**
 /**
  * 添加背景图片
  * 添加背景图片
  */
  */

+ 6 - 5
src/vuex/editor/index.js

@@ -5,7 +5,8 @@ import * as getters from './getters'
 const state = {
 const state = {
   editorElement: {}, // 正在编辑的元素
   editorElement: {}, // 正在编辑的元素
   editorPage: {
   editorPage: {
-    elements: []
+    elements: [],
+    questions: []
   }, // 正在编辑的页面
   }, // 正在编辑的页面
   themeList: [], // 用户所有主题列表
   themeList: [], // 用户所有主题列表
   editorTheme: {
   editorTheme: {
@@ -20,12 +21,12 @@ const state = {
 
 
   }, // 正在编辑的主题
   }, // 正在编辑的主题
   picList: [], // 图片列表
   picList: [], // 图片列表
-  gridTempField:false,//网格参考线
-  complexEditorElement:[], //ctrl点击多个的情况
-  ctrlKeyDownFlag:false,//是否按住了ctrl键
+  gridTempField: false,//网格参考线
+  complexEditorElement: [], //ctrl点击多个的情况
+  ctrlKeyDownFlag: false,//是否按住了ctrl键
 }
 }
 
 
-export default{
+export default {
   state,
   state,
   getters,
   getters,
   actions,
   actions,

+ 1 - 0
src/vuex/editor/mutation-type.js

@@ -24,3 +24,4 @@ export const PUSH_PIC_LIST = 'PUSH_PIC_LIST' // 图片列表
 export const CLEAN_PIC_LIST = 'CLEAN_PIC_LIST' // 清除图片列表
 export const CLEAN_PIC_LIST = 'CLEAN_PIC_LIST' // 清除图片列表
 export const DELETE_THEME = 'DELETE_THEME' // 删除主题
 export const DELETE_THEME = 'DELETE_THEME' // 删除主题
 export const SORTELEMENTS_BY_ZINDEX = 'SORTELEMENTS_BY_ZINDEX' // 元素重新排序
 export const SORTELEMENTS_BY_ZINDEX = 'SORTELEMENTS_BY_ZINDEX' // 元素重新排序
+export const ADD_PAGE_QUESTION = 'ADD_PAGE_QUESTION' // 添加问题

+ 3 - 0
src/vuex/editor/mutations.js

@@ -9,6 +9,9 @@ const mutations = {
   [types.ADD_PIC_ELEMENT](state, data) {
   [types.ADD_PIC_ELEMENT](state, data) {
     state.editorPage.elements.push(new Element(data))
     state.editorPage.elements.push(new Element(data))
   },
   },
+  [types.ADD_PAGE_QUESTION](state, data) {
+    state.editorPage.questions = data
+  },
   [types.SET_BG_ELEMENT](state, data) {
   [types.SET_BG_ELEMENT](state, data) {
     let haveBG = false
     let haveBG = false
     state.editorPage.elements.findIndex((value, index, arr) => {
     state.editorPage.elements.findIndex((value, index, arr) => {

+ 2 - 1
static/json.json

@@ -1,6 +1,7 @@
 {
 {
   "pages": [
   "pages": [
     {
     {
+      "questions": [],
       "elements": [
       "elements": [
         {
         {
           "name": "dv_13psd_layer_0",
           "name": "dv_13psd_layer_0",
@@ -3460,4 +3461,4 @@
   "createDate": "2018-08-30T10:50:56.121Z",
   "createDate": "2018-08-30T10:50:56.121Z",
   "canvasHeight": 6500,
   "canvasHeight": 6500,
   "canvasWidth": 750
   "canvasWidth": 750
-}
+}