佣金配置 新增 数据展示、新增、编辑、删除

src/App.vue

@@ -294,4 +294,22 @@
     font-size: 14px;
     color: #606266;
   }
+
+  .tabs-refresh {
+    &.el-tabs--card > .el-tabs__header {
+      margin-bottom: 10px;
+      padding-left: 10px;
+      /* background-color: #fff; */
+      padding-top: 10px;
+      padding-bottom: 1px;
+    }
+
+    &.el-tabs--card > .el-tabs__header .el-tabs__nav {
+      overflow: hidden;
+    }
+
+    &.el-tabs--card > .el-tabs__header .el-tabs__item.is-active {
+      background-color: #fff;
+    }
+  }
 </style>

src/components/brokerage/index.vue

@@ -2,17 +2,55 @@
 
   <div class="brokerage">
 
-    <el-tabs v-model="type" type="card" style="background: #fff; padding-top: 10px">
+    <el-tabs v-model="type" type="card" class="tabs-refresh" v-loading="loading">
 
       <el-tab-pane v-for="item1 in list" :key="item1.label" :label="item1.label" :name="item1.value">
-        <ul class="tab-content">
+        <ul>
 
           <li v-for="item2 in item1.children" class="brokerage-item">
-            {{filterName(item2.value, 'BROKERAGE_COURSE_TYPE')}}
-            <el-button type="success" plain>新增</el-button>
-            <!--<el-table>
-              <el-table-column label="ID"></el-table-column>
-            </el-table>-->
+            <div class="brokerage-item-header clearfix">
+              {{filterName(item2.value, 'BROKERAGE_COURSE_TYPE')}}
+              <el-button @click="itemAdd(item1.value, item2.value)" class="fr" type="success" plain size="small">新增</el-button>
+            </div>
+            <el-table border :data="item2.data">
+
+              <el-table-column :label="item2.money">
+                <template slot-scope="scope">
+                  <div style="display: flex;">
+                    <el-input
+                      style="width: 46%;"
+                      type="number"
+                      v-model.number="scope.row.min_money"></el-input>
+                    <div style="display: flex; align-items: center; justify-content: center; width: 8%;">~</div>
+                    <el-input
+                      style="width: 46%;"
+                      type="number"
+                      v-model.number="scope.row.max_money"></el-input>
+                  </div>
+                </template>
+              </el-table-column>
+
+              <el-table-column :label="item2.scale">
+                <template slot-scope="scope">
+                  <el-input
+                    type="number"
+                    v-model.number="scope.row.scale"></el-input>
+                </template>
+              </el-table-column>
+
+              <el-table-column label="操作" width="150px">
+                <template slot-scope="scope">
+                  <div style="display: flex;">
+                    <el-button
+                      :disabled="!((typeof scope.row.min_money == 'number') && (typeof scope.row.max_money == 'number') && (typeof scope.row.scale == 'number'))"
+                      v-if="true" size="small" plain type="primary" @click="itemSave(scope.row)">保存</el-button>
+                    <el-button v-if="true" size="small" plain type="danger" @click="itemDelete(scope.row)">删除</el-button>
+                  </div>
+                </template>
+              </el-table-column>
+
+
+            </el-table>
           </li>
 
         </ul>
@@ -25,13 +63,14 @@
 </template>
 
 <script>
