部分市场客户资料界面完成

src/components/MCR/MarketCustomerResourcesHome.vue

@@ -0,0 +1,326 @@
+<template>
+    <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading">
+        <div class="job-box">
+            <div class="job-head">
+                <!-- 预计出团量 -->
+                <div style="display: flex;margin-bottom: 10px;">
+                    <div style="width:24%">
+                        预计出团:<span>{{ preDele }}</span>
+                    </div>
+                    <div style="width:24%">
+                        预计出团总量:<span>{{ groupNumber.preDeleAll }}</span>
+                    </div>
+                    <div style="width:24%">
+                        已出团:<span>{{ finlishedDele }}</span>
+                    </div>
+                    <div style="width:24%">
+                        已出团总量:<span>{{ groupNumber.finlishedDeleAll }}</span>
+                    </div>
+                </div>
+
+
+                <div>
+                    <el-select v-model="principalSel" clearable placeholder="负责人">
+                        <el-option v-for="item in principalList" :key="item.id" :label="item.name" :value="item.id">
+                        </el-option>
+                    </el-select>
+                    <el-select v-model="territorySel" clearable placeholder="省 域">
+                        <el-option v-for="item in territoryList" :key="item.id" :label="item.name" :value="item.id">
+                        </el-option>
+                    </el-select>
+                    <el-select v-model="clientLvSel" clearable placeholder="客户级别">
+                        <el-option v-for="item in clientLvList" :key="item.id" :label="item.name" :value="item.id">
+                        </el-option>
+                    </el-select>
+                    <el-select v-model="clientTypeSel" clearable placeholder="客户类别">
+                        <el-option v-for="item in clientTypeList" :key="item.id" :label="item.name" :value="item.id">
+                        </el-option>
+                    </el-select>
+                    <el-select v-model="businessClassSel" clearable placeholder="业务分类">
+                        <el-option v-for="item in businessClassList" :key="item.id" :label="item.name" :value="item.id">
+                        </el-option>
+                    </el-select>
+
+                </div>
+                <!-- textbox框 -->
+                <div style="display: flex;margin-top: 10px;">
+                    <div style="width: 29%;">
+                        <el-input v-model="inputLXR" placeholder="联系人"></el-input>
+                    </div>
+                    &nbsp;
+                    <div style="width: 29%;">
+                        <el-input v-model="inputDQ" placeholder="地区"></el-input>
+                    </div>
+                    &nbsp;
+                    <div style="width: 29%;">
+                        <el-input v-model="inputDW" placeholder="单位"></el-input>
+                    </div>
+                    &nbsp;
+                    <div style="margin-left: 50px;">
+                        <el-button type="primary" @click="QueryData">查 询</el-button>
+                    </div>
+                </div>
+
+            </div>
+            <div class="job-table">
+                <el-table :data="PageList" border @select="handleSelect" style="width: 100%">
+                    <el-table-column prop="client" label="单位" width="140">
+                    </el-table-column>
+                    <el-table-column prop="contact" label="联系人">
+                    </el-table-column>
+                    <el-table-column prop="job" label="职位">
+                    </el-table-column>
+                    <el-table-column prop="telephone" label="手机号">
+                    </el-table-column>
+                    <el-table-column prop="phone" label="座机号">
+                    </el-table-column>
+                    <el-table-column prop="location" label="所在区域">
+                    </el-table-column>
+                    <el-table-column prop="birthday" label="生日">
+                    </el-table-column>
+                    <el-table-column prop="weight" label="权重">
+                    </el-table-column>
+                    <el-table-column prop="ascribedDepartment" label="业务归属">
+                        <template slot-scope="scope">
+                            <el-tooltip class="item" effect="dark" placement="top">
+                                <span style="color:royalblue">查看</span>
+                                <div slot="content">
+                                    <div v-for="yw in scope.row.ascribedDepartment"
+                                        style="text-align: center; width: 100px;padding: 5px;">
+                                        {{ yw.name }}
+                                    </div>
+                                </div>
+                            </el-tooltip>
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="ascribedUser" label="负责人">
+                        <template slot-scope="scope">
+                            <el-tooltip class="item" effect="dark" placement="top">
+                                <span style="color:royalblue">查看</span>
+                                <div slot="content">
+                                    <div v-for="yw in scope.row.ascribedUser"
+                                        style="text-align: center; width: 100px;padding: 5px;">
+                                        {{ yw.cnName }}
+                                    </div>
+                                </div>
+                            </el-tooltip>
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="remark" label="备注">
+                        <template slot-scope="scope">
+                            <div id="remark">
+                                <el-tooltip v-show="scope.row.remark != ''" class="item" effect="dark"
+                                    :content="scope.row.remark" placement="top">
+                                    <span
+                                        v-if="scope.row.remark.length > 10">{{ scope.row.remark.slice(0, 10) + "..." }}</span>
+                                    <span v-else>{{ scope.row.remark }}</span>
+                                    <div slot="content">
+                                        <div style="width: 300px;">
+                                            {{ scope.row.remark }}
+                                        </div>
+                                    </div>
+                                </el-tooltip>
+                            </div>
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="preDele" label="预计出团">
+                    </el-table-column>
+                    <el-table-column prop="finlishedDele" label="已出团">
+                    </el-table-column>
+                    <el-table-column label="操作">
+                        <template slot-scope="scope">
+                            <el-button type="primary" size="mini" @click="Edit(scope.row)">编
+                                辑</el-button>
+                            <br>
+                            <br>
+                            <el-button type="danger" size="mini" @click="Del(scope.row)">删
+                                除</el-button>
+                        </template>
+                    </el-table-column>
+                </el-table>
+                <div class="block">
+                    <el-pagination align='center' @size-change="handleSizeChange" @current-change="handleCurrentChange"
+                        :current-page="currentPage" :page-sizes="[10, 20]" :page-size="pageSize"
+                        layout="total, sizes, prev, pager, next" :total="total">
+                    </el-pagination>
+                </div>
+            </div>
+        </div>
+    </div>
+</template>
+
+<script>
+
+
+export default {
+    data() {
+        return {
+            total: 0, //总行数
+            principalSel: '',
+            principalList: [],//负责人数据
+            territorySel: '',
+            territoryList: [],//省域数据
+            clientLvSel: '',
+            clientLvList: [],//客户级别数据
+            clientTypeSel: '',
+            clientTypeList: [],//客户类别数据]
+            businessClassSel: '',
+            businessClassList: [],//业务分类
+            PageList: [],    //页面数据
+            currentPage: 1, // 当前页码
+            pageSize: 10,// 每页的数据条数
+            loading: true,
+            inputLXR: '', //联系人
+            inputDQ: '', //地区
+            inputDW: '', //单位
+            pageloadData: {
+                "portType": 1,
+                "pageIndex": 1,
+                "pageSize": 10,
+                "contact": "",
+                "location": "",
+                "client": "",
+                "userid": "",
+                "lvlid": 0,
+                "business": "",
+                "Range": 0,
+                "Category": 0
+            },
+            groupNumber: {
+                preDeleAll: '',
+                finlishedDeleAll: ''
+            }
+        }
+    },
+    methods: {
+        //每页条数改变时触发 选择一页显示多少行
+        handleSizeChange(val) {
+            this.currentPage = 1;
+            this.pageSize = val;
+            this.pageloadData.pageIndex = val;
+            this.pageloadData.pageSize = this.pageSize;
+            this.pageload();
+        },
+        //当前页改变时触发 跳转其他页
+        handleCurrentChange(val) {
+            this.loading = true;
+            this.pageloadData.pageIndex = val;
+            this.pageloadData.pageSize = this.pageSize;
+            this.pageload();
+        },
+        //多选框选中方法
+        handleSelect(selection, row) {
+
+        },
+        pageload() {
+            var that = this;
+            //初始化界面数据
+            this.$axios.post('/api/MarketCustomerResources/QueryNewClientData', this.pageloadData, {
+                headers: {
+                    'Authorization': 'Bearer eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJodHRwOi8vc2NoZW1hcy54bWxzb2FwLm9yZy93cy8yMDA1LzA1L2lkZW50aXR5L2NsYWltcy9uYW1laWRlbnRpZmllciI6IkZ1dHVyZSIsImV4cCI6MTY3OTU0MjgwNSwiaXNzIjoiT0FTeXN0ZW0uY29tIiwiYXVkIjoiT0FTeXN0ZW0uY29tIn0.iy5SUInq1p3yjZultRPyzCa2ekLeepSdMLxvPwXY6MI',
+                }
+            }).then(resp => {
+                if (resp.data.code == 200) {
+                    console.log(resp.data);
+                    if (resp.data.data == null) {
+                        that.PageList = [];
+                        that.total = 0;
+                        this.$message.error(resp.data.msg);
+                    } else {
+                        that.principalList = resp.data.data.users; //负责人
+                        that.clientLvList = resp.data.data.level;//客户级别
+                        that.clientTypeList = resp.data.data.customerClass;//客户类别
+                        that.territoryList = resp.data.data.province; //省域数据
+                        that.businessClassList = resp.data.data.serviceClass; //业务归属
+                        that.PageList = resp.data.data.clientTableData.pageSource; //table数据
+                        that.total = resp.data.data.clientTableData.pageCount; //总数
+                        that.groupNumber = resp.data.data.groupNumber; //团组出团总数
+                    }
+                    that.loading = false;
+                }
+
+            }).catch(err => {
+                this.$message.error('网络异常！');
+                this.loading = false;
+            })
+        },
+        //保存权限
+        saveData() {
+            var that = this;
+        },
+        QueryData() {
+            this.pageloadData.pageIndex = this.currentPage;
+            this.pageloadData.pageSize = this.pageSize;
+            this.pageloadData.location = this.inputDQ; //地区
+            this.pageloadData.client = this.inputDW;  //单位
+            this.pageloadData.contact = this.inputLXR; //联系人
+            this.pageloadData.userid = this.principalSel.toString(); //负责人
+            this.pageloadData.Range = this.territorySel;//省域
+            this.pageload();
+        },
+        Edit(row) {
+            this.$router.push("/home/MCROper");
+        },
+        Del(row) {
+            console.log(row.id);
+        }
+    },
+    mounted() {
+        this.pageload();
+    },
+    computed: {
+        preDele() {
+            var number = 0;
+            this.PageList.forEach(element => {
+                number += element.preDele;
+            });
+            return number;
+        },
+        finlishedDele() {
+            var number = 0;
+            this.PageList.forEach(element => {
+                number += element.finlishedDele;
+            });
+            return number;
+        }
+    }
+}
+</script>
+<style>
+body {
+    margin: 0;
+    padding: 0;
+}
+
+.job-head {}
+
+.job-box {
+    background-color: #fff;
+    padding: 10px;
+    border-radius: 10px;
+}
+
+.job-table {
+    margin-top: 10px;
+}
+
+.job-table .block {
+    margin-top: 10px;
+}
+
+.job-table .el-table--enable-row-transition .el-table__body td.el-table__cell {
+    text-align: center;
+}
+
+.job-table .el-table--border .el-table__cell:first-child .cell {
+    text-align: center;
+}
+
+.job-input {
+    display: flex;
+}
+
+.job-input .el-select {
+    margin-right: 5px;
+}
+</style>

