Merge branch 'master' of http://git.cc-lotus.info/live-platform/live-cms

src/views/question/part/tiku.vue

@@ -80,28 +80,28 @@ export default {
   props: {},
   components: {},
   data: () => ({
-    list: [],
-    total: 0,
-    dialogFormVisible: false,
+    list: [], //列表
+    total: 0, //总数
+    dialogFormVisible: false, //控制dialog是否显示
     form: {
       option: [],
-    },
-    type: null,
+    }, //表单
+    type: null, //选择的类型
     typeoptions: [
       { value: '0', label: '单选' },
       { value: '1', label: '多选' },
       { value: '2', label: '问答' },
-    ],
-    status: null,
+    ], //类型选择数组
+    status: null, //选择的状态
     statusoptions: [
       { value: '0', label: '弃用' },
       { value: '1', label: '正常' },
-    ],
+    ], //状态选择数组
     rules: {
       type: { required: true, message: '类型不能为空', trigger: 'blur' },
       topic: { required: true, message: '题目不能为空', trigger: 'blur' },
       status: { required: true, message: '状态不能为空', trigger: 'blur' },
-    },
+    }, //表单验证规则
   }),
   created() {
     this.search();
@@ -109,24 +109,28 @@ export default {
   computed: {},
   methods: {
     ...question(['create', 'query', 'update', 'delete']),
+    //查询列表
     async search({ skip = 0, limit = 10, ...info } = {}) {
       info = { type: this.type, status: this.status };
       const list = await this.query({ skip, limit, ...info });
       this.$set(this, `list`, list.data);
       this.$set(this, `total`, list.total);
     },
+    //查看详情
     detailBtn(item) {
-      console.log(item);
       this.$set(this, `form`, item);
       this.dialogFormVisible = true;
     },
+    //删除
     async deleteBtn(id) {
       let res = await this.delete(id);
       if (res.errcode == 0) this.search();
     },
+    //分页
     handleCurrentChange(val) {
       this.search({ skip: (val - 1) * 10, limit: val * 10 });
     },
+    //提交表单
     async submitFrom() {
       let index = 0;
       for (const option of this.form.option) {
@@ -144,20 +148,24 @@ export default {
         this.search();
       }
     },
+    //删除选项
     removeDomain(item) {
       var index = this.form.option.indexOf(item);
       if (index !== -1) {
         this.form.option.splice(index, 1);
       }
     },
+    //新增选项
     addDomain() {
       this.form.option.push({
         opname: '',
       });
     },
+    //根据index生成选项number
     sortNumber(index) {
       return String.fromCharCode(65 + index);
     },
+    //添加
     add() {
       this.dialogFormVisible = true;
       this.form = { status: '1', option: [] };

src/views/question/part/wenjuan.vue

@@ -1,19 +1,221 @@
 <template>
   <div id="wenjuan">
-    <p>wenjuan</p>
+    <el-row>
+      <el-col :span="24">
+        <el-col class="add" :span="24">
+          <el-select v-model="status" placeholder="请选择问卷状态">
+            <el-option v-for="item in statusoptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
+          </el-select>
+          <el-button size="mini" type="primary" @click="search" style="margin-left:10px;">查询</el-button>
+          <el-button size="mini" type="primary" @click="add">添加</el-button>
+        </el-col>
+        <el-col :span="24"
+          ><el-table :data="list" border style="width: 100%">
+            <el-table-column prop="num" label="序号"> </el-table-column>
+            <el-table-column prop="name" label="问卷名称" show-overflow-tooltip> </el-table-column>
+            <el-table-column prop="status" label="状态">
+              <template slot-scope="scope">
+                <span>{{ scope.row.status == '0' ? '草稿' : scope.row.status == '1' ? '发布' : scope.row.status == '2' ? '弃用' : '未识别' }}</span>
+              </template>
+            </el-table-column>
+            <el-table-column label="操作">
+              <template slot-scope="scope">
+                <el-button size="mini" @click="detailBtn(scope.row)">查看</el-button>
+                <el-button size="mini" @click="deleteBtn(scope.row.id)" type="danger">删除</el-button>
+              </template>
+            </el-table-column>
+          </el-table>
+        </el-col>
+        <el-col :span="24" class="page">
+          <el-pagination background layout="prev, pager, next,total" :total="total" @current-change="handleCurrentChange"> </el-pagination>
+        </el-col>
+        <el-dialog title="添加问卷" :visible.sync="dialogFormVisible">
+          <el-form size="mini" :model="form" ref="form" label-width="100px" class="demo-dynamic" :rules="rules">
+            <el-form-item prop="status" label="状态">
+              <el-radio-group v-model="form.status">
+                <el-radio :label="'0'">草稿</el-radio>
+                <el-radio :label="'1'">发布</el-radio>
+                <el-radio :label="'2'">停用</el-radio>
+              </el-radio-group>
+            </el-form-item>
+            <el-form-item prop="num" label="序号">
+              <el-input v-model="form.num"></el-input>
+            </el-form-item>
+            <el-form-item prop="name" label="问卷名称">
+              <el-input v-model="form.name"></el-input>
+            </el-form-item>
+            <el-col :span="24" style="margin: 0 0 10px 0;">
+              <el-select v-model="qtype" placeholder="请选择题目类型">
+                <el-option v-for="item in qtypeoptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
+              </el-select>
+              <el-select v-model="qstatus" placeholder="请选择题目状态">
+                <el-option v-for="item in qstatusoptions" :key="item.value" :label="item.label" :value="item.value"> </el-option>
+              </el-select>
+              <el-button size="mini" type="primary" @click="searchQuestion" style="margin-left:10px;">查询</el-button>
+            </el-col>
+            <el-table
+              :row-key="getRowKey"
+              ref="multipleTable"
+              :data="questions"
+              tooltip-effect="dark"
+              style="width: 100%"
+              @selection-change="handleSelectionChange"
+            >
+              <el-table-column prop="_id" type="selection" width="55" :reserve-selection="true"> </el-table-column>
+              <el-table-column prop="type" label="类型">
+                <template slot-scope="scope">
+                  <span>{{ scope.row.type == '0' ? '单选' : scope.row.type == '1' ? '多选' : scope.row.type == '2' ? '问答' : '未识别' }}</span>
+                </template>
+              </el-table-column>
+              <el-table-column prop="topic" label="题目"> </el-table-column>
+              <el-table-column prop="status" label="状态">
+                <template slot-scope="scope">
+                  <span>{{ scope.row.status == '0' ? '弃用' : scope.row.status == '1' ? '正常' : '未识别' }}</span>
+                </template>
+              </el-table-column>
+            </el-table>
+            <el-col :span="24" class="page">
+              <el-pagination background layout="prev, pager, next,total" :total="questiontotal" @current-change="questionChange"> </el-pagination>
+            </el-col>
+          </el-form>
+          <div slot="footer" class="dialog-footer">
+            <el-button @click="dialogFormVisible = false">取 消</el-button>
+            <el-button type="primary" @click="submitFrom">确 定</el-button>
+          </div>
+        </el-dialog>
+      </el-col>
+    </el-row>
   </div>
 </template>
 
 <script>
+import { createNamespacedHelpers, mapState } from 'vuex';
+const { mapActions: questionnaire } = createNamespacedHelpers('questionnaire');
+const { mapActions: question } = createNamespacedHelpers('question');
 export default {
   name: 'wenjuan',
   props: {},
   components: {},
-  data: () => ({}),
-  created() {},
+  data: () => ({
+    list: [], //列表
+    total: 0, //总数
+    status: null, //选择的状态
+    statusoptions: [
+      { value: '0', label: '草稿' },
+      { value: '1', label: '发布' },
+      { value: '2', label: '停用' },
+    ], //状态选择数组
+    dialogFormVisible: false, //控制dialog是否显示
+    form: {},
+    questions: [], //问题数组
+    questiontotal: 0, //问题总数
+    multipleSelection: [], //选择的问题数组
+    qtype: null, //选择的问题类型
+    qtypeoptions: [
+      { value: '0', label: '单选' },
+      { value: '1', label: '多选' },
+      { value: '2', label: '问答' },
+    ], //问题类型选择数组
+    qstatus: null, //选择的问题状态
+    qstatusoptions: [
+      { value: '0', label: '弃用' },
+      { value: '1', label: '正常' },
+    ], //问题状态选择数组
+    rules: {
+      name: { required: true, message: '问卷名称不能为空', trigger: 'blur' },
+      num: { required: true, message: '序号不能为空', trigger: 'blur' },
+      status: { required: true, message: '状态不能为空', trigger: 'blur' },
+    }, //表单验证规则
+  }),
+  created() {
+    this.search();
+    this.searchQuestion();
+  },
   computed: {},
-  methods: {},
+  methods: {
+    ...questionnaire(['create', 'query', 'update', 'delete']),
+    ...question({ questionQuery: 'query' }),
+    //查询问卷列表
+    async search({ skip = 0, limit = 10, ...info } = {}) {
+      info = { status: this.status };
+      const list = await this.query({ skip, limit, ...info });
+      if (list.errcode == '0') {
+        this.$set(this, `list`, list.data);
+        this.$set(this, `total`, list.total);
+      }
+    },
+    //查询题库列表
+    async searchQuestion({ skip = 0, limit = 10, ...info } = {}) {
+      info = { type: this.qtype, status: this.qstatus };
+      const list = await this.questionQuery({ skip, limit, ...info });
+      if (list.errcode == '0') {
+        this.$set(this, `questions`, list.data);
+        this.$set(this, `questiontotal`, list.total);
+      }
+    },
+    // 查看详情
+    async detailBtn(item) {
+      this.dialogFormVisible = true;
+      this.form = item;
+      this.$nextTick(function() {
+        item.question.forEach(row => {
+          //this.multipleSelection.push(row);
+          this.$refs.multipleTable.toggleRowSelection(row);
+        });
+      });
+      console.log(this.multipleSelection);
+    },
+    //删除
+    async deleteBtn() {
+      let res = await this.delete(id);
+      if (res.errcode == 0) this.search();
+    },
+    //问卷分页
+    handleCurrentChange(val) {
+      this.search({ skip: (val - 1) * 10, limit: val * 10 });
+    },
+    //提交问卷
+    async submitFrom() {
+      this.form.question = this.multipleSelection;
+      let res = await this.create(this.form);
+      if (res.errcode == '0') {
+        this.dialogFormVisible = false;
+        this.search();
+      }
+    },
+    //添加问卷
+    add() {
+      this.dialogFormVisible = true;
+      this.qstatus = null;
+      this.qtype = null;
+      this.form = {};
+      this.multipleSelection = [];
+    },
+    //选中问题时触发
+    handleSelectionChange(val) {
+      this.multipleSelection = val;
+    },
+    //题库分页
+    questionChange(val) {
+      this.searchQuestion({ skip: (val - 1) * 10, limit: val * 10 });
+    },
+    getRowKey(row) {
+      console.log(row);
+
+      return row._id;
+    },
+  },
 };
 </script>
 
-<style lang="less" scoped></style>
+<style lang="less" scoped>
+.add {
+  margin: 0 0 10px 0;
+}
+.add .el-button:last-child {
+  float: right;
+}
+/deep/.el-dialog {
+  width: 70%;
+}
+</style>