feat faq

src/api/help.js

@@ -0,0 +1,11 @@
+import { get, post, postJson } from './http.js';
+
+// 帮助中心栏目
+export const helpList = (params) => {
+  return get('app/common/help', params)
+}
+
+//帮助中心内容
+export const helpDetail = (params) => {
+  return get('app/common/help_detail', params)
+}

src/common/sider.vue

@@ -1,170 +1,198 @@
 <template>
-    <el-aside style="width: 254px;">
-      <div class="sidebar">
-        <div class="side-logo">
-          <img @click="$router.push({path:'/'})" src="/static/image/logo.png" class="logo" />
-        </div>
-        <el-menu class="sidebar-el-menu" :default-active="$route.path" :collapse="collapse" background-color="#00152A"
-          text-color="#bfcbd9" active-text-color="#20a0ff" router>
-          <template v-for="item in items">
-            <template v-if="item.children">
-              <el-submenu :index="item.path" :key="item.path">
-                <template slot="title">
-                  <!-- <i :class="[item.icon,'aliFamily']"></i> -->
-                  <img v-if="item.icon" class="side-bar-icon" :src="item.icon" />
-                  <span slot="title">{{ item.title }}</span>
-                </template>
-                <template v-for="subItem in item.children">
-                  <el-submenu v-if="subItem.children" :index="subItem.path" :key="subItem.path">
-                    <template slot="title">{{ subItem.title }}</template>
-                    <el-menu-item v-for="(threeItem,i) in subItem.children" :key="i" :index="threeItem.path">
-                      {{ threeItem.title }}</el-menu-item>
-                  </el-submenu>
-                  <el-menu-item v-else :index="subItem.path" :key="subItem.path">{{ subItem.title }}</el-menu-item>
-                </template>
-              </el-submenu>
-            </template>
-            <template v-else>
-              <el-menu-item :index="item.path" :key="item.path">
+  <el-aside style="width: 254px;">
+    <div class="sidebar">
+      <div class="side-logo">
+        <img @click="$router.push({path:'/'})" src="/static/image/logo.png" class="logo" />
+      </div>
+      <el-menu class="sidebar-el-menu" :default-active="$route.path" :collapse="collapse" background-color="#00152A" text-color="#bfcbd9" active-text-color="#20a0ff" router>
+        <template v-for="item in items">
+          <template v-if="item.children">
+            <el-submenu :index="item.path" :key="item.path">
+              <template slot="title">
                 <!-- <i :class="[item.icon,'aliFamily']"></i> -->
-                <img :src="item.icon" class="side-bar-icon" v-if="item.icon" />
+                <img v-if="item.icon" class="side-bar-icon" :src="item.icon" />
                 <span slot="title">{{ item.title }}</span>
-              </el-menu-item>
-            </template>
+              </template>
+              <template v-for="subItem in item.children">
+                <el-submenu v-if="subItem.children" :index="subItem.path" :key="subItem.path">
+                  <template slot="title">{{ subItem.title }}</template>
+                  <el-menu-item v-for="(threeItem,i) in subItem.children" :key="i" :index="threeItem.path">
+                    {{ threeItem.title }}</el-menu-item>
+                </el-submenu>
+                <el-menu-item v-else :index="subItem.path" :key="subItem.path">{{ subItem.title }}</el-menu-item>
+              </template>
+            </el-submenu>
           </template>
-        </el-menu>
-      </div>
-    </el-aside>
+          <template v-else>
+            <el-menu-item :index="item.path" :key="item.path">
+              <!-- <i :class="[item.icon,'aliFamily']"></i> -->
+              <img :src="item.icon" class="side-bar-icon" v-if="item.icon" />
+              <span slot="title">{{ item.title }}</span>
+            </el-menu-item>
+          </template>
+        </template>
+      </el-menu>
+    </div>
+  </el-aside>
 </template>
 
 <script>
