edit

admin/src/api/qa.js

@@ -0,0 +1,38 @@
+import request from '@/utils/request'
+
+export function login(data) {
+  return request({
+    url: '/admin/login',
+    method: 'post',
+    data
+  })
+}
+
+// 获取城市列表
+export function getCityList() {
+  return request({
+    url: '/admin/city/getCityList',
+    method: 'get'
+  })
+}
+
+// 获取子集列表
+export function getQaList(city_id) {
+  return request({
+    url: '/admin/qa/getQaList',
+    method: 'get',
+    params: {
+      city_id
+    }
+  })
+}
+// 获取qa详情
+export function getQaDetail(city_id) {
+  return request({
+    url: 'admin/qa/getQaDetail',
+    method: 'get',
+    params: {
+      city_id
+    }
+  })
+}

admin/src/layout/components/Navbar.vue

@@ -8,14 +8,16 @@
       <template v-if="device!=='mobile'">
         <!-- <search id="header-search" class="right-menu-item" /> -->
 
-        <screenfull id="screenfull" class="right-menu-item hover-effect" />
+        <!-- <screenfull id="screenfull" class="right-menu-item hover-effect" />
 
         <el-tooltip content="Global Size" effect="dark" placement="bottom">
           <size-select id="size-select" class="right-menu-item hover-effect" />
-        </el-tooltip>
+        </el-tooltip> -->
 
       </template>
-
+      <div class="right-menu-item hover-effect">
+        <el-button @click="drawer = true">QA常见问题</el-button>
+      </div>
       <div v-if="$store.getters.is_anchor" class="right-menu-item hover-effect">
         <el-button @click="dialogWorks = true">排班{{ $store.getters.name }}</el-button>
       </div>
@@ -116,7 +118,28 @@
         <el-button type="primary" @click="saveWork">确 定</el-button>
       </div>
     </el-dialog>
-
+    <el-drawer
+      :with-header="false"
+      :visible.sync="drawer"
+      size="800px"
+      direction="rtl"
+      :modal="false"
+      :before-close="handleClose"
+    >
+      <div v-clickoutside="handleClose" class="drawer">
+        <el-button v-if="QaShow" type="success" @click="drawer = false">关 闭</el-button>
+        <el-button v-if="!QaShow" type="success" @click="QaShow = true">返 回</el-button>
+        <div v-if="QaShow" class="mod">
+          <el-button v-for="item in getCityList" style="width: 150px;" size="medium" type="primary" @click="getQaDetail(item.city_id)">
+            {{ item.city_name }}
+          </el-button>
+        </div>
+        <div v-if="QaInfo && !QaShow" class="ver">
+          <div class="ver_title">{{ QaInfo.title }}</div>
+          <div class="ver_content">{{ QaInfo.content }}</div>
+        </div>
+      </div>
+    </el-drawer>
   </div>
 </template>
 
@@ -130,8 +153,10 @@ import Search from '@/components/HeaderSearch'
 import { color } from 'echarts/lib/export'
 import sidebar from '@/layout/components/Sidebar/index.vue'
 import avatar from 'element-ui/packages/avatar'
-
+import { getCityList, getQaList, getQaDetail } from '@/api/qa'
+import clickoutside from 'element-ui/src/utils/clickoutside'
 export default {
+  directives: { clickoutside },
   components: {
     Breadcrumb,
     Hamburger,
@@ -157,17 +182,24 @@ export default {
   data() {
     return {
       workstatus: false,
+      drawer: false,
       showAvatar: false,
       dialogPWD: false,
       dialogWorks: false,
       centerDialogVisible: false,
       imageUrl: false,
+      QaShow: true,
       os: [],
+      getCityList: [],
       times: [],
       form: {
         oldpwd: '',
         pwd: ''
       },
+      QaInfo: {
+        title: '',
+        content: ''
+      },
       rules: {
         oldpwd: [
           { required: true, message: '请输入旧密码', trigger: 'blur' },
@@ -182,12 +214,32 @@ export default {
   },
   created() {
     this.getworkstatus()
+    getCityList().then(res => {
+      this.getCityList = res.data
+    })
   },
   methods: {
     color,
     toggleSideBar() {
       this.$store.dispatch('app/toggleSideBar')
     },
+    handleClose() {
+      this.drawer = false
+      this.QaShow = true
+    },
+    getQaDetail(id) {
+      getQaDetail(id).then(res => {
+        this.QaInfo = res.data
+        if (!this.QaInfo) {
+          return this.$message({
+            message: '暂无QA问题',
+            type: 'warning',
+            duration: 1500
+          })
+        }
+        this.QaShow = false
+      })
+    },
     async logout() {
       await this.$store.dispatch('user/logout')
       this.$router.push(`/login?redirect=${this.$route.fullPath}`)
@@ -264,6 +316,22 @@ export default {
 </script>
 
 <style lang="scss" scoped>
+.drawer{
+  padding: 20px 0 0 20px;
+  width: 100%;
+  height: 100vh;
+}
+.mod{
+  margin-top: 50px;
+}
+.ver{
+  margin-top: 20px;
+  &_title{
+    font-size: 24px;
+    color: #1890ff;
+    margin-bottom: 20px;
+  }
+}
 .navbar {
   height: 50px;
   overflow: hidden;

admin/vue.config.js

@@ -38,13 +38,13 @@ module.exports = {
     },
     proxy: {
       '/dev-api': { // 接口地址 以 api开头的都走下面的配置
-        target: 'http://127.0.0.1:8787', // 代理目标地址为后端服务器地址 127.0.0.1 192.168.1.2
+        target: 'http://192.168.1.132:8787', // 代理目标地址为后端服务器地址 127.0.0.1 192.168.1.2
         ws: true, // 是否支持 websocket 请求 支持
         changeOrigin: true, // 是否启用跨域
         pathRewrite: {
           '^/dev-api': '' // 发送请求时自动去掉开头
         },
-        onProxyReq: function(proxyReq, req, res, options) {
+        onProxyReq: function (proxyReq, req, res, options) {
           if (req.body) {
             const bodyData = JSON.stringify(req.body)
             // incase if content-type is application/x-www-form-urlencoded -> we need to change to application/json
@@ -108,7 +108,7 @@ module.exports = {
             .plugin('ScriptExtHtmlWebpackPlugin')
             .after('html')
             .use('script-ext-html-webpack-plugin', [{
-            // `runtime` must same as runtimeChunk name. default is `runtime`
+              // `runtime` must same as runtimeChunk name. default is `runtime`
               inline: /runtime\..*\.js$/
             }])
             .end()