增加常见问题模块

package.json

@@ -61,6 +61,7 @@
     "vue": "2.6.10",
     "vue-count-to": "1.0.13",
     "vue-cropper": "0.4.9",
+    "vue-quill-editor": "^3.0.6",
     "vue-router": "3.0.2",
     "vue-splitpane": "1.0.4",
     "vuedraggable": "2.20.0",

src/api/baseManage/issues.js

@@ -0,0 +1,46 @@
+import request from '@/utils/request'
+
+// 查询参数列表
+export function listInssues(data) {
+  return request({
+    url: '/system/carbon/problem/list',
+    method: 'post',
+    data: data
+  })
+}
+
+//问题新增
+export function addInssues(data) {
+  return request({
+    url: '/system/carbon/problem',
+    method: 'post',
+    data: data
+  })
+}
+
+//问题更新
+export function updateInssues(data) {
+  return request({
+    url: '/system/carbon/problem',
+    method: 'put',
+    data: data
+  })
+}
+
+//问题删除
+export function delInssues(query) {
+  return request({
+    url: '/system/carbon/problem/del',
+    method: 'get',
+    params: query
+  })
+}
+
+//问题状态
+export function issuesStatus(query) {
+  return request({
+    url: '/system/carbon/problem/disen',
+    method: 'get',
+    params: query
+  })
+}

src/views/baseManage/issues/index.vue

