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

src/api/kefu/tencentim.js

@@ -5,4 +5,11 @@ export function getusersig() {
     url: '/api/tencent/usersig', 
     method: 'get',
   })
-}
+}
+export function GetAllMembers() {
+  return request({
+    url: '/api/members/all', 
+    method: 'get',
+  })
+}
+

src/api/sms/index.js

@@ -0,0 +1,68 @@
+import request from '@/utils/request'
+
+export function fetchBatchSendRecords(page) {
+    return request({
+        url: "/api/sms/records",
+        method: "get",
+        params: {
+            page: page,
+        }
+    })
+}
+
+export function sendsInitData(action, id) {
+    var param = {}
+    if (action != null && action != undefined) {
+        param.action = action
+    }
+    if (id != null && id != undefined) {
+        param.id = id
+    }
+    return request({
+        url: "/api/sms/sendinit",
+        method: "get",
+        params: param,
+    })
+}
+
+export function tagFilterCustomerCount(tag_ids_str) {
+    return request({
+        url: "/api/sms/tagfiltercount",
+        method: "get",
+        params: {
+            tags: tag_ids_str,
+        },
+    })
+}
+
+export function send2AllCustomers(content) {
+    return request({
+        url: "/api/sms/send2all",
+        method: "post",
+        params: {
+            content: content,
+        }
+    })
+}
+
+export function send2TagCustomers(content, tag_ids) {
+    return request({
+        url: "/api/sms/send2tag",
+        method: "post",
+        params: {
+            content: content,
+            tags: tag_ids,
+        }
+    })
+}
+
+export function send2SpecificCustomers(content, customer_ids) {
+    return request({
+        url: "/api/sms/send2specific",
+        method: "post",
+        params: {
+            content: content,
+            ids: customer_ids,
+        }
+    })
+}

src/lang/en.js

@@ -120,6 +120,8 @@ export default {
     activityShare: "activity share",
     activityPreview: "activity preview",
     activitySignupList: "activity sign up list",
+    SMSManage: "sms manage",
+    SMSSend: "sms send",
   },
   navbar: {
     logOut: 'Log Out',

src/lang/zh.js

@@ -171,6 +171,8 @@ export default {
     activityShare: "活动分享",
     activityPreview: "活动预览",
     activitySignupList: "报名列表",
+    SMSManage: "短信管理",
+    SMSSend: "群发短信",
   },
   navbar: {
     logOut: '退出登录',

src/router/index.js

@@ -84,9 +84,9 @@ var _asy_router_map = [
   article,
   marketing_tool,
   org,
-  role,
   system,
-  site
+  site,
+  role,
 ]
 
 var is_asy_router = process.env.NODE_ENV === 'production' // true; 设置为 true 强制进行路由验证

src/router/modules/marketing_tool.js

@@ -61,17 +61,6 @@ export default {
         noCache: true,
       }
     },
-    // {
-    //   path: "/activity/preview",
-    //   hidden: true,
-    //   is_menu: false,
-    //   component: () => import("@/scrm_pages/marketing_tool/activity_preview"),
-    //   name: "activityPreview",
-    //   meta: {
-    //     title: "activityPreview",
-    //     noCache: true,
-    //   }
-    // },
     {
       path: "/activity/signupusers",
       hidden: true,

src/router/modules/member.js

@@ -30,5 +30,21 @@ export default {
       name: 'memberCardlist',
       meta: { title: '会员卡管理', noCache: true }
     },
+
+    // SMS
+    {
+      path: '/sms',
+      component: () => import('@/scrm_pages/sms/sms_manage'),
+      name: 'SMSManage',
+      meta: { title: 'SMSManage', noCache: true }
+    },
+    {
+      path: '/sms/send',
+      component: () => import('@/scrm_pages/sms/sms_send'),
+      hidden: true,
+      is_menu: false,
+      name: 'SMSSend',
+      meta: { title: 'SMSSend', noCache: true }
+    },
   ]
 }

src/router/modules/site.js

@@ -4,17 +4,32 @@ export default {
   path: '',
   component: Layout,
   redirect: '/site',
+  alwaysShow: true,
+  // name: '微网站',
+  meta: {
+    title: '微网站',
+    icon: 'dashboard'
+  },
   children: [{
-    path: '/site',
-    component: () => import('@/scrm_pages/site/index'),
-    name: 'site',
-    meta: {
-      title: '微网站',
-      icon: 'dashboard',
-      noCache: true
+      path: '/site',
+      component: () => import('@/scrm_pages/site/index'),
+      name: 'site',
+      unfinished: true,
+      meta: {
+        title: '微网站',
+        noCache: true,
+      }
+    },
+    {
+      path: '/site/preview',
+      component: () => import('@/scrm_pages/site/preview'),
+      name: '预览',
+      meta: {
+        title: 'preview'
+      },
+      hidden: true,
+      is_menu: false
     }
-  },
-  { path: '/site/preview', component: () => import('@/scrm_pages/site/preview'), name: '预览', meta: { title: 'preview' }, hidden: true, is_menu: false }
 
   ]
 }

src/scrm_pages/contactBox/index.vue

@@ -642,13 +642,14 @@ export default {
 
                 newMsg = newMsgList[j];
                 formId = newMsg.getSession().id();
-                if (formId.indexOf("AdminKeFu")<0) {
-                    continue;
-                }else {
+                if (formId.indexOf("AdminKeFu")>-1) {
+                    
                     if (newMsg.getSession().id() == this.selToID) {//为当前聊天对象的消息
                         this.addMsg(newMsg);
                     }
                     msgList.push(newMsg.elems[0].content.text);
+                }else if(formId.indexOf("User")>-1){
+                    this.$message.success("有的新的消息，请到客服管理查看")
                 }
                 
             }

src/scrm_pages/home/index.vue

@@ -10,6 +10,21 @@
        </li>
      </ul>
    </div>
+   <div class="notice">
+     <el-table ref="notice_table" :data="notices" @row-click="expandRow">
+       <el-table-column
+        type="selection"
+        width="30">
+       </el-table-column>
+       <el-table-column type="expand" width="20">
+         <template slot-scope="scope">
+           <p class="notice_expand_content">{{ scope.row.content }}</p>
+           <p class="notice_expand_publisher">酷医聚客团队</p>
+         </template>
+       </el-table-column>
+       <el-table-column prop="title" label="所有通知"></el-table-column>
+     </el-table>
+   </div>
   </div>
 </div>
 
@@ -21,16 +36,34 @@ export default {
     return {
       numbers: [
         { num: '0', name: '新增数量', time: '昨日: 0' },
-        { num: '1', name: '总粉丝', time: '昨日: 0' },
-        { num: '1', name: '今日新增会员', time: '昨日: 0' },
-        { num: '1', name: '总会员', time: '昨日: 1' },
-        { num: '1', name: '商品浏览数', time: '昨日: 1' },
-        { num: '111', name: '文章浏览量', time: '昨日: 0' },
-        { num: '150', name: '活动浏览量', time: '昨日: 0' },
-        { num: '120', name: '新增订单', time: '昨日: 0' }
-      ]
+        { num: '0', name: '总粉丝', time: '昨日: 0' },
+        { num: '0', name: '今日新增会员', time: '昨日: 0' },
+        { num: '0', name: '总会员', time: '昨日: 0' },
+        { num: '0', name: '商品浏览数', time: '昨日: 0' },
+        { num: '0', name: '文章浏览量', time: '昨日: 0' },
+        { num: '0', name: '活动浏览量', time: '昨日: 0' },
+        { num: '0', name: '新增订单', time: '昨日: 0' }
+      ],
+
+      expanding_row: null,
+      notices: [
+        // { id: 1, title: "第一个通知", content: "第一个通知第一个通知第一个通知第一个通知第一个通知第一个通知第一个通知第一个通知第一个通知第一个通知" }, 
+        // { id: 2, title: "第二个通知", content: "第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知第二个通知" }, 
+      ],
     }
-  }
+  },
+  methods: {
+    expandRow: function(row, column, event) {
+      if (this.expanding_row == null || this.expanding_row.id != row.id) {
+        this.$refs.notice_table.toggleRowExpansion(this.expanding_row, false)
+        this.$refs.notice_table.toggleRowExpansion(row, true)
+        this.expanding_row = row
+      } else {
+        this.$refs.notice_table.toggleRowExpansion(this.expanding_row, false)
+        this.expanding_row = null
+      }
+    }
+  },
 }
 </script>
 
@@ -65,5 +98,20 @@ export default {
       }
     }
   }
+
+  .notice {
+    box-shadow: 4px 4px 8px #dde7f2;
+    margin-top: 20px;
+
+    .notice_expand_content {
+      color: #89949b;
+      font-size: 15px;
+      line-height: 25px;
+    }
+    .notice_expand_publisher {
+      font-size: 14px;
+      margin-top: 10px;
+    }
+  }
 }
 </style>

src/scrm_pages/kefu/index.vue

@@ -3,107 +3,141 @@
     <div class="position">
       <bread-crumb :crumbs='crumbs'></bread-crumb>
     </div>
-    <div class="app-container">
-        <div class="customer_plate white-bg">
-            <div class="aside">
-                <div class="customer_search clearfix">
-                <div class="super_searchbox">
-                    <span class="search_icon"></span>
-                    <input type="text" class="cus_search_input" v-model="searchname" placeholder="请输入客户名称">
-                </div>
-                </div>
-                <div class="client_list_box">
-                <div class="client_list">
-                    <ul class="users-list">
-                    <li v-for="(patient, key) in patientsMap" v-show="searchname == '' || (patient.name.indexOf(searchname)>=0)" :class="thisPatient && patient.user_id==thisPatient.user_id?'Active':''" :key="key" :id="'sessDiv_User_'+patient.user_id" class="item" :data-username="patient.name" @click="chooseThisUser(patient)">
-                        <span :id="'badgeDiv_User_'+patient.user_id" class="circle-count" style="" v-show="patient.unread_msg_count"><i class="count">{{patient.unread_msg_count}}</i></span>
-                        <figure :id="'faceImg_User_'+patient.user_id" class="session-pic"><img :src="patient.avatar"></figure>
-                        <h3 :id="'nameDiv_User_'+patient.user_id" class="nick">{{patient.name}}</h3>
-                        <!-- <span class="square-close" title="退出接待" :data-toid="'User_'+patient.user_id">×</span> -->
-                    </li>
-                    </ul>
-                </div>
-                </div>
+    <div class="app-container"  
+      v-loading="loading"
+      :element-loading-text="loadingtext">
+
+      <div class="customer_plate white-bg">
+        <div class="aside">
+          <div class="customer_search clearfix">
+            <div class="super_searchbox">
+              <span class="search_icon"></span>
+              <input type="text" class="cus_search_input" v-model="searchname" placeholder="请输入客户名称">
             </div>
