ytj

config/index.js

@@ -25,8 +25,8 @@ module.exports = {
       '/api': {
         // target: 'https://dp.huiju360.com.cn/hj_operations',
         // target: 'http://192.168.0.62:8080', //wf
-        target: 'http://192.168.0.11:8080', //ys
-        // target: 'http://dev.ycjcjy.com', //zys
+        // target: 'http://192.168.0.11:8080', //ys
+        target: 'http://dev.ycjcjy.com', //zys
         changeOrigin: true, // 如果接口跨域，需要进行这个参数配置
         // pathRewrite: {
         //   '^/api': '/api-v2/api'

src/components/myCard/myCard.vue

@@ -0,0 +1,144 @@
+<template>
+  <div class="card-content flex-l" :class="{invalid: data.invalid}">
+    <div class="card-top flex-h">
+      <div>
+        <img :src="logo" class="logo">
+        <span>￥ <span> 9999 </span> 元</span>
+        <img :src="line3" class="line3">
+      </div>
+      <div>
+        <h2>咖啡团课一次体验卡</h2>
+        <span>可在银城会所健身房体验私教课一次</span>
+        <span>2018年02月17日-2018年3月17日</span>
+      </div>
+    </div>
+    <div class="card-main flex-h">
+      <img :src="line">
+      <div class="flex-h">
+        <span>总数量</span>
+        <span>40</span>
+      </div>
+      <div>
+        <span>总剩余</span>
+        <span>40</span>
+      </div>
+      <div>
+        <span>用户领取</span>
+        <span>40</span>
+      </div>
+      <div>
+        <span>用户使用</span>
+        <span>40</span>
+      </div>
+    </div>
+    <div class="card-bottom" @click.stop="share">
+      分享卡券
+    </div>
+  </div>
+</template>
+
+<script>
+export default {
+  name: 'myCard',
+  props: {
+    data: {
+      type: Object,
+      default: () => { }
+    }
+  },
+  methods: {
+    share () {
+      this.$emit('share', this.data)
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.card-content {
+  box-shadow: 0px 2px 0.1rem 0px rgba(193, 204, 217, 0.5);
+  border-radius: 0.08rem;
+  overflow: hidden;
+  margin-bottom: 0.2rem;
+  &.invalid {
+    filter: grayscale(100%);
+  }
+  .card-top {
+    height: 0.88rem;
+    padding: 0.1rem;
+    box-sizing: border-box;
+    div:nth-of-type(1) {
+      width: 1.2rem;
+      position: relative;
+      .logo {
+        width: 85%;
+        position: absolute;
+      }
+      .line3 {
+        height: 80%;
+        position: absolute;
+        right: 0.15rem;
+        top: 10%;
+      }
+      > span {
+        color: #fc6243;
+        position: absolute;
+        top: 50%;
+        left: 40%;
+        transform: translate(-50%, -50%);
+        font-size: 0.14rem;
+        display: flex;
+        align-items: baseline;
+        span {
+          color: #fc6243;
+          font-size: 0.26rem;
+        }
+      }
+    }
+    div:nth-of-type(2) {
+      flex: 1;
+      h2 {
+        font-size: 0.16rem;
+      }
+      span {
+        display: block;
+        color: #323645;
+        font-size: 12px;
+        padding-top: 0.03rem;
+      }
+    }
+  }
+  .card-main {
+    position: relative;
+    img {
+      width: 100%;
+      position: absolute;
+      top: 0;
+      left: 0;
+    }
+    div {
+      flex: 1;
+      display: flex;
+      flex-flow: column nowrap;
+      justify-content: center;
+      align-items: center;
+      padding-top: 0.15rem;
+      span:nth-of-type(1) {
+        font-size: 0.12rem;
+        color: #323645;
+      }
+      span:nth-of-type(2) {
+        font-size: 0.12rem;
+        color: #fc6243;
+      }
+    }
+  }
+  .card-bottom {
+    padding: 0.1rem;
+    margin-top: 0.1rem;
+    background-color: #fc6243;
+    text-align: center;
+    color: #fff;
+  }
+}
+</style>

src/module/sales/coffeeIndex/index.vue

@@ -44,8 +44,10 @@
               </div>
             </div>
           </li>
-          <li :hidden="navActive !== 1">
-            2
+          <li :hidden="navActive !== 1" class="my-card">
+            <div class="list-box">
+              <myCard v-for="(item,index) in cardList" :key="index" :data='item' @share='share'></myCard>
+            </div>
           </li>
           <li :hidden="navActive !== 2">
             3
@@ -68,12 +70,19 @@
 <script>
 import caseTableItem from '../../../components/caseTableItem/index'
 import topCaseInfo from '../../../components/topCaseInfo/index'
+import myCard from '../../../components/myCard/myCard'
+import logo from '../../../common/icon/logo-t.png'
+import line from '../../../common/icon/cicyle.png'
+import line3 from '../../../common/icon/Line3.png'
 
 export default {
   name: '',
   data () {
     return {
-      navActive: 0,
+      logo,
+      line,
+      line3,
+      navActive: 1,
       cutNavList: [{
         value: '城咖啡',
         id: '1',
@@ -114,7 +123,18 @@ export default {
       }, {
         name: '案场名称2',
         list: [{}, {}, {}, {}, {}],
-      }]
+      }],
+      cardList: [
+        {
+          invalid: true
+        },
+        {
+          invalid: false
+        },
+        {
+          invalid: false
+        }
+      ]
     }
   },
   computed: {
@@ -123,6 +143,7 @@ export default {
   components: {
     topCaseInfo,
     caseTableItem,
+    myCard
   },
   created () {
 
@@ -137,6 +158,9 @@ export default {
       this.topCaseInfoData.caseId = val.id
       this.showSelect = false
     },
+    share (item) {
+      console.log(item)
+    }
   }
 }
 </script>

src/module/sales/coffeeIndex/page.scss

@@ -137,6 +137,11 @@
               }
             }
           }
+          &.my-card{
+            .list-box{
+              padding: .26rem .2rem;
+            }
+          }
         }
       }
     }

