邀请函后台管理完成

.gitignore

@@ -22,3 +22,4 @@ pnpm-debug.log*
 *.njsproj
 *.sln
 *.sw?
+*.zip

src/App.vue

@@ -9,4 +9,36 @@
   width: 100%;
   height: 100%;
 }
+body,
+div,
+p,
+ul,
+ol,
+li,
+dl,
+dt,
+dd,
+table,
+tr,
+td,
+form,
+hr,
+fieldset,
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+img,
+input {
+    margin: 0;
+    padding: 0;
+}
+
+html,
+body {
+    width: 100%;
+    height: 100%;
+}
 </style>

src/plugins/axios.js

@@ -3,10 +3,12 @@ import { Notify } from "vant";
 import Vue from 'vue';
 import axios from "axios";
 // Full config:  https://github.com/axios/axios#request-config
-axios.defaults.baseURL = 'http://121.40.217.77:8084/';
-// axios.defaults.baseURL = process.env.baseURL || process.env.apiUrl || '';
-// axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
-// axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
+// axios.defaults.baseURL = 'http://121.40.217.77:8084/';
+axios.defaults.baseURL = 'https://121.40.217.77:8084/';
+console.log(axios.defaults.baseURL)
+    // axios.defaults.baseURL = process.env.baseURL || process.env.apiUrl || '';
+    // axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
+    // axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';
 
 let config = {
     // baseURL: process.env.baseURL || process.env.apiUrl || ""

src/router/index.js

@@ -21,6 +21,12 @@ const routes = [{
         component: () =>
             import ( /* webpackChunkName: "about" */ '../views/business-end')
     },
+    {
+        path: '/back-stage-management',
+        name: 'back-stage-management',
+        component: () =>
+            import ( /* webpackChunkName: "about" */ '../views/back-stage-management')
+    },
 ]
 
 const router = new VueRouter({

src/views/back-stage-management/dialog-user.vue

@@ -0,0 +1,81 @@
+<template>
+    <el-dialog :before-close="() => { $emit('update:visible', false) }" :title="type==='add'?'新增接待人':'修改接待人'" :visible.sync="visible" width="400px" :close-on-click-modal="false">
+        <el-form ref="form" :model="form" :rules="rules" label-width="70px">
+            <el-form-item :label="'姓名'" prop="userName">
+                <el-input :maxlength="200" v-model.trim="form.userName" clearable></el-input>
+            </el-form-item>
+            <el-form-item :label="'手机号'" prop="phone">
+                <el-input :maxlength="200" v-model.trim="form.phone" clearable></el-input>
+            </el-form-item>
+            <el-form-item :label="'密码'" prop="passWord">
+                <el-input :maxlength="200" v-model.trim="form.passWord" clearable></el-input>
+            </el-form-item>
+        </el-form>
+        <div slot="footer" class="dialog-footer">
+            <el-button type="primary" :loading="submitLoading" @click="handleEvent">{{'确定'}}</el-button>
+            <el-button @click="$emit('update:visible', false)">{{'取消'}}</el-button>
+        </div>
+    </el-dialog>
+</template>
+
+<script>
+export default {
+    props:['visible', 'type', 'value',],
+        watch: {
+            visible: function(val) {
+                if (val) {
+                    switch (this.type) {
+                    case 'add':
+                        for (const key in this.form) {
+                            this.form[key] = '';
+                            console.log(this.form[key])
+                        }
+                        break;
+                    case 'edit':
+                        this.form = Object.assign({}, this.form, this.value);
+                        break;
+                    default:
+                        break;
+                    }
+                    this.$refs.form && this.$refs.form.resetFields();
+                }
+            },
+        },
+    data(){
+        return{
+            form:{
+                userName:'',
+                passWord:'',
+                phone:'',
+            },
+            submitLoading:false,
+            rules:{
+                phone: [
+                    {required: true, message: '请输入手机号', trigger: 'blur'}
+                ],
+                passWord: [
+                    {required: true, message: '请输入密码', trigger: 'blur'}
+                ],
+                userName: [
+                    {required: true, message: '请输入姓名', trigger: 'blur'}
+                ],
+            }
+        }
+    },
+    methods:{
+        async handleEvent() {
+            this.submitLoading = true
+            let res = await this.$axios.post((this.type==='add'? '/AF/addUserInfo' : '/AF/updateUserInfo') + "?" + this.$qs.stringify({ ...this.form}))
+            if(res.data.success){
+                this.$emit('getData');
+                this.$emit('update:visible', false);
+            }
+            this.submitLoading = false
+        }
+    }
+}
+</script>
+
+<style>
+
+</style>

src/views/back-stage-management/dialog.vue

@@ -0,0 +1,93 @@
+<template>
+    <el-dialog :before-close="() => { $emit('update:visible', false) }" :title="type==='add'?'分配接待人':'重新分配接待人'" :visible.sync="visible" width="600" :close-on-click-modal="false">
+        <el-form inline ref="form"  :model="form" label-width="120px">
+            <el-form-item :label="'当前客户：'" prop="name">
+                {{value.name || ''}}，{{value.phone || ''}}
+            </el-form-item>
+            <el-form-item :label="'当前接待人：'" prop="userName" v-if="type!=='add'">
+                {{value.userName || ''}}，{{value.userPhone || ''}}
+            </el-form-item>
+        </el-form>
+        <div class="onSubmitBox">
+            <el-input v-model="input" placeholder="接待人/接待人手机号"></el-input>
+            <el-button @click="onSubmit">{{'查询'}}</el-button>
+        </div>
+         <el-table
+            :data="tableData"
+            border
+            height="400"
+            v-loading="loading"
+            style="width: 100%">
+            <el-table-column prop="userName" label="接待人"></el-table-column>
+            <el-table-column prop="phone" label="接待人手机号"></el-table-column>
+            <el-table-column label="操作">
+                <template slot-scope="scope">
+                    <el-button type="text" size="small" @click="distribution(scope.row)" :disabled="type!=='add' && value.phone === scope.row.phone">分配</el-button>
+                </template>
+            </el-table-column>
+        </el-table>
+    </el-dialog>
+</template>
+
+<script>
+export default {
+    props:['visible', 'type', 'value','tableDataUser'],
+        watch: {
+            visible: function(val) {
+                if (val) {
+                    this.input = ''
+                    this.tableData = this.tableDataUser
+                    switch (this.type) {
+                    case 'add':
+                        break;
+                    case 'edit':
+                        break;
+                    default:
+                        break;
+                    }
+                }
+            },
+        },
+    data(){
+        return{
+            input:'',
+            submitLoading:false,
+            loading:false,
+            tableData:[],
+            form:{}
+        }
+    },
+    methods:{
+        async distribution(row){
+            this.loading = true
+            let res = await this.$axios.post('/AF/editRegisterInfo' + "?" + this.$qs.stringify({ ...this.value,userId:row.id}))
+            if(res.data.success){
+                this.$emit('getData');
+                this.$emit('update:visible', false);
+            }
+            this.loading = false
+        },
+        onSubmit(){
+            if(!this.input) return this.tableData = this.tableDataUser.map(val=> val)
+            this.tableData = this.tableDataUser.filter(val=> val.userName.indexOf(this.input) !== -1 || val.phone.indexOf(this.input) !== -1)
+        },
+    }
+}
+</script>
+
+<style scoped lang="scss">
+/deep/.el-dialog__body{
+    padding-top: 0;
+}
+.el-form-item{
+    width: 100%;
+    margin-bottom: 0;
+}
+.onSubmitBox{
+    display: flex;
+    margin-bottom: 10px;
+    .el-input{
+        margin-right: 20px;
+    }
+}
+</style>

src/views/back-stage-management/index.vue

@@ -0,0 +1,170 @@
+<template>
+  <div class="mainBox">
+    <div class="title">
+      <span>已预约人数：10000人</span>永天科技-安博会人员信息管理
+    </div>
+    <el-tabs v-model="activeName" type="card" @tab-click="handleClick">
+      <el-tab-pane label="客户信息" name="first"></el-tab-pane>
+      <el-tab-pane label="接待人信息" name="second"></el-tab-pane>
+    </el-tabs>
+    <div class="tableBox">
+      <el-form :inline="true" :model="formInline" class="demo-form-inline">
+        <el-form-item label="" v-if="activeName === 'first'">
+          <el-input v-model="formInline.customer" placeholder="客户姓名/联系电话"></el-input>
+        </el-form-item>
+        <el-form-item label="">
+          <el-input v-model="formInline.user" placeholder="接待人/接待人手机号"></el-input>
+        </el-form-item>
+        <el-form-item label="是否已分配" v-if="activeName === 'first'">
+            <el-select v-model="formInline.distribution" placeholder="">
+            <el-option label="全部" :value="0"></el-option>
+            <el-option label="已分配" :value="1"></el-option>
+            <el-option label="未分配" :value="2"></el-option>
+            </el-select>
+        </el-form-item>
+        <el-form-item>
+          <el-button type="primary" @click="onSubmit()">查询</el-button>
+          <el-button type="primary" @click="type = 'add';dialogUserVisible = true" v-if="activeName === 'second'">新增接待人</el-button>
+        </el-form-item>
+      </el-form>
+      <div class="tableList">
+        <el-table
+            :data="tableData"
+            border
+            height="100%"
+            style="width: 100%">
+            <template v-if="activeName === 'first'">
+                <el-table-column prop="name" label="客户姓名" show-overflow-tooltip></el-table-column>
+                <el-table-column prop="phone" label="联系电话" show-overflow-tooltip></el-table-column>
+                <el-table-column prop="companyName" label="客户单位名称" show-overflow-tooltip></el-table-column>
+                <el-table-column prop="post" label="职位" show-overflow-tooltip></el-table-column>
+                <el-table-column prop="sf" label="省份" show-overflow-tooltip></el-table-column>
+                <el-table-column prop="dateOfVisit" label="到访日期" show-overflow-tooltip></el-table-column>
+                <el-table-column prop="accompany" label="随行人数" show-overflow-tooltip>
+                  <template slot-scope="scope">
+                    {{ scope.row.accompany === 1 ? '1-3人' : scope.row.accompany === 2 ? '3-7人' : '7人以上' }}
+                  </template>
+                </el-table-column>
+                <el-table-column prop="userName" label="接待人" show-overflow-tooltip></el-table-column>
+                <el-table-column prop="userPhone" label="接待人手机号" show-overflow-tooltip></el-table-column>
+            </template>
+            <template v-if="activeName === 'second'">
+                <el-table-column prop="userName" label="接待人"></el-table-column>
+                <el-table-column prop="phone" label="接待人手机号"></el-table-column>
+                <!-- <el-table-column prop="phone" label="登录账号"></el-table-column> -->
+                <!-- <el-table-column prop="zip" label="接待客户数（人）"></el-table-column> -->
+            </template>
+            <el-table-column fixed="right" label="操作">
+                <template slot-scope="scope">
+                    <template v-if="activeName === 'first'">
+                        <el-button type="text" size="small" v-if="!scope.row.userPhone" @click="type = 'add';currentRow = scope.row;dialogVisible = true">分配接待人</el-button>
+                        <el-button type="text" size="small" v-else @click="type = 'edit';currentRow = scope.row;dialogVisible = true">重新分配</el-button>
+                    </template>
+                    <template v-else-if="activeName === 'second'">
+                        <el-button type="text" size="small" @click="type = 'edit';currentRow = scope.row;dialogUserVisible = true">修改</el-button>
+                        <el-button type="text" size="small" style="color:red;">删除</el-button>
+                    </template>
+                </template>
+            </el-table-column>
+        </el-table>
+      </div>
+    </div>
+    <el-dialog :visible.sync="dialogVisible" :type="type" v-model="currentRow" @getData="getDataCustomer" :tableDataUser="tableDataUser"></el-dialog>
+    <el-dialog-user :visible.sync="dialogUserVisible" :type="type" v-model="currentRow" @getData="getDataReception"></el-dialog-user>
+  </div>
+</template>
+
+<script>
+import elDialog from './dialog';
+import elDialogUser from './dialog-user';
+export default {
+components: {
+    elDialog,
+    elDialogUser
+},
+data() {
+    return {
+      activeName: "first",
+      formInline: {
+        user: "",
+        customer: "",
+        distribution: 0,
+      },
+      tableData:[],
+      tableDataUser:[],
+      tableDataCustomer:[],
+      dialogVisible:false,
+      dialogUserVisible:false,
+      type:null,
+      currentRow:{}
+    };
+  },
+  mounted(){
+      this.getDataCustomer()
+      this.getDataReception()
+  },
+  methods: {
+    async getDataCustomer(){
+        let res = await this.$axios.post('/AF/listAppointment')
+        if(res.data.success){
+            this.tableDataCustomer = res.data.data
+        }
+        this.onSubmit()
+    },
+    async getDataReception(){
+        let res = await this.$axios.post('/AF/listUserInfo')
+        if(res.data.success){
+            this.tableDataUser = res.data.data
+        }
+        this.onSubmit()
+    },
+    handleClick(tab, event) {
+        console.log(tab, event);
+        this.onSubmit()
+    },
+    onSubmit() {
+        if(this.activeName === 'first'){
+            this.tableData = this.tableDataCustomer.filter(val=>{
+                return (!this.formInline.user || (val.userName && val.userName.indexOf(this.formInline.user) !== -1) || (val.userPhone && val.userPhone.indexOf(this.formInline.user) !== -1)) && 
+                (!this.formInline.customer || val.name.indexOf(this.formInline.customer) !== -1 || val.phone.indexOf(this.formInline.customer) !== -1) && 
+                (this.formInline.distribution === 0 || (this.formInline.distribution === 1 && !!val.userPhone) || (this.formInline.distribution === 2 && !val.userPhone)) 
+            })
+        } else if(this.activeName === 'second'){
+            this.tableData = this.tableDataUser.filter(val=>{
+                return (!this.formInline.user || (val.userName && val.userName.indexOf(this.formInline.user) !== -1) || (val.phone && val.phone.indexOf(this.formInline.user) !== -1)) 
+            })
+        } else{
+            this.tableData = []
+        }
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.mainBox {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  flex-direction: column;
+  padding: 20PX;
+  box-sizing: border-box;
+  overflow: hidden;
+  .title {
+    text-align: center;
+    font-size: 20PX;
+    margin-bottom: 20PX;
+    span {
+      float: left;
+    }
+  }
+  .tableBox {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    .tableList{
+        flex: 1;
+    }
+  }
+}
+</style>