Merge branch 'master' of http://git.shengws.com/zhangbj/scrm-vue

config/index.js

@@ -17,10 +17,9 @@ module.exports = {
     // can be overwritten by process.env.HOST
     // if you want dev by ip, please set host: '0.0.0.0'
 
-    // host: 'test1.sgjyun.com',
     // host: 'jk.kuyicloud.com',
-    // host: 'test1.sgjyun.com',
-    host:'localhost',
+
+
     port: 8090, // can be overwritten by process.env.PORT, if port is in use, a free one will be determined
     autoOpenBrowser: true,
     errorOverlay: true,

src/api/act/submitinfo.js

@@ -1,7 +1,7 @@
 import request from '@/utils/request'
 
 export function submitForm (params){
-    console.log("文章列表",params)
+    //console.log("文章列表",params)
     return request({
         url: '/api/acticle/createacticle',
         method: 'Get',
@@ -19,10 +19,34 @@ export function getArticleType(params){
 }
 
 export function GetAllArticles(params){
-     console.log("文章列表")
      return request({
          url:'/api/acticle/getAllArticles',
          method:'Get',
          params:params
      })
+}
+
+export function addCategory(data){
+    return request({
+        url:'/api/article/addCategory',
+        method:'Post',
+        data:data
+    })
+}
+
+export function GetCategorys(params){
+      console.log("params",params)
+     return request({
+         url:'/api/acticle/getCategorys',
+         method:'Get',
+         params:params
+     })
+}
+
+export function EditArticleCategory(MenuId,data){
+    return request({
+        url:'/api/acticle/edit?MenuId='+MenuId,
+        method:'put',
+        data,data
+    })
 }

src/api/member/member.js

@@ -9,6 +9,7 @@ export function GetMembers(params) {
 }
 
 export function CreateMember(data) {
+  console.log("data是神",data)
   return request({
     url: '/api/member/create',
     method: 'post',
@@ -56,11 +57,64 @@ export function EditMemberCard(params) {
   })
 }
 
-export function GetTags() {
+export function GetTags(params) {
   return request({
     url: '/api/members/tags',
     method: 'get',
+    params: params
+  })
+}
+
+export function CreateTag(data) {
+  return request({
+    url: '/api/members/tag/create',
+    method: 'post',
+    data: data
   })
 }
 
+export function EditTag(id,data) {
+  return request({
+    url: '/api/members/tag/edit?id='+id,
+    method: 'put',
+    data: data
+  })
+}
+export function DeleteTags(data) {
+  return request({
+    url: '/api/members/tags/delete',
+    method: 'delete',
+    data: data
+  })
+}
 
+export function GetCards() {
+  return request({
+    url: '/api/membercards',
+    method: 'get',
+  })
+}
+
+export function CreateMemberShipCard(data) {
+  return request({
+    url: '/api/membercard/create',
+    method: 'post',
+    data: data
+  })
+}
+
+export function EditMemberShipCard(id,data) {
+  return request({
+    url: '/api/membercard/edit?id='+id,
+    method: 'put',
+    data: data
+  })
+}
+
+export function DeleteMemberShipCard(data) {
+  return request({
+    url: '/api/membercards/delete',
+    method: 'delete',
+    data: data
+  })
+}

src/components/Neditor/index.vue

@@ -39,6 +39,7 @@
       selectionchange() {
         this.ue.addListener('selectionchange', () => {
           this.content = this.ue.getContent()
+          this.$emit("content_changed", this.content)
         })
       },
 

src/router/modules/member.js

@@ -24,5 +24,11 @@ export default {
       name: 'memberTaglist',
       meta: { title: '标签管理', noCache: true }
     },
+    {
+      path: '/member/cards',
+      component: () => import('@/scrm_pages/members/cards'),
+      name: 'memberCardlist',
+      meta: { title: '会员卡管理', noCache: true }
+    },
   ]
 }

src/router/modules/system.js

@@ -1,21 +1,27 @@
 import Layout from '@/views/layout/Layout'
 
-export default{
-    alwaysShow: true,
-    path: '/Systemsetting',
-    component: Layout,
-    redirect: 'noredirect',
-    name: 'Systemsetting',
-    meta: {
-        title: 'systemsetting',
-        icon: 'peoples'
-      },
-      children: [
-        {
-          path: '/Systemsetting/staffmanagement',
-          component: () => import('@/scrm_pages/Systemsetting/staffmanagement'),
-          name: 'memberslist',
-          meta: { title: 'staffmanagement', noCache: true }
-        },
-      ]  
+export default {
+  alwaysShow: true,
+  path: '/Systemsetting',
+  component: Layout,
+  redirect: 'noredirect',
+  name: 'Systemsetting',
+  meta: {
+    title: 'systemsetting',
+    icon: 'peoples'
+  },
+  children: [
+    {
+      path: '/weixinmp/authorization',
+      component: () => import('@/scrm_pages/weixinmp/authorization'),
+      name: 'weixinMpAuth',
+      meta: { title: '公众号授权', noCache: true }
+    },
+    {
+      path: '/Systemsetting/staffmanagement',
+      component: () => import('@/scrm_pages/Systemsetting/staffmanagement'),
+      name: 'memberslist',
+      meta: { title: 'staffmanagement', noCache: true }
+    },
+  ]
 }

src/scrm_pages/article/acticleCategory.vue

@@ -2,24 +2,22 @@
     <div class="main-contain">
       <div class="position">
         <bread-crumb :crumbs='crumbs'></bread-crumb>
-        <el-button  style="float:right;" type="primary" size="small" icon="el-icon-circle-plus-outline">添加分类</el-button>
+        <el-button  style="float:right;" type="primary" size="small" icon="el-icon-circle-plus-outline" @click="openCreate()">添加分类</el-button>
       </div>
       <div class="app-container">
         <div class="filter-container" style="margin-top: 10px;margin-left: 5px">
-          <el-checkbox style="width: 30px" v-model="checked" @change="changeAllSelected">全选</el-checkbox>
-          <el-button size="small" icon="el-icon-delete" @click="batchDelete">删除</el-button>
+          <el-checkbox style="width: 30px">全选</el-checkbox>
+          <el-button size="small" icon="el-icon-delete">批量删除</el-button>
 
         </div>
 
         <el-row :gutter="12" style="margin-top: 10px">
           <el-table
-            :data="cancelStockDate"
-            :class="signAndWeighBoxPatients"
             border
             highlight-current-row
             ref="multipleTable"
-            @selection-change="select"
             :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}"
+            :data="articsData"
           >
             <el-table-column
               type="selection"
@@ -28,19 +26,19 @@
 
             <el-table-column label="分类名称" align="center">
               <template slot-scope="scope">
-                123
+                {{scope.row.Name}}
               </template>
             </el-table-column>
 
             <el-table-column label="所属文章数量" align="center">
               <template slot-scope="scope">
-                456
+                {{scope.row.num}}
               </template>
             </el-table-column>
 
             <el-table-column label="分类排序" align="center">
               <template slot-scope="scope">
-                789
+                {{scope.row.Order}}
               </template>
             </el-table-column>
 
@@ -52,7 +50,7 @@
                     size="mini"
                     type="primary"
                     icon="el-icon-edit-outline"
-                    @click="handleEdit(scope.$index, scope.row)">
+                    @click="openEdit(scope.row,scope.$index)">
                   </el-button>
                 </el-tooltip>
                 <el-tooltip class="item" effect="dark" content="删除" placement="top">
@@ -69,17 +67,22 @@
 
           </el-table>
 
-          <el-pagination
+         <el-pagination
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
-            :page-sizes="[7]"
-            :page-size="7"
+            :page-sizes="[10,20,50,100]"
+            :page-size="10"
             background
-            style="margin-top:20px;float: right"
+            style="margin-top:20px;"
+            align="right"
             layout="total, sizes, prev, pager, next, jumper"
             :total="total">
           </el-pagination>
-
+           <!-- 添加分类 -->
+           <create-article-form ref="createArticleForm" :articsData="articsData"></create-article-form>
+           <!-- 编辑分类 -->
+           <edit-article-form ref="editArticleForm" :artilceIndex="artilceIndex" :form="articData" :articsData="articsData" ></edit-article-form>
+         
         </el-row>
       </div>
     </div>
@@ -87,10 +90,15 @@
 
 <script>
   import BreadCrumb from '../components/bread-crumb'
+  import CreateArticleForm from "./components/CreateArticleForm";
+  import EditArticleForm from "./components/EditArticleForm";
+  import { GetCategorys } from '@/api/act/submitinfo'
   export default {
     name: 'acticleCategory',
     components:{
-      BreadCrumb
+      BreadCrumb,
+      CreateArticleForm,
+      EditArticleForm,
     },
     data(){
       return{
@@ -98,8 +106,62 @@
           { path: false, name: '文章管理' },
           { path: '/articles/acticleCategory', name: '发布文章' }
         ],
+        articsData:[],
+        articData:{
+          Name:'',
+          Summary:'',
+          Order:'',
+          MenuId:0,
+        },
+        total:0,
+        listQuery:{
+          page:1,
+          limit:10,
+          name:'',
+          content:'',
+          sort:'',
+        },
+         artilceIndex:-1,
       }
     },
+
+    methods:{
+      openCreate(){
+        this.$refs.createArticleForm.open();
+      },
+      GetCategorys(){
+        GetCategorys(this.listQuery).then(response=>{
+             console.log(response.data.state)
+             if(response.data.state === 1){
+               this.articsData = response.data.data.category 
+               console.log(this.articsData)
+               this.total = response.data.data.total
+             }
+        })
+      },
+       handleSizeChange(limit) {
+            this.listQuery.limit = limit;
+            this.GetCategorys();
+        },
+        handleCurrentChange(page) {
+            this.listQuery.page = page;
+            this.GetCategorys();
+        },
+        openEdit(row,index){          
+            for(const key in this.articData){
+               if(key in row){
+                 this.articData[key] = row[key]
+               }
+            }
+            console.log("是什么",this.articData) 
+            console.log("heh",this.articsData)  
+             this.artilceIndex = index 
+             this.$refs.editArticleForm.open();        
+        }
+    },
+     created(){
+         this.GetCategorys()
+       }
   }
 </script>
 

src/scrm_pages/article/articleList.vue

@@ -9,7 +9,7 @@
             <el-row :gutter="24">
               <el-col :span="8">
                   <el-input style="width: 300px" v-model="listQuery.search"  placeholder="请输入您需要搜索的内容"></el-input>
-                  <el-button type="primary"  icon="el-icon-search">搜索</el-button>
+                  <el-button type="primary"  icon="el-icon-search" @click="changeKey">搜索</el-button>
               </el-col>
             </el-row>
           </div>
@@ -18,7 +18,7 @@
              <div class="time">
                 <ul class="">
                   <li :class="0==schedulType?'active':''" @click="selectsign(0)">全部</li>
-                  <li :class="item.MenuId==schedulType?'active':''"  v-for="item in schedulArr" :key="item.MenuId">{{item.Name}}</li>
+                  <li :class="item.MenuId==schedulType?'active':''"  v-for="item in schedulArr" :key="item.MenuId" @click="selectsign(item.MenuId)">{{item.Name}}</li>
                 </ul>
              </div>
           </div>
@@ -37,32 +37,33 @@
           </div>
           <el-table ref="multipleTable" :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}" :data="ArticleData" border fit highlight-current-row  style="width: 100%;margin-top: 10px;">
               <el-table-column
+                align="center" 
                 type="selection"
                 width="55">
               </el-table-column> 
              <el-table-column label="文章图片" align="center">
                <template slot-scope="scope">
-
+                  <img :src="memberAvatar(scope.row)" alt="" srcset="" style="width:100px;height:100px;" >
                </template>
              </el-table-column>
             <el-table-column label="文章标题" align="center">
               <template slot-scope="scope">
-
+                  {{scope.row.title}}
               </template>
             </el-table-column>
             <el-table-column label="阅读量" align="center">
               <template slot-scope="scope">
-
+                 {{scope.row.real_read_num}}
               </template>
             </el-table-column>
             <el-table-column label="评论数" align="center">
               <template slot-scope="scope">
-
+                  {{scope.row.comment_num}}
               </template>
             </el-table-column>
             <el-table-column label="点赞数" align="center">
               <template slot-scope="scope">
-
+                  {{scope.row.num}}
               </template>
             </el-table-column>
             <el-table-column label="操作" align="center">
@@ -75,14 +76,17 @@
                     @click="handleEdit(scope.$index, scope.row)">
                   </el-button>
                 </el-tooltip>
+                 <el-tooltip class="item" effect="dark" content="删除" placement="top">
+                  <el-button size="mini" type="danger" icon="el-icon-delete" @click="openDelete(scope.row, scope.$index)" ></el-button>
+                </el-tooltip>
               </template>
             </el-table-column>
           </el-table>
           <el-pagination
             @size-change="handleSizeChange"
             @current-change="handleCurrentChange"
-            :page-sizes="[7]"
-            :page-size="7"
+            :page-sizes="[10,20,50,100]"
+            :page-size="10"
             background
             style="margin-top:20px;float: right"
             layout="total, sizes, prev, pager, next, jumper"
@@ -109,7 +113,7 @@
         time: '',
         active: true,
         schedulType: 0,
-        schedulArr:0,
+        schedulArr:[],
         systemType: 0,
         systemArr: [
           { value: 0, label: "全部" },
@@ -129,17 +133,23 @@
     },
     methods:{
          GetAllArticles(){
-              GetAllArticles(this.listQuery).then(response =>{
-                     if(response.data.status === 1){
-                       this.ArticleData = response.data.data.articles
-                        console.log("文章列表",this.ArticleData)
+              GetAllArticles(this.listQuery).then(response=>{
+                     if(response.data.state === 1){
+                        this.ArticleData = response.data.data.articles  
                         this.total = response.data.data.total
+                        console.log("文章列表",this.ArticleData)
+                        console.log("total",this.total)                                                   
+                     }
+                     if(typeof(response.data.data.category != 'undefined')){
+                       this.schedulArr = response.data.data.category
+                        console.log("分类列表",response.data.data.category)
+                       
                      }
               })
          },
-         selectsign(id){
-            this.listQuery.classid = id;
-            this.schedulArr = id;
+         selectsign(MenuId){
+            this.listQuery.classid = MenuId;
+            this.schedulArr = MenuId;
             this.GetAllArticles();
          },
          selectStatus(id){
@@ -154,6 +164,12 @@
          handleCurrentChange(page) {
             this.listQuery.page = page;
             this.GetAllAritcles();
+        },
+        changeKey(){
+           this.GetAllArticles();
+        },
+        memberAvatar(row){
+             return row.imgs
         }
     },
     created(){

src/scrm_pages/article/components/CreateArticleForm.vue

@@ -0,0 +1,101 @@
+<template>
+
+    <div id="create-article-form-box">
+      <el-dialog
+        title="添加分类"
+        :visible.sync="centerDialogVisible"
+        width="1000px"
+        center>
+        <el-form label-width="90px" class="clearfix" :model="form" ref="acticleform" :rules="rules">
+          <el-row :span=20>
+            <el-form-item label="分类名称:" required prop="name">
+              <el-input v-model="form.name">
+
+              </el-input>
+            </el-form-item>
+          </el-row>
+          <el-row :span=20>
+            <el-form-item label="分类描述:" required prop="content">
+              <keep-alive>
+                <neditor ref="neditor"
+                         id="editor"
+                         v-bind:r_content="form.content">
+                </neditor>
+              </keep-alive>
+            </el-form-item>
+          </el-row>
+          <el-row :span=20>
+            <el-form-item label="排序" required prop="sort">
+              <el-input v-model="form.sort">
+
+              </el-input>
+            </el-form-item>
+          </el-row>
+        </el-form>
+        <span slot="footer" class="dialog-footer">
+               <el-button type="primary" @click="addCategory('acticleform');">添加</el-button>
+              <el-button  @click="centerDialogVisible = false">返回列表</el-button>
+             </span>
+      </el-dialog>
+    </div>
+
+</template>
+
+<script>
+    import Neditor from '@/components/Neditor'
+    import { addCategory } from '@/api/act/submitinfo'
+    export default {
+        name: "CreateArticleForm",
+         components:{
+           Neditor,
+        },
+            data(){
+                return {
+                    centerDialogVisible:false,
+                    rules: {
+                    name: [{required: true, message: "请填写分类名称",},],
+                    content: [{required: true,message:"请填写分类描述"}],
+                    sort: [{required: true,message:"请填写排序"}]
+                },
+                 form:{
+                   name:"",
+                   content:"",
+                   sort:"",
+                },
+                acticleform:[],
+             }
+          },   
+           methods:{
+                 open:function(){
+                    this.centerDialogVisible = true;
+                  },   
+                 resetForm(formName) {
+                     if (typeof(this.$refs[formName]) !='undefined') {
+                     this.$refs[formName].resetFields();
+                   }
+                  },
+               addCategory(formName){
+                  this.form.content = this.$refs.neditor.content
+                   this.$refs[formName].validate((valid)=>{
+                       if(valid){
+                            addCategory(this.form).then(response =>{
+                                  console.log(response.data.state)
+                                  if(response.data.state==1){
+                                    var category = response.data.data.category
+                                    this.centerDialogVisible=false
+                                    this.resetForm("acticleform");
+                                    this.$message.success("添加分类成功");
+                                    console.log("coo",category)
+                                  }
+                            });
+                       }   
+                   });         
+          },  
+       }
+    }
+</script>
+
+<style scoped>
+
+</style>
+   

src/scrm_pages/article/components/EditArticleForm.vue

@@ -0,0 +1,109 @@
+<template>
+    <div id="edit-article-form-box">
+        <el-dialog
+        title="编辑分类"
+        :visible.sync="centerDialogVisible"
+        width="1000px"
+        center>
+        <el-form label-width="90px" class="clearfix" :model="form" ref="acticleform" :rules="rules">
+          <el-row :span=20>
+            <el-form-item label="分类名称:" required prop="Name">
+              <el-input v-model="form.Name"></el-input>
+            </el-form-item>
+          </el-row>
+          <el-row :span=20>
+            <el-form-item label="分类描述:" required prop="Summary">
+              <keep-alive>
+                <neditor ref="neditor"
+                         id="editor"
+                         v-bind:r_content="form.Summary">
+                </neditor>
+              </keep-alive>
+            </el-form-item>
+          </el-row>
+          <el-row :span=20>
+            <el-form-item label="排序" required prop="Order">
+              <el-input v-model="form.Order"></el-input>
+            </el-form-item>
+          </el-row>
+        </el-form>
+        <span slot="footer" class="dialog-footer">
+               <el-button type="primary" @click="submitForm('acticleform')">保存</el-button>
+              <el-button  @click="centerDialogVisible = false">取消</el-button>
+             </span>
+      </el-dialog>   
+    </div>
+</template>
+<script>
+import Neditor from '@/components/Neditor'
+ import { EditArticleCategory } from '@/api/act/submitinfo'
+export default {
+    name: "EditArticleForm",
+     components:{
+        Neditor,
+      },
+      props:{
+        form:{
+           Name:'',
+          Summary:'',
+          Order:'',
+          MenuId:0,
+        },
+      artilceIndex:{
+          type:Number,
+          default:-1,
+        },
+      articsData:{
+          type: Array,
+          default: function () {
+          return [];
+        }
+      }
+    },
+     data(){
+          return {
+          centerDialogVisible:false,
+           rules: {
+             Name: [{required: true, message: "请填写分类名称",},],
+             Summary: [{required: true,message:"请填写分类描述"}],
+             Order: [{required: true,message:"请填写排序"}]
+              },
+             }
+          }, 
+          methods:{
+                open:function(){
+                  this.centerDialogVisible = true;
+                },
+                resetForm(formName) {
+                     if (typeof(this.$refs[formName]) !='undefined') {
+                     this.$refs[formName].resetFields();
+                   }
+                },  
+              submitForm(forname){ 
+                alert("aaa")
+                this.$refs[forname].validate((valid)=>{
+                   if(valid){
+                      EditArticleCategory(this.form.MenuId,this.form).then(response=>{
+                            console.log("id是谁",this.form.MenuId)
+                            console.log(this.form)
+                           var res =  response.data;
+                           console.log(res.state)
+                           if(res.state ===1 ){
+                              var categorys = res.data.categorys; 
+                              console.log("categorys是什么",categorys)
+                              this.articsData[this.artilceIndex].name = categorys.Name;
+                              this.articsData[this.artilceIndex].content = categorys.Summary;
+                              this.articsData[this.artilceIndex].sort = categorys.Order;
+                              this.centerDialogVisible = false;
+                              this.$message.success("编辑文章分类成功");
+                           }
+                      })
+                   }
+                })
+              },  
+          }
+}
+</script>
+<style scoped>
+
+</style>

src/scrm_pages/article/createArticle.vue

@@ -94,7 +94,7 @@
           <el-row :span="24">
             <el-col :span="24">
                 <el-form-item>
-                      <el-button size="small" type="primary" style="width: 100px"  @click="submitForm;centerDialogVisible = true" :disabled="formsubmit">发布</el-button>
+                      <el-button size="small" type="primary" style="width: 100px"  @click="submitForm();centerDialogVisible = true">发布</el-button>
                       <el-button size="small" style="width: 100px">预览</el-button>
                       <el-button size="small" style="width: 100px">保存草稿</el-button>
                   <el-button size="small" style="width: 100px">取消</el-button>
@@ -433,6 +433,7 @@
          console.log("所属分类",this.form.act_type)
       },
       submitForm(){
+        console.log("提交文章")
         var params  = new Object()
         params.act_name = this.form.act_name
         params.act_content = this.$refs.neditor.content
@@ -451,12 +452,12 @@
       },
       getArticleType(){
         getArticleType().then(response =>{
-            console.log("好嗨我")
+            //console.log("好嗨我")
             if(response.data.state === 1){
             var category = response.data.data.category
             this.options = response.data.data.category
-             console.log("文章内容:",category)
-             console.log("文章",this.options)
+            // console.log("文章内容:",category)
+            // console.log("文章",this.options)
             }
         })
       },

src/scrm_pages/marketing_tool/activity_publish.vue

@@ -6,10 +6,10 @@
         <div class="app-container" style="padding: 0 20px; background-color: #f6f8f9;">
             <div class="edit-main">
                 <div class="preview-panel">
-                    <preview-form></preview-form>
+                    <preview-form :activity="activity" :paragraph="activity_paragraph"></preview-form>
                 </div>
                 <div class="edit-panel">
-                    <edit-form></edit-form>
+                    <edit-form :activity="activity" :paragraph="activity_paragraph"></edit-form>
                 </div>
             </div>
         </div>
@@ -34,6 +34,23 @@ export default {
                 { path: false, name: "营销工具" },
                 { path: false, name: "发布活动" }
             ],
+
+            activity: {
+                id: 0,
+                poster_photo: "",
+                title: "",
+                subtitle: "",
+                address: "",
+                limit_num: 0,
+                sign_up_deadline: 0,
+                start_time: 0,
+                phone_number: "",
+                sign_up_notice: "",
+            },
+            activity_paragraph: {
+                title: "",
+                content: "",
+            }
         }
     },
 }

src/scrm_pages/marketing_tool/components/edit_activity_edit_form.vue

@@ -1,14 +1,316 @@
 <template>
-    <div></div>
+    <div class="edit-form-main">
+        <div class="form-title">
+            <img class="icon" src="@/assets/img/sa_7.png" />
+            <span>活动编辑</span>
+        </div>
+        <div class="form-content">
+            <div class="module-panel">
+                <p class="module-title">
+                    <img src="@/assets/img/sa_13.png" />
+                    基本信息
+                </p>
+                <div class="module-item">
+                    <label class="item-title">主图</label>
+                    <div class="poster-photo-panel">
+                        <el-input v-model="poster_photo_file_name" :readonly="true" class="input"></el-input>
+                        <el-upload 
+                        action="https://upload.qiniup.com" 
+                        :data="{ token: qntoken, key: poster_photo_file_key }"
+                        :show-file-list="false"
+                        :on-error="posterPhotoUploadFail"
+                        :on-success="posterPhotoUploadSuccess"
+                        :before-upload="beforePosterPhotoUpload"
+                        >
+                            <el-button type="primary" style="margin-left: 10px;" v-loading="uploading_poster_photo">上传图片</el-button>
+                        </el-upload>
+                    </div>
+                </div>
+                <div class="poster-photo-hint">图片建议尺寸828*430,大小不超过3M</div>
+                <div class="module-item">
+                    <label class="item-title">标题</label>
+                    <el-input v-model="activity.title" class="item-input"></el-input>
+                </div>
+                <div class="module-item">
+                    <label class="item-title">名称</label>
+                    <el-input v-model="activity.subtitle" class="item-input"></el-input>
+                </div>
+                <div class="module-item">
+                    <label class="item-title">商户简称</label>
+                    <el-input v-model="$store.getters.xt_user.org.org_name" class="item-input" readonly></el-input>
+                </div>
+                <div class="module-item">
+                    <label class="item-title">报名时间</label>
+                    <el-date-picker v-model="sign_up_deadline" :picker-options="pickerOptions" value-format="timestamp" type="datetime" format="yyyy-MM-dd HH:mm" class="item-input"></el-date-picker>
+                </div>
+                <div class="module-item">
+                    <label class="item-title">活动时间</label>
+                    <el-date-picker v-model="activity_time" :picker-options="pickerOptions" value-format="timestamp" type="datetime" format="yyyy-MM-dd HH:mm" class="item-input"></el-date-picker>
+                </div>
+                <div class="module-item">
+                    <label class="item-title">活动地址</label>
+                    <el-input v-model="activity.address" class="item-input"></el-input>
+                </div>
+                <div class="module-item">
+                    <label class="item-title">限定人数</label>
+                    <el-input v-model="limit_num" class="item-input" :maxlength="9" @keyup.native="limit_num=limit_num.replace(/\D/g,'')" @afterpaste.native="limit_num=limit_num.replace(/\D/g,'')"></el-input>
+                    <span class="limit-text">不填写默认为无限制</span>
+                </div>
+                <div class="module-item">
+                    <label class="item-title">联系方式</label>
+                    <el-input v-model="activity.phone_number" class="item-input"></el-input>
+                </div>
+            </div>
+
+            <div class="module-panel" style="margin-top: 30px;">
+                <p class="module-title">
+                    <img src="@/assets/img/sa_13.png" />
+                    报名须知
+                </p>
+                <div class="module-item">
+                    <label class="item-title">报名须知</label>
+                    <el-input v-model="activity.sign_up_notice" class="item-input" type="textarea" :rows="4" resize="none"></el-input>
+                </div>
+            </div>
+
+            <div class="module-panel" style="margin-top: 30px;">
+                <p class="module-title">
+                    <img src="@/assets/img/sa_13.png" />
+                    详细说明
+                </p>
+                <div class="module-item">
+                    <label class="item-title">标题</label>
+                    <el-input v-model="paragraph.title" class="item-input"></el-input>
+                </div>
+                <div class="module-item">
+                    <label class="item-title">详情</label>
+                    <div class="item-input">
+                        <keep-alive>
+                            <neditor ref="neditor" id="editor" :r_content="paragraph_init_content" @content_changed="paragraphContentChanged"></neditor>
+                        </keep-alive>
+                    </div>
+                </div>
+            </div>
+
+            <div class="submit-button-panel">
+                <el-button style="padding: 10px 30px;" type="primary">发 布</el-button>
+                <el-button style="color: #409eff; border-color: #409eff; padding: 10px 30px;">保存草稿</el-button>
+                <el-button style="color: #409eff; border-color: #409eff; padding: 10px 30px;">预 览</el-button>
+            </div>
+        </div>
+    </div>
 </template>
 
 <script>
+import Neditor from '@/components/Neditor'
+import { getToken } from "@/api/qiniu"
+import { getFileExtension } from "@/utils/tools"
+
 export default {
     name: "EditActivityEditForm",
+    components: {
+        Neditor,
+    },
+    props: {
+        activity: {
+            type: Object,
+            required: true,
+        },
+        paragraph: {
+            type: Object,
+            required: true,
+        },
+    },
+    data() {
+        return {
+            uploading_poster_photo: false,
+            qntoken: "",
+            poster_photo_file_key: "",
+            poster_photo_file_name: "",
+
+            limit_num: "",
+            activity_time: 0,
+            sign_up_deadline: 0,
+            paragraph_init_content: "",
+
+            pickerOptions: {
+                disabledDate: (time) => {
+                    return time.getTime() < Date.now() - 8.64e7
+                }
+            }
+        }
+    },
+    created() {
+        this.activity_time = (new Date()).getTime()
+        this.sign_up_deadline = (new Date()).getTime()
+    },
+    watch: {
+        limit_num: function(new_val) {
+            if (/^[1-9]+[0-9]*]*$/.test(new_val)) {
+                this.activity.limit_num = parseInt(new_val)
+            } else {
+                this.activity.limit_num = 0
+            }
+        },
+        activity_time: function(new_val) {
+            this.activity.start_time = new_val
+        },
+        sign_up_deadline: function(new_val) {
+            this.activity.sign_up_deadline = new_val  
+        },
+    },
+    methods: {
+        initParagraphContent: function(content) {
+            this.paragraph_init_content = this.paragraph.content
+        },
+        paragraphContentChanged: function(content) {
+            this.paragraph.content = content
+        },
+
+        posterPhotoUploadFail: function(err, file, fileList) {
+            this.uploading_poster_photo = false
+            this.$message.error(err)
+        },
+        posterPhotoUploadSuccess: function(res, file) {
+            console.log(res)
+            console.log(file)
+            this.poster_photo_file_name = file.name
+            this.uploading_poster_photo = false
+            this.activity.poster_photo = "https://images.shengws.com/" + res.url
+        },
+        beforePosterPhotoUpload: function(file) {
+            console.log(file)
+            var is_image = file.type.indexOf("image") > -1
+            var mb = file.size / 1024 / 1024
+
+            if (!is_image) {
+                this.$message.error("请上传图片")
+                return false
+            }
+            if (mb > 3) {
+                this.$message.error("上传主图大小不能超过3MB")
+                return false
+            }
+
+            var rand = Math.floor(Math.random() * 1000000000)
+            var date = new Date()
+            var ext = getFileExtension(file.name)
+            var key = "" + date.getFullYear() + (date.getMonth() + 1) + date.getDate() + "_activity_" + rand + "." + ext
+
+            this.uploading_poster_photo = true
+
+            return new Promise((resolve, reject) => {
+                getToken().then(rs => {
+                    var token = rs.data.data.uptoken
+                    this.qntoken = token
+                    this.poster_photo_file_key = key
+                    resolve(true)
+                }).catch(err => {
+                    this.uploading_poster_photo = false
+                    reject(false)
+                })
+            })
+        },
+    },
 }
 </script>
 
 <style lang="scss" scoped>
+.edit-form-main {
+    .form-title {
+        width: 100%;
+        height: 60px;
+        padding: 20px 0 20px 30px;
+        border-bottom: 1px #dee2e5 solid;
+
+        .icon {
+            margin-top: -4px;
+            vertical-align: middle;
+        }
+
+        span {
+            font-size: 18px;
+            font-weight: 500;
+            color: #485b6d;
+            margin-left: 10px;
+        }
+    }
 
+    .form-content {
+        width: 100%;
+        padding: 14px 30px 14px 30px;
+
+        .module-panel {
+            // padding: 0 30px;
+
+            .module-title {
+                font-size: 18px;
+                color: #a8b3ba;
+
+                img {
+                    float: left;
+                    display: block;
+                    padding: 2px 19px 0 0;
+                }
+            }
+
+            .module-item {
+                margin-top: 20px;
+                display: flex;
+                // padding: 0 30px;
+
+                .item-title {
+                    width: 115px;
+                    height: 40px;
+                    line-height: 40px;
+                    color: #485b6d;
+                    font-size: 13px;
+                    // font-weight: 100;
+                    text-align: right;
+                    padding-right: 22px;
+                    float: left;
+                }
+
+                .item-input {
+                    flex: 1;
+                    color: #485b6d;
+                }
+
+                .limit-text {
+                    line-height: 40px;
+                    color: #a8b3ba;
+                    font-size: 13px;
+                    // font-weight: 100;
+                    text-align: left;
+                    padding-left: 10px;
+                }
+
+                .poster-photo-panel {
+                    display: flex;
+                    flex: 1;
+                    align-items: center;
+
+                    .input {
+                        flex: 1;
+                        color: #485b6d;
+                        cursor: pointer;
+                    }
+                }
+            }
+
+            .poster-photo-hint {
+                font-size: 12px;
+                line-height: 16px;
+                color: #a8b3ba;
+                margin-left: 115px;
+            }
+        }
+
+        .submit-button-panel {
+            padding: 0 0 0 115px;
+            margin-top: 30px;
+        }
+    }
+}
 </style>
 

src/scrm_pages/marketing_tool/components/edit_activity_preview_form.vue

@@ -1,5 +1,5 @@
 <template>
-    <div class="preview-main">
+    <div class="preview-form-main">
         <div class="form-title">
             <img class="icon" src="@/assets/img/sa_06.png" />
             <span>预览</span>
@@ -14,11 +14,11 @@
             </div>
             <div class="org-info-cell border">
                 <div class="logo">
-                    <img :src="poster_photo" />
+                    <img :src="$store.getters.xt_user.org.org_logo" />
                 </div>
                 <div class="text-info">
-                    <p class="name">测试机构</p>
-                    <p class="address">地址地址地址地址地址地址地址地址地址地址地址地址地址地址地址地址</p>
+                    <p class="name">{{ $store.getters.xt_user.org.org_name }}</p>
+                    <p class="address">{{ address }}</p>
                 </div>
                 <div class="arrow-panel">
                     <img src="@/assets/img/sa_52.png" />
@@ -29,7 +29,7 @@
                     <img src="@/assets/img/sa_21.png" />
                 </div>
                 <div class="text">
-                    <p>2019-01-01</p>
+                    <p>{{ activity_time }}</p>
                 </div>
                 <div class="arrow-panel">
                     <img src="@/assets/img/sa_52.png" />
@@ -40,19 +40,55 @@
                     <img src="@/assets/img/sa_24.png" />
                 </div>
                 <div class="text">
-                    <p>0755-86879866</p>
+                    <p>{{ phone_number }}</p>
                 </div>
                 <div class="arrow-panel">
                     <img src="@/assets/img/sa_52.png" />
                 </div>
             </div>
+            <div class="simple-cell border">
+                <div class="title">
+                    <p>活动名额</p>
+                </div>
+                <div class="detail">
+                    <p>{{ limit_num }}</p>
+                </div>
+            </div>
+            <div class="large-text-cell border">
+                <div class="title">
+                    <img src="@/assets/img/sa_25.png" />
+                    <span>报名须知</span>
+                </div>
+                <p class="content" v-html="sign_up_notice">
+                </p>
+            </div>
+            <div class="large-text-cell border">
+                <div class="title">
+                    <img src="@/assets/img/sa_26.png" />
+                    <span>{{ paragraph_title }}</span>
+                </div>
+                <p class="content" v-html="paragraph_content">
+                </p>
+            </div>
         </div>
     </div>
 </template>
 
 <script>
+import { parseTime } from "@/utils"
+
 export default {
     name: "EditActivityPreviewForm",
+    props: {
+        activity: {
+            type: Object,
+            required: true,
+        },
+        paragraph: {
+            type: Object,
+            required: true,
+        },
+    },
     data() {
         return {
             
@@ -60,22 +96,51 @@ export default {
     },
     computed: {
         poster_photo: function() {
-            return require("@/assets/img/activity_poster_photo_default.png")
+            return this.activity.poster_photo.length > 0 ? this.activity.poster_photo : require("@/assets/img/activity_poster_photo_default.png")
         },
         title: function() {
-            return "与孩子一起挑选采摘新鲜有机马陆葡萄，体验采摘乐趣"
+            return this.activity.title.length > 0 ? this.activity.title : "与孩子一起挑选采摘新鲜有机马陆葡萄，体验采摘乐趣"
         },
         subtitle: function() {
-            return "亲子采摘活动"
+            return this.activity.subtitle.length > 0 ? this.activity.subtitle : "亲子采摘活动"
+        },
+        address: function() {
+            return this.activity.address.length > 0 ? this.activity.address : "深圳市南山区高新园"
+        },
+        activity_time: function() {
+            if (this.activity.start_time > 0) {
+                return parseTime(this.activity.start_time, "{y}-{m}-{d} {h}:{i}")
+            } else {
+                return "2019-01-01 09:00:00"
+            }
+        },
+        phone_number: function() {
+            return this.activity.phone_number.length > 0 ? this.activity.phone_number : "0755-86879866"
+        },
+        limit_num: function() {
+            return this.activity.limit_num > 0 ? (this.activity.limit_num + "人") : "无限制"
+        },
+        sign_up_notice: function() {
+            var notice = this.activity.sign_up_notice.length > 0 ? this.activity.sign_up_notice : "1.活动费用88元（2斤葡萄 1只手绘风筝 车费 包含1个大人 1个小孩）。\n2.多加1个大人另收30元/人。\n3.葡萄采摘时在园内可以适当品尝。"
+            return notice.replace(/\n/g, "<br/>")
+        },
+
+        paragraph_title: function() {
+            return this.paragraph.title.length > 0 ? this.paragraph.title : "商家介绍"
+        },
+        paragraph_content: function() {
+            var content = this.paragraph.content.length > 0 ? this.paragraph.content : "1.活动费用88元（2斤葡萄 1只手绘风筝 车费 包含1个大人 1个小孩）。<br/>2.多加1个大人另收30元/人。<br/>3.葡萄采摘时在园内可以适当品尝。"
+            return content
         },
     },
 }
 </script>
 
 <style lang="scss" scoped>
-.preview-main {
+.preview-form-main {
     .form-title {
         width: 100%;
+        height: 60px;
         padding: 20px 0 20px 30px;
         border-bottom: 1px #dee2e5 solid;
 
@@ -94,7 +159,7 @@ export default {
 
     .form-content {
         width: 100%;
-        padding: 14px 30px 0 30px;
+        padding: 14px 30px 14px 30px;
 
         .preview-cell-poster-photo {
             .poster-photo {
@@ -173,7 +238,7 @@ export default {
             .icon {
                 img {
                     width: 20px;
-                    height: 20px;
+                    height: auto;//20px;
                     vertical-align: middle;
                 }
             }
@@ -193,6 +258,50 @@ export default {
                     vertical-align: middle;
                 }
             }
+
+            .title {
+                p {
+                    color: #485b6d;
+                }
+            }
+            .detail {
+                flex: 1;
+                padding-left: 23px;
+                color: #485b6d;
+
+                p {
+                    color: #485b6d;
+                    float: right;
+                    text-align: right;
+                }
+            }
+        }
+
+        .large-text-cell {
+            padding: 20px 20px;
+            position: relative;
+            -webkit-box-align: center;
+            align-items: center;
+            margin-top: 15px;
+
+            .title {
+                color: #485b6d;
+                line-height: 18px;
+                height: 18px;
+
+                img {
+                    // width: 18px;
+                    // height: auto;
+                    margin-right: 11px;
+                    float: left;
+                }
+            }
+            .content {
+                color: #a8b3ba;
+                margin: 10px 0 0 0;
+                font-size: 14px;
+                line-height: 20px;
+            }
         }
     }
 }

src/scrm_pages/members/cards.vue

@@ -0,0 +1,207 @@
+<template>
+  <div class="main-contain">
+    <div class="position">
+      <bread-crumb :crumbs='crumbs'></bread-crumb>
+      <el-button  style="float:right;" type="primary" size="small" icon="el-icon-circle-plus-outline" @click="openCreate">添加会员卡</el-button>
+    </div>
+    <div class="app-container">
+        <div class="filter-container" style="margin-top: 10px;margin-left: 5px " id="member-cards-box">
+          <div class="col" v-for="(card, index) in cardsData" :key="index">
+              <div class="thumbnail">
+
+                  <div class="pic" v-if="card.background_type==1" :style="'background: '+card.background">
+                      <div class="ico_crow" ></div>
+                  </div>
+                  <div class="pic" v-else>
+                      <img :src="card.background" alt="...">
+                  </div>
+                  <h3 class="tit">{{card.card_name}}</h3>
+                  <div class="caption">
+                      <h3 class="card_edier">
+                        <span @click="openEdit(card, index)">编辑会员卡</span> -
+                        <span @click="openDelete(card, index)">删除会员卡</span>
+                      </h3>
+                  </div>
+              </div>
+          </div>
+        </div>
+        <!--create-card-form 添加会员卡-->
+        <create-card-form ref="createCardForm" :cardsData="cardsData" ></create-card-form>
+        <!--create-card-form 编辑会员卡-->
+        <edit-card-form ref="editCardForm" :cardsData="cardsData" :cardIndex="cardIndex" :form="editFormData"></edit-card-form>
+    </div>
+  </div>
+</template>
+
+<script>
+  import {GetCards, DeleteMemberShipCard} from "@/api/member/member";
+  import BreadCrumb from '../components/bread-crumb';
+  import CreateCardForm from "./components/CreateCardForm";
+  import EditCardForm from "./components/EditCardForm";
+
+  export default {
+    name: 'memberCardList',
+    components:{
+      BreadCrumb,
+      CreateCardForm,
+      EditCardForm,
+    },
+    data(){
+      return{
+        crumbs: [
+          { path: false, name: '会员管理' },
+          { path: false, name: '会员卡管理' }
+        ],
+        cardsData:[],
+        editFormData:{
+            background_type:1,
+            background:"#409EFF",
+            background_color:"#409EFF",
+            background_image:"",
+            card_name:'',
+            use_notice:'',
+            card_right:'',
+            service_phone:'',
+            upgrade_integral:0,
+            id:0,
+        },
+        cardIndex:-1,
+      }
+    },
+    methods:{
+        openCreate:function(){
+          this.$refs.createCardForm.open();
+        },
+        openEdit(row, index) {
+          for (const key in this.editFormData) {
+            this.editFormData[key] = row[key];
+          }
+          this.cardIndex = index;
+          this.$refs.editCardForm.open();
+        },
+        openDelete:function(row,index){
+          this.$confirm('确认要删除该会员卡吗？<br>删除后，该会员卡将无法恢复', '删除提示', {
+            dangerouslyUseHTMLString:true,
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+          }).then(() => {
+            var ids = [];
+            ids.push(row.id);
+            DeleteMemberShipCard({ids:ids}).then(response=>{
+              var res = response.data;
+              if (res.state === 1) {
+                this.cardsData.splice(index, 1);
+                this.$message.success("删除会员卡成功");
+              }else {
+                this.$message.error(res.msg);
+              }
+            }).catch(e=>{});
+          }).catch(() => {
+            return false        
+          });
+        },
+        GetCards(){
+            GetCards().then(response=>{
+                var res = response.data;
+                if(res.state===1) {
+                    this.cardsData = res.data.cards;
+                }
+            }).catch(e=>{})
+        }
+    },
+    created(){
+        this.GetCards();
+    }
+  }
+</script>
+
+<style scoped>
+ #member-cards-box .col {
+    float: left;
+    padding: 0 6px;
+ }
+ #member-cards-box .thumbnail {
+    padding: 0;
+    position: relative;
+    border: none;
+    background: #dde1e4;
+    color: #58a2ec;
+    display: block;
+    padding: 4px;
+    margin-bottom: 20px;
+    line-height: 1.42857143;
+    background-color: #fff;
+    border-radius: 4px;
+    -webkit-transition: border .2s ease-in-out;
+    -o-transition: border .2s ease-in-out;
+    transition: border .2s ease-in-out;
+}
+ #member-cards-box .thumbnail .pic {
+    width: 20rem;
+    height: 8rem;
+    background: #58a2ec;
+    border-radius: 25px 25px 0 0;
+    position: relative;
+}
+ #member-cards-box .thumbnail .ico_crow {
+    position: absolute;
+    right: 18px;
+    top: 10px;
+    width: 64px;
+    height: 54px;
+    background: url("https://images.shengws.com/icos-201906141103.png") no-repeat -58px -422px;
+}
+ #member-cards-box .thumbnail .pic img {
+    width: 100%;
+    height: 100%;
+    object-position: top left;
+    object-fit: cover;
+    border-radius: 25px 25px 0 0;
+    margin: 0;
+    border: 0;
+    vertical-align: middle;
+}
+
+ #member-cards-box .thumbnail .tit {
+    position: absolute;
+    top: 1.5rem;
+    left: 1.5rem;
+    font-size: 1rem;
+    color: #fff;
+}
+ #member-cards-box .thumbnail .caption {
+    background: #eef6fd;
+    border-radius: 0 0 20px 20px;
+    height: 38px;
+    cursor: pointer;
+    max-width: 100%;
+    padding: 9px;
+    color: #333;
+}
+ #member-cards-box .thumbnail .caption .card_edier {
+    font-size: 12px;
+    color: #58a2ec;
+    padding-left: 0.8rem;
+}
+ #member-cards-box .thumbnail .caption .card_edier span {
+    color: #58a2ec;
+    text-decoration: none;
+}
+
+ #member-cards-box .thumbnail .caption .card_edier span:hover {
+    color: #58a2ec;
+    text-decoration: underline;
+}
+  /*.app-container .cell.clearfix .time ul li {*/
+    /*float: left;*/
+    /*list-style: none;*/
+    /*cursor: pointer;*/
+    /*padding: 6px 20px;*/
+    /*color: #606266;*/
+    /*border-radius: 4px;*/
+    /*margin: 0 8px 0 0;*/
+    /*font-size: 14px;*/
+    /*text-align: center;*/
+  /*}*/
+</style>