-  import bus from '../common/bus'
-  import router from '../router/index.js';
-  export default {
-    data() {
-      return {
-        collapse: false,
-        //items: []
-        items: [
-          {
-            path: '/',
-            name: 'home',
-            title: '一键发单',
-            icon: '/static/image/order-icon.png',
-            children: [
-              {
-                path: '/',
-                name: 'HomeIndex',
-                title: '订单列表',
-              },
-              {
-                path: '/orderSearch',
-                name: 'orderSearch',
-                title: '订单查询',
-              },
-              {
-                path: '/manualCreate',
-                name: 'manualCreate',
-                title: '手动发单',
-              }
-            ]
-          },
-          {
-            path: '/shopInfo',
-            name: 'shopInfo',
-            title: '商户信息',
-            icon: '/static/image/shop-icon.png',
-            children: [
-              {
-                path: '/shopInfo/shopInfos',
-                name: 'shopInfos',
-                title: '门店管理',
-              },
-              {
-                path: '/shopInfo/shopAccount',
-                name: 'shopInfos',
-                title: '我的账户',
-              }
-            ]
-          },
-          {
-            path: '/setUp/set',
-            name: 'setUp',
-            title: '设置',
-            icon: '/static/image/setting-icon.png'
-          }
-        ]
-      }
-    },
-    created() {
-      console.log(router.options.routes)
-      //this.items = [...router.options.routes];
-      // 通过 Event Bus 进行组件间通信，来折叠侧边栏
-      bus.$on('collapse', msg => {
-        this.collapse = msg
-        bus.$emit('collapse-content', msg)
-      })
-    }
-  }
+import bus from "../common/bus";
+import router from "../router/index.js";
+export default {
+  data() {
+    return {
+      collapse: false,
+      //items: []
+      items: [
+        {
+          path: "/",
+          name: "home",
+          title: "一键发单",
+          icon: "/static/image/order-icon.png",
+          children: [
+            {
+              path: "/",
+              name: "HomeIndex",
+              title: "订单列表",
+            },
+            {
+              path: "/orderSearch",
+              name: "orderSearch",
+              title: "订单查询",
+            },
+            {
+              path: "/manualCreate",
+              name: "manualCreate",
+              title: "手动发单",
+            },
+          ],
+        },
+        {
+          path: "/shopInfo",
+          name: "shopInfo",
+          title: "商户信息",
+          icon: "/static/image/shop-icon.png",
+          children: [
+            {
+              path: "/shopInfo/shopInfos",
+              name: "shopInfos",
+              title: "门店管理",
+            },
+            {
+              path: "/shopInfo/shopAccount",
+              name: "shopInfos",
+              title: "我的账户",
+            },
+          ],
+        },
+        {
+          path: "/setUp",
+          name: "setUp",
+          title: "设置",
+          icon: "/static/image/setting-icon.png",
+          children: [
+            {
+              path: "/setUp/set",
+              name: "set",
+              title: "外卖设置",
+            },
+            {
+              path: "/setUp/addressManagement",
+              name: "addressManagement",
+              title: "常用地址",
+            },
+            {
+              path: "/setUp/pictureManagement",
+              name: "pictureManagement",
+              title: "图片管理",
+            },
+          ],
+        },
+        {
+          path: "/help",
+          name: "help",
+          title: "帮助中心",
+          icon: "/static/image/help-icon.png",
+        },
+        {
+          path: "/about",
+          name: "about",
+          title: "关于我们",
+          icon: "/static/image/about-icon.png",
+        },
+      ],
+    };
+  },
+  created() {
+    console.log(router.options.routes);
+    //this.items = [...router.options.routes];
+    // 通过 Event Bus 进行组件间通信，来折叠侧边栏
+    bus.$on("collapse", (msg) => {
+      this.collapse = msg;
+      bus.$emit("collapse-content", msg);
+    });
+  },
+};
 </script>
 
 <style lang='scss' scoped='scoped'>
-  /deep/ .el-submenu .el-menu-item {
-    padding-left: 76px !important;
-  }
-  /deep/ .el-menu-item.is-active {
-    color: #fff !important;
-    background-color: #0C2B47 !important;
-    border-right: 6px solid #009CFF;
-  }
-  .sidebar {
-    display: block;
-    position: absolute;
-    left: 0;
-    top: 0;
-    bottom: 0;
-    box-sizing: border-box;
-    padding-top: 80px;
-  }
-  .side-logo {
-    width: 100%;
-    height: 80px;
-    box-sizing: border-box;
-    padding-top: 18px;
-    position: absolute;
-    top: 0;
-    left: 0;
-    z-index: 400;
-    background-color: #fff;
-    font-size: 0;
-    padding-left: 32px;
-    cursor: pointer;
-  }
-  .logo {
-    width: 204px;
-    height: 44px;
-  }
-  .side-bar-icon {
-    width: 21px;
-    height: 21px;
-    margin-right: 18px;
-    margin-left: 14px;
-  }
-  .aliFamily {
-    font-size: 24px;
-    margin-right: 10px;
-  }
+/deep/ .el-submenu .el-menu-item {
+  padding-left: 76px !important;
+}
+/deep/ .el-menu-item.is-active {
+  color: #fff !important;
+  background-color: #0c2b47 !important;
+  border-right: 6px solid #009cff;
+}
+.sidebar {
+  display: block;
+  position: absolute;
+  left: 0;
+  top: 0;
+  bottom: 0;
+  box-sizing: border-box;
+  padding-top: 80px;
+}
+.side-logo {
+  width: 100%;
+  height: 80px;
+  box-sizing: border-box;
+  padding-top: 18px;
+  position: absolute;
+  top: 0;
+  left: 0;
+  z-index: 400;
+  background-color: #fff;
+  font-size: 0;
+  padding-left: 32px;
+  cursor: pointer;
+}
+.logo {
+  width: 204px;
+  height: 44px;
+}
+.side-bar-icon {
+  width: 21px;
+  height: 21px;
+  margin-right: 18px;
+  margin-left: 14px;
+}
+.aliFamily {
+  font-size: 24px;
+  margin-right: 10px;
+}
 