@@ -0,0 +1,247 @@
+<template>
+  <div class="app-container">
+      <el-form :model="queryParams" ref="queryForm" :inline="true" v-show="showSearch" label-width="68px">
+        <el-form-item>
+          <el-input
+            v-model="queryParams.problemName"
+            placeholder="请输入问题关键字"
+            clearable
+            size="small"
+            style="width: 240px"
+            @keyup.enter.native="handleQuery"
+          />
+        </el-form-item>
+        <el-form-item>
+          <el-select v-model="queryParams.state" placeholder="问题状态">
+              <el-option v-for="(item,index) in issuesSate" :label="item.label" :value="item.id" ></el-option>
+            </el-select>
+          </el-form-item>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
+          <el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
+        </el-form-item>
+      </el-form>
+      <el-row :gutter="10" class="mb8">
+        <el-col :span="1.5">
+          <el-button
+            type="primary"
+            icon="el-icon-plus"
+            size="mini"
+            @click="handleAdd"
+            v-hasPermi="['baseManage:companyType:add']"
+          >新增问题</el-button>
+        </el-col>
+        <right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
+      </el-row>
+      <el-table v-loading="loading" :data="list">
+        <el-table-column label="序号" type="index" width="50" align="center" />
+        <el-table-column label="问题名称" align="center" prop="problemName" />
+        <el-table-column label="问题状态" align="center" prop="createTime">
+          <template slot-scope="scope">
+              <el-switch
+                v-model="scope.row.state"
+                style="display: block"
+                @change="handelUserStatus($event,scope.row)"
+                :active-value="0"
+                :inactive-value="1"
+                v-hasPermi="['customerManage:customers:uStatus']"
+                active-text="启用"
+                inactive-text="禁用">
+              </el-switch>
+          </template>
+        </el-table-column>
+
+        <el-table-column label="创建时间" align="center" prop="createTime" width="160">
+          <template slot-scope="scope">
+            <span>{{ parseTime(scope.row.createTime) }}</span>
+          </template>
+        </el-table-column>
+        <el-table-column
+          label="操作"
+          align="center"
+          width="280"
+          class-name="small-padding fixed-width"
+        >
+          <template slot-scope="scope">
+            <el-button
+              size="mini"
+              type="primary"
+              icon="el-icon-view"
+              @click="handleView(scope.row)"
+              v-hasPermi="['baseManage:companyType:view']"
+            >查看</el-button>
+            <el-button
+              size="mini"
+              type="success"
+              icon="el-icon-edit"
+              @click="handleEdit(scope.row)"
+              v-hasPermi="['baseManage:companyType:edit']"
+            >编辑</el-button>
+            <el-button
+              size="mini"
+              type="danger"
+              @click="handleDelete(scope.row)"
+              v-hasPermi="['baseManage:companyType:del']"
+              icon="el-icon-delete"
+            >删除</el-button>
+          </template>
+        </el-table-column>
+      </el-table>
+      <pagination
+        v-show="total>0"
+        :total="total"
+        :page.sync="queryParams.pageNo"
+        :limit.sync="queryParams.pageSize"
+        @pagination="getList"
+      />
+      <add-mobiel
+      			v-if="modal.visibleModal"
+      			:title="modal.title"
+      			:action="modal.action"
+      			:visible="modal.visibleModal"
+      			:selectRow="modal.selectRow"
+      			@closeModal="closeModal">
+      		</add-mobiel>
+  </div>
+</template>
+<script>
+import { listInssues , delInssues , issuesStatus } from "@/api/baseManage/issues";
+import addMobiel from './modal/addMobiel'
+export default {
+  name: "issues",
+  components: {
+    addMobiel
+  },
+  data() {
+    return {
+      // 遮罩层
+      loading: false,
+      // 显示搜索条件
+      showSearch: true,
+      // 总条数
+      total: 0,
+      // 表格数据
+      list: null,
+      // 状态数据字典
+      statusOptions: [],
+      // 表单参数
+      form: {},
+      issuesSate:[
+        {
+          id:0,
+          label:'启用'
+        },
+        {
+          id:1,
+          label:'禁用'
+        }
+      ],
+      //弹出层
+      modal:{
+        action:'',
+        title:'',
+        visibleModal:false,
+        selectRow:null
+      },
+      // 查询参数
+      queryParams: {
+        pageNo: 1,
+        pageSize: 10
+      }
+    };
+  },
+  created() {
+    this.getList();
+  },
+  methods: {
+    /** 查询产婆类别列表 */
+    getList() {
+      this.loading = true;
+      listInssues(this.queryParams).then(res => {
+          if(res.retHead.errCode == 0){
+            this.list = res.retBody
+            this.total = res.retHead.total;
+          }
+          this.loading = false;
+        }
+      );
+    },
+    /** 搜索按钮操作 */
+    handleQuery() {
+      this.queryParams.pageNo = 1;
+      this.getList();
+    },
+    /** 重置按钮操作 */
+    resetQuery() {
+      this.queryParams = {
+        pageNo:1,
+        pageSize:10,
+      }
+      this.handleQuery();
+    },
+    /** 新增按钮操作 */
+    handleAdd() {
+        this.modal.visibleModal = true
+        this.modal.title = '新增问题'
+        this.modal.action = 'add'
+    },
+    /** 查看按钮操作 */
+    handleView(item){
+        this.modal.visibleModal = true
+        this.modal.title = '问题详情'
+        this.modal.action = 'view'
+        this.modal.selectRow = item
+    },
+    /** 查看按钮操作 */
+    handleEdit(item){
+        this.modal.visibleModal = true
+        this.modal.title = '编辑问题'
+        this.modal.action = 'edit'
+        this.modal.selectRow = item
+    },
+    /** 删除按钮操作 */
+    handleDelete(item) {
+      console.log(item)
+      let params = {
+        guid:item.guid
+      }
+      this.$confirm('是否确认删除该数据项?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+          return delInssues(params);
+        }).then(() => {
+          this.getList();
+          this.msgSuccess("删除成功");
+        }).catch(function() {});
+    },
+    //更改文章状态
+    handelUserStatus(val,row){
+      let params = {
+        guid:row.guid,
+        state:val
+      }
+      let _this = this;
+      this.$confirm('你确定是否改变改客户的账号状态?', "警告", {
+          confirmButtonText: "确定",
+          cancelButtonText: "取消",
+          type: "warning"
+        }).then(function() {
+            return issuesStatus(params);
+        }).then(() => {
+            _this.getList();
+            _this.msgSuccess("操作成功");
+        }).catch(function() {
+            _this.getList()
+        });
+    },
+    //窗口关闭
+    closeModal(flag = false){
+      this.modal.visibleModal = false
+      flag && this.getList()
+    }
+  }
+};
+</script>

src/views/baseManage/issues/modal/addMobiel.vue