src/scrm_pages/members/components/CreateCardForm.vue

@@ -0,0 +1,385 @@
+<template>
+    <div id="create-card-form-box">
+        <el-dialog title="添加会员卡" :visible.sync="createCardFormVisible" width="900px" id="create-member-card-show" v-loading="submitLoading" :element-loading-text="loadingText">
+            <el-row>
+                <el-col :span="10">
+                    <div class="membercard-area" :style="membercardAreaBackground">
+                        <span class="ico_crown"></span>
+                        <div class="card-header clearfix">
+                            <h4 class="shop-name">
+                                <span class="shop-logo">
+                                    <img :src="orgLogo"> 
+                                </span>
+                                <span class="tit">{{form.card_name}}</span>
+                            </h4>
+                            <div class="qr-code"></div>
+                        </div>
+                        <h3 class="member-type"></h3>
+                        <div class="card-content">
+                            <p class="expiry-date">
+                                有效期：
+                                <span>无限期</span>
+                            </p>
+                        </div>
+                    </div>
+                </el-col>
+                <el-col :span="14">
+                    <el-form ref="cardForm" :rules="cardRules" :model="form" label-width="100px" id="create-member-card-form">
+                        <el-form-item label="机构Logo:" >
+                            <el-upload class="org-logo" action="https://upload.qiniup.com" disabled >
+                                <img v-if="orgLogo" :src="orgLogo" class="org-logo-image">
+                                <i v-else class="el-icon-plus org-logo-icon"></i>
+                                <div class="el-upload__tip" slot="tip">如需修改机构Logo信息，请在<em>机构中心</em>中更新。</div>
+                            </el-upload>
+                        </el-form-item>
+                        <el-form-item label="卡片封面:" required prop="background_type">
+                            <el-radio-group v-model="form.background_type">
+                                <el-radio :label="bgt.id" :value="bgt.id" :key="index" v-for="(bgt, index) in backgroundTypeOptions">{{bgt.name}}</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                        <el-form-item label="背景色:"  prop="background_color"  v-show="form.background_type==1">
+                            <el-color-picker v-model="form.background_color" @change="handleChangeColor" :predefine="predefineData"></el-color-picker>
+                        </el-form-item>
+                        <el-form-item label="封面图片:"  prop="background_image"  v-show="form.background_type==2">
+                           <el-upload
+                                v-loading="uploading"
+                                :element-loading-text="loadingText"
+                                class="bg-image-uploader"
+                                :data="uploadData"
+                                action="https://upload.qiniup.com"
+                                :show-file-list="false"
+                                :on-error="handleBackImageError"
+                                :on-success="handleBackImageSuccess"
+                                :before-upload="beforeBackImageUpload"
+                            >
+                                <img v-if="form.background_image" :src="form.background_image" class="bg-image">
+                                <i v-else class="el-icon-plus bg-image-uploader-icon"></i>
+                                <div class="el-upload__tip" slot="tip">尺寸：906*498像素，小于2M，支持jpg、png、jpeg格式</div>
+                            </el-upload>
+                        </el-form-item>
+
+                        <el-form-item label="会员卡名称:" required prop="card_name" >
+                            <el-input v-model="form.card_name" placeholder="最多可输入9个字符" maxlength="9"></el-input>
+                        </el-form-item>
+                        <el-form-item label="使用须知:"  prop="use_notice">
+                            <el-input v-model="form.use_notice" type="textarea" rows='4' placeholder="会员特权会根据您上文的勾选情况系统自动生成，此处可填写其它补充信息以便会员知晓，最多可输入300个字符"  maxlength="300"></el-input>
+                        </el-form-item>
+                        <el-form-item label="会员权益:"  prop="card_right">
+                            <el-input v-model="form.card_right" type="textarea" rows='4' placeholder="会员特权会根据您上文的勾选情况系统自动生成，此处可填写其它补充信息以便会员知晓，最多可输入300个字符"  maxlength="300"></el-input>
+                        </el-form-item>
+                        <el-form-item label="客服电话:"  prop="service_phone" >
+                            <el-input v-model="form.service_phone" placeholder="请输入手机号或固定电话" ></el-input>
+                        </el-form-item>
+                        <el-form-item label="升级条件:"  prop="upgrade_integral" >
+                            累积积分达到
+                            <el-input v-model.number="form.upgrade_integral" style="width:100px;" placeholder="" ></el-input>
+                            分
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+            </el-row>
+            
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="createCardFormVisible = false">取消</el-button>
+                <el-button
+                type="primary"
+                @click="submitForm('cardForm')"
+                >保 存
+                </el-button>
+            </div>
+        </el-dialog>  
+    </div>
+</template>
+
+<script>
+import {CreateMemberShipCard} from "@/api/member/member";
+import { getFileExtension,checkHexColor,checkMobileOrPhone } from "@/utils/tools";
+import { getToken } from "@/api/qiniu";
+
+export default {
+    name:'CreateCardForm',
+    props:{
+        cardsData:{
+            type: Array,
+            default: function () {
+                return [];
+            }
+        },
+    },
+    data(){
+        var checkBgColorRule = (rule, value, callback) => {
+            if (this.form.background_type == 1 && !checkHexColor(value)) {
+                callback(new Error('请选择背景色'));
+            }else {
+               callback(); 
+            }
+        };
+        var checkBgImageRule = (rule, value, callback) => {
+            if (this.form.background_type == 2 && !value) {
+                callback(new Error('请上图片封面图片'));
+            }else {
+               callback(); 
+            }
+        };
+        var checkTelRule = (rule, value, callback) => {
+            if (value && !checkMobileOrPhone(value)) {
+                callback(new Error('请填写正确的客服电话:13888888888 或 0756-1234567'));
+            }else {
+               callback(); 
+            }
+        };
+        var checkIntegralRule = (rule, value, callback) => {
+            if(!value) {
+                callback(); 
+            }else {
+                if(!Number.isInteger(value)) {
+                    callback(new Error('必须是整数'));
+                }else {
+                    if (value<0) {
+                        callback(new Error('不能小于0'));
+                    }else {
+                        callback(); 
+                    }
+                }
+            }
+        };
+        return {
+            createCardFormVisible:false,
+            qiniuDomain: "https://images.shengws.com/",
+            uploading:false,
+            loadingText:'',
+            submitLoading:false,
+            uploadData: { token: "", key: "" },
+            predefineData:['#65d3e3','#82cecb','#5bd18b','#58a2ec','#9675cc','#f2ca68','#ff7979','#aed15b','#75c075','#67b192','#7b8a97','#34495e','#262626'],
+            backgroundTypeOptions:[
+                {id:1, name:'背景色'},
+                {id:2, name:'封面图片'},
+            ],
+            
+            cardRules: {
+                card_name: [{required: true, message: "请填写会员卡名称",},],
+                background_color: [{ validator: checkBgColorRule}],
+                background_image: [{ validator: checkBgImageRule}],
+                service_phone: [{ validator: checkTelRule}],
+                upgrade_integral: [{ validator:checkIntegralRule}],
+            },
+            form:{
+                background_type:1,
+                background:"#409EFF",
+                background_color:"#409EFF",
+                background_image:"",
+                card_name:'',
+                use_notice:'',
+                card_right:'',
+                service_phone:'',
+                upgrade_integral:0,
+            },
+        }
+    },
+    methods:{
+        open:function(){
+            this.resetForm("cardForm");
+            this.createCardFormVisible = true;
+        },
+        resetForm:function(formName) {
+            if (typeof(this.$refs[formName]) !='undefined') {
+                this.$refs[formName].resetFields();
+            }
+        },
+        handleChangeColor:function(color){
+            this.form.background = color;
+        },
+        handleBackImageError(err, file, fileList) {
+            this.$message.error(err);
+            this.uploading = false;
+            return false;
+        },
+        handleBackImageSuccess(res, file) {
+            var url = this.qiniuDomain + res.url;
+            this.form.background_image = url
+            this.form.background = url;
+            this.uploading = false;
+        },
+        beforeBackImageUpload(file) {
+            var fileType = file.type;
+            const isJPG = fileType.indexOf("image") > -1;
+            const isLt2M = file.size / 1024 / 1024 < 2;
+            if (!isJPG) {
+                this.$message.error("只能上传图片");
+                return false;
+            }
+            if (!isLt2M) {
+                this.$message.error("图片大小不能超过 2MB!");
+                return false;
+            }
+
+            var date = new Date();
+            var ext = getFileExtension(file.name);
+            var key = "" + date.getFullYear() + (date.getMonth() + 1) + date.getDate() + date.getHours() + date.getMinutes() + date.getSeconds() + "_card_" +file.uid +"." + ext;
+            this.uploading = true;
+            this.loadingText = "图片上传中";
+
+            const _self = this;
+            return new Promise((resolve, reject) => {
+                getToken()
+                .then(response => {
+                    const token = response.data.data.uptoken;
+                    _self._data.uploadData.token = token;
+                    _self._data.uploadData.key = key;
+                    resolve(true);
+                })
+                .catch(err => {
+                    reject(false);
+                    this.uploading = false;
+                });
+            });
+        },
+        submitForm:function(formName){
+            this.$refs[formName].validate((valid) => {
+                if (valid) {
+                    this.loadingText = "正在保存...";
+                    this.submitLoading = true;
+                    CreateMemberShipCard(this.form).then(response=>{
+                        var res = response.data;
+                        if(res.state === 1) {
+                            var card = res.data.card;
+                            this.cardsData.push(card);
+                            this.resetForm("cardForm");
+                            this.createCardFormVisible = false;
+                            this.$message.success("添加会员卡成功");
+                        }else {
+                            this.$message.error(res.msg);
+                        }
+                        this.submitLoading = false;
+                    }).catch(e=>{
+                        this.submitLoading = false;
+                    });
+                } else {
+                    return false;
+                }
+            });
+        },
+    },
+    computed: {
+      orgLogo: function() {
+        var avatar = this.$store.getters.xt_user.org.org_logo
+        return avatar.length > 0
+          ? avatar
+          : require('../../../assets/home/userData.png')
+      },
+      membercardAreaBackground:function(){
+          if (this.form.background_type == 1) {
+              return 'background:' + this.form.background_color;
+          }else {
+              return 'background: url("' + this.form.background_image + '") 0% 0% / 100% 100% no-repeat;'
+          }
+      }
+    },
+}
+</script>
+
+<style rel="stylesheet/scss" >
+#create-member-card-form .org-logo .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 25px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+#create-member-card-form .org-logo .el-upload:hover {
+  border-color: #409eff;
+}
+#create-member-card-form .org-logo-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 50px;
+  height: 50px;
+  line-height: 50px;
+  text-align: center;
+}
+
+#create-member-card-form .el-upload__tip em {
+    color: #5599eb;
+}
+
+#create-member-card-form .org-logo-image {
+  width: 50px;
+  height: 50px;
+  display: block;
+}
+
+
+#create-member-card-form .bg-image-uploader .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 10px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+#create-member-card-form .bg-image-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+#create-member-card-form .bg-image-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 278px;
+  height: 130px;
+  line-height: 130px;
+  text-align: center;
+}
+#create-member-card-form .bg-image {
+  width: 278px;
+  height: 130px;
+  display: block;
+}
+
+#create-member-card-show .membercard-area {
+    margin: 9px;
+    padding: 14px 18px 24px 17px;
+    background: #5599eb;
+    color: #fff;
+    border-radius: 20px 20px 20px 20px;
+    position: relative;
+}
+#create-member-card-show  .membercard-area .ico_crown {
+    position: absolute;
+    right: 18px;
+    width: 64px;
+    height: 54px;
+    background: url("https://images.shengws.com/icos-201906141103.png") no-repeat -58px -422px;
+}
+#create-member-card-show .clearfix {
+    clear: both;
+}
+#create-member-card-show .clearfix:before {
+    display: table;
+    content: " ";
+}
+#create-member-card-show .membercard-area .shop-name {
+    font-size: 14px;
+}
+#create-member-card-show .membercard-area .shop-name .shop-logo {
+    display: inline-block;
+    width: 40px;
+    height: 40px;
+    float: left;
+    margin-right: 13px;
+}
+#create-member-card-show .membercard-area .shop-name .shop-logo img {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+}
+#create-member-card-show .membercard-area .shop-name .tit {
+    height: 41px;
+    line-height: 41px;
+}
+#create-member-card-show  .member-type {
+    height: 70px;
+    line-height: 70px;
+}
+#create-member-card-show .membercard-area .card-content .expiry-date {
+    font-size: 12px;
+}
+</style>
+

