1

src/views/questionnaire/detail.vue

@@ -5,37 +5,47 @@
         <div class="w_1200">
           <el-col :span="24" class="one">
             <el-row>
-              <el-col :span="24">{{ question.title }}</el-col>
-              <el-form :model="answer" label-position="top" ref="form">
-                <!-- 0单选,1多选,2简答 -->
-                <template v-for="(i, index) in question.questions">
-                  <el-form-item
-                    v-if="i.type === '0'"
-                    :prop="`${index}`"
-                    :key="`question${index}`"
-                    :label="`${index + 1}.${i.title}`"
-                    :rules="[{ required: true, message: '请选择一个选项', trigger: 'blur' }]"
-                  >
-                    <el-radio-group v-model="answer[index]" :disabled="disabled">
-                      <el-radio v-for="(s, si) in i.selects" :key="`s_${index}_${si}`" :label="s.name">{{ s.num }}.{{ s.name }}</el-radio>
-                    </el-radio-group>
-                  </el-form-item>
-                  <el-form-item
-                    v-else-if="i.type === '1'"
-                    :prop="`${index}`"
-                    :key="`question${index}`"
-                    :label="`${index + 1}.${i.title}`"
-                    :rules="[{ required: true, message: '请至少选择一个选项', trigger: 'blur' }]"
-                  >
-                    <el-checkbox-group :value="answer[index]" @input="data => toCheck(data, index)" :disabled="disabled">
-                      <el-checkbox v-for="(s, si) in i.selects" :key="`c_${index}_${si}`" :label="s.name">{{ s.num }}.{{ s.name }}</el-checkbox>
-                    </el-checkbox-group>
-                  </el-form-item>
-                  <el-form-item v-else :key="`question${index}`" :label="`${index + 1}.${i.title}`">
-                    <el-input v-model="answer[index]" type="textarea" :autosize="{ minRows: 3, maxRows: 5 }" :readonly="disabled"></el-input>
-                  </el-form-item>
-                </template>
-              </el-form>
+              <el-col :span="24" class="info">
+                <el-col :span="24" class="title">
+                  {{ question.title }}
+                </el-col>
+                <el-col :span="24" class="brief">
+                  {{ question.brief }}
+                </el-col>
+              </el-col>
+              <el-col :span="24" class="form">
+                <el-form :model="answer" label-position="top" ref="form">
+                  <!-- 0单选,1多选,2简答 -->
+                  <template v-for="(i, index) in question.questions">
+                    <el-form-item
+                      v-if="i.type === '0'"
+                      :prop="`${index}`"
+                      :key="`question${index}`"
+                      :label="`${index + 1}.${i.title}`"
+                      :rules="[{ required: true, message: '请选择一个选项', trigger: 'blur' }]"
+                    >
+                      <el-radio-group v-model="answer[index]" :disabled="disabled">
+                        <el-radio v-for="(s, si) in i.selects" :key="`s_${index}_${si}`" :label="s.name">{{ s.num }}.{{ s.name }}</el-radio>
+                      </el-radio-group>
+                    </el-form-item>
+                    <el-form-item
+                      v-else-if="i.type === '1'"
+                      :prop="`${index}`"
+                      :key="`question${index}`"
+                      :label="`${index + 1}.${i.title}`"
+                      :rules="[{ required: true, message: '请至少选择一个选项', trigger: 'blur' }]"
+                    >
+                      <el-checkbox-group :value="answer[index]" @input="data => toCheck(data, index)" :disabled="disabled">
+                        <el-checkbox v-for="(s, si) in i.selects" :key="`c_${index}_${si}`" :label="s.name">{{ s.num }}.{{ s.name }}</el-checkbox>
+                      </el-checkbox-group>
+                    </el-form-item>
+                    <el-form-item v-else :key="`question${index}`" :label="`${index + 1}.${i.title}`">
+                      <el-input v-model="answer[index]" type="textarea" :autosize="{ minRows: 4, maxRows: 6 }" :readonly="disabled"></el-input>
+                    </el-form-item>
+                  </template>
+                </el-form>
+              </el-col>
+
               <el-col :span="24" style="text-align:center">
                 <el-button type="primary" @click="toSubmit" v-if="!disabled">提交</el-button>
               </el-col>
@@ -163,6 +173,32 @@ export default {
   padding: 15px 0;
   .one {
     margin: 0 0 10px 0;
+    .info {
+      border-bottom: 1px dashed #ccc;
+      padding: 0 20px;
+      .title {
+        font-size: 30px;
+        font-weight: bold;
+        margin: 20px 0;
+        text-align: center;
+      }
+      .brief {
+        font-size: 16px;
+        padding: 0 0 20px 0;
+      }
+    }
+    .form {
+      padding: 20px 0;
+      /deep/.el-form-item {
+        margin-bottom: 5px;
+      }
+      /deep/.el-form-item__label {
+        padding: 0 0;
+        font-weight: bold;
+        color: #000;
+        font-size: 16px;
+      }
+    }
   }
 }
 </style>

src/views/questionnaire/index.vue

@@ -47,7 +47,7 @@ export default {
   },
   methods: {
     ...questionnaire(['query']),
-    async search({ skip = 0, limit = 10 } = {}) {
+    async search({ skip = 0, limit = 5 } = {}) {
       const res = await this.query({ skip, limit });
       if (this.$checkRes(res)) {
         this.$set(this, `list`, res.data);