@@ -0,0 +1,171 @@
+<template>
+  <el-dialog
+    :title="modalTitle"
+    :visible.sync="modalVisible"
+    :width="formLabelWidth"
+    top="2vh"
+    @close="handleCancel">
+    <div class="mobile">
+        <el-form label-width="90px" :model="form" :rules="rules" ref="from" class="from">
+            <el-form-item label="问题名称:" prop="problemName">
+                <el-input type="text" v-model="form.problemName" :disabled="limit.isRead"></el-input>
+            </el-form-item>
+            <el-form-item label="问题状态:">
+                <el-radio-group v-model="form.state" :disabled="limit.isRead">
+                  <el-radio :label="item.id" v-for="(item,index) in issuesSate">{{item.label}}</el-radio>
+                </el-radio-group>
+            </el-form-item>
+            <el-form-item label="问题内容:" prop="problemAnswer">
+                <quill-editor
+                  ref="text"
+                  :disabled="limit.isRead"
+                  v-model="form.problemAnswer"
+                  class="myQuillEditor"
+                  :options="editorOption" />
+            </el-form-item>
+        </el-form>
+    </div>
+    <div slot="footer" class="dialog-footer">
+      <el-button @click="handleCancel">取 消</el-button>
+      <el-button type="primary" @click="submit" v-if="!limit.isRead">确 定</el-button>
+    </div>
+  </el-dialog>
+</template>
+
+<script>
+import 'quill/dist/quill.core.css'
+import 'quill/dist/quill.snow.css'
+import 'quill/dist/quill.bubble.css'
+import { quillEditor } from 'vue-quill-editor'
+import { addInssues , updateInssues } from "@/api/baseManage/issues";
+export default {
+  name: 'addMobiel',
+  components:{
+    quillEditor
+  },
+  props: {
+    visible: {
+      type: Boolean,
+      default: false
+    },
+    title: {
+      type: String,
+      default: 'title'
+    },
+    action: {
+      type: String,
+      default: 'add'
+    },
+    selectRow: {
+      type: Object,
+      default:null
+    }
+  },
+  watch: {
+    visible(newVal, oldVal) {
+      this.modalVisible = newVal;
+    },
+    title(newVal, oldVal) {
+      this.modalTitle = newVal;
+    },
+    action(newVal, oldVal) {
+      this.modalAction = newVal;
+    },
+    selectRow(newVal, oldVal) {
+      this.modalSelectRow = newVal;
+    }
+  },
+  data() {
+    return {
+      modalTitle: this.title,
+      modalVisible: this.visible,
+      modalAction: this.action,
+      modalSelectRow: this.selectRow,
+      formLabelWidth: '924px',
+      //窗口权限
+      limit: {
+        isRead: false, //是否只读
+        isAdd: false //是否可写
+      },
+      //验证
+      rules: {
+        problemName: [{ required: true, message: '问题名称不能为空!', trigger: 'blur' }],
+      },
+      issuesSate:[
+        {
+          id:0,
+          label:'启用'
+        },
+        {
+          id:1,
+          label:'禁用'
+        }
+      ],
+      //属性
+      content: '',
+      editorOption: {},
+      //表单
+      form: {
+        state:0
+      }
+    };
+  },
+  created() {
+    console.log(this.modalSelectRow)
+    switch (this.modalAction) {
+      case 'add':
+        this.limit.isAdd = true;
+        break;
+      case 'edit':
+        this.limit.isAdd = true;
+        this.form = Object.assign({},this.modalSelectRow)
+        break;
+      case 'view':
+        this.limit.isRead = true;
+        this.form = Object.assign({},this.modalSelectRow)
+        break;
+      default:
+        break;
+    }
+  },
+  methods: {
+    //表单提交
+    submit() {
+      this.$refs.from.validate(valid => {
+        if (valid) {
+          let params = Object.assign({},this.form)
+          if(this.modalAction === 'add'){
+            addInssues(params).then(res => {
+                if (res.retHead.errCode === 0) {
+                  this.msgSuccess("操作成功");
+                  this.modalVisible = false
+                 	this.$emit('closeModal', true);
+                }
+            });
+          }else{
+            updateInssues(params).then(res => {
+                if (res.retHead.errCode === 0) {
+                  this.msgSuccess("操作成功");
+                  this.modalVisible = false
+                 	this.$emit('closeModal', true);
+                }
+            });
+          }
+        } else {
+          return false;
+        }
+      });
+    },
+    //窗口关闭
+    handleCancel() {
+      this.$emit('closeModal', false);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped>
+  ::v-deep  .ql-editor{
+  	height:300px;
+  }
+</style>