src/scrm_pages/members/components/CreateTagForm.vue

@@ -0,0 +1,87 @@
+<template>
+    <div id="create-tag-form-box">
+        <el-dialog title="添加标签" :visible.sync="createTagFormVisible" width="700px" >
+            <el-form ref="tagForm" :rules="tagRules" :model="form" label-width="60px">
+                <el-row>
+                    <el-col :span="24">
+                        <el-form-item label="标签:" required prop="tag_name">
+                        <el-input v-model="form.tag_name"></el-input>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+            </el-form>
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="createTagFormVisible = false">取消</el-button>
+                <el-button
+                type="primary"
+                @click="submitForm('tagForm')"
+                >保 存
+                </el-button>
+            </div>
+        </el-dialog>  
+    </div>
+</template>
+
+<script>
+import {CreateTag} from "@/api/member/member";
+
+export default {
+    name:'CreateTagForm',
+    props:{
+        tagsData:{
+            type: Array,
+            default: function () {
+                return [];
+            }
+        },
+    },
+    data(){
+        return {
+            createTagFormVisible:false,
+            
+            tagRules: {
+                tag_name: [{required: true, message: "请填写标签",},],
+                
+            },
+            form:{
+                tag_name:'',
+            },
+            
+        }
+    },
+    methods:{
+        open:function(){
+            this.resetForm("tagForm");
+            this.createTagFormVisible = true;
+        },
+        resetForm(formName) {
+            if (typeof(this.$refs[formName]) !='undefined') {
+                this.$refs[formName].resetFields();
+            }
+        },
+        submitForm(formName){
+            this.$refs[formName].validate((valid) => {
+                if (valid) {
+                    CreateTag(this.form).then(response=>{
+                        var res = response.data;
+                        if(res.state === 1) {
+                            var tag = res.data.tag;
+                            tag["member_count"] = 0;
+                            this.tagsData.unshift(tag);
+                            this.resetForm("tagForm");
+                            this.createTagFormVisible = false;
+                            this.$message.success("添加标签成功");
+                        }else {
+                            this.$message.error(res.msg);
+                        }
+                    }).catch(e=>{});
+
+                } else {
+                    return false;
+                }
+            });
+        },
+    }
+}
+</script>
+

