自助营销

src/assets/css/customerManage.css

@@ -8,6 +8,7 @@
 .customerManage .tools h1{
     font-weight: bold;
     font-size: 18px;
+    font-family: perfectFont;
 }
 .customerManage .tools .rightmenu{
     display: flex;

src/components/sellevent/brithday.vue

+<style>
+@import '../../assets/css/customerManage.css';
+
+.el-table__fixed-body-wrapper table{
+    padding-bottom: 8px!important;
+}
+.el-table__fixed-body-wrapper{
+    overflow: auto;
+}
+</style>
+<template>
+  <div class="customerManage">
+    <div class="tools">
+        <h1>生日事件客户</h1>
+        <!-- <div style="width: 340px;">
+            <el-input placeholder="请输入直客名称/手机号" v-model="msg.GusetName" class="input-with-select">
+                <el-button slot="append"  icon="el-icon-search" @click="getList"></el-button>
+            </el-input>
+        </div> -->
+        <div class="rightmenu">
+            <!-- <el-button class="crm-btn query-btn" @click="getList">查询</el-button> -->
+            <el-button icon="el-icon-plus" class="crm-btn org-btn" @click="CustomerId = 0, dialogTableVisibleName = '新建直客', dialogTableVisible=true">发送生日祝福涵</el-button>
+            <!-- <el-dropdown>
+                <el-button class="crm-btn crm-btn-more easy-btn margin-right0">
+                    <i class="iconfont icongengduo"></i>
+                </el-button>
+                <el-dropdown-menu slot="dropdown">
+                    <el-dropdown-item><i class="iconfont icondaoru"></i> 导入</el-dropdown-item>
+                    <el-dropdown-item><i class="iconfont icondaochu"></i> 导出</el-dropdown-item>
+                </el-dropdown-menu>
+            </el-dropdown> -->
+        </div>
+    </div>
+    <div class="query-box" :style="{'padding-bottom': sceneList.length > 0 ? '0px' : '10px'}">
+        <el-row v-if="!multipleSelection.length" :gutter="30">
+            <el-col :span="4">
+                <span class="font-size-12" style="padding-right: 10px">场景</span>
+                <el-popover
+                    placement="bottom"
+                    width="180"
+                    popper-class="popover-class"
+                    v-model="visible"
+                    trigger="click">
+                    <div data-v-16d669bb="" class="scene-container">
+                        <div class="scene-list">
+                            <div class="scene-list-item" :class="{'scene-list-item-select': sceneID === item.ID}" v-for="(item, index) in SceneEmployeeList" :key="index" @click="changeWhere(item)">{{item.SceneName}}</div>
+                        </div>
+                        <div class="handle-interval">
+                            <div class="vux-flexbox handle-button vux-flex-row"  @click="MsgBus.$emit('sceneBoxShow', 5, 1)">
+                                <i class="el-icon-circle-plus-outline handle-button-icon"></i>
+                            <div class="handle-button-name">新建场景</div></div>
+                            <div class="vux-flexbox handle-button vux-flex-row" @click="MsgBus.$emit('sceneEditBoxShow', 5, SceneEmployeeList)">
+                                <i class="el-icon-setting handle-button-icon"></i>
+                                <div class="handle-button-name">管理</div>
+                            </div>
+                        </div>
+                    </div>
+                    <el-select size="mini" popper-class="select-no" slot="reference" v-model="msg.ID" placeholder="请选择">
+                        <el-option
+                            v-for="item in SceneEmployeeList"
+                            :key="item.ID"
+                            :label="item.SceneName"
+                            :value="item.ID">
+                        </el-option>
+                    </el-select>
+                </el-popover>
+            </el-col>
+            <el-col :span="4">
+                <span class="font-size-12" style="padding-right: 10px">客户类型</span>
+                <el-select size="mini" v-model="msg.CustomerType" placeholder="请选择" @change="getList">
+                    <el-option key="0" label="客户" :value="0"></el-option>
+                    <el-option key="1" label="直客" :value="1"></el-option>
+                </el-select>
+            </el-col>
+            <el-col :span="4">
+                <el-button icon="iconfont iconshaixuan" class="crm-btn query-btn crm-btn-mini margin-right0" @click="MsgBus.$emit('sceneBoxShow', 5)">高级筛选</el-button>
+            </el-col>
+        </el-row>
+        <div v-else class="flex-center">
+            <p class="font-size-12">已选 <span class="font-color-link">{{multipleSelection.length}}</span> 项</p>
+            <div class="selection-box">
+               <el-button  v-for="(item, index) in selectionList" :key="index" @click="item.myFun"><i :class="item.class"></i>{{item.name}}</el-button>
+            </div>
+        </div>
+        <div class="scene-wrapper" v-if="sceneList.length > 0">
+            <ul class="list">
+                <li class="list-item" v-for="(item, index) in sceneList" :key="index">
+                    <span v-if="item.formType !== 'datetime'">{{item.str}}&nbsp;{{item.regionStr}}“{{item.nameFC ? item.nameFC : item.value}}”</span>
+                    <span v-else>{{item.str}}&nbsp;“{{item.start}}-{{item.end}}”</span>
+                    <i class="el-icon-close icon" @click="deleteScene(index)"></i>
+                </li>
+            </ul>
+        </div>
+    </div>
+    <div class="page-content">
+        <el-table 
+            v-if="loading"
+            v-loading="true"
+            :data="[]">
+            <el-table-column 
+                v-for="(item, index) in queryType2" :key="index"
+                :label="item.label">
+            </el-table-column>
+        </el-table>
+        <el-table
+            v-if="!loading"
+            ref="multipleTable"
+            :data="tableData"
+            tooltip-effect="dark"
+            style="width: 100%"
+            :height="sceneList.length > 0 ? '600' : '660'"
+            border
+            row-class-name="font-size-12"
+            @selection-change="handleSelectionChange">
+            <el-table-column fixed type="selection" width="40"></el-table-column>
+            <el-table-column 
+                fixed
+                prop="GuestName"
+                label="客户名称"
+                width="120"
+                v-if="queryType[0].show"
+                show-overflow-tooltip>
+                <template slot-scope="scope">
+                    <p @click="openDetails(scope)" class="font-color-link cp">{{scope.row.GuestName}}</p>
+                </template>
+            </el-table-column>
+            <el-table-column
+                prop="Away"
+                label="生日倒计时"
+                width="120"
+                v-if="queryType[1].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="BirthdayMonth"
+                label="生日日期"
+                width="120"
+                v-if="queryType[2].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="MobilePhone"
+                label="手机号码"
+                width="120"
+                v-if="queryType[3].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="Address"
+                label="地址"
+                v-if="queryType[4].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="SexStr"
+                label="性别"
+                v-if="queryType[5].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="TripCount"
+                label="参团次数"
+                sortable
+                v-if="queryType[6].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="Old"
+                label="年龄"
+                sortable
+                v-if="queryType[7].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="PassportNo"
+                label="护照号"
+                sortable
+                v-if="queryType[8].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="Duty"
+                label="职业"
+                sortable
+                v-if="queryType[9].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="CustomerName"
+                label="关联同行"
+                sortable
+                v-if="queryType[10].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="ProductName"
+                label="上次出行产品"
+                sortable
+                v-if="queryType[11].show"
+                width="200"
+                show-overflow-tooltip>
+            </el-table-column>
+            <el-table-column
+                prop="UnitPrice"
+                label="上次出行单价"
+                sortable
+                v-if="queryType[12].show"
+                show-overflow-tooltip>
+            </el-table-column>
+            <!-- <el-table-column 
+                prop="IsCarefor"
+                fixed="right"
+                width="50"
+                label="关注">
+                <template slot-scope="scope">
+                    <p>
+                        <el-tooltip class="item" effect="dark" content="关注" placement="top">
+                            <i v-if="scope.row.IsCarefor === 0" @click="CareforCustomer(scope)" class="iconfont iconwujiaoxing cp"></i>
+                        </el-tooltip>
+                        <el-tooltip class="item" effect="dark" content="取消关注" placement="top">
+                            <i v-if="scope.row.IsCarefor === 1" @click="CareforCustomer(scope)" class="iconfont iconstar_full cp"></i>
+                        </el-tooltip>
+                    </p>
+                </template>
+            </el-table-column> -->
+            <el-table-column 
+                width="40"
+                fixed="right">
+                <template slot="header" slot-scope="scope">
+                    <el-popover
+                        placement="bottom"
+                        width="240">
+                        <mySelect :queryType="queryType" @listenTochildEvent="showMessageFromChild"/>
+                        <i class="el-icon-s-operation cp" slot="reference"></i>
+                    </el-popover>
+                </template>
+            </el-table-column>
+        </el-table>
+    </div>
+    <div>
+        <el-pagination
+            class="Mypagination"
+            background
+            @current-change="handleCurrentChange"
+            :page-sizes="[30, 60, 90, 100]"
+            :page-size="msg.pageSize"
+            layout="sizes, prev, pager, next"
+            @size-change="handleSizeChange"
+            :total="total">
+        </el-pagination>
+    </div>
+    <!-- <el-drawer
+        :with-header="false"
+        size='70%'
+        :visible.sync="drawer"
+        direction="rtl"
+        :before-close="handleClose">
+        <customerInfoBox :CustomerId="CustomerId" @transferS="transfer" @editCustS="editCust"/>
+    </el-drawer> -->
+    <!-- <div v-if="dialogTableVisible">
+        <customerDialogBox @getList="getList" :name="dialogTableVisibleName" :CustomerId="CustomerId"/>
+    </div> -->
+    <el-dialog :visible.sync="transferVisible" :close-on-click-modal="false" width="450px" custom-class="transfer-box add-box add-box2">
+        <div class="add-tit" slot="title">
+            <p><span></span>客户转移</p>
+            <span icon="el-icon-close"></span>
+        </div>
+        <el-form :model="transferMsg" ref="form" class="MyEditForm" >
+            <div class="MyEditForm-item">
+                <el-form-item label="变更负责人为" class="label-pad-left">
+                    <el-select
+                        filterable
+                        v-model="transferMsg.EmpId" placeholder="请选择">
+                        <el-option
+                            v-for="item in EmployeeList"
+                            :label='item.EmName'
+                            :value='item.EmployeeId'
+                            :key='item.EmployeeId'>
+                        </el-option>
+                    </el-select>
+                </el-form-item>
+            </div>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+            <el-button type="primary" class="add-box-btn" @click="transfer(2)">确 定</el-button>
+            <el-button class="add-box-btn add-box-cancel" @click="transferVisible = false">取 消</el-button>
+        </div>
+    </el-dialog>
+  </div>
+</template>
+<script>
+import mySelect from "../dialogModel/select";
+// import customerInfoBox from "./customerInfoBox";
+// import customerDialogBox from "./customerDialogBox";
+export default {
+    components: {
+        mySelect
+        // customerInfoBox,
+        // customerDialogBox
+    },
+  data() {
+    return {
+        queryType2: [
+            {
+                label: '客户名称',
+                show: true,
+            },{
+                label: '生日倒计时',
+                show: true,
+            },{
+                label: '生日日期',
+                show: true,
+            },{
+                label: '手机号码',
+                show: true,
+            },{
+                label: '地址',
+                show: true,
+            }            
+            ,{
+                label: '性别',
+                show: true,
+            },{
+                label: '参团次数',
+                show: true,
+            },{
+                label: '年龄',
+                show: true,
+            },{
+                label: '护照号',
+                show: true,
+            },{
+                label: '职业',
+                show: true,
+            },{
+                label: '关联同行',
+                show: true,
+            },{
+                label: '上次出行产品',
+                show: true,
+            },{
+                label: '上次出行单价',
+                show: true,
+            }
+        ],
+        queryType: [
+            {
+                label: '客户名称',
+                show: true,
+            },{
+                label: '生日倒计时',
+                show: true,
+            },{
+                label: '生日日期',
+                show: true,
+            },{
+                label: '手机号码',
+                show: true,
+            },{
+                label: '地址',
+                show: true,
+            }            
+            ,{
+                label: '性别',
+                show: true,
+            },{
+                label: '参团次数',
+                show: true,
+            },{
+                label: '年龄',
+                show: true,
+            },{
+                label: '护照号',
+                show: true,
+            },{
+                label: '职业',
+                show: true,
+            },{
+                label: '关联同行',
+                show: true,
+            },{
+                label: '上次出行产品',
+                show: true,
+            },{
+                label: '上次出行单价',
+                show: true,
+            }
+        ],
+        CustomerId: 0,
+        CustomerIdStr: '',
+        transferVisible: false,
+        mySelectCtrl: false,
+        drawer: false,
+        loading: true,
+        dialogTableVisible: false,
+        dialogTableVisibleName: '新建直客',
+        tableData: [],
+        multipleSelection: [],
+        EmployeeList: [],
+        value: '',
+        userInfo: {},
+        transferMsg: {
+            IDs: [],
+            EmpId: '',
+        },
+        msg: {
+            GusetName: '',
+            pageIndex: 1,
+            pageSize: 30,
+            ContactNumber: '',
+            WhereType: -1,
+            OrderBy: '',
+            ID: 36
+        },
+        total: 0,
+        WhereTypeList: [
+            {
+                id: -1,
+                name: '全部'
+            },{
+                id: 1,
+                name: '我负责的'
+            },{
+                id: 2,
+                name: '下属的'
+            },{
+                id: 3,
+                name: '我关注的'
+            },
+        ],
+        selectionList: [
+            {
+                name: '转移',
+                class:'iconfont iconplus-transfer',
+                myFun: this.transfer
+            },{
+                name: '删除',
+                class:'iconfont icondelete',
+                myFun: this.delete
+            },
+        ],
+         sceneList: [],
+        SceneEmployeeList: [],
+        sceneID: 36,
+        visible: false,
+    };
+  },
+  mounted() {
+    this.userInfo = this.getLocalStorage();
+    console.log(this.queryType)
+    this.getList()
+    this.Employee()
+    let $this = this
+    this.MsgBus.$on('closeCustomerDialogBox', function (){
+        $this.dialogTableVisible = false
+    })
+  this.GetSceneEmployeeList()
+        this.MsgBus.$on('sceneSave', function (msg){
+            $this.sceneList = [...msg]
+            $this.GetSceneEmployeeList()
+            let obj = {}
+            msg.forEach(element => {
+                obj[element.name] = element
+            });
+            $this.msg.Data = obj
+            $this.getList()
+        })
+        this.MsgBus.$on('editScene', function (){
+            console.log(1)
+            $this.GetSceneEmployeeList()
+        })
+    },beforeDestroy() {
+        this.MsgBus.$off('sceneSave');
+        this.MsgBus.$off('editScene');
+    },
+  methods: {
+    changeWhere(item){
+        this.msg.ID = item.ID
+        this.sceneID = item.ID
+        this.msg.Data = item.WhereData ? JSON.parse(item.WhereData) : {}
+        this.msg.WhereType = item.WhereType
+        this.visible = false
+        this.getList()
+    },
+    GetSceneEmployeeList(){
+        this.apipost('/api/Scene/GetSceneEmployeeList', {LableType: 5}, res=>{
+            if (res.data.resultCode == 1) {
+                this.SceneEmployeeList = res.data.data
+            }
+        })
+    },
+    deleteScene(index){
+        this.sceneList.splice(index, 1)
+        let obj = {}
+        this.sceneList.forEach(element => {
+            obj[element.name] = element
+        });
+        this.msg.Data = obj
+        this.getList()
+    },
+    getMarriageStr(type){
+        if (type === 5) return '其他'
+        if (type === 4) return '丧偶'
+        if (type === 3) return '未婚'
+        if (type === 2) return '离婚'
+        if (type === 1) return '已婚'
+        if (type === 0) return '无'
+    },
+    Employee(){
+        let msg = {
+            RB_Group_id: this.userInfo.RB_Group_id,
+            BranchId:-1,
+            DepartmentId:0,
+            PostId:0,
+            IsLeave:0,
+        }
+        this.apipost2(
+          "admin_get_EmployeeGetList",
+          this.msg,
+          res => {
+            if (res.data.resultCode == 1) {
+              this.EmployeeList = res.data.data;
+            } else {
+            }
+          },
+          err => {}
+        );
+    },
+    
+    //锁定
+    locking(){
+        console.log('锁定')
+    },
+    //解锁
+    Unlock(){
+        console.log('解锁')
+    },
+    //删除团队成员
+    delCust(){
+        console.log('删除团队成员')
+    },
+    //删除
+    delete(){
+        console.log('删除')
+    },
+    //导出
+    export(){
+        console.log('导出')
+    },
+    // 更改状态
+    changeState(){
+        console.log('更改状态')
+    },
+    // 关注
+    CareforCustomer(scope){
+        this.apipost('/api/Customer/CareforGuesstCustomer', {ID: scope.row.ID}, res=>{
+            if (res.data.resultCode == 1) {
+                this.$message.success('操作成功');
+                this.getList()
+            }
+        })
+    },
+    // 转移
+    transfer(type){
+        if (type !== 2) {
+            if (type === 3) {
+                this.multipleSelection.push(this.CustomerId)
+            }
+            this.transferVisible = true
+        } else {
+            if (this.transferMsg.EmpId === '') {
+                return this.$message.error('请选择变更负责人！')
+            }
+            let str = ''
+            this.multipleSelection.map((x, i)=>{
+                str = str + x + ','
+            })
+            this.transferMsg.IDs = str.substring(0, str.length - 1)
+            this.apipost('/api/Customer/TransferGuesstCustomer', this.transferMsg, res=>{
+                if (res.data.resultCode == 1) {
+                    this.multipleSelection = []
+                    this.transferVisible = false
+                    if (type === 3) {} {
+                        this.drawer = false
+                    }
+                    this.$message.success(res.data.message);
+                    this.getList()
+                    this.transferMsg = {
+                        IDs: [],
+                        EmpId: ''
+                    }
+                }
+            })
+        }
+        console.log('转移')
+    },
+    showMessageFromChild(list){
+        this.mySelectCtrl=!this.mySelectCtrl
+        if (list) {
+            this.queryType = list
+            this.getList()
+        }
+    },
+    editCust(){
+        this.dialogTableVisibleName = '修改直客'
+        this.dialogTableVisible = true
+    },
+    openDetails(scope){ 
+        this.drawer = true
+        this.CustomerId = scope.row.ID
+        this.CustomerName = scope.row.GusetName
+    },
+    handleSizeChange(val) {
+        this.msg.pageSize = val
+        this.getList();
+    },
+    handleCurrentChange(val) {
+        this.msg.pageIndex = val;
+        this.getList();
+    },
+    handleClose(done) {
+        done();
+    },
+    getList: function (){
+        this.tableData = []
+        this.loading = true
+        this.apipost('/api/sellevent/GetSellEventToC', this.msg, res=>{
+            if (res.data.resultCode == 1) {
+                this.tableData = res.data.data.pageData;
+                this.total = res.data.data.count;
+                this.loading = false;
+            }
+        })
+    },
+    handleSelectionChange(val) {
+        this.multipleSelection = val.map(x=>
+            x.ID
+        )
+    }
+  }
+};
+</script>

src/components/sellevent/index.vue

@@ -7,8 +7,8 @@
                 <span>直客营销事件</span>
             </div>
             <div class="events">
-                <el-badge :value="2" :max="99" class="item">
-                    <div class="event">
+                <el-badge :value="r[0]" :max="9999" class="item">
+                    <div class="event" @click="goBirth">
                         <img src="../../assets/img/event/shengri.png" />
                         <div class="content">
                             <div class="ti">生日事件</div>
@@ -20,17 +20,19 @@
                         </div>
                     </div>
                 </el-badge>
-                <div class="event">
-                    <img src="../../assets/img/event/biye.png" />
-                    <div class="content">
-                        <div class="ti">毕业季事件</div>
-                        <el-tooltip class="item" effect="dark" content="进入毕业季6-8月份正值初中，高中，大学学生毕业的客户名单，可以向客户或在关联同行发出恭贺函，并且关联部分产品信息" placement="top">
-                            <div class="desc">
-                                进入毕业季6-8月份正值初中，高中，大学学生毕业的客户名单，可以向客户或在关联同行发出恭贺函，并且关联部分产品信息
-                            </div>
-                        </el-tooltip>
+                <el-badge :value="r[1]" :max="9999" class="item">
+                    <div class="event">
+                        <img src="../../assets/img/event/biye.png" />
+                        <div class="content">
+                            <div class="ti">毕业季事件</div>
+                            <el-tooltip class="item" effect="dark" content="进入毕业季6-8月份正值初中，高中，大学学生毕业的客户名单，可以向客户或在关联同行发出恭贺函，并且关联部分产品信息" placement="top">
+                                <div class="desc">
+                                    推荐3-6月发送一次，为考试前的加油函，6-9月发送一次为考试后的毕业恭喜函，提供初中，高中，大学学生毕业的客户名单，可以向客户或在关联同行发出恭贺函，并且关联部分产品信息
+                                </div>
+                            </el-tooltip>
+                        </div>
                     </div>
-                </div>
+                </el-badge>
                 <div class="event">
                     <img src="../../assets/img/event/jieri.png" />
                     <div class="content">
@@ -75,6 +77,7 @@
                         </el-tooltip>
                     </div>
                 </div>
+                
             </div>
         </el-col>
         <el-col :span="12">
@@ -128,6 +131,7 @@
                         </div>
                     </div>
                 </div>
+                <div class="event" style="cursor:default;">&nbsp;</div>
             </div>
         </el-col>
     </el-row>
@@ -136,7 +140,27 @@
 
 <script>
 export default {
-
+    data() {
+        return {
+            r:[0,0]
+        }
+    },
+    created() {
+        this.init();
+    },
+    methods:{
+        init(){
+            this.apipost("/api/SellEvent/GetSellEventToCCount",{},r=>{
+                console.log(r.data)
+                if(r.data.resultCode==1){
+                    this.r=r.data.data
+                }
+            })
+        },
+        goBirth(){
+            this.$router.push('/birthdayEvent');
+        }
+    }
 }
 </script>
 
@@ -170,6 +194,7 @@ export default {
     height:370px;
     background:rgba(244,245,249,1);
     margin-bottom: 30px;
+    cursor: pointer;
 }
 .event-box .events .event img{
     width:100%;

src/plugins/index.js

@@ -11,7 +11,7 @@ export default {
             },
             //域名管理对象
             Vue.prototype.domainManager = function () {
-                let domainUrl = "http://testcrm.oytour.com"
+                let domainUrl = "https://localhost:5001"
                 let locationName = window.location.hostname;
                 let domainPostUrl = "http://testapi.oytour.com"
                 if (this.isOnline()) {

src/router.js

@@ -171,6 +171,14 @@ export default new Router({
             title: "营销事件"
           }
         },
+        {
+          path: "/birthdayEvent",
+          name: "birthdayEvent",
+          component: ()=>import('./components/sellevent/brithday.vue'),
+          meta: {
+            title: "生日事件"
+          }
+        },
         {
           path: "/gaoxiao",
           name: "gaoxiao",