add: 增加门店权限

src/components/set/set-permiss.vue

+<!--
+  门店权限设置组件
+
+ -->
+<template>
+  <div class="permiss-wrap">
+    <el-form label-width="110px" :model="ruleForm">
+      <el-form-item label="店员可见权限">
+        <el-radio v-model="ruleForm.radio" label="0">可见所有品牌门店架构和行政架构</el-radio>
+      </el-form-item>
+      <el-form-item label=" ">
+        <el-radio v-model="ruleForm.radio" label="1">可见所在品牌门店架构和行政架构</el-radio>
+      </el-form-item>
+      <el-form-item label=" ">
+        <el-radio v-model="ruleForm.radio" label="2">门店仅可见所有品牌门店架构</el-radio>
+      </el-form-item>
+      <el-form-item label=" ">
+        <el-radio v-model="ruleForm.radio" label="3"> 门店仅可见自己品牌门店架构</el-radio>
+      </el-form-item>
+      <el-form-item label=" ">
+        <el-radio v-model="ruleForm.radio" label="4">门店仅可见自己门店</el-radio>
+      </el-form-item>
+      <el-form-item>
+        <el-button type="primary" @click="submitForm('ruleForm')">保存</el-button>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+<script>
+import strLength from '@/common/js/strlen';
+import showMsg from '@/common/js/showmsg';
+import errMsg  from '@/common/js/error';
+import { _debounce } from "@/common/js/public";
+import { getRequest, postRequest, postJson, postForm } from '@/api/api';
+export default {
+  name: "",
+  props: {
+    imgSrc: {// 传入 input value
+      type: String,
+      default: ''
+    },
+    field: {
+      type: String,
+      default: ''
+    },
+    uploadLimit: {
+      type: Number,
+      default: 2
+    }
+
+  },
+  data() {
+    return {
+      projectName:  '', // 当前项目名
+      imgShowFlag: false, // 是否弹框显示,true: 显示；false: 不显示
+      imgUrl: '', // 传递的图片 src
+
+      ruleForm: {
+        radio: '0',
+      }
+    }
+  },
+  beforeMount() {
+    var that = this
+    var host = window.location.origin;
+    console.log("当前host:",host)
+    if (host.indexOf('localhost') != '-1') {
+      that.baseUrl = 'http://gicdev.demogic.com';
+    }else {
+      that.baseUrl = host
+    }
+
+  },
+  methods: {
+    /**
+     * 保存
+     */
+    submitForm: _debounce(function(formName) {
+      const that = this;
+      that.$refs[formName].validate((valid) => {
+        console.log(valid)
+        if (valid) {
+
+        } else {
+          return false;
+        }
+      });
+    },500),
+
+
+    /**
+     *
+     */
+
+  },
+  mounted() {
+
+  },
+}
+</script>
+<style lang="less" scoped>
+
+.w-500 {
+  width: 500px;
+}
+
+/* flex */
+.flex {
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+}
+
+.flex-1 {
+  -webkit-box-flex: 1;
+  -webkit-flex: 1;
+  -ms-flex: 1;
+  flex: 1;
+}
+
+.flex-column {
+  -webkit-flex-direction: column;
+  -moz-flex-direction: column;
+  -ms-flex-direction: column;
+  -o-flex-direction: column;
+  flex-direction: column;
+}
+
+.flex-row {
+  -webkit-flex-direction: row;
+  -moz-flex-direction: row;
+  -ms-flex-direction: row;
+  -o-flex-direction: row;
+  flex-direction: row;
+}
+
+.flex-align-center {
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+}
+
+.flex-pack-center {
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+}
+
+.avatar-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 180px;
+  height: 180px;
+  line-height: 180px;
+  text-align: center;
+}
+.avatar {
+  max-width: 180px;
+  max-height: 180px;
+  display: block;
+}
+
+.upload-tip {
+  color: #606266;
+  font-size: 12px;
+  line-height: 20px;
+}
+
+.color-1890ff {
+  color: #1890ff;
+}
+
+.permiss-wrap {
+
+}
+</style>

src/views/index/index.vue

@@ -5,8 +5,8 @@
       <div class="content-body" :style="{height: contentHeight}">
         <div class="index-swiper">
           <el-carousel trigger="click" height="250px" arrow="never" :autoplay="false">