src/scrm_pages/members/components/EditCardForm.vue

@@ -0,0 +1,396 @@
+<template>
+    <div id="edit-card-form-box">
+        <el-dialog title="编辑会员卡" :visible.sync="editCardFormVisible" width="900px" id="edit-member-card-show" v-loading="submitLoading" :element-loading-text="loadingText">
+            <el-row>
+                <el-col :span="10">
+                    <div class="membercard-area" :style="membercardAreaBackground">
+                        <span class="ico_crown"></span>
+                        <div class="card-header clearfix">
+                            <h4 class="shop-name">
+                                <span class="shop-logo">
+                                    <img :src="orgLogo"> 
+                                </span>
+                                <span class="tit">{{form.card_name}}</span>
+                            </h4>
+                            <div class="qr-code"></div>
+                        </div>
+                        <h3 class="member-type"></h3>
+                        <div class="card-content">
+                            <p class="expiry-date">
+                                有效期：
+                                <span>无限期</span>
+                            </p>
+                        </div>
+                    </div>
+                </el-col>
+                <el-col :span="14">
+                    <el-form ref="cardForm" :rules="cardRules" :model="form" label-width="100px" id="edit-member-card-form">
+                        <el-form-item label="机构Logo:" >
+                            <el-upload class="org-logo" action="https://upload.qiniup.com" disabled >
+                                <img v-if="orgLogo" :src="orgLogo" class="org-logo-image">
+                                <i v-else class="el-icon-plus org-logo-icon"></i>
+                                <div class="el-upload__tip" slot="tip">如需修改机构Logo信息，请在<em>机构中心</em>中更新。</div>
+                            </el-upload>
+                        </el-form-item>
+                        <el-form-item label="卡片封面:" required prop="background_type">
+                            <el-radio-group v-model="form.background_type">
+                                <el-radio :label="bgt.id" :value="bgt.id" :key="index" v-for="(bgt, index) in backgroundTypeOptions">{{bgt.name}}</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                        <el-form-item label="背景色:"  prop="background_color"  v-show="form.background_type==1">
+                            <el-color-picker v-model="form.background_color" @change="handleChangeColor" :predefine="predefineData"></el-color-picker>
+                        </el-form-item>
+                        <el-form-item label="封面图片:"  prop="background_image"  v-show="form.background_type==2">
+                           <el-upload
+                                v-loading="uploading"
+                                :element-loading-text="loadingText"
+                                class="bg-image-uploader"
+                                :data="uploadData"
+                                action="https://upload.qiniup.com"
+                                :show-file-list="false"
+                                :on-error="handleBackImageError"
+                                :on-success="handleBackImageSuccess"
+                                :before-upload="beforeBackImageUpload"
+                            >
+                                <img v-if="form.background_image" :src="form.background_image" class="bg-image">
+                                <i v-else class="el-icon-plus bg-image-uploader-icon"></i>
+                                <div class="el-upload__tip" slot="tip">尺寸：906*498像素，小于2M，支持jpg、png、jpeg格式</div>
+                            </el-upload>
+                        </el-form-item>
+
+                        <el-form-item label="会员卡名称:" required prop="card_name" >
+                            <el-input v-model="form.card_name" placeholder="最多可输入9个字符" maxlength="9"></el-input>
+                        </el-form-item>
+                        <el-form-item label="使用须知:"  prop="use_notice">
+                            <el-input v-model="form.use_notice" type="textarea" rows='4' placeholder="会员特权会根据您上文的勾选情况系统自动生成，此处可填写其它补充信息以便会员知晓，最多可输入300个字符"  maxlength="300"></el-input>
+                        </el-form-item>
+                        <el-form-item label="会员权益:"  prop="card_right">
+                            <el-input v-model="form.card_right" type="textarea" rows='4' placeholder="会员特权会根据您上文的勾选情况系统自动生成，此处可填写其它补充信息以便会员知晓，最多可输入300个字符"  maxlength="300"></el-input>
+                        </el-form-item>
+                        <el-form-item label="客服电话:"  prop="service_phone" >
+                            <el-input v-model="form.service_phone" placeholder="请输入手机号或固定电话" ></el-input>
+                        </el-form-item>
+                        <el-form-item label="升级条件:"  prop="upgrade_integral" >
+                            累积积分达到
+                            <el-input v-model.number="form.upgrade_integral" style="width:100px;" placeholder="" ></el-input>
+                            分
+                        </el-form-item>
+                    </el-form>
+                </el-col>
+            </el-row>
+            
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="editCardFormVisible = false">取消</el-button>
+                <el-button
+                type="primary"
+                @click="submitForm('cardForm')"
+                >保 存
+                </el-button>
+            </div>
+        </el-dialog>  
+    </div>
+</template>
+
+<script>
+import {EditMemberShipCard} from "@/api/member/member";
+import { getFileExtension,checkHexColor,checkMobileOrPhone } from "@/utils/tools";
+import { getToken } from "@/api/qiniu";
+
+export default {
+    name:'EditCardForm',
+    props:{
+        cardsData:{
+            type: Array,
+            default: function () {
+                return [];
+            }
+        },
+        cardIndex:{
+            type:Number,
+            default:-1.
+        },
+        form:{
+            background_type:1,
+            background:"#409EFF",
+            background_color:"#409EFF",
+            background_image:"",
+            card_name:'',
+            use_notice:'',
+            card_right:'',
+            service_phone:'',
+            upgrade_integral:0,
+            id:0,
+        },
+    },
+    data(){
+        var checkBgColorRule = (rule, value, callback) => {
+            if (this.form.background_type == 1 && !checkHexColor(value)) {
+                callback(new Error('请选择背景色'));
+            }else {
+               callback(); 
+            }
+        };
+        var checkBgImageRule = (rule, value, callback) => {
+            if (this.form.background_type == 2 && !value) {
+                callback(new Error('请上图片封面图片'));
+            }else {
+               callback(); 
+            }
+        };
+        var checkTelRule = (rule, value, callback) => {
+            if (value && !checkMobileOrPhone(value)) {
+                callback(new Error('请填写正确的客服电话:13888888888 或 0756-1234567'));
+            }else {
+               callback(); 
+            }
+        };
+        var checkIntegralRule = (rule, value, callback) => {
+            if(!value) {
+                callback(); 
+            }else {
+                if(!Number.isInteger(value)) {
+                    callback(new Error('必须是整数'));
+                }else {
+                    if (value<0) {
+                        callback(new Error('不能小于0'));
+                    }else {
+                        callback(); 
+                    }
+                }
+            }
+        };
+        return {
+            editCardFormVisible:false,
+            qiniuDomain: "https://images.shengws.com/",
+            uploading:false,
+            loadingText:'',
+            submitLoading:false,
+            uploadData: { token: "", key: "" },
+            predefineData:['#65d3e3','#82cecb','#5bd18b','#58a2ec','#9675cc','#f2ca68','#ff7979','#aed15b','#75c075','#67b192','#7b8a97','#34495e','#262626'],
+            backgroundTypeOptions:[
+                {id:1, name:'背景色'},
+                {id:2, name:'封面图片'},
+            ],
+            
+            cardRules: {
+                card_name: [{required: true, message: "请填写会员卡名称",},],
+                background_color: [{ validator: checkBgColorRule}],
+                background_image: [{ validator: checkBgImageRule}],
+                service_phone: [{ validator: checkTelRule}],
+                upgrade_integral: [{ validator:checkIntegralRule}],
+            },
+        }
+    },
+    methods:{
+        open:function(){
+            this.form.background_color = '';
+            this.form.background_image = '';
+            if (this.form.background_type == 1) {
+                this.form.background_color = this.form.background;
+            }else {
+                this.form.background_image = this.form.background;
+            }
+            this.editCardFormVisible = true;
+        },
+        resetForm:function(formName) {
+            if (typeof(this.$refs[formName]) !='undefined') {
+                this.$refs[formName].resetFields();
+            }
+        },
+        handleChangeColor:function(color){
+            this.form.background = color;
+        },
+        handleBackImageError(err, file, fileList) {
+            this.$message.error(err);
+            this.uploading = false;
+            return false;
+        },
+        handleBackImageSuccess(res, file) {
+            var url = this.qiniuDomain + res.url;
+            this.form.background_image = url
+            this.form.background = url;
+            this.uploading = false;
+        },
+        beforeBackImageUpload(file) {
+            var fileType = file.type;
+            const isJPG = fileType.indexOf("image") > -1;
+            const isLt2M = file.size / 1024 / 1024 < 2;
+            if (!isJPG) {
+                this.$message.error("只能上传图片");
+                return false;
+            }
+            if (!isLt2M) {
+                this.$message.error("图片大小不能超过 2MB!");
+                return false;
+            }
+
+            var date = new Date();
+            var ext = getFileExtension(file.name);
+            var key = "" + date.getFullYear() + (date.getMonth() + 1) + date.getDate() + date.getHours() + date.getMinutes() + date.getSeconds() + "_card_" +file.uid +"." + ext;
+            this.uploading = true;
+            this.loadingText = "图片上传中";
+
+            const _self = this;
+            return new Promise((resolve, reject) => {
+                getToken()
+                .then(response => {
+                    const token = response.data.data.uptoken;
+                    _self._data.uploadData.token = token;
+                    _self._data.uploadData.key = key;
+                    resolve(true);
+                })
+                .catch(err => {
+                    reject(false);
+                    this.uploading = false;
+                });
+            });
+        },
+        submitForm:function(formName){
+            this.$refs[formName].validate((valid) => {
+                if (valid) {
+                    this.loadingText = "正在保存...";
+                    this.submitLoading = true;
+                    EditMemberShipCard(this.form.id, this.form).then(response=>{
+                        var res = response.data;
+                        if(res.state === 1) {
+                            var card = res.data.card;
+                            this.cardsData.splice(this.cardIndex, 1, card);
+                            this.resetForm("cardForm");
+                            this.editCardFormVisible = false;
+                            this.$message.success("编辑会员卡成功");
+                        }else {
+                            this.$message.error(res.msg);
+                        }
+                        this.submitLoading = false;
+                    }).catch(e=>{
+                        this.submitLoading = false;
+                    });
+                } else {
+                    return false;
+                }
+            });
+        },
+    },
+    computed: {
+      orgLogo: function() {
+        var avatar = this.$store.getters.xt_user.org.org_logo
+        return avatar.length > 0
+          ? avatar
+          : require('../../../assets/home/userData.png')
+      },
+      membercardAreaBackground:function(){
+          if (this.form.background_type == 1) {
+              return 'background:' + this.form.background_color;
+          }else {
+              return 'background: url("' + this.form.background_image + '") 0% 0% / 100% 100% no-repeat;'
+          }
+      }
+    },
+}
+</script>
+
+<style rel="stylesheet/scss" >
+#edit-member-card-form .org-logo .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 25px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+#edit-member-card-form .org-logo .el-upload:hover {
+  border-color: #409eff;
+}
+#edit-member-card-form .org-logo-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 50px;
+  height: 50px;
+  line-height: 50px;
+  text-align: center;
+}
+
+#edit-member-card-form .el-upload__tip em {
+    color: #5599eb;
+}
+
+#edit-member-card-form .org-logo-image {
+  width: 50px;
+  height: 50px;
+  display: block;
+}
+
+
+#edit-member-card-form .bg-image-uploader .el-upload {
+  border: 1px dashed #d9d9d9;
+  border-radius: 10px;
+  cursor: pointer;
+  position: relative;
+  overflow: hidden;
+}
+#edit-member-card-form .bg-image-uploader .el-upload:hover {
+  border-color: #409eff;
+}
+#edit-member-card-form .bg-image-uploader-icon {
+  font-size: 28px;
+  color: #8c939d;
+  width: 278px;
+  height: 130px;
+  line-height: 130px;
+  text-align: center;
+}
+#edit-member-card-form .bg-image {
+  width: 278px;
+  height: 130px;
+  display: block;
+}
+
+#edit-member-card-show .membercard-area {
+    margin: 9px;
+    padding: 14px 18px 24px 17px;
+    background: #5599eb;
+    color: #fff;
+    border-radius: 20px 20px 20px 20px;
+    position: relative;
+}
+#edit-member-card-show  .membercard-area .ico_crown {
+    position: absolute;
+    right: 18px;
+    width: 64px;
+    height: 54px;
+    background: url("https://images.shengws.com/icos-201906141103.png") no-repeat -58px -422px;
+}
+#edit-member-card-show .clearfix {
+    clear: both;
+}
+#edit-member-card-show .clearfix:before {
+    display: table;
+    content: " ";
+}
+#edit-member-card-show .membercard-area .shop-name {
+    font-size: 14px;
+}
+#edit-member-card-show .membercard-area .shop-name .shop-logo {
+    display: inline-block;
+    width: 40px;
+    height: 40px;
+    float: left;
+    margin-right: 13px;
+}
+#edit-member-card-show .membercard-area .shop-name .shop-logo img {
+    width: 40px;
+    height: 40px;
+    border-radius: 50%;
+}
+#edit-member-card-show .membercard-area .shop-name .tit {
+    height: 41px;
+    line-height: 41px;
+}
+#edit-member-card-show  .member-type {
+    height: 70px;
+    line-height: 70px;
+}
+#edit-member-card-show .membercard-area .card-content .expiry-date {
+    font-size: 12px;
+}
+</style>
+