+          </div>
+          <div class="client_list_box">
+            <div class="client_list">
+              <ul class="users-list">
+                <li v-for="(customer, key) in customersMap" v-show="searchname == '' || (customer.name.indexOf(searchname)>=0)" :class="thisCustomer && customer.user_id==thisCustomer.user_id?'Active':''" :key="key" :id="'sessDiv_User_'+customer.user_id" class="item" :data-username="customer.name" @click="chooseThisUser(customer)">
+                  <span :id="'badgeDiv_User_'+customer.user_id" class="circle-count" style="" v-show="customer.unread_msg_count"><i class="count">{{customer.unread_msg_count}}</i></span>
+                  <figure :id="'faceImg_User_'+customer.user_id" class="session-pic"><img :src="customer.avatar"></figure>
+                  <h3 :id="'nameDiv_User_'+customer.user_id" class="nick">{{customer.name}}</h3>
+                  <!-- <span class="square-close" title="退出接待" :data-toid="'User_'+customer.user_id">×</span> -->
+                </li>
+              </ul>
+            </div>
+          </div>
+        </div>
 
-            <div class="left_content">
-                <div class="conversation-admin">
-                <span class="nickname">
-                    <span></span>
-                </span>
-                </div>
-                <div class="message-list-wrap">
-                <div class="message-list-item">
-                    <ul class="message-list">
-                    
-                    <li v-for="(messageitem, key) in messageBox" :key="key" :id="'id_'+messageitem.id" class="message-item clearfix">
-                        <div class="time"><span v-html="messageitem.time"></span></div>
-                        <div class="user " :class="messageitem.float">
-                            <figure class="bg-pic circle-bg-pic">
-                            <div class="bg-pic-content">
-                                <img :src="messageitem.avatar">
-                            </div>
-                            </figure>
+        <div class="left_content">
+          <div class="conversation-admin">
+            <span class="nickname">
+              <span></span>
+            </span>
+          </div>
+          <div class="message-list-wrap">
+            <div class="message-list-item">
+              <ul class="message-list">
+              
+                <li v-for="(messageitem, key) in messageBox" :key="key" :id="'id_'+messageitem.id" class="message-item clearfix">
+                    <div class="time"><span v-html="messageitem.time"></span></div>
+                    <div class="user " :class="messageitem.float">
+                      <figure class="bg-pic circle-bg-pic">
+                        <div class="bg-pic-content">
+                          <img :src="messageitem.avatar">
                         </div>
-                        <div class="message-body " :class="messageitem.float"><div class="inner" v-html="messageitem.message"></div></div>
-                    </li>
-
-                    </ul>
-                </div>
-                <div class="no_session">
-                    <span class="no_session_pic"></span>
-                    <p class="no_session_txt">没有选中会话哦！</p>
-                </div>
-                </div>
-                <div class="send_box" v-loading="loadingbox" :element-loading-text="loadingboxtext">
-                <div class="inputer_actions">
-                    <!-- <div class="face">
-                    <span class="face_icon" @click="showEmotionDialog"></span>
-                    </div> -->
-                    <div class="picture">
-                    <span class="picture_icon" @click="selectPicClick"></span>
-                    </div>
-                </div>
-                <div id="wl_faces_box" class="wl_faces_box" v-bind:style="{left:'0px', display:facesBoxDisplay}">
-                    <div class="wl_faces_content">
-                    <div class="title">
-                        <ul>
-                        <li class="title_name">常用表情</li>
-                        <li class="wl_faces_close">
-                            <span @click="facesBoxDisplay='none'">&nbsp;</span>
-                        </li>
-                        </ul>
+                      </figure>
                     </div>
-                    <div id="wl_faces_main" class="wl_faces_main">
-                        <ul id="emotionUL">
-                        <li v-for="(emotion, key) in emotionList" :key="key" @click="chooseThisFace(emotion)">
-                            <img :src="emotion.src" :id="emotion.id" alt="" style="cursor:pointer;">
-                        </li>
-                        </ul>
-                    </div>
-                    </div>
-                    <div class="wlf_icon"></div>
-                </div>
-                <div class="inputer-area">
-                    <textarea
-                    maxlength="500" v-model="message"
-                    class="message-textarea transparent-txta"
-                    placeholder
-                    id="message"
-                    ></textarea>
-                </div>
-                <div class="send_box_btn">
-                    <button class="send_btn" id="sendMessaeg" @click="sendMessage">发送</button>
+                    <div class="message-body " :class="messageitem.float"><div class="inner" v-html="messageitem.message"></div></div>
+                </li>
+
+              </ul>
+            </div>
+            <div class="no_session">
+              <span class="no_session_pic"></span>
+              <p class="no_session_txt">没有选中会话哦！</p>
+            </div>
+          </div>
+          <div class="send_box" v-loading="loadingbox" :element-loading-text="loadingboxtext">
+            <div class="inputer_actions">
+              <!-- <div class="face">
+                <span class="face_icon" @click="showEmotionDialog"></span>
+              </div> -->
+              <div class="picture">
+                <span class="picture_icon" @click="selectPicClick"></span>
+              </div>
+            </div>
+            <div id="wl_faces_box" class="wl_faces_box" v-bind:style="{left:'0px', display:facesBoxDisplay}">
+              <div class="wl_faces_content">
+                <div class="title">
+                  <ul>
+                    <li class="title_name">常用表情</li>
+                    <li class="wl_faces_close">
+                      <span @click="facesBoxDisplay='none'">&nbsp;</span>
+                    </li>
+                  </ul>
                 </div>
+                <div id="wl_faces_main" class="wl_faces_main">
+                  <ul id="emotionUL">
+                    <li v-for="(emotion, key) in emotionList" :key="key" @click="chooseThisFace(emotion)">
+                      <img :src="emotion.src" :id="emotion.id" alt="" style="cursor:pointer;">
+                    </li>
+                  </ul>
                 </div>
+              </div>
+              <div class="wlf_icon"></div>
+            </div>
+            <div class="inputer-area">
+              <textarea
+                maxlength="500" v-model="message"
+                class="message-textarea transparent-txta"
+                placeholder
+                id="message"
+              ></textarea>
             </div>
+            <div class="send_box_btn">
+              <button class="send_btn" id="sendMessaeg" @click="sendMessage">发送</button>
+            </div>
+          </div>
+        </div>
+      </div>
+
+      <el-dialog title="发送图片" :visible.sync="dialogPicModal">
+        <el-form ref="form" :model="form" label-width="80px">
+          <el-form-item label="选择">
+            <input type="file" name="filebox" id="upd_pic" @change="fileOnChange(this)">
+
+          </el-form-item>
+          <el-form-item label="预览">
+          <img :src="dialogImageUrl"  alt="" style="width:100%">
+          </el-form-item>
+          <el-form-item label="进度">
+            <el-progress :text-inside="true" :stroke-width="18" :percentage="percentage" status="success"></el-progress>
+          </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+          <el-button type="primary" @click="uploadPic">发送</el-button>
         </div>
+      </el-dialog>
+
+
     </div>
   </div>
 </template>
 
 <script>
-  import BreadCrumb from '../components/bread-crumb'
+import BreadCrumb from '../components/bread-crumb'
+import {getusersig,GetAllMembers} from "@/api/kefu/tencentim";
+
+// let webim = require('../../../static/im/sdk/sdk/webim');
+import webim from 'webim-tencent'
+// let webim = webimSDK.webim;
+let selType =  webim.SESSION_TYPE.C2C;
+let reqMsgCount = 15; //每次请求的历史消息(c2c获取群)条数
+var msgList = [];
+var getPrePageC2CHistroyMsgInfoMap = {};
+var kgetPrePageC2CHistroyMsgInfoMap = {};
+
   export default {
     name: 'commentList',
     components:{
@@ -115,15 +149,749 @@
           { path: false, name: '客服管理' },
           { path: false, name: '咨询管理' }
         ],
+        
+        imloginFlag:false,
+        customer_id:0,
         searchname:'',
-        patientsMap:{},
-        thisPatient:null,
+        facesBoxDisplay:'none',
+        emotionList:[],
+        percentage:0,
+        dialogImageUrl:'',
+        form:{name:'', region:''},
+        dialogPicModal:false,
+        loading:false,
+        loadingtext:'加载中...',
+        loadingbox:true,
+        loadingboxtext:'请选择用户',
+        selToID:'',
+        useradmin:{
+          usersig: '',
+          Indentifier: '',
+          appIDAt3rd:'',
+          IdentifierNick:'',
+          HeadURL:'',
+        },
+        loginInfo: {
+            sdkAppID: '', //用户所属应用id,必填
+            appIDAt3rd: '',
+            identifier: '', //当前用户ID,必须是否字符串类型，必填
+            accountType: '', //用户所属应用帐号类型，必填
+            userSig: '', //当前用户身份凭证，必须是字符串类型，必填
+            identifierNick: '', //当前用户昵称，不用填写，登录接口会返回用户的昵称，如果没有设置，则返回用户的id
+            headurl: '', //当前用户默认头像，选填，如果设置过头像，则可以通过拉取个人资料接口来得到头像信息
+        },
+        loginOptions:{},
+        userSigFlag:false,
+        userListFlag:false,
+        customers:[],
+        customersUnique:[],
+        customersMap:{},
+        thisCustomer:null,
+        selSess:null,
+        message:'',
         messageBox:[],
       }
     },