src/components/MCR/MarketCustomerResourcesOperation.vue

@@ -0,0 +1,24 @@
+<template>
+    <div v-loading="loading" element-loading-text="拼命加载中" element-loading-spinner="el-icon-loading">
+        <div class="operationMCR-Box">
+
+        </div>
+    </div>
+</template>
+
+<script>
+
+
+export default {
+    data() {
+        return {
+        }
+    },
+}
+</script>
+<style>
+body {
+    margin: 0;
+    padding: 0;
+}
+</style>

src/main.js

@@ -9,8 +9,8 @@ import './assets/icon/iconfont.css'
 import store from './store/index.js';
 
 import axios from 'axios';
-axios.defaults.baseURL = 'http://132.232.92.186:8888';
-// axios.defaults.baseURL = 'http://localhost:5256/';
+//axios.defaults.baseURL = 'http://132.232.92.186:8888';
+axios.defaults.baseURL = 'http://localhost:5256/';
 import { Message } from "element-ui";
 Vue.prototype.$message = Message
 Vue.prototype.$axios = axios;

src/router/index.js

@@ -42,6 +42,9 @@ import SetData from '@/components/system/SetData';
 import CustomerCompany from '@/components/Crm/CustomerCompany';
 import DeleClient from '@/components/Crm/DeleClient';
 import Cost from '@/components/Finance/Cost';
+import MCR from '@/components/MCR/MarketCustomerResourcesHome';
+import MCROper from '@/components/MCR/MarketCustomerResourcesOperation';
+
 Vue.use(Router)
 
 export default new Router({
@@ -239,6 +242,16 @@ export default new Router({
           name: 'Cost',
           component: Cost
         },
+        {
+          path: '/home/MCR',
+          name: 'MCR',
+          component: MCR
+        },
+        {
+          path: '/home/MCROper',
+          name: 'MCROper',
+          component: MCROper
+        },
       ]
     },
     {