src/scrm_pages/members/components/EditTagForm.vue

@@ -0,0 +1,94 @@
+<template>
+    <div id="edit-tag-form-box">
+        <el-dialog title="编辑标签" :visible.sync="editTagFormVisible" width="700px" >
+            <el-form ref="tagForm" :rules="tagRules" :model="form" label-width="60px">
+                <el-row>
+                    <el-col :span="24">
+                        <el-form-item label="标签:" required prop="tag_name">
+                        <el-input v-model="form.tag_name"></el-input>
+                        </el-form-item>
+                    </el-col>
+                </el-row>
+            </el-form>
+            <div slot="footer" class="dialog-footer">
+                <el-button @click="editTagFormVisible = false">取消</el-button>
+                <el-button
+                type="primary"
+                @click="submitForm('tagForm')"
+                >保 存
+                </el-button>
+            </div>
+        </el-dialog>  
+    </div>
+</template>
+
+<script>
+import {EditTag} from "@/api/member/member";
+
+export default {
+    name:'EditTagForm',
+    props:{
+        tagsData:{
+            type: Array,
+            default: function () {
+                return [];
+            }
+        },
+        form:{
+            tag_name:'',
+            id:0,
+        },
+        tagIndex:{
+            type:Number,
+            default:-1,
+        },
+    },
+    data(){
+        return {
+            editTagFormVisible:false,
+            tagRules: {
+                tag_name: [{required: true, message: "请填写标签",},],
+            },
+            oldTagName:'',
+        }
+    },
+    methods:{
+        open:function(){
+            this.oldTagName = this.form.tag_name;
+            this.editTagFormVisible = true;
+        },
+        resetForm(formName) {
+            if (typeof(this.$refs[formName]) !='undefined') {
+                this.$refs[formName].resetFields();
+            }
+        },
+        submitForm(formName){
+            this.$refs[formName].validate((valid) => {
+                if (valid) {
+                    if(this.oldTagName == this.form.tag_name) {
+                        this.$message.success("标签名未变化");
+                        this.editTagFormVisible = false;
+                        return false;
+                    }
+                    EditTag(this.form.id, this.form).then(response=>{
+                        var res = response.data;
+                        if(res.state === 1) {
+                            var tag = res.data.tag;
+                            this.tagsData[this.tagIndex].tag_name = tag.tag_name;
+                            this.resetForm("tagForm");
+                            this.editTagFormVisible = false;
+                            this.$message.success("编辑标签成功");
+                        }else {
+                            this.$message.error(res.msg);
+                        }
+                    }).catch(e=>{});
+
+                } else {
+                    return false;
+                }
+            });
+        },
+    }
+}
+</script>
+