-  .sidebar::-webkit-scrollbar {
-    width: 0;
-  }
+.sidebar::-webkit-scrollbar {
+  width: 0;
+}
 
-  .sidebar-el-menu:not(.el-menu--collapse) {
-    width: 254px;
-    box-sizing: border-box;
-  }
+.sidebar-el-menu:not(.el-menu--collapse) {
+  width: 254px;
+  box-sizing: border-box;
+}
 
-  .sidebar>ul {
-    height: 100%;
-  }
+.sidebar > ul {
+  height: 100%;
+}
 </style>

src/components/about.vue

@@ -0,0 +1,91 @@
+<template>
+  <div class="about">
+    <div class="about-bg">
+      <div class="name">猎豹AI</div>
+      <div class="des">智能聚合运力平台</div>
+      <img class="download" src="../../static/image/download.png" alt="">
+      <div class="scan">扫码下载APP</div>
+      <div class="version">
+        <img class="pc" src="../../static/image/pc-icon.png" alt="">
+        <div class="versoin-num">猎豹AI聚合配送PC版版本V1.0.1</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: "about",
+  data() {
+    return {};
+  },
+  // 监听属性 类似于data概念
+  computed: {},
+  // 监控data中的数据变化
+  watch: {},
+
+  // 生命周期 - 创建完成（可以访问当前this实例）
+  created() {},
+  // 生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  // 方法集合
+  methods: {},
+};
+</script>
+
+<style lang="scss" scoped  type="text/css">
+.about {
+  display: flex;
+  justify-content: center;
+  margin-top: 150px;
+  .about-bg {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    background: url("../../static/image/about-bg.png");
+    background-size: 100% 100%;
+    width: 372px;
+    height: 268px;
+    .name {
+      font-weight: bold;
+      font-size: 40px;
+      color: #eb5605;
+      letter-spacing: 10px;
+    }
+    .des {
+      font-size: 16px;
+      color: #333;
+      letter-spacing: 10px;
+    }
+    .download {
+      margin-top: 10px;
+      width: 150px;
+      height: 150px;
+    }
+    .scan {
+      margin-top: 10px;
+      font-size: 14px;
+      color: #333;
+    }
+    .version {
+      margin-top: 20px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background: #eb5605;
+      opacity: 0.6;
+      border-radius: 29px;
+      padding: 10px 20px;
+      .pc {
+        width: 21px;
+        height: 21px;
+        margin-right: 10px;
+      }
+      .versoin-num {
+        font-size: 12px;
+        color: #fff;
+      }
+    }
+  }
+}
+</style>

src/components/settingComponents/addressManagement.vue

@@ -23,7 +23,7 @@
       <el-form ref="form" :model="form" label-width="100px" label-position="left" size="small">
         <el-form-item label="位置" required>
           <el-input v-model="form.address" placeholder="请选择位置！" disabled>
-            <el-image @click="showMap" slot="append" class="map" src="../../static/image/icon_map.png"></el-image>
+            <el-image @click="showMap" slot="append" class="map" src="../static/image/icon_map.png"></el-image>
           </el-input>
         </el-form-item>
         <el-form-item label="门牌号">
@@ -50,7 +50,7 @@
 </template>
 
 <script>