-    methods:{},
+    methods: {
+      
+      bindScrollHistoryEvent(axtion){
+        var msgflow = document.getElementsByClassName("message-list-item")[0];
+        var _this = this;
+        if (axtion=='init') {
+          msgflow.onscroll = function () {
+                if (msgflow.scrollTop == 0) {
+                    msgflow.scrollTop = 10;
+                    if (selType == webim.SESSION_TYPE.C2C) {
+                        _this.getPrePageC2CHistoryMsgs();
+                    } 
+                }
+            }
+        }else {
+          
+              msgflow.onscroll = null;
+        }
+      },
+      selectPicClick() {
+        this.dialogPicModal = true;
+      },  
+      chooseThisFace(face) {
+        this.message = this.message + face.id;
+        this.facesBoxDisplay='none';
+      },
+      onProgressCallBack(loadedSize, totalSize) {
+          this.percentage = (loadedSize / totalSize) * 100;
+      },
+      uploadPic(){
+        var _this = this;
+        var uploadFiles = document.getElementById('upd_pic');
+        var file = uploadFiles.files[0];
+        var businessType;//业务类型，1-发群图片，2-向好友发图片
+        if (selType != webim.SESSION_TYPE.C2C) {//向好友发图片
+          this.$message.error('不支持群聊');
+          return; 
+        } 
+        businessType = webim.UPLOAD_PIC_BUSSINESS_TYPE.C2C_MSG;
+        //封装上传图片请求
+        var opt = {
+            'file': file, //图片对象
+            'onProgressCallBack': this.onProgressCallBack, //上传图片进度条回调函数
+            //'abortButton': document.getElementById('upd_abort'), //停止上传图片按钮
+            'To_Account': this.selToID, //接收者
+            'businessType': businessType//业务类型
+        };
+        //上传图片
+        webim.uploadPic(opt,
+            function (resp) {
+                //上传成功发送图片
+                _this.sendPic(resp, file.name);
+                
+            },
+            function (err) {
+                alert(err.ErrorInfo);
+            }
+        );
+      },
+      sendPic(images, imgName) {
+        var _this = this;
+          if (!this.selToID) {
+              alert("请先选择对话用户");
+              return;
+          }
+
+          if (!this.selSess) {
+              this.selSess = new webim.Session(selType, this.selToID, this.selToID, this.thisCustomer.avatar, Math.round(new Date().getTime() / 1000));
+          }
+          var msg = new webim.Msg(this.selSess, true, -1, -1, -1, this.loginInfo.identifier, 0, this.loginInfo.identifierNick);
+          var images_obj = new webim.Msg.Elem.Images(images.File_UUID);
+          for (var i in images.URL_INFO) {
+              var img = images.URL_INFO[i];
+              var newImg;
+              var type;
+              switch (img.PIC_TYPE) {
+                  case 1://原图
+                      type = 1;//原图
+                      break;
+                  case 2://小图（缩略图）
+                      type = 3;//小图
+                      break;
+                  case 4://大图
+                      type = 2;//大图
+                      break;
+              }
+              newImg = new webim.Msg.Elem.Images.Image(type, img.PIC_Size, img.PIC_Width, img.PIC_Height, img.DownUrl);
+              images_obj.addImage(newImg);
+          }
+          msg.addImage(images_obj);
+          //if(imgName){
+          //    var data=imgName;//通过自定义消息中的data字段保存图片名称
+          //    var custom_obj = new webim.Msg.Elem.Custom(data, '', '');
+          //    msg.addCustom(custom_obj);
+          //}
+          //调用发送图片消息接口
+          webim.sendMsg(msg, function (resp) {
+              if (selType == webim.SESSION_TYPE.C2C) {//私聊时，在聊天窗口手动添加一条发的消息，群聊时，长轮询接口会返回自己发的消息
+                  _this.addMsg(msg);
+              }
+          }, function (err) {
+              alert(err.ErrorInfo);
+          });
+      },
+      showEmotionDialog(){
+        this.facesBoxDisplay = 'block';
+      },
+      fileOnChange(){
+        var file = document.querySelector('input[name=filebox]').files[0]
+        if (!window.File || !window.FileList || !window.FileReader) {
+            alert("您的浏览器不支持File Api");
+            return;
+        }
+
+        var fileSize = file.size;
+
+        //先检查图片类型和大小
+        if (!this.checkPic(file, fileSize)) {
+            return;
+        }
+
+        var _this = this;
+        //预览图片
+        var reader = new FileReader();
+        reader.onload = (function (file) {
+            return function (e) {
+              _this.dialogImageUrl = this.result;
+            };
+        })(file);
+        //预览图片
+        reader.readAsDataURL(file);
+      },
+      
+      checkPic(obj, fileSize) {
+          var picExts = 'jpg|jpeg|png|bmp|gif|webp';
+          var photoExt = obj.name.substr(obj.name.lastIndexOf(".") + 1).toLowerCase();//获得文件后缀名
+          var pos = picExts.indexOf(photoExt);
+          if (pos < 0) {
+            this.$message.error('您选中的文件不是图片，请重新选择');
+              return false;
+          }
+          fileSize = Math.round(fileSize / 1024 * 100) / 100; //单位为KB
+          if (fileSize > 30 * 1024) {
+            this.$message.error('您选择的图片大小超过限制(最大为30M)，请重新选择');
+              return false;
+          }
+          return true;
+      },
+      chooseThisUser(customer) {
+        if(customer.user_id<=0) {
+          this.$message.error('选择对象还未关联用户，无法进行对话');
+          return false;
+        }
+        this.thisCustomer = customer;
+        this.selToID = "User_" + customer.user_id;
+        this.onSelSess(selType, this.selToID);
+        this.loadingbox = false;
+      },
+      sendMessage(){
+        if(this.thisCustomer == null) {
+          this.$message.error('请先选择对话用户');
+          return false;
+        }
+        var message = this.message.trim();
+        var msgLen = webim.Tool.getStrBytes(message);
+        if(message == '') {
+          this.$message.error('不能发送空消息');
+          return false;
+        }
+        var maxLen, errInfo;
+        if (selType == webim.SESSION_TYPE.C2C) {
+          maxLen = webim.MSG_MAX_LENGTH.C2C;
+          errInfo = "消息长度超出限制(最多" + Math.round(maxLen / 3) + "汉字)";
+        } else {
+          maxLen = webim.MSG_MAX_LENGTH.GROUP;
+          errInfo = "消息长度超出限制(最多" + Math.round(maxLen / 3) + "汉字)";
+        }
+        if (msgLen > maxLen) {
+          this.$message.error(errInfo);
+          return false;
+        }
+        this.handleMsgSend(message);
+
+      },
+      webimlogin(){
+        let _this = this;
+        let listeners = {
+          "onConnNotify": this.onConnNotify //监听连接状态回调变化事件,必填
+          ,
+          "jsonpCallback": this.jsonpCallback //IE9(含)以下浏览器用到的jsonp回调函数，
+          ,
+          "onMsgNotify": this.onMsgNotify //监听新消息(私聊，普通群(非直播聊天室)消息，全员推送消息)事件，必填
+          ,
+          "onProfileSystemNotifys": this.onProfileSystemNotifys //监听资料系统（自己或好友）通知事件，选填
+          ,
+          "onKickedEventCall": this.onKickedEventCall //被其他登录实例踢下线
+          ,
+          "onC2cEventNotifys": this.onC2cEventNotifys //监听C2C系统消息通道
+        };
+
+        webim.login(this.loginInfo, listeners, this.loginOptions, 
+          function(resp){
+            _this.$message.success('登录成功');
+            _this.imloginFlag = true;
+          },
+          function(err) {
+            _this.$message.error('登录错误');
+          }
+        );
+      
+      },
+      onConnNotify(){},
+      jsonpCallback(){},
+      onMsgNotify(newMsgList){
+        //监听新消息事件
+        var msgList = [];
+        var dateStart = null;
+        var dateEnd = null;
+
+        //console.warn(newMsgList);
+        var sess, newMsg, formId;
+        //获取所有聊天会话
+        var sessMap = webim.MsgStore.sessMap();
+
+        for (var j in newMsgList) {//遍历新消息
+
+            newMsg = newMsgList[j];
+            formId = newMsg.getSession().id();
+            if (formId.indexOf("User")<0) {
+                continue;
+            }else {
+                // if (!this.selToID) {//没有聊天对象
+                //     this.selToID = newMsg.getSession().id();
+                //     selType = newMsg.getSession().type();
+                //     this.selSess = newMsg.getSession();
+                //     if(this.selToID in this.customersMap) {
+                //       this.thisCustomer = this.customersMap[this.selToID];
+                //     }
+                // }
+                if (newMsg.getSession().id() == this.selToID) {//为当前聊天对象的消息
+                    this.addMsg(newMsg);
+                }
+                msgList.push(newMsg.elems[0].content.text);
+            }
+
+            
+        }
+
+
+        for (var i in sessMap) {
+            sess = sessMap[i];
+            if (this.selToID != sess.id() && sess.id() in this.customersMap) {//更新其他聊天对象的未读消息数
+              var unread = sess.unread();
+              if(unread>99) {
+                unread = '99+';
+              }
+              // var custimerItem = this.customersMap[sess.id()];
+              // custimerItem.unread_msg_count = unread;
+              var thisdiv = document.getElementById('badgeDiv_'+ sess.id());
+              thisdiv.innerHTML = '<i class="count">' + unread + '</i>';
+              thisdiv.style.display = 'block';
+              this.$set(this.customersMap[sess.id()], 'unread_msg_count', unread);
+            }
+        }
+    
+      },
+      onProfileSystemNotifys(){},
+      onKickedEventCall(){},
+      onC2cEventNotifys(){},
+      initUnreadMsgCount() {
+          var sess;
+          var sessMap = webim.MsgStore.sessMap();
+          for (var i in sessMap) {
+              sess = sessMap[i];
+              if (this.selToID != sess.id() && sess.id() in this.customersMap) {//更新其他聊天对象的未读消息数
+                var unread = sess.unread();
+                if(unread>99) {
+                  unread = '99+';
+                }
+                // var custimerItem = this.customersMap[sess.id()];
+                // custimerItem.unread_msg_count = unread;
+                
+                var thisdiv = document.getElementById('badgeDiv_'+ sess.id());
+                thisdiv.innerHTML = '<i class="count">' + unread + '</i>';
+                thisdiv.style.display = 'block';
+                this.$set(this.customersMap[sess.id()], 'unread_msg_count', unread);
+                
+                // this.$set(this.customersMap, sess.id(), custimerItem);
+              }
+          }
+      },
+      getusersig() {
+        getusersig().then(response => {
+          if (response.data.state == 0) {
+            this.$message.error(response.data.msg);
+            return false;
+          } else {
+            this.useradmin = {
+              usersig: response.data.data.sig,
+              Indentifier: response.data.data.Indentifier,
+              appIDAt3rd:response.data.data.appIDAt3rd,
+              IdentifierNick:response.data.data.IdentifierNick,
+              HeadURL:response.data.data.HeadURL,
+            } 
+          
+            this.loginInfo.appIDAt3rd = this.useradmin.appIDAt3rd
+            this.loginInfo.identifier = this.useradmin.Indentifier
+            this.loginInfo.userSig = this.useradmin.usersig
+            this.loginInfo.identifierNick = this.useradmin.IdentifierNick
+            this.loginInfo.headurl = this.useradmin.HeadURL
+            this.loginInfo.sdkAppID = response.data.data.sdkAppID
+            this.loginInfo.accountType = response.data.data.accountType
+            this.userSigFlag = true;
+          }
+        });
+        this.bindWechatDialog = true
+      },
+
+      GetAllMembers(){
+        GetAllMembers().then(response=>{
+          if (response.data.state == 1) { 
+            this.customers = response.data.data.members;
+            for (const key in this.customers) {
+              var custimerItem = this.customers[key];
+              var mapKey = "User_" + custimerItem.user_id;
+              if(custimerItem.user_id==0 || mapKey in this.customersMap) {
+                continue;
+              }
+              custimerItem['sortno'] = -1;
+              custimerItem['unread_msg_count'] = '';
+              this.$set(this.customersMap, mapKey, custimerItem);
+              this.customersUnique.push(custimerItem);
+            }
+            this.userListFlag = true;
+          } else {
+
+          }
+        });
+      },
+      addMsg(msg, prepage) {
+        var messageitem = {
+          id:'',
+          message:'',
+          avatar:'',
+          time:'',
+          float:''
+        };
+        var isSelfSend, fromAccount, fromAccountNick, fromAccountImage, sessType, subType;
+
+        //webim.SESSION_TYPE.GROUP-群聊，
+        //webim.SESSION_TYPE.C2C-私聊，
+        sessType = msg.getSession().type();
+        isSelfSend = msg.getIsSend();//消息是否为自己发的
+        fromAccount = msg.getFromAccount();
+        if (!fromAccount) {
+            return;
+        }
+        if (isSelfSend) {//如果是自己发的消息
+          messageitem.avatar = this.loginInfo.headurl;
+          messageitem.float = "fr";
+        } else {
+          messageitem.avatar = this.thisCustomer.avatar;
+          messageitem.float = "fl";
+        }
+        messageitem.id = msg.random;
+        messageitem.time = webim.Tool.formatText2Html(webim.Tool.formatTimeStamp(msg.getTime()));
+        messageitem.message = this.convertMsgtoHtml(msg)
+        this.messageBox.push(messageitem);
+
+        var msgflow = document.getElementsByClassName("message-list-item")[0];
+        if (prepage) {
+            //300ms后,等待图片加载完，滚动条自动滚动到底部
+            if (msgflow.scrollTop == 0) {
+                setTimeout(function () {
+                    msgflow.scrollTop = 0;
+                }, 300);
+            }
+        } else {
+            //300ms后,等待图片加载完，滚动条自动滚动到底部
+            setTimeout(function () {
+                msgflow.scrollTop = msgflow.scrollHeight;
+            }, 300);
+        }
+
+      },
+      convertMsgtoHtml(msg) {
+          var html = "",
+              elems, elem, type, content;
+          elems = msg.getElems(); //获取消息包含的元素数组
+          var count = elems.length;
+          for (var i = 0; i < count; i++) {
+              elem = elems[i];
+              type = elem.getType();//获取元素类型
+              content = elem.getContent();//获取元素对象
+              switch (type) {
+                  case webim.MSG_ELEMENT_TYPE.TEXT:
+                      var eleHtml = this.convertTextMsgToHtml(content);
+                      //转义，防XSS
+                      html += webim.Tool.formatText2Html(eleHtml);
+                      break;
+                  case webim.MSG_ELEMENT_TYPE.FACE:
+                      html += this.convertFaceMsgToHtml(content);
+                      break;
+                  case webim.MSG_ELEMENT_TYPE.IMAGE:
+                      if (i <= count - 2) {
+                          var customMsgElem = elems[i + 1];//获取保存图片名称的自定义消息elem
+                          var imgName = customMsgElem.getContent().getData();//业务可以自定义保存字段，demo中采用data字段保存图片文件名
+                          html += this.convertImageMsgToHtml(content, imgName);
+                          i++;//下标向后移一位
+                      } else {
+                          html += this.convertImageMsgToHtml(content);
+                      }
+                      break;
+                  case webim.MSG_ELEMENT_TYPE.SOUND:
+                      html += this.convertSoundMsgToHtml(content);
+                      break;
+                  case webim.MSG_ELEMENT_TYPE.FILE:
+                      html += this.convertFileMsgToHtml(content);
+                      break;
+                  case webim.MSG_ELEMENT_TYPE.LOCATION:
+                      html += this.convertLocationMsgToHtml(content);
+                      break;
+                  case webim.MSG_ELEMENT_TYPE.CUSTOM:
+                      var eleHtml = this.convertCustomMsgToHtml(content);
+                      //转义，防XSS
+                      html += webim.Tool.formatText2Html(eleHtml);
+                      break;
+                  case webim.MSG_ELEMENT_TYPE.GROUP_TIP:
+                      var eleHtml = this.convertGroupTipMsgToHtml(content);
+                      //转义，防XSS
+                      html += webim.Tool.formatText2Html(eleHtml);
+                      break;
+                  default:
+                      webim.Log.error('未知消息元素类型: elemType=' + type);
+                      break;
+              }
+          }
+          return html;
+      },
+      convertTextMsgToHtml(content) {
+          return content.getText();
+      },
+      //解析表情消息元素
+      convertFaceMsgToHtml(content) {
+          var faceUrl = null;
+          var data = content.getData();
+          var index = webim.EmotionDataIndexs[data];
+
+          var emotion = webim.Emotions[index];
+          if (emotion && emotion[1]) {
+              faceUrl = emotion[1];
+          }
+          if (faceUrl) {
+              return "<img src='" + faceUrl + "'/>";
+          } else {
+              return data;
+          }
+      },
+      //解析图片消息元素
+      convertImageMsgToHtml(content, imageName) {
+          var smallImage = content.getImage(webim.IMAGE_TYPE.SMALL);//小图
+          var bigImage = content.getImage(webim.IMAGE_TYPE.LARGE);//大图
+          var oriImage = content.getImage(webim.IMAGE_TYPE.ORIGIN);//原图
+          if (!bigImage) {
+              bigImage = smallImage;
+          }
+          if (!oriImage) {
+              oriImage = smallImage;
+          }
+          return "<img name='" + imageName + "' src='" + smallImage.getUrl() + "#" + bigImage.getUrl() + "#" + oriImage.getUrl() + "' style='CURSOR: hand' id='" + content.getImageId() + "' bigImgUrl='" + bigImage.getUrl() + "' />";
+      },
+      onSelSess(sess_type, to_id) {
+        var _this = this;
+        if(this.selToID != to_id) {
+          this.message = '';
+        }
+        if (sess_type == webim.SESSION_TYPE.GROUP) {
+          this.$message.error("不支持群聊");
+          return;
+        }
+        this.messageBox = [];
+        this.bindScrollHistoryEvent('reset');
+        this.getLastC2CHistoryMsgs(function (msgList) {
+            _this.getHistoryMsgCallback(msgList);
+            _this.bindScrollHistoryEvent('init');
+            //绑定滚动操作
+        }, function (err) {
+            alert(err.ErrorInfo);
+        });
+      },
+      getHistoryMsgCallback(msgList, prepage) {
+          var msg;
+          var prepage = prepage || false;
+
+          //如果是加载前几页的消息，消息体需要prepend，所以先倒排一下
+          if (prepage) {
+              msgList.reverse();
+          }
+
+          for (var j in msgList) {//遍历新消息
+              msg = msgList[j];
+              if (msg.getSession().id() == this.selToID) {//为当前聊天对象的消息
+                  this.selSess = msg.getSession();
+                  //在聊天窗体中新增一条消息
+                  this.addMsg(msg, prepage);
+                  var thisdiv = document.getElementById('badgeDiv_'+ this.selToID);
+                  thisdiv.innerHTML = '<i class="count"></i>';
+                  thisdiv.style.display = 'none';
+              }
+          }
+          //消息已读上报，并将当前会话的消息设置成自动已读
+          webim.setAutoRead(this.selSess, true, true);
+      },
+      getPrePageC2CHistoryMsgs  (cbOk, cbError) {
+        var _this = this;
+          if (selType == webim.SESSION_TYPE.GROUP) {
+            _this.$message.error("当前的聊天类型为群聊天，不能进行拉取好友历史消息操作");
+              return;
+          }
+          var tempInfo = getPrePageC2CHistroyMsgInfoMap[_this.selToID];//获取下一次拉取的c2c消息时间和消息Key
+          var lastMsgTime;
+          var msgKey;
+          if (tempInfo) {
+              lastMsgTime = tempInfo.LastMsgTime;
+              msgKey = tempInfo.MsgKey;
+          } else {
+              _this.$message.error("获取下一次拉取的c2c消息时间和消息Key为空");
+              return;
+          }
+          var options = {
+              'Peer_Account': _this.selToID, //好友帐号
+              'MaxCnt': reqMsgCount, //拉取消息条数
+              'LastMsgTime': lastMsgTime, //最近的消息时间，即从这个时间点向前拉取历史消息
+              'MsgKey': msgKey
+          };
+          webim.getC2CHistoryMsgs(
+              options,
+              function (resp) {
+                  var complete = resp.Complete;//是否还有历史消息可以拉取，1-表示没有，0-表示有
+                  if (resp.MsgList.length == 0) {
+                      webim.Log.warn("没有历史消息了:data=" + JSON.stringify(options));
+                      return;
+                  }
+                  getPrePageC2CHistroyMsgInfoMap[_this.selToID] = {//保留服务器返回的最近消息时间和消息Key,用于下次向前拉取历史消息
+                      'LastMsgTime': resp.LastMsgTime,
+                      'MsgKey': resp.MsgKey
+                  };
+                  if (cbOk) {
+                      cbOk(resp.MsgList);
+                  } else {
+                      _this.getHistoryMsgCallback(resp.MsgList, true);
+                  }
+              },
+              cbError
+          );
+      },
+      getLastC2CHistoryMsgs (cbOk, cbError) {
+        var _this = this;
+          var lastMsgTime = 0;//第一次拉取好友历史消息时，必须传0
+          var msgKey = '';
+          var options = {
+              'Peer_Account': this.selToID, //好友帐号
+              'MaxCnt': reqMsgCount, //拉取消息条数
+              'LastMsgTime': lastMsgTime, //最近的消息时间，即从这个时间点向前拉取历史消息
+              'MsgKey': msgKey
+          };
+          this.selSess = null;
+          webim.MsgStore.delSessByTypeId(selType, this.selToID);
+
+          webim.getC2CHistoryMsgs(
+              options,
+              function (resp) {
+                  var complete = resp.Complete;//是否还有历史消息可以拉取，1-表示没有，0-表示有
+
+                  if (resp.MsgList.length == 0) {
+                      webim.Log.warn("没有历史消息了:data=" + JSON.stringify(options));
+                      return;
+                  }
+                  getPrePageC2CHistroyMsgInfoMap[_this.selToID] = {//保留服务器返回的最近消息时间和消息Key,用于下次向前拉取历史消息
+                      'LastMsgTime': resp.LastMsgTime,
+                      'MsgKey': resp.MsgKey
+                  };
+                  
+                  if (cbOk)
+                      cbOk(resp.MsgList);
+              },
+              cbError
+          );
+      },
+      handleMsgSend(msgContent) {
+          
+          var selSess = new webim.Session(selType, this.selToID, this.selToID, this.thisCustomer.avatar, Math.round(new Date().getTime() / 1000));
+          
+          var isSend = true; //是否为自己发送
+          var seq = -1; //消息序列，-1表示sdk自动生成，用于去重
+          var random = Math.round(Math.random() * 4294967296); //消息随机数，用于去重
+          var msgTime = Math.round(new Date().getTime() / 1000); //消息时间戳
+          var subType; //消息子类型
+          if (selType == webim.SESSION_TYPE.C2C) {
+              subType = webim.C2C_MSG_SUB_TYPE.COMMON;
+          } else {
+              subType = webim.GROUP_MSG_SUB_TYPE.COMMON;
+          }
+          var msg = new webim.Msg(selSess, isSend, seq, random, msgTime, this.loginInfo.identifier, subType, this.loginInfo.identifierNick);
+
+          var text_obj, face_obj, tmsg, emotionIndex, emotion, restMsgIndex;
+          //解析文本和表情
+          var expr = /\[[^[\]]{1,3}\]/mg;
+          var emotions = msgContent.match(expr);
+          if (!emotions || emotions.length < 1) {
+              text_obj = new webim.Msg.Elem.Text(msgContent);
+              msg.addText(text_obj);
+          } else {
+              for (var i = 0; i < emotions.length; i++) {
+                  tmsg = msgContent.substring(0, msgContent.indexOf(emotions[i]));
+                  if (tmsg) {
+                      text_obj = new webim.Msg.Elem.Text(tmsg);
+                      msg.addText(text_obj);
+                  }
+                  emotionIndex = webim.EmotionDataIndexs[emotions[i]];
+                  emotion = webim.Emotions[emotionIndex];
+
+                  if (emotion) {
+                      face_obj = new webim.Msg.Elem.Face(emotionIndex, emotions[i]);
+                      msg.addFace(face_obj);
+                  } else {
+                      text_obj = new webim.Msg.Elem.Text(emotions[i]);
+                      msg.addText(text_obj);
+                  }
+                  restMsgIndex = msgContent.indexOf(emotions[i]) + emotions[i].length;
+                  msgContent = msgContent.substring(restMsgIndex);
+              }
+              if (msgContent) {
+                  text_obj = new webim.Msg.Elem.Text(msgContent);
+                  msg.addText(text_obj);
+              }
+          }
+
+          msg.PushInfo = {
+              "PushFlag": 0,
+              "Desc": '测试离线推送内容', //离线推送内容
+              "Ext": '测试离线推送透传内容', //离线推送透传内容
+              "AndroidInfo": {
+                  "Sound": "android.mp3" //离线推送声音文件路径。
+              },
+              "ApnsInfo": {
+                  "Sound": "apns.mp3", //离线推送声音文件路径。
+                  "BadgeMode": 1
+              }
+          };
+
+          msg.PushInfoBoolean = true; //是否开启离线推送push同步
+          msg.sending = 1;
+          msg.originContent = msgContent;
+          // turnoffFaces_box();
+          var _this = this;
+
+          webim.sendMsg(msg, function (resp) {
+            _this.addMsg(msg);
+            _this.message = '';
+          }, function (err) {
+              console.log(err)
+          });
+      },
+      
+    },
+    watch:{
+      userSigFlag(newValue){
+        if(this.userSigFlag) {
+          this.webimlogin();
+        }
+      },
+      userListFlag(newValue){
+        if(this.userListFlag && this.imloginFlag) {
+          this.initUnreadMsgCount();
+        }
+
+      },
+      imloginFlag(newvalue) {
+        if(this.userListFlag && this.imloginFlag) {
+          this.initUnreadMsgCount();
+        }
+      }
+    },
     created(){
-    }
+      
+      this.GetAllMembers();
+      this.getusersig();
+
+      this.emotionList = [];
+
+      for (var index in webim.Emotions) {
+        var item = {
+          id:webim.Emotions[index][0],
+          src:webim.Emotions[index][1],
+        };
+        this.emotionList.push(item);
+      }
+
+    },
   }
 </script>
 