src/scrm_pages/members/members.vue

@@ -218,6 +218,7 @@
                 console.log("res是谁？",res)
                 if(res.state == 1) {
                     this.membersData = res.data.members;
+                    console.log("会员管理的数据",this.membersData)
                     this.total = res.data.total;
                     if(typeof(res.data.cards) != 'undefined') {
                         this.levelCards = res.data.cards;
@@ -367,9 +368,8 @@
                   this.memberData.ill_date = uParseTime(row.ill_date, "{y}-{m}-{d}");
               } else if (key in row) {
                   this.memberData[key] = row[key];                  
-              }
+              }            
           }
-          
           // this.memberData = row;
           this.memberIndex = index;
           this.$refs.editMemberForm.open();

src/scrm_pages/members/tags.vue

@@ -15,7 +15,7 @@
         </div>
         <div class="filter-container" style="margin-top: 10px;margin-left: 5px">
             <el-checkbox style="width: 30px" @change="changeCheck" v-model="checkAllStatus">全选</el-checkbox>
-            <el-button size="small" icon="el-icon-delete" >批量删除</el-button>
+            <el-button size="small" icon="el-icon-delete" @click="openDeleteTags">批量删除</el-button>
         </div>
         <el-table ref="multipleTable"  @selection-change="handleSelectionChange"  :header-cell-style="{ backgroundColor: 'rgb(245, 247, 250)'}" :data="tagsData" border fit highlight-current-row  style="width: 100%;margin-top: 10px;">
             <el-table-column
