修改

src/pages/exam/examEdit.vue

@@ -82,7 +82,7 @@
     width: 328px;
   }
 
-  .List-ul li a {
+  .List-ul li{
     display: block;
     padding-left: 25px;
     line-height: 33px;
@@ -91,6 +91,11 @@
     border-bottom: 1px solid #f3f3f3;
     color: #555;
     text-decoration: none;
+    min-width: 250px;
+    overflow: hidden;
+    padding-right:20px;
+    white-space: nowrap;
+    text-overflow: ellipsis
   }
 
   .List-ul-li-checked b {
@@ -105,6 +110,51 @@
     z-index: 1000;
   }
 
+  .Left-btn {
+    height: 58px;
+    padding: 20px 0 20px 20px;
+    width: 100%;
+    border-bottom: 1px solid #d9d9d9;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+  }
+  .List-bt {
+      width: 318px;
+      height: 27px;
+      background: #fdfdfd;
+      font-size: 14px;
+      line-height: 27px;
+      padding-left: 10px;
+  }
+  .List-ul li:hover{
+    background: #a6a6a6;
+    color: #333;
+  }
+  .left-btn-list{
+    padding:5px 10px;
+    display: inline-block;
+    color: #555;
+    border-radius: 3px;
+    font-size:14px;
+    border:1px solid #999;
+    margin-right:10px;
+    cursor: pointer;
+  }
+  #btn1{
+    background: #26a69a!important;
+  }
+  .difficulty_Degree{
+    display: inline-block;
+    width:80px;
+    text-align: right;
+    line-height: 56px;
+  }
+  .commonDalei{
+    display: flex;
+    align-content: center;
+    margin-bottom:20px;
+  }
 </style>
 <template>
   <div class="examPaper">
@@ -132,8 +182,11 @@
         <div class="Left-list" style="height:740px;overflow:auto;">
           <template v-if="DataObj&&DataObj.GroupList&&DataObj.GroupList.length>0">
             <div class="List-con1" v-for="(gItem,gIndex) in DataObj.GroupList" :key="gIndex">
-              <b>(<label>{{gIndex+1}}</label>)</b>
-              <b>{{gItem.GroupName}}</b>
+              <div class="List-bt">
+                <strong class="f1">
+                  {{gIndex+1}}{{gItem.GroupName}}
+                </strong>
+              </div>
               <ul class="List-ul" v-if="gItem.DetailsList&&gItem.DetailsList.length>0">
                 <li class="" style="cursor:pointer;" v-for="(dItem,dIndex) in gItem.DetailsList" :key="dIndex"
                   @click="ClickItem(dItem)">
@@ -146,15 +199,16 @@
         </div>
       </div>
       <div class="Exam-right f1">
-        <span></span>
-        <div class="row wrap" v-if="ChooseItem">
-          <div class="col-12" style="margin-bottom:20px">
-            题型
+        <div class="Left-btn">
+          <div>
+            <!-- <template v-for="(fItem,fIndex) in firstTypeList">
+              <span class="left-btn-list" :key="fIndex" @click="onItemClick(fItem)">{{fItem.Name}}</span>
+            </template> -->
             <template v-for="(fItem,fIndex) in firstTypeList">
-              <q-btn :key="fIndex" color="accent" :label="fItem.Name" style="margin-left:5px;"
-                @click="onItemClick(fItem)" />
+              <q-btn :key="fIndex" color="accent" :id="commonIndex==fIndex?'btn1':''" size="sm" :label="fItem.Name" style="margin-left:5px;"
+                @click="onItemClick(fItem,fIndex)" />
             </template>
-            <q-btn-dropdown color="accent" label="更多" style="margin-left:5px;">
+            <q-btn-dropdown color="accent" size="sm" label="更多" style="margin-left:5px;">
               <q-list>
                 <q-item v-for="(fItem,fIndex) in secondTypeList" @click="onItemClick(fItem)" clickable v-close-popup
                   :key="fIndex">
@@ -165,8 +219,12 @@
               </q-list>
             </q-btn-dropdown>
           </div>
+          <div>
+            <q-btn color="accent" size="sm" @click="isShowQuestion=true" class="q-mr-md" label="题库选题" />
+          </div>
+        </div>
+        <div class="row wrap" v-if="ChooseItem" style="padding:20px;">
           <div class="edit_stem">
-
             <q-input filled stack-label maxlength="5" :dense="false" v-model="ChooseItem.Score" class="col-12 q-pb-lg"
               label="分数" />
           </div>
@@ -221,38 +279,25 @@
             <UeEditor v-model="ChooseItem.AnswerParse" :config="config" ref="AnswerParse"></UeEditor>
           </div>
           <br />
-          <div class="col-12">
-            <br />
-            <span class="difficulty_Degree">难度</span>
-            <select v-model="ChooseItem.DifficultyType" class="selectBox blue-border">
-              <template v-for="(cItem,cIndex) in questionDifficultyTypeList">
-                <option :key="cIndex" :label="cItem.Name" :value="cItem.Id">
-                </option>
-              </template>
-            </select>
+          <div class="col-12 commonDalei" style="margin-top:20px;">
+            <span class="difficulty_Degree">难度：</span>
+            <q-select filled option-value="Id" size="sm" style="display:inline-block;width:300px;" option-label="Name"
+            v-model="ChooseItem.DifficultyType" :options="questionDifficultyTypeList" emit-value map-options/>
           </div>
-          <div class="col-12">
+          <div class="col-12 commonDalei">
             <br />
-            <span class="difficulty_Degree">所属大类</span>
-            <select v-model="ChooseItem.Category" class="selectBox blue-border">
-              <template v-for="(cItem,cIndex) in questionCategoryList">
-                <option :key="cIndex" :label="cItem.Name" :value="cItem.Id">
-                </option>
-              </template>
-            </select>
+            <span class="difficulty_Degree">所属大类：</span>
+            <q-select filled option-value="Id" size="sm" style="display:inline-block;width:300px;" option-label="Name"
+            v-model="ChooseItem.Category" :options="questionCategoryList" emit-value map-options/>
           </div>
-          <div class="col-12">
+          <div class="col-12 commonDalei">
             <br />
-            <span class="difficulty_Degree">考级程度</span>
-            <select v-model="ChooseItem.LevelType" class="selectBox blue-border">
-              <template v-for="(cItem,cIndex) in questionLevalTypeList">
-                <option :key="cIndex" :label="cItem.Name" :value="cItem.Id">
-                </option>
-              </template>
-            </select>
+            <span class="difficulty_Degree">考级程度：</span>
+            <q-select filled option-value="Id" size="sm" style="display:inline-block;width:300px;" option-label="Name"
+            v-model="ChooseItem.LevelType" :options="questionLevalTypeList" emit-value map-options/>
           </div>
-          <div class="col-12" style="margin-top:16px;">
-            <span class="difficulty_Degree">知识点: </span>
+          <div class="col-12">
+            <span class="difficulty_Degree">知识点：</span>
             <a class="addKnowledge" @click="isShowPoint=true">
               <i class="iconfont icon-add" style="position:relative;top:1px;"></i>选择知识点
             </a>
@@ -263,6 +308,7 @@
           </div>
         </div>
       </div>
+      <questionForm v-if="isShowQuestion" @close="closeQuestForm" @success="refreshPage"></questionForm>
     </div>
   </div>
 </template>
@@ -282,7 +328,7 @@
   import cloze from '../../components/questiontype/cloze'
   import readingComprehensio from '../../components/questiontype/reading-comprehensio'
   import sharingChoose from '../../components/questiontype/sharing-choose'
-
+  import questionForm from '../../components/exam/question-form'
   import {
     GetPaper,
     savePaperInfo,
@@ -307,7 +353,8 @@
       sortingProblem, //排序题
       cloze, //完型填空
       readingComprehensio, //阅读理解
-      sharingChoose, //共用选择题
+      sharingChoose, //共用选择题、
+      questionForm
     },
     meta: {
       title: "考试"
@@ -341,6 +388,8 @@
         choosePointArray: [], //选择知识点
         firstTypeList: [], //第一类题型
         secondTypeList: [], //第二类题型
+        isShowQuestion:false,
+        commonIndex:-1
       }
     },
     created() {
@@ -350,7 +399,7 @@
       this.getQuestionType();
       this.getDifficultyType();
       this.getQuestionCategory();
-      this.getQuestionLevelType
+      this.getQuestionLevelType();
     },
     mounted() {
       this.GetPaperInfo()
@@ -369,7 +418,7 @@
         });
       },
       //题型点击
-      onItemClick(item) {
+      onItemClick(item,index) {
         // this.AnswerList = [];
         // this.questionObj = item;
         // this.objOption.QuestionTypeId = item.QId;
@@ -379,6 +428,7 @@
         // if (obj) {
         //   this.objOption.QuestionContent = JSON.stringify(obj);
         // }
+        this.commonIndex=index
       },
       //获取问题大类
       getQuestionCategory() {
@@ -419,6 +469,12 @@
         savePaperInfo(this.DataObj).then(res => {
           console.log("res", res);
         })
+      },
+      closeQuestForm(){
+        this.isShowQuestion = false;
+      },
+      refreshPage(){
+
       }
     }
   }