src/module/sales/login/index.vue

@@ -53,79 +53,25 @@
 
 <script>
 import logo from '../../../common/icon/logo.png'
-import { mapState, createNamespacedHelpers } from 'vuex'
+import { createNamespacedHelpers } from 'vuex'
 const { mapActions: actions } = createNamespacedHelpers('userCenter')
+const { mapActions: mapLoginActions } = createNamespacedHelpers('login')
 export default {
   data () {
     return {
       logo,
       showCase: false,
       showSales: false,
-      columns: [],
-      columnsS: [],
-      caseName: '选择案场',
-      salesName: '选择销售',
       seconds: 60,
       postData: {
         phone: '',
-        case: '',
-        sales: '',
         captcha: ''
       }
     }
   },
-  computed: {
-    ...mapState({
-      caseInfo: x => x.userCenter.caseInfo
-    })
-  },
-  created () {
-    this.getCaseInfo(1).then(() => {
-      this.columns = this.caseInfo.cases
-    })
-  },
   methods: {
-    ...actions(['getCaseInfo']),
     ...actions(['getCaptcha']),
-    ...actions(['submitData']),
-    onConfirmC (value, index) {
-      this.caseName = value.CaseName
-      this.postData.case = value.CaseId
-      this.columnsS = []
-      this.salesName = '选择销售'
-      if (this.caseInfo.sales) {
-        for (let i = 0; i < this.caseInfo.sales.length; i++) {
-          if (this.caseInfo.sales[i].CaseId === this.postData.case) {
-            this.columnsS.push(this.caseInfo.sales[i])
-          }
-        }
-      }
-      this.showCase = false
-    },
-    onCancelC () {
-      this.showCase = false
-    },
-    onConfirmS (value, index) {
-      this.salesName = value.UserName
-      this.postData.sales = value.UserId
-      this.showSales = false
-    },
-    onCancelS () {
-      this.showSales = false
-    },
-    selectCase () {
-      this.showCase = true
-    },
-    selectSales () {
-      if (!this.postData.case) {
-        this.$toast('请先选择案场')
-        return
-      } else if (this.columnsS.length <= 0) {
-        this.$toast('此案场无销售')
-        return
-      }
-      this.showSales = true
-    },
+    ...mapLoginActions(['submitData']),
     sandMsg () {
       if (!this.postData.phone) {
         this.$toast('请先填写手机号')
@@ -149,14 +95,6 @@ export default {
         this.$toast('请先获取验证码')
         return
       }
-      if (!this.postData.case) {
-        this.$toast('请选择案场')
-        return
-      }
-      if (!this.postData.sales) {
-        this.$toast('请选择销售')
-        return
-      }
       this.submitData(this.postData).then((res) => {
         this.$toast(res)
       })

src/store/login/login.js

@@ -0,0 +1,55 @@
+import Ajax from '../../util/ajax'
+import api from '../../util/api'
+const http = new Object
+
+http.getCaptcha = (data) => { // 获取验证码
+  console.log(data)
+  return new Promise((resolve, reject) => {
+    Ajax(api.user.captcha.url, {
+      method: api.user.captcha.method,
+      queryData: {
+        phone: data
+      }
+    }).then(res => {
+      resolve(res)
+    }).catch((err) => {
+      reject(err)
+    })
+  })
+}
+
+http.submitData = (data) => { // 登陆
+  console.log(data)
+  return new Promise((resolve, reject) => {
+    Ajax(api.login.login.url, {
+      method: api.login.login.method,
+      data: data
+    }).then(res => {
+      resolve(res)
+    }).catch((err) => {
+      reject(err)
+    })
+  })
+}
+
+export default {
+  namespaced: true,
+  state: {},
+  mutations: {},
+  actions: {
+    getCaptcha (data) {
+      return new Promise((resolve) => {
+        http.getCaptcha(data).then((res) => {
+          resolve(res)
+        })
+      })
+    },
+    submitData(data) {
+      return new Promise((resolve) => {
+        http.submitData(data).then((res) => {
+          resolve(res)
+        })
+      })
+    }
+  }
+}

src/util/api.js

@@ -43,6 +43,12 @@ const $api = {
       method: 'get',
       url: `${baseUrl}${guest}/captcha`
     }
+  },
+  login:{ // 主管、销售端登陆
+    login: {
+      method: 'post',
+      url: `${baseUrl}${guest}/wxsignin`
+    }
   }
 }
 export default $api