@@ -30,7 +30,7 @@
             </el-table-column>
             <el-table-column label="会员数" align="center">
                 <template slot-scope="scope">
-                <span>{{scope.row.created_time}}</span>
+                <span>{{scope.row.member_count}}</span>
                 </template>
             </el-table-column>
             <el-table-column label="操作" align="center">
@@ -44,24 +44,44 @@
                 </template>
             </el-table-column>
         </el-table>
+        <el-pagination
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+            :page-sizes="[10,20,50,100]"
+            :page-size="10"
+            background
+            style="margin-top:20px;"
+            align="right"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="total">
+        </el-pagination>
+
+        <!--create-tag-form 添加标签-->
+        <create-tag-form ref="createTagForm" :tagsData="tagsData" ></create-tag-form>
+        <!--edit-tag-form 编辑标签-->
+        <edit-tag-form ref="editTagForm" :tagsData="tagsData" :tagIndex="tagIndex" :form="editForm"></edit-tag-form>
     </div>
   </div>
 </template>
 
 <script>
-  import {GetTags} from "@/api/member/member";
+  import {GetTags,DeleteTags} from "@/api/member/member";
   import BreadCrumb from '../components/bread-crumb';
-  
+  import CreateTagForm from "./components/CreateTagForm";
+  import EditTagForm from "./components/EditTagForm";
+
   export default {
     name: 'memberTagList',
     components:{
       BreadCrumb,
+      CreateTagForm,
+      EditTagForm,
     },
     data(){
       return{
         crumbs: [
           { path: false, name: '会员管理' },
-          { path: false, name: '标签列表' }
+          { path: false, name: '标签管理' }
         ],
         total:0,
         listQuery:{
@@ -70,30 +90,109 @@
             search:'',
         },
         checkAllStatus:false,
-       
+        selectedTags:[],
         tagsData:[],
+        tagIndex:-1,
+        editForm:{
+            id:0,
+            tag_name:'',
+        },
       }
     },
     methods:{
         openCreate:function(){
-            this.tagsData.push({id:1,tag_name:'2'});
+          this.$refs.createTagForm.open();
         },
-        openEdit:function(row,index){},
-        openDelete:function(row,index){},
-        changeCheck:function(){
+        openEdit:function(row,index){
+            this.tagIndex = index;
+            this.editForm.id = row.id;
+            this.editForm.tag_name = row.tag_name;
+            this.$refs.editTagForm.open();
+        },
+        openDeleteTags:function(){
+          if (this.selectedTags.length==0) {
+            this.$message.error("请选择要删除的标签");
+            return false;
+          }
 
+          this.$confirm('确认要删除所选的标签吗？<br>删除后，标签将无法恢复', '删除提示', {
+            dangerouslyUseHTMLString:true,
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+          }).then(() => {
+            var ids = [];
+            var idMap = {};
+            for (const index in this.selectedTags) {
+              ids.push(this.selectedTags[index].id);
+              idMap[this.selectedTags[index].id] = this.selectedTags[index].id;
+            }
+            DeleteTags({ids:ids}).then(response=>{
+              var res = response.data;
+              if (res.state === 1) {
+                var tagsDataLength = this.tagsData.length;
+                for (let index = tagsDataLength-1; index >= 0; index--) {
+                  if(this.tagsData[index].id in idMap) {
+                    this.tagsData.splice(index, 1);
+                  }                  
+                }
+                this.$message.success("删除标签成功");
+              }else {
+                this.$message.error(res.msg);
+              }
+            }).catch(e=>{});
+          }).catch(() => {
+            return false        
+          });
+        },
+        openDelete:function(row,index){
+          this.$confirm('确认要删除该标签吗？<br>删除后，该标签将无法恢复', '删除提示', {
+            dangerouslyUseHTMLString:true,
+            confirmButtonText: '确定',
+            cancelButtonText: '取消',
+            type: 'warning'
+          }).then(() => {
+            var ids = [];
+            ids.push(row.id);
+            DeleteTags({ids:ids}).then(response=>{
+              var res = response.data;
+              if (res.state === 1) {
+                this.tagsData.splice(index, 1);
+                this.$message.success("删除标签成功");
+              }else {
+                this.$message.error(res.msg);
+              }
+            }).catch(e=>{});
+          }).catch(() => {
+            return false        
+          });
+        },
+        changeCheck:function(){
+          this.$refs.multipleTable.clearSelection();
+          if (this.checkAllStatus) {
+            this.$refs.multipleTable.toggleAllSelection();
+          }
         },
         handleSelectionChange:function (val) {
-            
+          this.selectedTags = val;
+        },
+        handleSizeChange(limit) {
+            this.listQuery.limit = limit;
+            this.GetTags();
+        },
+        handleCurrentChange(page) {
+            this.listQuery.page = page;
+            this.GetTags();
         },
         changeKey(){
             this.GetTags();
         },
         GetTags(){
-            GetTags().then(response=>{
+            GetTags(this.listQuery).then(response=>{
                 var res = response.data;
                 if(res.state===1) {
                     this.tagsData = res.data.tags;
+                    this.total = res.data.total;
                 }
             }).catch(e=>{})
         }

src/scrm_pages/weixinmp/authorization.vue

@@ -0,0 +1,180 @@
+<template>
+  <div class="main-contain">
+    <div class="position">
+      <bread-crumb :crumbs="crumbs"></bread-crumb>
+    </div>
+    <div class="app-container" id="winxin-auth-box">
+      <div class="filter-container" style="margin-top: 10px;margin-left: 5px ">
+        <div v-if="authData.authorizer_status==1">
+          <div class="bind-title-box">
+            <span class="bind-title">您已绑定公众号，如需更换绑定公众号，请点击下面按钮</span>
+          </div>
+          <el-button type="warning">更换绑定公众号</el-button>
+          <div class="bind-massage-box">
+            <span>
+              授权公众号：{{authData.authorizer_nick_name}}，类型：{{mpTypeName}}，
+              <!--授权方公众号类型，0代表订阅号，1代表由历史老帐号升级后的订阅号，2代表服务号-->
+              <!-- authorizer_service_type_info -->
+            </span>
+          </div>
+        </div>
+        <div v-else>
+          <div class="bind-title-box">
+            <span class="bind-title">您尚未绑定公众号</span>
+          </div>
+          <el-button type="warning">已有公众号，立刻绑定</el-button>
+          <div class="bind-massage-box">
+            <span>
+              如果还没有公众号，需要先在微信公众号平台进行申请。 去
+              <a href="https://mp.weixin.qq.com/" title="申请微信公众号">申请>></a>
+            </span>
+          </div>
+        </div>
+
+      </div>
+      <div style="height:20px">&nbsp;</div>
+      <div class="dataTitle title-15">授权公众号后可以使用什么功能？</div>
+      <div class="dataBody">
+        <p>1.微信公众号的菜单设置</p>
+        <p>2.微网站分享功能</p>
+      </div>
+
+      <div style="height:20px">&nbsp;</div>
+      <div class="dataTitle title-7">授权有风险吗？</div>
+      <div class="dataBody">
+        <p>没有，酷医云使用了微信平台提供的官方授权接口，是非常安全的。</p>
+      </div>
+
+      <div style="height:20px">&nbsp;</div>
+      <div class="dataTitle title-23">我的公众号已经授权了其它的第三方平台，怎么办？</div>
+      <div class="dataBody">
+        <p>没问题，秀米的授权不会影响任何第三方平台，也不影响现有的任何自定义菜单、开发模式、自定义回复等功能。</p>
+      </div>
+
+      <div style="height:20px">&nbsp;</div>
+      <div class="dataTitle title-12">如何取消给酷医云的授权？</div>
+      <div class="dataBody">
+        <p>公众号取消授权，进入微信后台，点击“+添加功能插件”，进入“授权管理”，就可以看到酷医云的授权，并且解除授权了。</p>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import BreadCrumb from "../components/bread-crumb";
+
+export default {
+  name: "authorization",
+  components: {
+    BreadCrumb
+  },
+  data() {
+    return {
+      crumbs: [
+        { path: false, name: "系统设置" },
+        { path: false, name: "公众号授权" }
+      ],
+
+      authData: {
+        id: 0,
+        user_org_id: 0,
+        authorizer_appid: "",
+        authorizer_access_token: "",
+        authorizer_refresh_token: "",
+        authorizer_jsapi_ticket: "",
+        authorizer_funcscope_category: "",
+        authorizer_nick_name: "",
+        authorizer_head_img: "",
+        authorizer_service_type_info: 0,
+        authorizer_verify_type_info: 0,
+        authorizer_user_name: "",
+        authorizer_principal_name: "",
+        authorizer_business_info: "",
+        authorizer_qrcode_url: "",
+        created_time: "",
+        updated_time: "",
+        authorizer_status: 1
+      }
+    };
+  },
+  methods: {},
+  created() {},
+  computed:{
+    mpTypeName:function(){
+      return 'xx';
+    }
+  },
+};
+</script>
+
+<style scoped>
+#winxin-auth-box .bind-title-box {
+  margin-bottom: 20px;
+}
+
+#winxin-auth-box .bind-title {
+  color: #000;
+  font-size: 24px;
+}
+
+#winxin-auth-box .bind-massage-box {
+  margin-top: 10px;
+  color: #303133;
+  font-size: 14px;
+}
+#winxin-auth-box .bind-massage-box a,#winxin-auth-box .bind-massage-box a:visited,#winxin-auth-box .bind-massage-box a:active {
+  color: #409eff;
+}
+#winxin-auth-box .bind-massage-box a:hover {
+  color: #409eff;
+  text-decoration: underline;
+}
+
+#winxin-auth-box .dataTitle {
+  color: #303133;
+  font-size: 14px;
+  border-bottom: 1px #409eff solid;
+  height: 36px;
+  line-height: 36px;
+  margin: 0 0 20px 0;
+  position: relative;
+}
+
+#winxin-auth-box .dataTitle::before {
+  position: absolute;
+  left: 0;
+  bottom: -1px;
+  content: "";
+  height: 3px;
+  background: #409eff;
+}
+
+#winxin-auth-box .title-15::before {
+  width: 200px;
+}
+#winxin-auth-box .title-12::before {
+  width: 158px;
+}
+#winxin-auth-box .title-7::before {
+  width: 88px;
+}
+#winxin-auth-box .title-23::before {
+  width: 312px;
+}
+#winxin-auth-box .dataBody {
+  color: #303133;
+  font-size: 14px;
+  line-height: 18px;
+}
+/*.app-container .cell.clearfix .time ul li {*/
+/*float: left;*/
+/*list-style: none;*/
+/*cursor: pointer;*/
+/*padding: 6px 20px;*/
+/*color: #606266;*/
+/*border-radius: 4px;*/
+/*margin: 0 8px 0 0;*/
+/*font-size: 14px;*/
+/*text-align: center;*/
+/*}*/
+</style>

src/utils/tools.js

@@ -175,4 +175,16 @@ export function uParseTime(time, cFormat) {
         return false; 
     } 
     return true;
+  } 
+  
+  export function checkMobileOrPhone(tel){ 
+    var mobile = /^1[2-9][0-9]\d{8}$/ , phone = /^0\d{2,3}-?\d{7,8}$/;
+    return mobile.test(tel) || phone.test(tel);
+  } 
+
+  export function checkHexColor(color){ 
+    if(!(/(^#[0-9A-F]{6}$)|(^#[0-9A-F]{3}$)/i.test(color))){ 
+        return false; 
+    } 
+    return true;
   }