-  import {getBrokerageApi} from '@/service/api';
+  import {getBrokerageApi, deleteBrokerageApi, postBrokerageApi,putBrokerageApi} from '@/service/api';
   import {BROKERAGE_COURSE_TYPE} from '@/util/wordbook';
 
   export default {
     name: "index",
     data() {
       return {
+        loading: true,
         type: '1',
         BROKERAGE_COURSE_TYPE: BROKERAGE_COURSE_TYPE,
         list: [{
@@ -39,14 +78,20 @@
           value: '1',
           children: [{
             label: '试听课来源-转年课业绩',
+            money: '业绩区间',
+            scale: '提点比例',
             value: '1',
             data: []
           }, {
             label: '月课、季课来源-转年课业绩',
+            money: '业绩区间',
+            scale: '提点比例',
             value: '2',
             data: []
           }, {
             label: '年课来源 - 转两年课业绩提点配置',
+            money: '业绩区间',
+            scale: '提点比例',
             value: '3',
             data: []
           }]
@@ -55,14 +100,20 @@
           value: '2',
           children: [{
             label: '主管业绩提点',
+            money: '业绩完成率',
+            scale: '提点比例',
             value: '4',
             data: []
           }, {
             label: '主管转化率系数（试听课）',
+            money: '团队转化率',
+            scale: '转化系数',
             value: '5',
             data: []
           }, {
             label: '主管转化率系数（月课、季课）',
+            money: '团队转化率',
+            scale: '转化系数',
             value: '6',
             data: []
           }]
@@ -79,6 +130,76 @@
         }).label
       },
 
+      itemAdd(id1, id2) {
+        this.list.forEach(val1 => {
+          if (val1.value == id1) {
+            val1.children.forEach(val2 => {
+              if (val2.value == id2) {
+                val2.data.push({
+                  sale_type: id1,
+                  course_type: id2,
+                  max_money: '',
+                  min_money: '',
+                  scale: '',
+                  id_add: (new Date()).getTime(),
+                })
+              }
+            })
+          }
+        })
+      },
+      itemSave(row) {
+        if ((typeof row.min_money == 'number') && (typeof row.max_money == 'number') && (typeof row.scale == 'number')) {
+          let json = {
+            min_money: row.min_money,
+            max_money: row.max_money,
+            scale: row.scale,
+            sale_type: row.sale_type,
+            course_type: row.course_type
+          }
+          if (row.id) { // 编辑的
+            putBrokerageApi(row.id, json).then(res => {
+              this.$message({type: 'success', message: '保存成功'});
+              this.getData();
+            })
+          } else { // 新增的
+            postBrokerageApi(json).then(res => {
+              this.$message({type: 'success', message: '保存成功'});
+              this.getData();
+            })
+          }
+        }
+      },
+      itemDelete(row) {
+        if (row.id_add) {
+          this.list.forEach(val1 => {
+            if (val1.value == row.sale_type) {
+              val1.children.forEach(val2 => {
+                if (val2.value == row.course_type) {
+                  var idx = val2.data.findIndex(item => {
+                    return item.id_add == row.id_add
+                  })
+                  val2.data.splice(idx, 1);
+                }
+              })
+            }
+          })
+        } else {
+          this.$confirm(`确定删除？`, '提示', {
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+          }).then(() => {
+            deleteBrokerageApi(row.id).then(res => {
+              this.$message({type: 'success', message: '删除成功'});
+              this.getData();
+            })
+          }).catch(()=>{
+            this.$message({type: 'info', message: '已取消删除'});
+          });
+        }
+      },
+
       getData() {
         getBrokerageApi().then(res => {
           if (res.list && res.list.length) {
@@ -87,15 +208,14 @@
                 var idx1 = this.list.findIndex(item1 => {
                   return item1.value == val1[0].sale_type
                 })
-                this.list[idx1].children.forEach(val2 => {
-                  var idx2 = this.list[idx1].children.findIndex(item2 => {
-                    return item2.value == val1[0].course_type
-                  })
-                  this.list[idx1].children[idx2].data = val1;
+                var idx2 = this.list[idx1].children.findIndex(item2 => {
+                  return item2.value == val1[0].course_type
                 })
+                this.list[idx1].children[idx2].data = val1;
               }
             })
             console.log(this.list)
+            this.loading = false;
           }
         })
       }
@@ -105,12 +225,13 @@
 
 <style lang="less">
   .brokerage {
-    .tab-content {
-      padding: 10px;
-    }
-
     .brokerage-item {
-
+      margin: 0 10px 10px;
+      padding: 10px;
+      background-color: #fff;
+      .brokerage-item-header {
+        padding-bottom: 10px;
+      }
     }
   }
 </style>

src/components/login/index.vue

 <template>
-    <div class="login">
-      <div class="wrap-main">
-        <h1 class="title">唱唱启蒙——后台管理系统</h1>
-        <el-form :model="login" :rules="loginRules" ref="loginForm">
-          <el-form-item prop="username">
-            <el-input v-model="login.username" placeholder="用户名"></el-input>
-          </el-form-item>
-          <el-form-item prop="password">
-            <el-input type="password" v-model="login.password" placeholder="密码"></el-input>
-          </el-form-item>
-          <el-form-item>
-            <el-button class="btn" size="medium" type="primary" @click="submitForm">登录</el-button>
-            <router-link class="fr" :to="{name:'register'}" >
+  <div class="login">
+    <div class="wrap-main">
+      <h1 class="title">唱唱启蒙——后台管理系统</h1>
+      <el-form :model="login" :rules="loginRules" ref="loginForm">
+        <el-form-item prop="username">
+          <el-input v-model="login.username" placeholder="用户名"></el-input>
+        </el-form-item>
+        <el-form-item prop="password">
+          <el-input type="password" v-model="login.password" placeholder="密码"></el-input>
+        </el-form-item>
+        <el-form-item>
+          <el-button class="btn" size="medium" type="primary" @click="submitForm">登录</el-button>
+          <router-link class="fr" :to="{name:'register'}">
             班主任注册入口
           </router-link>
-            <!-- <el-button class="fr" size="medium" type="success" @click="goRegister">去注册</el-button> -->
-          </el-form-item>
-        </el-form>
-      </div>
+          <!-- <el-button class="fr" size="medium" type="success" @click="goRegister">去注册</el-button> -->
+        </el-form-item>
+      </el-form>
+    </div>
   </div>
 </template>
 
 <script>
-import { loginApi } from "../../service/api";
-import md5 from "js-md5";
-export default {
-  data() {
-    return {
-      login: {
-        username: "",
-        password: ""
-      },
-      loginRules: {
-        username: [
-          { required: true, message: "请输入您的用户名", trigger: "blur" }
-        ],
-        password: [
-          { required: true, message: "请输入您的密码", trigger: "blur" }
-        ]
-      }
-    };
-  },
-  mounted() {
-    let that = this;
-    document.onkeydown = keyDownSearch;
-    function keyDownSearch(e) {
-      // 兼容FF和IE和Opera
-      let theEvent = e || window.event;
-      let code = theEvent.keyCode || theEvent.which || theEvent.charCode;
-      if (code === 13 && that.$route.name === "login") {
-        that.submitForm(); //具体处理函数
-        return false;
-      }
-      return true;
-    }
-  },
-  methods: {
-    // 提交
-    submitForm() {
-      this.$refs["loginForm"].validate(valid => {
-        if (valid) {
-              let json = {
-                username:this.login.username,
-                password:md5(this.login.password)
-              };
-              // debugger
-              loginApi(json).then(res=>{
-                      if(res.teacher_info){
-                         let data=JSON.stringify(res.teacher_info)
-                             localStorage.setItem("phoneNum",data)
-                      }else{
-                        localStorage.setItem("phoneNum","")
-                      }
-                  this.$store.dispatch('setToken',res.token);
-                  this.$store.dispatch('setUserName',res.desc);
-                  this.$store.dispatch('setPermission',JSON.parse(res.roles.menu_ids));
-                  // debugger
-                  window.location.href = '/';
+  import {loginApi} from "../../service/api";
+  import md5 from "js-md5";
 
-              })
-            }
-      });
+  export default {
+    data() {
+      return {
+        login: {
+          username: "",
+          password: ""
+        },
+        loginRules: {
+          username: [
+            {required: true, message: "请输入您的用户名", trigger: "blur"}
+          ],
+          password: [
+            {required: true, message: "请输入您的密码", trigger: "blur"}
+          ]
+        }
+      };
     },
-    goRegister(){
-          this.$router.push({
-            name:"register"
-          })
+    mounted() {
+      let that = this;
+      document.onkeydown = keyDownSearch;
+
+      function keyDownSearch(e) {
+        // 兼容FF和IE和Opera
+        let theEvent = e || window.event;
+        let code = theEvent.keyCode || theEvent.which || theEvent.charCode;
+        if (code === 13 && that.$route.name === "login") {
+          that.submitForm(); //具体处理函数
+          return false;
         }
-  }
-};
+        return true;
+      }
+    },
+    methods: {
+      // 提交
+      submitForm() {
+        this.$refs["loginForm"].validate(valid => {
+          if (valid) {
+            let json = {
+              username: this.login.username,
+              password: md5(this.login.password)
+            };
+            // debugger
+            loginApi(json).then(res => {
+              debugger
+              if (res.teacher_info) {
+                let data = JSON.stringify(res.teacher_info)
+                localStorage.setItem("phoneNum", data)
+              } else {
+                localStorage.setItem("phoneNum", "")
+              }
+              this.$store.dispatch('setToken', res.token);
+              this.$store.dispatch('setUserName', res.desc);
+              this.$store.dispatch('setPermission', JSON.parse(res.roles.menu_ids));
+              // debugger
+              window.location.href = '/';
+
+            })
+          }
+        });
+      },
+      goRegister() {
+        this.$router.push({
+          name: "register"
+        })
+      }
+    }
+  };
 </script>
 
 <style scoped lang="less">
-@import "../../util/public";
-.login {
-  height: 100%;
-  background: linear-gradient(
-    to bottom right,
+  @import "../../util/public";
+
+  .login {
+    height: 100%;
+    background: linear-gradient(to bottom right,
     #ecec7c,
-    #787af4
-  ); /* 标准的语法（必须放在最后） */
-}
-.wrap-main {
-  width: 300px;
-  height: 180px;
-  padding: 50px 20px;
-  border-radius: 5px;
-  box-shadow: 8px 8px 15px rgba(49, 49, 49, 0.5);
-  position: fixed;
-  line-height: 50px;
-  background-color: rgba(255, 255, 255, 0.3);
-  top: 50%;
-  left: 50%;
-  margin-left: -200px;
-  margin-top: -200px;
-  .btn {
-    display: block;
-    width: 100%;
-  }
-  .title {
-    position: absolute;
-    top: -100px;
-    width: 100%;
-    text-align: center;
-    left: 0;
-    color: white;
-    font-size: 26px;
-    text-shadow: 6px 6px 3px rgba(49, 49, 49, 0.5);
+    #787af4); /* 标准的语法（必须放在最后） */
   }
-  .fr{float: right;margin-top: 10px;}
+
+  .wrap-main {
+    width: 300px;
+    height: 180px;
+    padding: 50px 20px;
+    border-radius: 5px;
+    box-shadow: 8px 8px 15px rgba(49, 49, 49, 0.5);
+    position: fixed;
+    line-height: 50px;
+    background-color: rgba(255, 255, 255, 0.3);
+    top: 50%;
+    left: 50%;
+    margin-left: -200px;
+    margin-top: -200px;
+
+    .btn {
+      display: block;
+      width: 100%;
+    }
+
+    .title {
+      position: absolute;
+      top: -100px;
+      width: 100%;
+      text-align: center;
+      left: 0;
+      color: white;
+      font-size: 26px;
+      text-shadow: 6px 6px 3px rgba(49, 49, 49, 0.5);
+    }
+
+    .fr {
+      float: right;
+      margin-top: 10px;
+    }
   }
 </style>

src/service/api.js

@@ -1420,7 +1420,19 @@ export const postMediaConvertApi = function (json) {
 export const getUpdateTimeApi = function () {
   return Vue.prototype.$fetch(`${_baseUrl}api/admin/get/report/time`)
 };
-// 获取佣金配置
+// 获取佣金配置列表
 export const getBrokerageApi = function () {
   return Vue.prototype.$fetch(`${_baseUrl}api/admin/bkge/config/list`)
 };
+// 添加佣金配置
+export const postBrokerageApi = function (json) {
+  return Vue.prototype.$post(`${_baseUrl}api/admin/bkge/config/add`, json)
+};
+// 修改佣金配置
+export const putBrokerageApi = function (id, json) {
+  return Vue.prototype.$put(`${_baseUrl}api/admin/bkge/config/${id}`, json)
+};
+// 删除佣金配置
+export const deleteBrokerageApi = function (id) {
+  return Vue.prototype.$del(`${_baseUrl}api/admin/bkge/config/${id}`)
+};

wq

-Merge branch 'dev' of http://git.singsingenglish.com/new-sing/admin into dev
-
-# Please enter a commit message to explain why this merge is necessary,
-# especially if it merges an updated upstream into a topic branch.
-#
-# Lines starting with '#' will be ignored, and an empty message aborts
-# the commit.