src/scrm_pages/marketing_tool/activity_share.vue

@@ -24,7 +24,7 @@
                     <p class="desc">以短信方式推送给客户</p>
                 </div>
                 <div class="btn-panel">
-                    <el-button type="primary">短信推送</el-button>
+                    <el-button type="primary" @click="smsAction">短信推送</el-button>
                 </div>
             </div>
             <div class="link-share-panel">
@@ -114,6 +114,9 @@ export default {
             document.body.removeChild(input);
 
             this.$message.success("已复制链接")
+        },
+        smsAction: function() {
+            this.$router.push({ path: "/sms/send", query: { action: 1, id: this.activity_id } })
         }
     },
 }

src/scrm_pages/members/components/CreateMemberForm.vue

@@ -30,8 +30,49 @@
                 </el-row>
                 <el-row>
                     <el-col :span="12">
-                        <el-form-item label="城市:" required prop="city">
-                            <el-cascader
+                        <el-form-item label="城市:" required prop="city_id">
+                            <el-select
+                                v-model="form.province_id"
+                                style="width:32%"
+                                placeholder="选择地址"
+                                @change="changeProvince">
+                                <el-option
+                                v-for="item in provinceOptions"
+                                :key="item.id"
+                                :label="item.name"
+                                :value="item.id">
+                                </el-option>
+                            </el-select>
+                            
+                            <el-select
+                                v-model="form.city_id"
+                                style="width:32%"
+                                placeholder="选择地址"
+                                @change="changeCity"
+                                v-show="cityOptions.length>0"
+                                >
+                                <el-option
+                                v-for="item in cityOptions"
+                                :key="item.id"
+                                :label="item.name"
+                                :value="item.id">
+                                </el-option>
+                            </el-select>
+                            
+                            <el-select
+                                v-model="form.district_id"
+                                style="width:32%"
+                                placeholder="选择地址"
+                                v-show="distictOptions.length>0"
+                                >
+                                <el-option
+                                v-for="item in distictOptions"
+                                :key="item.id"
+                                :label="item.name"
+                                :value="item.id">
+                                </el-option>
+                            </el-select>
+                            <!-- <el-cascader
                                 v-model="form.city"
                                 :options="cityOptions"
                                 @active-item-change="handleChangeCity"