-import orderMap from "../orderComponents/orderAMap.vue";
+import orderMap from "./orderComponents/orderAMap.vue";
 import {
   getAddressList,
   deleteAddress,
@@ -58,7 +58,7 @@ import {
   updateAddress,
   getAddressDetail,
   defaultAddress,
-} from "../../api/setting.js";
+} from "../api/setting.js";
 export default {
   name: "addressManagement",
   data() {

src/components/help.vue

@@ -0,0 +1,104 @@
+<template>
+  <div class="help">
+    <div class="help-content">
+      <div class="menu">
+        <el-menu :default-openeds="openeds"  default-active="0" class="el-menu-vertical-demo" @open="handleOpen" @close="handleClose">
+          <el-submenu :index="i" v-for="(v,i) in helpList" :key="i">
+            <template slot="title">
+              <span>{{v.firstColumnNames}}</span>
+            </template>
+            <el-menu-item-group v-for="(item,index) in v.helpSeconds" :key="index">
+              <template slot="title">
+                <span class="title">{{item.secondColumnNames}}</span>
+              </template>
+            </el-menu-item-group>
+          </el-submenu>
+        </el-menu>
+      </div>
+      <div class="content">
+
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { helpList, helpDetail } from "../api/help.js";
+export default {
+  name: "help",
+  data() {
+    return {
+      helpList: [],
+      detailList: [],
+      openeds: []
+    };
+  },
+  // 监听属性 类似于data概念
+  computed: {},
+  // 监控data中的数据变化
+  watch: {},
+
+  // 生命周期 - 创建完成（可以访问当前this实例）
+  created() {
+    this.getHelpList();
+  },
+  // 生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  // 方法集合
+  methods: {
+    getHelpList() {
+      helpList().then((res) => {
+        console.log(res);
+        if (res.code === 200) {
+          this.helpList = res.data;
+          this.openeds = this.helpList.map((v,i)=>{
+            return i
+          })
+          this.getDetail(this.helpList[0].helpSeconds[0].secondColumnId);
+        } else {
+          this.$message({
+            type: "error",
+            message: res.msg,
+          });
+        }
+      });
+    },
+    getDetail(secondColumnId) {
+      helpDetail({ secondColumnId }).then((res) => {
+        if (res.code === 200) {
+          this.detailList = res.data;
+        } else {
+          this.$message({
+            type: "error",
+            message: res.msg,
+          });
+        }
+      });
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped  type="text/css">
+.help {
+  height:100%;
+  .help-content {
+    display: flex;
+    justify-content: space-between;
+    height:100%;
+    .menu {
+      height:100%;
+      width: 250px;
+      /deep/ ul {
+        height: 100%;
+      }
+      .title {
+        cursor: pointer;
+      }
+    }
+    .content {
+      width: calc(100% - 260px)
+    }
+  }
+}
+</style>

src/components/manualCreate.vue

@@ -149,7 +149,7 @@
 </template>
 <script>
 import orderMap from "./orderComponents/orderAMap.vue";
-import addressManagement from "../components/settingComponents/addressManagement.vue";
+import addressManagement from "./addressManagement.vue";
 import { getProductList } from "../api/shop.js";
 import { sendValuation, saveOrder, getAddressList } from "../api/order.js";
 import sendOrderPopup from "../components/orderComponents/sendOrderPopup.vue";

src/components/pictureManagement.vue

@@ -0,0 +1,26 @@
+<template>
+  <div>11111111</div>
+</template>
+
+<script>
+export default {
+  name: "pictureManagement",
+  data() {
+    return {};
+  },
+  // 监听属性 类似于data概念
+  computed: {},
+  // 监控data中的数据变化
+  watch: {},
+
+  // 生命周期 - 创建完成（可以访问当前this实例）
+  created() {},
+  // 生命周期 - 挂载完成（可以访问DOM元素）
+  mounted() {},
+  // 方法集合
+  methods: {},
+};
+</script>
+
+<style lang="scss" scoped  type="text/css">
+</style>

src/components/set.vue

@@ -21,7 +21,6 @@
 <script>
 import voiceSetting from "./settingComponents/voiceSetting.vue";
 import deliverySetting from "./settingComponents/deliverySetting.vue";
-import addressManagement from "./settingComponents/addressManagement.vue";
 export default {
   name: "HelloWorld",
   data() {
@@ -29,7 +28,6 @@ export default {
       tabList: [
         { name: "自动接单/语音设置", index: 0,activeName: 'voiceSetting' },
         { name: "推荐/屏蔽运力", index: 1,activeName: 'deliverySetting' },
-        { name: "常用地址", index: 2,activeName: 'addressManagement' },
       ],
       tabNum: 0,
       activeName: "voiceSetting",
@@ -39,7 +37,6 @@ export default {
   components: {
     voiceSetting,
     deliverySetting,
-    addressManagement,
   },
   methods: {
     forceRerender() {

src/router/index.js

@@ -34,10 +34,22 @@ const router = new Router({
         {
           path: '/setUp/set',
           name: 'set',
-          title: '订单',
+          title: '外卖设置',
           component: () => import('../components/set.vue')
         },
         {
+          path: '/setUp/addressManagement',
+          name: 'addressManagement',
+          title: '常用地址',
+          component: () => import('../components/addressManagement.vue')
+        },
+        {
+          path: '/setUp/pictureManagement',
+          name: 'pictureManagement',
+          title: '图片管理',
+          component: () => import('../components/pictureManagement.vue')
+        },
+        {
           path: '/shopInfo/shopInfos',
           name: 'shopInfos',
           title: '门店管理',
@@ -55,6 +67,18 @@ const router = new Router({
           title: '手动发单',
           component: () => import('../components/manualCreate.vue')
         },
+        {
+          path: '/help',
+          name: 'help',
+          title: '帮助中心',
+          component: () => import('../components/help.vue')
+        },
+        {
+          path: '/about',
+          name: 'about',
+          title: '关于我们',
+          component: () => import('../components/about.vue')
+        },
 
       ]
     },