-            <el-carousel-item v-for="item in 4" :key="item">
-              <h3>{{ item }}</h3>
+            <el-carousel-item v-for="(item,index) in bannerList" :key="index">
+              <img :src="item.src" alt=""/>
             </el-carousel-item>
           </el-carousel>
         </div>
@@ -75,6 +75,17 @@ export default {
 
       showCustomDialog: false, // 自定义弹框显示标志
 
+      bannerList: [
+        {
+          name: '',
+          src: require('../../assets/index/index_banner1.jpg'),
+        },
+        {
+          name: '',
+          src: require('../../assets/index/index_banner1.jpg'),
+        }
+      ],
+
       // 公司信息
       companyObj: {
         logo: require('../../assets/logo.png'),
@@ -265,7 +276,8 @@ export default {
       }
 
       .el-carousel__item {
-        background: url(../../assets/index/index_banner1.jpg) no-repeat center center;
+        text-align: center;
+        /*background: url(../../assets/index/index_banner1.jpg) no-repeat center center;*/
       }
       .color-303133 {
         color: #303133;

src/views/login/index.vue

@@ -46,7 +46,7 @@
                     <div class="swiper-button-next" slot="button-next"><i class="el-icon-arrow-right"></i></div>
                   </swiper>
                 </div>
-                <el-button type="primary">登录</el-button>
+                <el-button type="primary" @click="toIndex">登录</el-button>
               </div>
             </div>
           </div>
@@ -78,17 +78,17 @@ export default {
           name: '达摩网络'
         },
         {
-          id: '12334',
+          id: '123354',
           src: require("../../assets/logo.png"),
           name: '达摩网络2'
         },
         {
-          id: '1233',
+          id: '12353',
           src: require("../../assets/logo.png"),
           name: '达摩网络'
         },
         {
-          id: '12334',
+          id: '123634',
           src: require("../../assets/logo.png"),
           name: '达摩网络2'
         }
@@ -113,9 +113,11 @@ export default {
 
   },
   methods: {
-    // 处理路由跳转
+    /**
+     * 处理路由跳转
+     */
     toRouterView(val) {
-      var that = this;
+      const that = this;
       // 模拟检查数据
       // //有两个参数
       //{
@@ -127,15 +129,21 @@ export default {
         path: val.path
       })
     },
-    // 折叠事件
+
+    /**
+     *  折叠事件
+     */
     collapseTag(val){
-      var that = this;
+      const that = this;
       console.log(val);
       that.collapseFlag = val
     },
 
+    /**
+     *  生成二维码
+     */
     qrcode (text) {
-      var that = this;
+      const that = this;
       that.qrcodeCase = new QRCode('qrcode',
         {
           width: 210,
@@ -149,25 +157,35 @@ export default {
       console.log(that.qrcodeCase)
     },
 
-    // 刷新二维码
+    /**
+     *  刷新二维码
+     */
     refreshCode() {
-      var that = this;
+      const that = this;
       document.getElementById("qrcode").innerHTML = '';
       that.qrcodeCase.clear(); // 先清除原有的
       that.qrcode(5666315956663159)
       that.expiredFlag = false; //隐藏过期遮罩层
+    },
+
+    /**
+     *  登录
+     */
+    toIndex() {
+      const that = this
+      that.$router.push('/index')
     }
 
 
   },
   mounted() {
-    var that = this
+    const that = this
 
     /**
      *生成二维码
      */
 
-    that.qrcode(55555566767)
+    // that.qrcode(55555566767)
   },
   components: {
     swiper,

src/views/setting/storePermission.vue

 <template>
   <div class="storePermission-wrap common-set-wrap">
+    <nav-crumb :navpath="navpath"></nav-crumb>
+    <div class="right-content">
+      <div class="right-box">
+        <el-tabs v-model="activeName" @tab-click="handleClick">
+          <template v-for="(item,index) in brandList">
+            <el-tab-pane :label="item.name" :name="item.id">
+              {{item.name}}
+              <set-permiss></set-permiss>
+            </el-tab-pane>
+          </template>
+        </el-tabs>
+        <div class="storePermission-wrap-switch m-t-24">
+          <div class="storePermission-switch-title">
+            门店信息变更是否需要审核
+          </div>
+          <div class="storePermission-switch-body">
+            <div class="switch-cell">
+              <el-switch
+                v-model="switchList.addStatus"
+                :inactive-text="switchList.addName">
+              </el-switch>
+            </div>
+            <div class="switch-cell">
+              <el-switch
+                v-model="switchList.delStatus"
+                :inactive-text="switchList.delName">
+              </el-switch>
+            </div>
+            <div class="switch-cell">
+              <el-switch
+                v-model="switchList.modStatus"
+                :inactive-text="switchList.modName">
+              </el-switch>
+            </div>
+            <div class="switch-cell p-l-94">
+              <el-button type="primary" @click="saveSwitch">保存</el-button>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <vue-gic-footer></vue-gic-footer>
   </div>
 </template>
 <script>
+import navCrumb from '@/components/nav/nav.vue';
+import setPermiss from '@/components/set/set-permiss.vue';
 
+import strLength from '@/common/js/strlen';
+import showMsg from '@/common/js/showmsg';
+import errMsg  from '@/common/js/error';
+import { _debounce } from "@/common/js/public";
+import { getRequest, postRequest, postJson, postForm } from '@/api/api';
 export default {
   name: "storePermission",
   data() {
     return {
+      // 面包屑参数
+      navpath: [
+        {
+          name: '首页',
+          path: '/index',
+          relocation: true
+        },
+        {
+          name: '设置',
+          path: '/companyAddress'
+        },
+        {
+          name: '通讯录信息',
+          path: '/staffDetails'
+        },
+        {
+          name: '门店权限设置',
+          path: ''
+        }
+      ],
+      // 品牌 tab
+      activeName: 'a',
+      brandList: [
+        {
+          id: 'a',
+          name: 'A 品牌'
+        },
+        {
+          id: 'b',
+          name: 'B 品牌'
+        },
+        {
+          id: 'c',
+          name: 'C 品牌'
+        },
+        {
+          id: 'd',
+          name: 'D 品牌'
+        }
+      ],
 
+      // 审核开关
+      switchList: {
+        addName: '新增门店成员',
+        addStatus: false,
+        delName: '删除门店成员',
+        delStatus: false,
+        modName: '门店信息变更',
+        modStatus: false,
+      }
     }
   },
   computed: {
 
   },
   methods: {
+    /**
+     * tab clcik
+     */
+    handleClick(tab, event) {
+      console.log(tab, event);
+    },
+
+    /**
+     * save
+     */
+    saveSwitch() {
+      const that = this
+      console.log(that.switchList)
+    }
 
   },
   mounted() {
 
   },
+  components: {
+    navCrumb,
+    setPermiss
+  }
 }
 
 </script>
 <style lang="less" scoped>
+.right-content {
+  /*width: 100%;*/
+  padding: 24px;
+  min-height: calc(100% - 240px);
+
+  .right-box {
+    /*background: #fff;*/
+    /*padding: 24px;*/
+    min-height: 500px;
+
+    .m-t-24 {
+      margin-top: 24px;
+    }
+
+    .el-tabs {
+      background: #fff;
+      /deep/ .el-tabs__nav-wrap {
+        height: 54px;
+        line-height: 54px;
+
+        &::after {
+          height: 1px;
+        }
+
+        .el-tabs__nav-scroll {
+          padding-left: 20px;
+        }
+
+        .el-tabs__item {
+
+        }
+      }
+      .el-tab-pane {
+        padding: 14px 32px 32px 32px;
+      }
+    }
 
+    .storePermission-wrap-switch {
+      width: 100%;
+      background: #fff;
+    }
+
+    .storePermission-switch-title {
+      width: 100%;
+      padding: 0 32px;
+      height: 54px;
+      line-height: 54px;
+      font-size: 16px;
+      color: #303133;
+      border-bottom: 1px solid #E4E7ED;
+    }
+
+    .p-l-94 {
+      padding-left: 94px;
+    }
+
+    .storePermission-switch-body {
+      width: 100%;
+      padding: 34px 32px ;
+
+      .switch-cell {
+        margin-bottom: 42px;
+      }
+      .el-switch {
+        /deep/ .is-active {
+          color: #303133;
+        }
+      }
+    }
+
+  }
+}
 </style>