@@ -42,7 +83,7 @@
                                     label: 'name',
                                     children: 'cities'
                                 }"
-                            ></el-cascader>
+                            ></el-cascader> -->
                         </el-form-item>
                     </el-col>
                     <el-col :span="12">
@@ -179,7 +220,7 @@ export default {
                 mobile: [{required: true, message: "请填写手机号",},{ validator: checkMobileRule}],
                 gender: [{required: true, message: "请选择性别",},],
                 birthday: [{required: true, message: "请选择生日",},],
-                city: [{required: true, message: "请选择城市",},],
+                city_id: [{required: true, message: "请选择城市",},],
                 illness: [{required: true, message: "请选择病种",},],
                 ill_date: [{required: true, message: "请选择患病时间",},],
                 treat_type: [{required: true, message: "请选择治疗方式",},],
@@ -189,14 +230,16 @@ export default {
                 {id:1, name:'男'},
                 {id:2, name:'女'},
             ],
+            provinceOptions:[],
             cityOptions:[],
+            distictOptions:[],
             form:{
                 name:'',
                 mobile:'',
                 gender:0,
                 birthday:'',
                 city:[],
-                province_id:0,
+                province_id:'',
                 city_id:0,
                 district_id:0,
                 illness:[],
@@ -212,7 +255,7 @@ export default {
     },
     methods:{
         open:function(){
-            this.GetDistrictsByUpid();
+            this.GetProvince(0);
             this.resetForm("memberForm");
             this.createMemberFormVisible = true;
         },
@@ -227,6 +270,9 @@ export default {
             // }
             this.$refs[formName].validate((valid) => {
                 if (valid) {
+                    if (this.form.district_id == '') {
+                        this.form.district_id = this.form.city_id;
+                    }
                     CreateMember(this.form).then(response=>{
                         var res = response.data;
                         if(res.state === 1) {
@@ -264,83 +310,48 @@ export default {
                 this.form.avatar = 'https://images.shengws.com/201809182128111.png';
             }
         },
-        handleChangeCity:function(val) {
-            this.GetDistrictsByUpid(val);
+        changeProvince(id) {
+            this.form.city_id = '';
+            this.form.district_id = '';
+            this.GetCity(id);
+            this.distictOptions = [];
         },
-        handleSelectedCity:function(val) {
-            this.form.province_id = val[0];
-            this.form.city_id = val[1];
-            this.form.district_id = val[2];
+        changeCity(id){
+            this.form.district_id = '';
+            this.GetDistrict(id);
         },
-        GetDistrictsByUpid:function(val) {  
-            let idArea
-            let sizeArea
-            if (!val) {
-                idArea = 0
-                sizeArea = 0
-            } else if (val.length === 1) {
-                idArea = val[0]
-                sizeArea = val.length // 3:一级 4:二级 6:三级
-            } else if (val.length === 2) {
-                idArea = val[1]
-                sizeArea = val.length // 3:一级 4:二级 6:三级
-            }
-            
-            GetDistrictsByUpid({id:idArea}).then(response=>{
+        GetProvince:function(id) {  
+            GetDistrictsByUpid({id:id}).then(response=>{
                 var res = response.data;
                 if (res.state===1) {
-                    var citys = res.data.citys;
-                    if (sizeArea === 0) { // 初始化 加载一级 省
-                        this.cityOptions = citys.map((value, i) => {
-                            return {
-                                id: value.id,
-                                name: value.name,
-                                cities: []
-                            }
-                        })
-                    } else if (sizeArea === 1) { // 点击一级 加载二级 市
-                        this.cityOptions.map((value, i) => {
-                            if (value.id === val[0]) {
-                                if (!value.cities.length) {
-                                    value.cities = citys.map((value, i) => {
-                                        return {
-                                            id: value.id,
-                                            name: value.name,
-                                            cities: []
-                                        }
-                                    })
-                                }
-                            }
-                        })
-                    } else if (sizeArea === 2) { // 点击二级 加载三级 区
-                        this.cityOptions.map((value, i) => {
-                            if (value.id === val[0]) {
-                                value.cities.map((value, i) => {
-                                    if (value.id === val[1]) {
-                                        if (!value.cities.length) {
-                                            if (citys.length) {
-                                                value.cities = citys.map((value, i) => {
-                                                    return {
-                                                        id: value.id,
-                                                        name: value.name
-                                                    }
-                                                })
-                                            }else {
-                                                value.cities = [
-                                                    {id:value.id, name:value.name}
-                                                ];
-                                            }
-                                            
-                                        }
-                                    }
-                                })
-                            }
-                        })
-                    }
+                    this.provinceOptions = res.data.citys;
+                }else {
+                    this.$message.error(res.msg);
+                }
+            }).catch(e=>{
+            });
+        },
+        GetCity:function(id) {  
+            GetDistrictsByUpid({id:id}).then(response=>{
+                var res = response.data;
+                if (res.state===1) {
+                    this.cityOptions = res.data.citys;
                 }else {
                     this.$message.error(res.msg);
                 }
-            }).catch(e=>{});
+            }).catch(e=>{
+            });
+        },
+        GetDistrict:function(id) {  
+            GetDistrictsByUpid({id:id}).then(response=>{
+                var res = response.data;
+                if (res.state===1) {
+                    this.distictOptions = res.data.citys;
+                }else {
+                    this.$message.error(res.msg);
+                }
+            }).catch(e=>{
+            });
         },
     }
 }

src/scrm_pages/members/components/EditMemberForm.vue

@@ -31,7 +31,48 @@
                 <el-row>
                     <el-col :span="12">
                         <el-form-item label="城市:" required prop="city">
-                            <el-cascader
+                            <el-select
+                                v-model="form.province_id"
+                                style="width:32%"
+                                placeholder="选择地址"
+                                @change="changeProvince">
+                                <el-option
+                                v-for="item in provinceOptions"
+                                :key="item.id"
+                                :label="item.name"
+                                :value="item.id">
+                                </el-option>
+                            </el-select>
+                            
+                            <el-select
+                                v-model="form.city_id"
+                                style="width:32%"
+                                placeholder="选择地址"
+                                @change="changeCity"
+                                v-show="cityOptions.length>0"
+                                >
+                                <el-option
+                                v-for="item in cityOptions"
+                                :key="item.id"
+                                :label="item.name"
+                                :value="item.id">
+                                </el-option>
+                            </el-select>
+                            
+                            <el-select
+                                v-model="form.district_id"
+                                style="width:32%"
+                                placeholder="选择地址"
+                                v-show="distictOptions.length>0"
+                                >
+                                <el-option
+                                v-for="item in distictOptions"
+                                :key="item.id"
+                                :label="item.name"
+                                :value="item.id">
+                                </el-option>
+                            </el-select>
+                            <!-- <el-cascader
                                 v-model="form.city"
                                 :options="cityOptions"
                                 @active-item-change="handleChangeCity"
@@ -42,7 +83,7 @@
                                     label: 'name',
                                     children: 'cities'
                                 }"
-                            ></el-cascader>
+                            ></el-cascader> -->
                         </el-form-item>
                     </el-col>
                     <el-col :span="12">
@@ -186,21 +227,21 @@ export default {
                 {id:1, name:'男'},
                 {id:2, name:'女'},
             ],
+            provinceOptions:[],
             cityOptions:[],
+            distictOptions:[],
             illnessMap:{},
+
         }
     },
     methods:{
         open:function(){
-            let city = [];
-            this.GetDistrictsByUpid();
+            this.GetProvince(0);
             if (this.form.province_id>0) {
-                city.push(this.form.province_id);
-                this.GetDistrictsByUpid(city);
+                this.GetCity(this.form.province_id);
             }
-            if (this.form.province_id>0 && this.form.city_id>0) {
-                city.push(this.form.city_id);
-                this.GetDistrictsByUpid(city);
+            if (this.form.city_id>0) {
+                this.GetDistrict(this.form.city_id);
             }
             this.form.birthday = this.form.birthday?this.form.birthday:'';
             this.form.ill_date = this.form.ill_date?this.form.ill_date:'';
@@ -230,6 +271,9 @@ export default {
             // }
             this.$refs[formName].validate((valid) => {
                 if (valid) {
+                    if (this.form.district_id == '') {
+                        this.form.district_id = this.form.city_id;
+                    }
                     EditMember(this.form.id, this.form).then(response=>{
                         var res = response.data;
                         if(res.state === 1) {
@@ -268,83 +312,48 @@ export default {
                 this.form.avatar = 'https://images.shengws.com/201809182128111.png';
             }
         },
-        handleChangeCity:function(val) {
-            this.GetDistrictsByUpid(val);
+        changeProvince(id) {
+            this.form.city_id = '';
+            this.form.district_id = '';
+            this.GetCity(id);
+            this.distictOptions = [];
         },
-        handleSelectedCity:function(val) {
-            this.form.province_id = val[0];
-            this.form.city_id = val[1];
-            this.form.district_id = val[2];
+        changeCity(id){
+            this.form.district_id = '';
+            this.GetDistrict(id);
         },
-        GetDistrictsByUpid:function(val) {  
-            let idArea
-            let sizeArea
-            if (!val) {
-                idArea = 0
-                sizeArea = 0
-            } else if (val.length === 1) {
-                idArea = val[0]
-                sizeArea = val.length // 3:一级 4:二级 6:三级
-            } else if (val.length === 2) {
-                idArea = val[1]
-                sizeArea = val.length // 3:一级 4:二级 6:三级
-            }
-            
-            GetDistrictsByUpid({id:idArea}).then(response=>{
+        GetProvince:function(id) {  
+            GetDistrictsByUpid({id:id}).then(response=>{
                 var res = response.data;
                 if (res.state===1) {
-                    var citys = res.data.citys;
-                    if (sizeArea === 0) { // 初始化 加载一级 省
-                        this.cityOptions = citys.map((value, i) => {
-                            return {
-                                id: value.id,
-                                name: value.name,
-                                cities: []
-                            }
-                        })
-                    } else if (sizeArea === 1) { // 点击一级 加载二级 市
-                        this.cityOptions.map((value, i) => {
-                            if (value.id === val[0]) {
-                                if (!value.cities.length) {
-                                    value.cities = citys.map((value, i) => {
-                                        return {
-                                            id: value.id,
-                                            name: value.name,
-                                            cities: []
-                                        }
-                                    })
-                                }
-                            }
-                        })
-                    } else if (sizeArea === 2) { // 点击二级 加载三级 区
-                        this.cityOptions.map((value, i) => {
-                            if (value.id === val[0]) {
-                                value.cities.map((value, i) => {
-                                    if (value.id === val[1]) {
-                                        if (!value.cities.length) {
-                                            if (citys.length) {
-                                                value.cities = citys.map((value, i) => {
-                                                    return {
-                                                        id: value.id,
-                                                        name: value.name
-                                                    }
-                                                })
-                                            }else {
-                                                value.cities = [
-                                                    {id:value.id, name:value.name}
-                                                ];
-                                            }
-                                            
-                                        }
-                                    }
-                                })
-                            }
-                        })
-                    }
+                    this.provinceOptions = res.data.citys;
+                }else {
+                    this.$message.error(res.msg);
+                }
+            }).catch(e=>{
+            });
+        },
+        GetCity:function(id) {  
+            GetDistrictsByUpid({id:id}).then(response=>{
+                var res = response.data;
+                if (res.state===1) {
+                    this.cityOptions = res.data.citys;
+                }else {
+                    this.$message.error(res.msg);
+                }
+            }).catch(e=>{
+            });
+        },
+        GetDistrict:function(id) {  
+            GetDistrictsByUpid({id:id}).then(response=>{
+                var res = response.data;
+                if (res.state===1) {
+                    this.distictOptions = res.data.citys;
                 }else {
                     this.$message.error(res.msg);
                 }
-            }).catch(e=>{});
+            }).catch(e=>{
+            });
         },
     }
 }

src/scrm_pages/members/components/EditMemberTagsForm.vue

@@ -11,7 +11,7 @@
                                 style="width:100%"
                                 placeholder="请选择标签">
                                 <el-option
-                                v-for="item in tagOptions"
+                                v-for="item in tags"
                                 :key="item.id"
                                 :label="item.tag_name"
                                 :value="item.id">
@@ -34,8 +34,6 @@
 </template>
 
 <script>
-import {GetDistrictsByUpid} from  "@/api/district";
-import {checkMobile} from "@/utils/tools";
 import {EditMemberTags} from "@/api/member/member";
 
 export default {
@@ -78,10 +76,15 @@ export default {
     data(){
         return {
             editMemberTagFormVisible:false,
+            tags:[],
         }
     },
     methods:{
         open:function(){
+            this.tags = [];
+            for (const index in this.tagOptions) {
+                this.tags.push(this.tagOptions[index]);
+            }
             this.editMemberTagFormVisible = true;
         },
         resetForm(formName) {

src/scrm_pages/members/members.vue

@@ -222,7 +222,6 @@
                     this.total = res.data.total;
                     if(typeof(res.data.cards) != 'undefined') {
                         this.levelCards = res.data.cards;
-                        console.log("levelCard是什么",levelCards)
                     }
                     if(typeof(res.data.tags) != 'undefined') {
                         this.tagOptions = res.data.tags;
@@ -237,13 +236,22 @@
             }).catch(e=>{});
         },
         openSendMessage(){
-          
-          this.$message.error("功能开发中...");
-          return false;
           if (this.selectedMembers.length==0) {
-            this.$message.error("请选择要发送短信的会员");
+            this.$message.error("请选择会员");
+            return false;
+          }
+          var targets = [];
+          for (const index in this.selectedMembers) {
+            if(this.selectedMembers[index].mobile.length>0) {
+              targets.push({id:this.selectedMembers[index].id,name:this.selectedMembers[index].name,name:this.selectedMembers[index].name,mobile:this.selectedMembers[index].mobile});
+            }
+          }
+          if (targets.length==0) {
+            this.$message.error("由于所选的全部会员里，均无手机号，无法发送短信");
             return false;
           }
+            this.$store.dispatch("SMSSetTargets", targets)
+          this.$router.push({path:'/sms/send'})
           
         },
         openAddMembersTags() {
@@ -339,6 +347,7 @@
           this.$refs.editMemberTagsForm.open();
         },
         openEdit(row, index){
+          this.memberData.tags= [];
           this.memberData.illness = [];
           this.memberData.city = [];
           this.memberData.birthday = '';

src/scrm_pages/sms/sms_manage.vue

@@ -0,0 +1,113 @@
+<template>
+    <div class="main-contain">
+        <div class="position">
+            <bread-crumb :crumbs="crumbs"></bread-crumb>
+            <el-button
+                :disabled="$store.getters.xt_user.subscibe.state==3?true:false"
+                @click="sendAction"
+                style="float:right;"
+                type="primary"
+                icon="el-icon-message"
+                size="small"
+            >群发短信</el-button>
+        </div>
+        <div class="app-container" style="padding: 0 5px; background-color: #f6f8f9;">
+            <div style="background-color: #fff; padding: 5px 0;">
+                <el-table :data="records">
+                    <el-table-column label="发送内容" align="center" prop="full_content" :show-overflow-tooltip="true" min-width="48%">
+                    </el-table-column>
+                    <el-table-column label="发送状态" align="center" min-width="15%">
+                        <template slot-scope="scope">
+                            {{ send_status_text(scope.row.status) }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="发送人数/到达条数" align="center" min-width="22%">
+                        <template slot-scope="scope">
+                            {{ scope.row.total_count }}/{{ scope.row.success_count }}
+                        </template>
+                    </el-table-column>
+                    <el-table-column label="审核状态" align="center" min-width="15%">
+                        <template slot-scope="scope">
+                            {{ review_status_text(scope.row.status) }}
+                        </template>
+                    </el-table-column>
+                </el-table>
+                <div style="padding-top: 15px; padding-left: 10px;">
+                    <el-pagination :total="record_total" :current-page.sync="current_page" :page-size="10" layout="total, prev, pager, next" @current-change="getSendRecords()"></el-pagination>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import BreadCrumb from "@/scrm_pages/components/bread-crumb"
+import { fetchBatchSendRecords } from "@/api/sms"
+
+export default {
+    name: "SMSManage",
+    components: {
+        BreadCrumb,
+    },
+    data() {
+        return {
+            crumbs: [
+                { path: false, name: "客户管理" },
+                { path: false, name: "短信管理" },
+            ],
+
+            record_total: 0,
+            current_page: 1,
+            records: [],
+        }
+    },
+    mounted() {
+        this.getSendRecords()
+    },
+    methods: {
+        getSendRecords: function() {
+            fetchBatchSendRecords(this.current_page).then(rs => {
+                var resp = rs.data
+                if (resp.state == 1) {
+                    this.records = resp.data.records
+                    this.record_total = resp.data.total
+
+                } else {
+                    this.$message.error(resp.msg)
+                }
+
+            }).catch(err => {
+                this.$message.error(err)
+            })
+        },
+        sendAction: function() {
+            this.$router.push({path:'/sms/send'})
+        },
+
+        send_status_text: function(status) {
+            if (status == 4) {
+                return "已发送"
+            } else if (status == 5) {
+                return "发送失败"
+            } else {
+                return "未发送"
+            }
+        },
+        review_status_text: function(status) {
+            if (status == 1) {
+                return "待审核"
+            } else if (status == 2) {
+                return "未通过"
+            } else {
+                return "通过"
+            }
+        },
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+
+</style>
+
+

src/scrm_pages/sms/sms_send.vue

@@ -0,0 +1,545 @@
+<template>
+    <div class="main-contain" v-loading="sending">
+        <div class="position">
+            <bread-crumb :crumbs="crumbs"></bread-crumb>
+        </div>
+        <div class="app-container" style="padding: 0 5px; background-color: #f6f8f9;">
+            <div class="main-panel">
+                <div class="preview-panel">
+                    <div class="form-title">
+                        <img class="icon" src="@/assets/img/sa_06.png" />
+                        <span>预览</span>
+                    </div>
+                    <div class="form-content">
+                        <div class="preview">
+                            <div class="bg">
+                                <div class="scroll">
+                                    <div class="fake-time">9:41</div>
+                                    <div class="content">
+                                        {{ content_preview }}
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+                <div class="edit-panel">
+                    <div class="form-title">
+                        <img class="icon" src="@/assets/img/sa_7.png" />
+                        <span>短信编辑</span>
+                    </div>
+                    <div class="form-content">
+                        <div class="input-panel">
+                            <el-input v-model="sms_content" type="textarea" :rows="4" resize="none" maxlength="500"></el-input>
+                            <div class="hint-text">已输入{{ total_content_length }}字（含签名和尾缀）按{{ sms_charge_count }}条短信计费</div>
+                        </div>
+                        <div v-if="designated_targets.length == 0" class="filters-panel">
+                            <div class="send-all-panel">
+                                <div class="text">
+                                    <p class="title">推送全部客户</p>
+                                    <p class="desc">将该短信推送给系统里的所有客户</p>
+                                </div>
+                                <div class="btn">
+                                    <el-button type="primary" @click="sendToAllCustomersAction">发送</el-button>
+                                </div>
+                            </div>
+                            <div class="tag-filter-panel">
+                                <p class="title">按标签推送</p>
+                                <p class="desc">将该短信推送给相应标签客户</p>
+                                <div class="tag-panel">
+                                    <div v-for="(tag, index) in tags" class="item-panel" :key="index">
+                                        <el-tag :effect="tagEffect(tag)" @click="selectTagAction(tag)" @close="cancelSelectTagAction(tag)" :closable="isTagSelected(tag)">{{ tag.tag_name }}</el-tag>
+                                    </div>
+                                </div>
+                                <p class="hint-text">*选择标签发送可以帮助您精准营销</p>
+                                <div class="send">
+                                    <p class="text">已为您筛选 {{ tag_filtered_count }} 位客户</p>
+                                    <div class="btn">
+                                        <el-button type="primary" @click="sendToTagCustomersAction">发送</el-button>
+                                    </div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="designated-targets-panel" v-else>
+                            <div class="send-panel">
+                                <div class="title">
+                                    推送指定客户
+                                </div>
+                                <div class="btn">
+                                    <el-button type="primary" @click="sendToDesignatedCustomersAction">发送</el-button>
+                                </div>
+                            </div>
+                            <el-table :data="designated_targets" border max-height="500px">
+                                <el-table-column label="客户" prop="name" align="center"></el-table-column>
+                                <el-table-column label="手机号" prop="mobile" align="center"></el-table-column>
+                            </el-table>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+import BreadCrumb from "@/scrm_pages/components/bread-crumb"
+import { sendsInitData, tagFilterCustomerCount, send2AllCustomers, send2TagCustomers, send2SpecificCustomers } from "@/api/sms"
+
+export default {
+    name: "SMSSend",
+    components: {
+        BreadCrumb,
+    },
+    data() {
+        return {
+            crumbs: [
+                { path: false, name: "短信管理" },
+                { path: false, name: "群发短信" },
+            ],
+
+            sending: false,
+            sms_content: "",
+            tags: [],
+            selecting_tags: [],
+            tag_filtered_count: 0,
+
+            action: 0,
+            id: 0,
+            designated_targets: [],
+        }
+    },
+    computed: {
+        content_preview: function() {
+            return "【酷医聚客】" + this.sms_content + "退订回TD"
+        },
+        total_content_length: function() {
+            return this.content_preview.length
+        },
+        sms_charge_count: function() {
+            return parseInt(Math.ceil(this.total_content_length / 67.0))
+        },
+    },
+    mounted() {
+        this.designated_targets = this.$store.getters.sms_designated_targets.targets
+        if (this.designated_targets.length > 0) {
+            this.$store.dispatch("SMSClearTargets")
+        } else {
+            var action = this.$route.query.action
+            var id = this.$route.query.id
+            if (action != undefined && id != undefined) {
+                this.action = action
+                this.id = id
+            }
+
+            this.getInitData()
+        }
+    },
+    methods: {
+        getInitData: function() {
+            sendsInitData(this.action, this.id).then(rs => {
+                var resp = rs.data
+                if (resp.state == 1) {
+                    this.tags = resp.data.tags
+                    this.sms_content = resp.data.default_content
+
+                } else {
+                    this.$message.error(resp.msg)
+                }
+
+            }).catch(err => {
+                this.$message.error(err)
+            })
+        },
+        getTagCustomerCount: function() {
+            var tag_ids = []
+            for (let index = 0; index < this.selecting_tags.length; index++) {
+                tag_ids.push(this.selecting_tags[index].id)
+            }
+            if (tag_ids.length == 0) {
+                this.tag_filtered_count = 0
+                return
+            }
+            tagFilterCustomerCount(tag_ids.join(",")).then(rs => {
+                var resp = rs.data
+                if (resp.state == 1) {
+                    this.tag_filtered_count = resp.data.count
+                } else {
+                    console.log(resp.msg)
+                }
+            }).catch(err => {
+                console.log(err)
+            })
+        },
+
+        tagEffect: function(tag) {
+            if (this.isTagSelected(tag)) {
+                return "dark"
+            } else {
+                return "plain"
+            }
+        },
+        isTagSelected: function(tag) {
+            for (let index = 0; index < this.selecting_tags.length; index++) {
+                if (this.selecting_tags[index].id == tag.id) {
+                    return true
+                }
+            }
+            return false
+        },
+        selectTagAction: function(tag) {
+            if (!this.isTagSelected(tag)) {
+                this.selecting_tags.push(tag)
+                this.getTagCustomerCount()
+            }
+        },
+        cancelSelectTagAction: function(tag) {
+            for (let index = 0; index < this.selecting_tags.length; index++) {
+                if (this.selecting_tags[index].id == tag.id) {
+                    this.selecting_tags.splice(index, 1)
+                    this.getTagCustomerCount()
+                    break
+                }
+            }
+        },
+
+        isSMSContentValid: function() {
+            if (this.sms_content.length == 0) {
+                this.$message.error("请编辑短信内容")
+                return false
+            }
+            if (this.sms_content.indexOf("【") >= 0 || this.sms_content.indexOf("】") >= 0) {
+                this.$message.error("短信内容不得包含【】")
+                return false
+            }
+            return true
+        },
+        sendToAllCustomersAction: function() {
+            if (!this.isSMSContentValid()) {
+                return
+            }
+            this.sending = true
+            send2AllCustomers(this.sms_content).then(rs => {
+                this.sending = false
+                var resp = rs.data
+                if (resp.state == 1) {
+                    this.$message.success("发送成功")
+                } else {
+                    this.$message.error(resp.msg)
+                }
+
+            }).catch(err => {
+                this.sending = false
+                this.$message.error(err)
+            })
+        },
+        sendToTagCustomersAction: function() {
+            if (!this.isSMSContentValid()) {
+                return
+            }
+            if (this.selecting_tags.length == 0) {
+                this.$message.error("请选择标签")
+                return
+            }
+
+            var tag_ids = []
+            for (let index = 0; index < this.selecting_tags.length; index++) {
+                tag_ids.push(this.selecting_tags[index].id)
+            }
+
+            this.sending = true
+            send2TagCustomers(this.sms_content, tag_ids.join(",")).then(rs => {
+                this.sending = false
+                var resp = rs.data
+                if (resp.state == 1) {
+                    this.$message.success("发送成功")
+                } else {
+                    this.$message.error(resp.msg)
+                }
+
+            }).catch(err => {
+                this.sending = false
+                this.$message.error(err)
+            })
+        },
+        sendToDesignatedCustomersAction: function() {
+            if (!this.isSMSContentValid()) {
+                return
+            }
+            var customer_ids = []
+            for (let index = 0; index < this.designated_targets.length; index++) {
+                customer_ids.push(this.designated_targets[index].id)
+            }
+
+            this.sending = true
+            send2SpecificCustomers(this.sms_content, customer_ids.join(",")).then(rs => {
+                this.sending = false
+                var resp = rs.data
+                if (resp.state == 1) {
+                    this.$message.success("发送成功")
+                } else {
+                    this.$message.error(resp.msg)
+                }
+
+            }).catch(err => {
+                this.sending = false
+                this.$message.error(err)
+            })
+        },
+    },
+}
+</script>
+
+<style lang="scss" scoped>
+.main-panel {
+    width: 100%;
+    display: flex;
+    min-height: 600px;
+    height: auto;
+    box-sizing: border-box;
+
+    .preview-panel {
+        flex: 3;
+        margin-right: 1rem;
+        background-color: #fff;
+
+        .form-content {
+            width: 100%;
+            padding: 14px 30px 14px 30px;
+
+            .preview {
+                width: 320px;
+                height: 568px;
+                background: #fff;
+                position: relative;
+                margin: 0 auto;
+
+                .bg {
+                    position: relative;
+                    padding-top: 85px;
+                    padding-bottom: 40px;
+                    width: 320px;
+                    height: 568px;
+                    background: url(../../assets/img/message_preview_bg.png) 50% no-repeat;
+                    background-image: -webkit-image-set(url(../../assets/img/message_preview_bg.png) 1x,url(../../assets/img/message_preview_bg@2x.png) 2x);
+                    -webkit-box-sizing: border-box;
+                    -moz-box-sizing: border-box;
+                    box-sizing: border-box;
+
+                    .scroll {
+                        height: 430px;
+                        overflow-x: hidden;
+                        overflow-y: auto;
+
+                        .fake-time {
+                            margin: auto;
+                            width: 310px;
+                            line-height: 40px;
+                            font-size: 12px;
+                            text-align: center;
+                            color: #999;
+                            background: #fff;
+                        }
+
+                        .content {
+                            display: inline-block;
+                            position: relative;
+                            left: 20px;
+                            margin-bottom: 12px;
+                            padding: 8px 15px;
+                            max-width: 260px;
+                            word-break: break-all;
+                            font-size: 16px;
+                            line-height: 1.25;
+                            color: #000;
+                            background: #e5e5ea;
+                            border-radius: 17px;
+                            -webkit-box-sizing: border-box;
+                            -moz-box-sizing: border-box;
+                            box-sizing: border-box;
+                        }
+                        .content::before {
+                            content: "";
+                            position: absolute;
+                            bottom: -2px;
+                            left: -7px;
+                            height: 20px;
+                            border-left: 20px solid #e5e5ea;
+                            border-bottom-right-radius: 16px 14px;
+                            -webkit-transform: translateY(-2px);
+                            -moz-transform: translateY(-2px);
+                            -ms-transform: translateY(-2px);
+                            transform: translateY(-2px);
+                        }
+                        .content::after {
+                            content: "";
+                            position: absolute;
+                            bottom: -2px;
+                            left: 20px;
+                            width: 10px;
+                            height: 20px;
+                            background: #fff;
+                            border-bottom-right-radius: 10px;
+                            -webkit-transform: translate(-30px,-2px);
+                            -moz-transform: translate(-30px,-2px);
+                            -ms-transform: translate(-30px,-2px);
+                            transform: translate(-30px,-2px);
+                        }
+                    }
+                    .scroll::-webkit-scrollbar {
+                        width: 5px;
+                    }
+                }
+            }
+        }
+    }
+
+    .edit-panel {
+        flex: 4;
+        padding-bottom: 80px;
+        background-color: #fff;
+
+        .form-content {
+            width: 100%;
+            padding: 14px 30px 14px 30px;
+
+            .input-panel {
+                padding-top: 10px;
+
+                .hint-text {
+                    margin-top: 5px;
+                    font-size: 12px;
+                    color: #a8b3ba;
+                    line-height: 30px;
+                }
+            }
+
+            .filters-panel {
+                margin-top: 50px;
+
+                .send-all-panel {
+                    display: flex;
+                    justify-content: space-between;
+                    align-items: center;
+
+                    .text {
+                        flex: 1;
+
+                        .title {
+                            font-size: 16px;
+                            color: #485b6d;
+                            font-weight: bold;
+                            height: 30px;
+                            display: -webkit-box;
+                            -webkit-box-orient: vertical;
+                            -webkit-line-clamp: 2;
+                            overflow: hidden;
+                        }
+                        .desc {
+                            font-size: 14px;
+                            color: #7b8a97;
+                        }
+                    }
+                    .btn {
+                        text-align: right;
+                    }
+                }
+                .tag-filter-panel {
+                    margin-top: 50px;
+
+                    .title {
+                        font-size: 16px;
+                        color: #485b6d;
+                        font-weight: bold;
+                        height: 30px;
+                        display: -webkit-box;
+                        -webkit-box-orient: vertical;
+                        -webkit-line-clamp: 2;
+                        overflow: hidden;
+                    }
+                    .desc {
+                        font-size: 14px;
+                        color: #7b8a97;
+                    }
+                    .tag-panel {
+                        margin-top: 15px;
+                        padding: 10px 15px 5px;
+                        background: #f4f7fa;
+
+                        .item-panel {
+                            display: inline-block;
+                            margin-bottom: 5px;
+                            margin-right: 5px;
+                        }
+                    }
+                    .hint-text {
+                        font-size: 12px;
+                        color: #a8b3ba;
+                        line-height: 30px;
+                        margin-top: 10px;
+                    }
+                    .send {
+                        display: flex;
+                        justify-content: space-between;
+                        align-items: center;
+                        margin-top: 15px;
+
+                        .text {
+                            flex: 1;
+                            color: #7b8a97;
+                            font-size: 14px;
+                        }
+                        .btn {
+                            text-align: right;
+                        }
+                    }
+                }
+            }
+
+            .designated-targets-panel {
+                margin-top: 20px;
+
+                .send-panel {
+                    display: flex;
+                    justify-content: space-between;
+                    align-items: center;
+                    padding-bottom: 10px;
+
+                    .title {
+                        flex: 1;
+                        font-size: 16px;
+                        color: #485b6d;
+                        font-weight: bold;
+                        height: 100%;
+                    }
+                    .btn {
+                        text-align: right;
+                    }
+                }
+            }
+        }
+    }
+}
+</style>
+
+<style lang="scss" scoped>
+.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;
+    }
+}
+</style>
+
+

src/store/getters.js

@@ -16,5 +16,7 @@ const getters = {
   xt_user: state => state.xt_user,
 
   xt_role_temps: state => state.xt_role_temps,
+
+  sms_designated_targets: state => state.sms_designated_targets,
 }
 export default getters

src/store/index.js

@@ -7,6 +7,7 @@ import xt_user from './modules/xt_user'
 import xt_permission from './modules/xt_permission'
 import members from './modules/members'
 import xt_role_temps from './modules/role_temps'
+import sms_designated_targets from "./modules/sms_designated_targets"
 
 import getters from './getters'
 
@@ -21,6 +22,7 @@ const store = new Vuex.Store({
     members,
     xt_permission,
     xt_role_temps,
+    sms_designated_targets,
   },
   getters
 })

src/store/modules/sms_designated_targets.js

@@ -0,0 +1,27 @@
+const sms_designated_targets = {
+    state: {
+        targets: [ /* { id, name, mobile } */ ],
+    },
+    mutations: {
+        SET_TARGETS: (state, targets) => {
+            state.targets = targets
+        },
+        CLEART_TARGETS: (state) => {
+            state.targets = []
+        },
+    },
+    actions: {
+        SMSSetTargets({ commit }, targets) {
+            if (targets == null || targets == undefined) {
+                commit("CLEART_TARGETS")
+            } else {
+                commit("SET_TARGETS", targets)
+            }
+        },
+        SMSClearTargets({ commit }) {
+            commit("CLEART_TARGETS")
+        },
+    }
+}
+
+export default sms_designated_targets

src/views/layout/components/Sidebar/SidebarItem.vue

@@ -17,12 +17,21 @@
         <template v-for="child in item.children" v-if="!child.hidden">
           <sidebar-item :is-nest="true" class="nest-menu" v-if="child.children&&child.children.length>0" :item="child" :key="child.path" :base-path="resolvePath(child.path)"></sidebar-item>
 
-          <router-link v-else :to="resolvePath(child.path)" :key="child.name">
-            <el-menu-item :index="resolvePath(child.path)">
-              <svg-icon v-if="child.meta&&child.meta.icon" :icon-class="child.meta.icon"></svg-icon>
-              <span v-if="child.meta&&child.meta.title" slot="title">{{generateTitle(child.meta.title)}}</span>
-            </el-menu-item>
-          </router-link>
+          <template v-else>
+            <!-- <router-link :key="child.name" :to="resolvePath(child.path)"> -->
+              <el-menu-item v-if="child.unfinished == true" :key="child.name" @click.native="unfinishAction()"  :index="resolvePath(child.path)">
+                <svg-icon v-if="child.meta&&child.meta.icon" :icon-class="child.meta.icon"></svg-icon>
+                <span v-if="child.meta&&child.meta.title" slot="title">{{generateTitle(child.meta.title)}}</span>
+              </el-menu-item>
+            <!-- </router-link> -->
+            <router-link v-else :to="resolvePath(child.path)" :key="child.name">
+              <el-menu-item :index="resolvePath(child.path)">
+                <svg-icon v-if="child.meta&&child.meta.icon" :icon-class="child.meta.icon"></svg-icon>
+                <span v-if="child.meta&&child.meta.title" slot="title">{{generateTitle(child.meta.title)}}</span>
+              </el-menu-item>
+            </router-link>
+          </template>
+          
         </template>
       </el-submenu>
 
@@ -74,7 +83,10 @@ export default {
     resolvePath(...paths) {
       return path.resolve(this.basePath, ...paths)
     },
-    generateTitle
+    generateTitle,
+    unfinishAction: function() {
+      this.$message.error("功能开发中")
+    },
   }
 }
 </script>