Просмотр исходного кода

fix:业务管理前端页面开发

wuguojie 1 год назад
Родитель
Сommit
3af5d6713f

+ 57 - 0
src/router/modules/operation.ts

@@ -0,0 +1,57 @@
+import type { RouteRecordRaw } from 'vue-router'
+
+const Layout = () => import('@/layouts/index.vue')
+
+const routes: RouteRecordRaw = {
+  path: '/operationManagement',
+  component: Layout,
+  redirect: '/operationManagement/operation',
+  name: 'OperationManagement',
+  meta: {
+    title: '业务团队',
+
+  },
+  children: [
+    {
+      path: '/operationDetail',
+      name: 'OperationDetail',
+      component: () => import('@/views/operationManagement/operationDetail.vue'),
+      meta: {
+        title: '业务员详情',
+        sidebar: false,
+      },
+    },
+    {
+      path: 'operation',
+      name: 'Operation',
+      component: () => import('@/views/operationManagement/operation.vue'),
+      meta: {
+        title: '业务员管理',
+      },
+    },{
+      path: 'team',
+      name: 'Team',
+      component: () => import('@/views/operationManagement/team.vue'),
+      meta: {
+        title: '团队管理',
+      },
+    },{
+      path: 'channel',
+      name: 'Channel',
+      component: () => import('@/views/operationManagement/channel.vue'),
+      meta: {
+        title: '渠道管理',
+      },
+    },{
+      path: 'telemarketing',
+      name: 'Telemarketing',
+      component: () => import('@/views/operationManagement/telemarketing.vue'),
+      meta: {
+        title: '电销组管理',
+      },
+    },
+
+  ],
+}
+
+export default routes

+ 10 - 0
src/router/routes.ts

@@ -5,6 +5,7 @@ import generatedRoutes from 'virtual:generated-pages'
 import { setupLayouts } from 'virtual:meta-layouts'
 import MultilevelMenuExample from './modules/multilevel.menu.example'
 import organizationManagement from './modules/organization'
+import operationManagement from './modules/operation'
 import personnel from './modules/personnel'
 
 // 固定路由(默认路由)
@@ -91,6 +92,15 @@ const asyncRoutes: Route.recordMainRaw[] = [
 
     ],
   },
+  {
+    meta: {
+      title: '业务管理',
+      icon: 'i-uim:box',
+    },
+    children: [
+      operationManagement
+    ],
+  },
   {
     meta: {
       title: '租户运营',

+ 11 - 0
src/views/operationManagement/channel.vue

@@ -0,0 +1,11 @@
+<template>
+  <div>channel</div>
+</template>
+
+<script setup>
+
+</script>
+
+<style scoped>
+
+</style>

+ 51 - 0
src/views/operationManagement/modules/addCard.vue

@@ -0,0 +1,51 @@
+<template>
+  <div>
+    <el-form ref="BankRef" :rules="bankRules" :model="bankForm" label-width="80">
+      <el-form-item prop="name" label="姓名">
+        <el-input v-model="bankForm.name" disabled></el-input>
+      </el-form-item>
+      <el-form-item prop="bank" label="银行">
+        <el-select v-model="bankForm.bank">
+          <el-option key="1" value="银行1"></el-option>
+        </el-select>
+      </el-form-item>
+      <el-form-item prop="card" label="银行卡号">
+        <el-input v-model="bankForm.card"></el-input>
+      </el-form-item>
+      <el-form-item prop="bankName" label="开户行">
+        <el-input v-model="bankForm.bankName"></el-input>
+      </el-form-item>
+      <el-form-item prop="photo" label="照片">
+        <ImageUpload action="#" :ext="['png','jpg','jpeg']" :size="5"></ImageUpload>
+      </el-form-item>
+    </el-form>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+let bankForm = ref({
+  name: '',
+  bank: '',
+  card: '',
+  bankName: '',
+  photo: ''
+})
+const bankRules = {
+  name: [
+    { required: true, message: '请填写姓名', trigger: 'blur' }
+  ],
+  card: [
+    { required: true, message: '请填写银行卡号', trigger: 'blur' }
+  ],
+  bankName: [
+    { required: true, message: '请填写开户行', trigger: 'blur' }
+  ],
+}
+
+</script>
+
+<style scoped lang="scss">
+
+</style>

+ 569 - 0
src/views/operationManagement/modules/addOperation.vue

@@ -0,0 +1,569 @@
+<template>
+  <div>
+    <el-form
+      :model="operationForm"
+      ref="OperationFormRef"
+      :rules="operationRules"
+      label-width="120"
+    >
+      <el-descriptions title="基本信息">
+        <el-descriptions-item>
+          <template #default>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="type" label="业务员类型">
+                  <el-select v-model="operationForm" placeholder="请选择业务员类型">
+                    <el-option key="1" value="类型1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="team" label="所属团队">
+                  <el-select v-model="operationForm" placeholder="请选择所属团队">
+                    <el-option key="1" value="团队1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="name" label="姓名">
+                  <el-input v-model="operationForm" placeholder="请填写姓名"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="telephone" label="手机号">
+                  <el-input v-model="operationForm" placeholder="请填写手机号"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="organization" label="所属机构">
+                  <el-select v-model="operationForm" placeholder="请选择所属机构">
+                    <el-option key="1" value="机构1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="number" label="证件号">
+                  <el-input v-model="operationForm" placeholder="请填写证件号"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="startTime" label="证件有效期始">
+                  <el-date-picker
+                    v-model="operationForm"
+                    type="date"
+                    placeholder="请选择"
+                    style="width: 100%"
+                  />
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="endTime" label="证件有效期止">
+                  <el-date-picker
+                    v-model="operationForm"
+                    type="date"
+                    placeholder="请选择"
+                    style="width: 100%"
+                  />
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </template>
+        </el-descriptions-item>
+      </el-descriptions>
+      <el-descriptions title="其他信息">
+        <el-descriptions-item>
+          <template #default>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="name" label="管理人">
+                  <el-input v-model="operationForm" placeholder="请填写管理人"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="telephone" label="管理人工号">
+                  <el-input v-model="operationForm" placeholder="请填写管理人工号"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="name" label="推荐人">
+                  <el-input v-model="operationForm" placeholder="请填写推荐人"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="telephone" label="推荐人工号">
+                  <el-input v-model="operationForm" placeholder="请填写推荐人工号"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </template>
+        </el-descriptions-item>
+      </el-descriptions>
+      <el-descriptions title="资料附件">
+        <el-descriptions-item>
+          <template #default>
+            <el-form-item prop="" label="身份证(人像面)" label-width="150">
+              <el-upload v-if="!IDCardFront" action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 1)">
+                <el-button link type="primary">上传</el-button>
+              </el-upload>
+              <div class="fileInfo" v-else>
+                <div class="fileName">{{ IDCardFrontName }}</div>
+                <div class="fileBtn">
+                  <el-upload action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 1)" style="display: flex; align-items: center">
+                    <el-icon class="btn-icon"><Upload /></el-icon>
+                  </el-upload>
+                  <el-icon class="btn-icon" @click="imageView(1)"><View /></el-icon>
+                  <el-icon class="btn-icon"><Download /></el-icon>
+                  <el-icon class="btn-icon"><Delete /></el-icon>
+                </div>
+              </div>
+            </el-form-item>
+            <el-form-item prop="" label="身份证(国徽面)" label-width="150">
+              <el-upload v-if="!IDCardBack" action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 2)">
+                <el-button link type="primary">上传</el-button>
+              </el-upload>
+              <div class="fileInfo" v-else>
+                <div class="fileName">{{ IDCardBackName }}</div>
+                <div class="fileBtn">
+                  <el-upload action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 2)" style="display: flex; align-items: center">
+                    <el-icon class="btn-icon"><Upload /></el-icon>
+                  </el-upload>
+                  <el-icon class="btn-icon" @click="imageView(2)"><View /></el-icon>
+                  <el-icon class="btn-icon"><Download /></el-icon>
+                  <el-icon class="btn-icon"><Delete /></el-icon>
+                </div>
+              </div>
+            </el-form-item>
+            <el-form-item prop="" label="展业资格证" label-width="150">
+              <el-upload v-if="!certification" action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 3)">
+                <el-button link type="primary">上传</el-button>
+              </el-upload>
+              <div class="fileInfo" v-else>
+                <div class="fileName">{{ certificationName }}</div>
+                <div class="fileBtn">
+                  <el-upload action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 3)" style="display: flex; align-items: center">
+                    <el-icon class="btn-icon"><Upload /></el-icon>
+                  </el-upload>
+                  <el-icon class="btn-icon" @click="imageView(3)"><View /></el-icon>
+                  <el-icon class="btn-icon"><Download /></el-icon>
+                  <el-icon class="btn-icon"><Delete /></el-icon>
+                </div>
+              </div>
+            </el-form-item>
+          </template>
+        </el-descriptions-item>
+      </el-descriptions>
+      <el-divider />
+      <el-button v-if="!recordShow" link type="primary" icon="plus" @click="recordShow = !recordShow">填写人事档案(选填)</el-button>
+      <el-button v-else link type="primary" icon="ArrowUp" @click="recordShow = !recordShow">收起人事档案(选填)</el-button>
+      <br/><br/>
+      <el-descriptions title="个人信息" v-show="recordShow">
+        <el-descriptions-item>
+          <template #default>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="sex" label="性别">
+                  <el-select v-model="operationForm" placeholder="请选择性别">
+                    <el-option key="1" value="类型1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="born" label="出生日期">
+                  <el-date-picker
+                    v-model="operationForm"
+                    type="date"
+                    placeholder="请选择"
+                    style="width: 100%"
+                  />
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="type" label="民族">
+                  <el-select v-model="operationForm" placeholder="请选择业务员类型">
+                    <el-option key="1" value="类型1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="team" label="户籍">
+                  <el-input v-model="operationForm" placeholder="请填写户籍"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="type" label="婚姻状况">
+                  <el-select v-model="operationForm" placeholder="请选择婚姻状况">
+                    <el-option key="1" value="类型1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="team" label="政治面貌">
+                  <el-select v-model="operationForm" placeholder="请选择政治面貌">
+                    <el-option key="1" value="团队1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="type" label="健康状况">
+                  <el-select v-model="operationForm" placeholder="请选择健康状况">
+                    <el-option key="1" value="类型1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="team" label="居住地区">
+                  <el-select v-model="operationForm" placeholder="请选择居住地区">
+                    <el-option key="1" value="团队1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="team" label="详细地址">
+                  <el-input v-model="operationForm" placeholder="请填写详细地址"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="team" label="邮政编码">
+                  <el-input v-model="operationForm" placeholder="请填写邮政编码"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </template>
+        </el-descriptions-item>
+      </el-descriptions>
+      <el-descriptions title="学历信息" v-show="recordShow">
+        <el-descriptions-item>
+          <template #default>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="sex" label="学历">
+                  <el-select v-model="operationForm" placeholder="请选择学历">
+                    <el-option key="1" value="类型1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="born" label="毕业时间">
+                  <el-date-picker
+                    v-model="operationForm"
+                    type="date"
+                    placeholder="请选择"
+                    style="width: 100%"
+                  />
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="type" label="毕业院校">
+                  <el-input v-model="operationForm" placeholder="请填写毕业院校"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="team" label="是否计算机专业">
+                  <el-select v-model="operationForm" placeholder="请选择是否计算机专业">
+                    <el-option key="1" value="类型1"></el-option>
+                  </el-select>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </template>
+        </el-descriptions-item>
+      </el-descriptions>
+      <el-descriptions title="紧急联系人信息" v-show="recordShow">
+        <el-descriptions-item>
+          <template #default>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="team" label="姓名">
+                  <el-input v-model="operationForm" placeholder="请填写姓名"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="team" label="手机号">
+                  <el-input v-model="operationForm" placeholder="请填写手机号"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </template>
+        </el-descriptions-item>
+      </el-descriptions>
+      <el-descriptions title="工资信息" v-show="recordShow">
+        <el-descriptions-item>
+          <template #default>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="team" label="工资">
+                  <el-input v-model="operationForm" placeholder="请填写工资"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="team" label="工资等级">
+                  <el-input v-model="operationForm" placeholder="请填写工资等级"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+            <el-row :gutter="20">
+              <el-col :span="10">
+                <el-form-item prop="team" label="银行卡号">
+                  <el-input v-model="operationForm" placeholder="请填写银行卡号"></el-input>
+                </el-form-item>
+              </el-col>
+              <el-col :span="10">
+                <el-form-item prop="team" label="开户行">
+                  <el-input v-model="operationForm" placeholder="请填写开户行"></el-input>
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </template>
+        </el-descriptions-item>
+      </el-descriptions>
+      <el-divider v-show="recordShow" />
+      <el-descriptions v-show="recordShow" title="其它附件">
+        <el-descriptions-item>
+          <template #default>
+            <el-form-item prop="" label="劳动合同" label-width="150">
+              <el-upload v-if="!contract" action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 4)">
+                <el-button link type="primary">上传</el-button>
+              </el-upload>
+              <div class="fileInfo" v-else>
+                <div class="fileName">{{ contractName }}</div>
+                <div class="fileBtn">
+                  <el-upload action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 4)" style="display: flex; align-items: center">
+                    <el-icon class="btn-icon"><Upload /></el-icon>
+                  </el-upload>
+                  <el-icon class="btn-icon" @click="imageView(4)"><View /></el-icon>
+                  <el-icon class="btn-icon"><Download /></el-icon>
+                  <el-icon class="btn-icon"><Delete /></el-icon>
+                </div>
+              </div>
+            </el-form-item>
+            <el-form-item prop="" label="应聘表" label-width="150">
+              <el-upload v-if="!applicant" action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 5)">
+                <el-button link type="primary">上传</el-button>
+              </el-upload>
+              <div class="fileInfo" v-else>
+                <div class="fileName">{{ applicantName }}</div>
+                <div class="fileBtn">
+                  <el-upload action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 5)" style="display: flex; align-items: center">
+                    <el-icon class="btn-icon"><Upload /></el-icon>
+                  </el-upload>
+                  <el-icon class="btn-icon" @click="imageView(5)"><View /></el-icon>
+                  <el-icon class="btn-icon"><Download /></el-icon>
+                  <el-icon class="btn-icon"><Delete /></el-icon>
+                </div>
+              </div>
+            </el-form-item>
+            <el-form-item prop="" label="定薪表" label-width="150">
+              <el-upload v-if="!decidePay" action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 6)">
+                <el-button link type="primary">上传</el-button>
+              </el-upload>
+              <div class="fileInfo" v-else>
+                <div class="fileName">{{ decidePayName }}</div>
+                <div class="fileBtn">
+                  <el-upload action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 6)" style="display: flex; align-items: center">
+                    <el-icon class="btn-icon"><Upload /></el-icon>
+                  </el-upload>
+                  <el-icon class="btn-icon" @click="imageView(6)"><View /></el-icon>
+                  <el-icon class="btn-icon"><Download /></el-icon>
+                  <el-icon class="btn-icon"><Delete /></el-icon>
+                </div>
+              </div>
+            </el-form-item>
+            <el-form-item prop="" label="离职表" label-width="150">
+              <el-upload v-if="!dimission" action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 7)">
+                <el-button link type="primary">上传</el-button>
+              </el-upload>
+              <div class="fileInfo" v-else>
+                <div class="fileName">{{ dimissionName }}</div>
+                <div class="fileBtn">
+                  <el-upload action="#" :show-file-list="false" accept=".png, .jpg, .jpeg" @change="uploadImage($event, 7)" style="display: flex; align-items: center">
+                    <el-icon class="btn-icon"><Upload /></el-icon>
+                  </el-upload>
+                  <el-icon class="btn-icon" @click="imageView(7)"><View /></el-icon>
+                  <el-icon class="btn-icon"><Download /></el-icon>
+                  <el-icon class="btn-icon"><Delete /></el-icon>
+                </div>
+              </div>
+            </el-form-item>
+          </template>
+        </el-descriptions-item>
+      </el-descriptions>
+    </el-form>
+    <div class="image-view" v-if="imageShow" @click="imageShow = false">
+      <img :src="imageUrl" />
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+// 添加/编辑业务员表单
+let operationForm = ref({
+
+})
+// 添加/编辑业务员表单校验
+let operationRules = ref({
+
+})
+// 身份证人像面
+let IDCardFrontName = ref('')
+let IDCardFront = ref('')
+// 身份证国徽面
+let IDCardBackName = ref('')
+let IDCardBack = ref('')
+// 展业资格证
+let certificationName = ref('')
+let certification = ref('')
+// 劳务合同
+let contractName = ref('')
+let contract = ref('')
+// 应聘表
+let applicantName = ref('')
+let applicant = ref('')
+// 定薪表
+let decidePayName = ref('')
+let decidePay = ref('')
+// 离职表
+let dimissionName = ref('')
+let dimission = ref('')
+// 图片预览地址
+let imageShow = ref(false)
+let imageUrl = ref('')
+
+// 上传图片
+const uploadImage = (file, type) => {
+  let files = file.raw
+  let url = window.URL.createObjectURL(files); //转临时路径
+  console.log(123123123, file, type)
+  switch (type) {
+    case 1:
+      IDCardFrontName.value = files.name
+      IDCardFront.value = url
+      break;
+    case 2:
+      IDCardBackName.value = files.name
+      IDCardBack.value = url
+      break;
+    case 3:
+      certificationName.value = files.name
+      certification.value = url
+      break;
+    case 4:
+      contractName.value = files.name
+      contract.value = url
+      break;
+    case 5:
+      applicantName.value = files.name
+      applicant.value = url
+      break;
+    case 6:
+      decidePayName.value = files.name
+      decidePay.value = url
+      break;
+    case 7:
+      dimissionName.value = files.name
+      dimission.value = url
+      break;
+  }
+  const params = new FormData(); // 声明formData数据类型
+  params.append("multipartFile", files);
+  params.append("type", "image");
+}
+
+// 人事档案
+let recordShow = ref(false)
+
+const imageView = (type) => {
+  imageShow.value = true
+  switch (type) {
+    case 1:
+      imageUrl.value = IDCardFront.value
+      break;
+    case 2:
+      imageUrl.value = IDCardBack.value
+      break;
+    case 3:
+      imageUrl.value = certification.value
+      break;
+    case 4:
+      imageUrl.value = contract.value
+      break;
+    case 5:
+      imageUrl.value = applicant.value
+      break;
+    case 6:
+      imageUrl.value = decidePay.value
+      break;
+    case 7:
+      imageUrl.value = dimission.value
+      break;
+  }
+}
+</script>
+
+<style scoped lang="scss">
+.fileInfo{
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+  padding: 2px 20px;
+  border-radius: 5px;
+  margin: 0 10px;
+  &:hover{
+    background: #ccc;
+  }
+  .fileName{
+    width: 200px;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    white-space: nowrap;
+  }
+  .fileBtn{
+    display: flex;
+    align-items: center;
+    .btn-icon{
+      margin: 0 10px;
+      font-size: 16px;
+      cursor: pointer;
+      &:hover{
+        color: #00a0f4;
+      }
+    }
+  }
+}
+.image-view{
+  position: absolute;
+  top: 0;
+  left: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0,0,0,.6);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  z-index: 9999;
+  img{
+    width: 800px;
+    height: 800px;
+    border-radius: 5px;
+  }
+}
+</style>

+ 125 - 0
src/views/operationManagement/modules/allocation.vue

@@ -0,0 +1,125 @@
+<template>
+  <div class="allocation">
+    <el-input v-model="searchValue" style="width: 240px" placeholder="输入姓名、手机号、工号查找">
+      <template #prefix>
+        <el-icon class="el-input__icon" @click="handleSearch"><Search /></el-icon>
+      </template>
+    </el-input>
+    <el-row :gutter="20" class="allocation-content">
+      <el-col :span="12" style="padding: 10px">
+        <el-tree
+          :data="data"
+          @node-click="handleNodeClick"
+        />
+      </el-col>
+      <el-col :span="12" style="padding: 10px">
+        <el-radio-group v-model="radioValue" class="allocation-radio">
+          <el-radio value="1" size="large">
+            <template #default>
+              <div>姓名1</div>
+              <div>99140109M60D01001</div>
+            </template>
+          </el-radio>
+          <el-radio value="1" size="large">
+            <template #default>
+              <div>姓名2</div>
+              <div>99140109M60D01001</div>
+            </template>
+          </el-radio>
+        </el-radio-group>
+      </el-col>
+    </el-row>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+
+let searchValue = ref('')
+const handleSearch = () => {
+
+}
+
+let data = [
+  {
+    label: 'Level one 1',
+    children: [
+      {
+        label: 'Level two 1-1',
+        children: [
+          {
+            label: 'Level three 1-1-1',
+          },
+        ],
+      },
+    ],
+  },
+  {
+    label: 'Level one 2',
+    children: [
+      {
+        label: 'Level two 2-1',
+        children: [
+          {
+            label: 'Level three 2-1-1',
+          },
+        ],
+      },
+      {
+        label: 'Level two 2-2',
+        children: [
+          {
+            label: 'Level three 2-2-1',
+          },
+        ],
+      },
+    ],
+  },
+  {
+    label: 'Level one 3',
+    children: [
+      {
+        label: 'Level two 3-1',
+        children: [
+          {
+            label: 'Level three 3-1-1',
+          },
+        ],
+      },
+      {
+        label: 'Level two 3-2',
+        children: [
+          {
+            label: 'Level three 3-2-1',
+          },
+        ],
+      },
+    ],
+  },
+]
+const handleNodeClick = (data) => {
+  console.log(data)
+}
+
+let radioValue = ref('')
+
+</script>
+
+<style scoped lang="scss">
+.allocation {
+  .allocation-content {
+    width: 100%;
+    margin: 20px;
+    border: 1px solid #ccc;
+    border-radius: 5px;
+    .allocation-radio{
+      display: flex;
+      flex-direction: column;
+      :deep(.el-radio) {
+        margin-right: 0;
+        margin-top: 10px;
+      }
+    }
+  }
+}
+</style>

+ 403 - 0
src/views/operationManagement/operation.vue

@@ -0,0 +1,403 @@
+<template>
+  <div class="operation">
+    <el-form
+      class="operationForm"
+      ref="OperationRef"
+      :model="form"
+      label-width="auto"
+    >
+      <el-row :gutter="20">
+        <el-col :span="8">
+          <el-form-item label="业务员" class="formItem">
+            <el-input v-model="form.operation" placeholder="输入姓名、手机号、工号查找"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="归属机构" class="formItem">
+            <el-cascader style="width: 100%" v-model="form.organization" :options="options" />
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="类型" class="formItem">
+            <el-select v-model="form.type">
+              <el-option key="1" value="type1"></el-option>
+              <el-option key="2" value="type2"></el-option>
+              <el-option key="3" value="type3"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="20">
+        <el-col :span="8">
+          <el-form-item label="所属" class="formItem">
+            <el-input v-model="form.belong" placeholder="渠道、团队、电销组名称查找"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="人员状态" class="formItem">
+            <el-select v-model="form.staffState">
+              <el-option key="1" value="type1"></el-option>
+              <el-option key="2" value="type2"></el-option>
+              <el-option key="3" value="type3"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-form-item label="账号状态" class="formItem">
+            <el-select v-model="form.accountState">
+              <el-option key="1" value="type1"></el-option>
+              <el-option key="2" value="type2"></el-option>
+              <el-option key="3" value="type3"></el-option>
+            </el-select>
+          </el-form-item>
+        </el-col>
+      </el-row>
+      <el-row :gutter="20">
+        <el-col :span="8">
+          <el-form-item label="管理人" class="formItem">
+            <el-input v-model="form.person" placeholder="管理人姓名、工号"></el-input>
+          </el-form-item>
+        </el-col>
+        <el-col :span="8">
+          <el-button type="primary" @click="search()">查询</el-button>
+          <el-button type="primary" plain @click="reset()">重置</el-button>
+        </el-col>
+      </el-row>
+    </el-form>
+    <el-row :gutter="20" style="margin: 20px 0" flex>
+      <el-col :span="3" style="display: flex">
+        <el-checkbox @change="selectAll"></el-checkbox>&nbsp;
+        <el-select class="select-all" placeholder="全选" v-model="selectType" style="width: 120px">
+          <el-option key="all" value="选中所有数据"></el-option>
+          <el-option key="cur" value="选中本页数据"></el-option>
+        </el-select>
+      </el-col>
+      <el-col :span="2">
+        <el-button type="primary" icon="plus" @click="addNumber">添加成员</el-button>
+      </el-col>
+      <el-col :span="2">
+        <el-dropdown trigger="click" placement="bottom" @command="dropdownCommand">
+          <el-button>批量管理</el-button>
+          <template #dropdown>
+            <el-dropdown-menu>
+              <el-dropdown-item command="启用">启用</el-dropdown-item>
+              <el-dropdown-item command="禁用">禁用</el-dropdown-item>
+              <el-dropdown-item command="删除">删除</el-dropdown-item>
+              <el-dropdown-item command="分配管理人">分配管理人</el-dropdown-item>
+            </el-dropdown-menu>
+          </template>
+        </el-dropdown>
+      </el-col>
+    </el-row>
+    <el-table
+      :data="tableData"
+      height="460"
+    >
+      <el-table-column type="selection" width="55"></el-table-column>
+      <el-table-column label="姓名" prop="name" width="80"></el-table-column>
+      <el-table-column label="手机号" prop="" width="150"></el-table-column>
+      <el-table-column label="工号" prop="" width="200"></el-table-column>
+      <el-table-column label="类型" prop="" width="100"></el-table-column>
+      <el-table-column label="归属" prop="" width="200"></el-table-column>
+      <el-table-column label="所属机构" prop="" width="200"></el-table-column>
+      <el-table-column label="人员状态" prop="" width="150"></el-table-column>
+      <el-table-column label="账号状态" prop="" width="150"></el-table-column>
+      <el-table-column label="管理人" prop="" width="150"></el-table-column>
+      <el-table-column label="管理人工号" prop="" width="200"></el-table-column>
+      <el-table-column label="推荐人" prop="" width="150"></el-table-column>
+      <el-table-column label="推荐人工号" prop="" width="200"></el-table-column>
+      <el-table-column fixed="right" label="操作" width="120">
+        <template #default="scope">
+          <div style="display: flex; align-items: center; justify-content: space-between">
+            <a style="color: #409EFF; cursor: pointer" @click="showDetail(scope)">详情</a>&nbsp;
+            <el-dropdown placement="bottom" trigger="click" @command="tableDataCommand(scope, $event)">
+              <a style="color: #409EFF; cursor: pointer">更多</a>
+              <template #dropdown>
+                <el-dropdown-menu>
+                  <el-dropdown-item command="编辑">编辑</el-dropdown-item>
+                  <el-dropdown-item command="启用">启用</el-dropdown-item>
+                  <el-dropdown-item command="禁用">禁用</el-dropdown-item>
+                  <el-dropdown-item command="删除">删除</el-dropdown-item>
+                  <el-dropdown-item command="分配管理人">分配管理人</el-dropdown-item>
+                  <el-dropdown-item command="添加银行卡">添加银行卡</el-dropdown-item>
+                </el-dropdown-menu>
+              </template>
+            </el-dropdown>
+          </div>
+        </template>
+      </el-table-column>
+    </el-table>
+    <div style="display: flex; justify-content: flex-end; margin-top: 15px">
+      <el-pagination
+        v-model:current-page="currentPage"
+        v-model:page-size="pageSize"
+        :page-sizes="[10, 20, 30, 40]"
+        layout="total, sizes, prev, pager, next, jumper"
+        :total="400"
+        @size-change="handleSizeChange"
+        @current-change="handleCurrentChange"
+      />
+    </div>
+    <el-dialog
+      v-model="dialogShow"
+      :title="title"
+      width="1000"
+    >
+      <addOperation></addOperation>
+      <template #footer>
+        <div>
+          <el-button plain @click="() => { dialogShow = false }">取消</el-button>
+          <el-button type="primary">确定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <el-dialog
+      v-model="bankCardDialogShow"
+      title="添加银行卡"
+      width="500"
+    >
+      <addCard></addCard>
+      <template #footer>
+        <div>
+          <el-button plain @click="() => { bankCardDialogShow = false }">取消</el-button>
+          <el-button type="primary">确定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <el-dialog
+      v-model="allocationShow"
+      title="分配管理人"
+      width="800"
+    >
+      <allocation></allocation>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import { useRouter } from 'vue-router'
+import addOperation from './modules/addOperation.vue'
+import addCard from './modules/addCard.vue'
+import allocation from './modules/allocation.vue'
+import { ElMessageBox, ElMessage } from 'element-plus'
+import Allocation from "@/views/operationManagement/modules/allocation.vue";
+
+let muRouter = useRouter()
+
+// 查询条件
+let form = ref({
+  operation: '',
+  organization: [],
+  type: '',
+  belong: '',
+  staffState: '',
+  accountState: '',
+  person: ''
+})
+let options = [
+  {
+    value: 'guide',
+    label: 'Guide',
+    children: [
+      {
+        value: 'disciplines',
+        label: 'Disciplines',
+        children: [
+          {
+            value: 'consistency',
+            label: 'Consistency',
+          },
+          {
+            value: 'feedback',
+            label: 'Feedback',
+          },
+          {
+            value: 'efficiency',
+            label: 'Efficiency',
+          },
+          {
+            value: 'controllability',
+            label: 'Controllability',
+          },
+        ],
+      }
+    ]
+  }
+]
+// 获取列表数据
+const init = () => {
+
+}
+// 搜索
+const search = () => {
+
+}
+// 重置
+const reset = () => {
+  form.value = {
+    operation: '',
+    organization: [],
+    type: '',
+    belong: '',
+    staffState: '',
+    accountState: '',
+    person: ''
+  }
+}
+// 外部的全选
+const selectAll = () => {
+
+}
+// 全选的类型
+let selectType = ref('')
+// 批量管理
+const dropdownCommand = (e) => {
+  switch (e) {
+    case '删除':
+      ElMessageBox({
+        title: '删除业务员',
+        message: '确定要删除该业务员吗?',
+        type: 'warning',
+        showCancelButton: true,
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+      }).then(( action ) => {
+
+      }).catch(( action ) => {
+
+      })
+      break;
+    case '禁用':
+      ElMessageBox({
+        title: '禁用业务员',
+        message: '确定要禁用该业务员吗?',
+        type: 'warning',
+        showCancelButton: true,
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+      }).then(( action ) => {
+
+      }).catch(( action ) => {
+
+      })
+      break;
+    case '启用':
+      ElMessage({
+        message: '启用成功!',
+        type: 'success',
+      })
+      break;
+    case '分配管理人':
+      allocationShow.value = true
+      break;
+  }
+}
+// 列表数据
+let tableData = ref([
+  {
+    name: 1
+  }
+])
+// 分页数据
+// 页码
+let currentPage = ref(1)
+// 单页数量
+let pageSize = ref(10)
+// 单页数量变化
+const handleSizeChange = (size) => {
+  pageSize.value = size
+}
+// 页码变化
+const handleCurrentChange = (page) => {
+  currentPage.value = page
+}
+// 详情
+const showDetail = (scope) => {
+  muRouter.push({
+    path: '/operationDetail'
+  })
+}
+
+// 添加银行卡弹框
+let bankCardDialogShow = ref(false)
+
+// 更多
+const tableDataCommand = (scope, e) => {
+  switch (e) {
+    case '编辑':
+      dialogShow.value = true
+      title.value = '编辑'
+      break;
+    case '删除':
+      ElMessageBox({
+        title: '删除业务员',
+        message: '确定要删除该业务员吗?',
+        type: 'warning',
+        showCancelButton: true,
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+      }).then(( action ) => {
+
+      }).catch(( action ) => {
+
+      })
+      break;
+    case '禁用':
+      ElMessageBox({
+        title: '禁用业务员',
+        message: '确定要禁用该业务员吗?',
+        type: 'warning',
+        showCancelButton: true,
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+      }).then(( action ) => {
+
+      }).catch(( action ) => {
+
+      })
+      break;
+    case '启用':
+      ElMessage({
+        message: '启用成功!',
+        type: 'success',
+      })
+      break;
+    case '添加银行卡':
+      bankCardDialogShow.value = true
+      break;
+    case '分配管理人':
+      allocationShow.value = true
+      break;
+  }
+}
+// 添加业务员
+const addNumber = () => {
+  dialogShow.value = true
+  title.value = '添加'
+}
+// 添加/编辑业务员弹框
+let dialogShow = ref(false)
+// 添加/编辑业务员弹框标题
+let title = ref('添加')
+
+// 分配管理人
+let allocationShow = ref(false)
+
+</script>
+
+<style scoped lang="scss">
+.operation{
+  margin: 0 20px;
+  .operationForm{
+    margin: 20px 0;
+  }
+  .formItem{
+    width: 350px;
+  }
+  :deep(.select-all .el-select__wrapper){
+    box-shadow: none;
+    background: none;
+  }
+}
+</style>

+ 365 - 0
src/views/operationManagement/operationDetail.vue

@@ -0,0 +1,365 @@
+<template>
+  <div class="detail">
+    <div class="state">
+      <el-icon :size="20" style="color: red; margin: 3px 10px 0 0;">
+        <CircleClose />
+      </el-icon>
+      <div>
+        <h3>审核不通过</h3>
+        <p>失败原因。如有问题,请联系审核人员或者拨打客服电话400-400-400。</p>
+        <el-button link type="primary" @click="editDetail">修改并重提交</el-button>
+      </div>
+    </div>
+    <div class="info">
+      <el-descriptions>
+        <template #title>
+          <el-row :gutter="20" flex justify="space-between">
+            <el-col :span="12" style="display: flex; align-items: center;">
+              <span class="firstName">w</span>
+              <span class="allName">姓名</span>
+            </el-col>
+            <el-col :span="12" style="display: flex; justify-content: flex-end">
+              <el-button plain @click="checkPass">审核通过</el-button>
+              <el-button plain @click="checkNotPass">审核不通过</el-button>
+              <el-button plain @click="editDetail">编辑</el-button>&nbsp;
+              <el-dropdown trigger="click" @command="handleCommand">
+                <el-button plain>更多</el-button>
+                <template #dropdown>
+                  <el-dropdown-menu>
+                    <el-dropdown-item command="启用">启用</el-dropdown-item>
+                    <el-dropdown-item command="禁用">禁用</el-dropdown-item>
+                    <el-dropdown-item command="删除">删除</el-dropdown-item>
+                    <el-dropdown-item command="分配管理人">分配管理人</el-dropdown-item>
+                  </el-dropdown-menu>
+                </template>
+              </el-dropdown>
+            </el-col>
+          </el-row>
+        </template>
+        <el-descriptions-item label="工号:">工号</el-descriptions-item>
+        <el-descriptions-item label="所属机构:">机构</el-descriptions-item>
+        <el-descriptions-item label="状态:">状态</el-descriptions-item>
+        <el-descriptions-item label="类型:">类型</el-descriptions-item>
+        <el-descriptions-item label="所属团队:">团队</el-descriptions-item>
+        <el-descriptions-item label="创建人:">创建人</el-descriptions-item>
+        <el-descriptions-item label="创建时间:">时间</el-descriptions-item>
+      </el-descriptions>
+      <el-tabs v-model="activeName" class="demo-tabs" @tab-click="(tab) => { activeName = tab }">
+        <el-tab-pane label="基本信息" name="msg">
+          <div class="other">
+            <el-descriptions title="个人信息">
+              <el-descriptions-item label="姓名:">姓名</el-descriptions-item>
+              <el-descriptions-item label="手机号:">手机号</el-descriptions-item>
+              <el-descriptions-item label="证件号:">证件号</el-descriptions-item>
+              <el-descriptions-item label="证件有效期始:">证件有效期始</el-descriptions-item>
+              <el-descriptions-item label="证件有效期止:">证件有效期止</el-descriptions-item>
+            </el-descriptions>
+            <el-descriptions title="其他信息">
+              <el-descriptions-item label="管理人:">管理人</el-descriptions-item>
+              <el-descriptions-item label="管理人工号:">管理人工号</el-descriptions-item>
+              <el-descriptions-item label="推荐人:">推荐人</el-descriptions-item>
+              <el-descriptions-item label="推荐人工号:">推荐人工号</el-descriptions-item>
+            </el-descriptions>
+            <el-descriptions title="银行卡信息">
+              <el-descriptions-item>
+                <template #default>
+                  <el-table
+                    :data="tableData"
+                  >
+                    <el-table-column prop="name" label="姓名"></el-table-column>
+                    <el-table-column prop="" label="开户行"></el-table-column>
+                    <el-table-column prop="" label="卡号"></el-table-column>
+                    <el-table-column prop="" label="开户支行"></el-table-column>
+                    <el-table-column prop="" label="审核状态"></el-table-column>
+                    <el-table-column prop="" label="身份证件照"></el-table-column>
+                    <el-table-column prop="" label="银行卡照"></el-table-column>
+                    <el-table-column label="操作">
+                      <template #default>
+                        <a style="color: #409EFF; cursor: pointer">详情</a>
+                      </template>
+                    </el-table-column>
+                  </el-table>
+                </template>
+              </el-descriptions-item>
+            </el-descriptions>
+            <el-button icon="plus" style="margin-left: 20px" @click="addBankCard">添加银行卡</el-button>
+          </div>
+        </el-tab-pane>
+        <el-tab-pane label="资料附件" name="file">
+          <div class="other">
+            <el-descriptions title="资料附件">
+              <el-descriptions-item>
+                <template #default>
+                  <div class="fileItem">
+                    <span class="label">身份证(人像面)</span>
+                    <div class="fileName">
+                      <span class="file-name">文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名文件名</span>
+                      <el-icon class="file-icon"><View /></el-icon>
+                    </div>
+                  </div>
+                  <div class="fileItem">
+                    <span class="label">身份证(国徽面)</span>
+                    <div class="fileName">
+                      <span class="file-name">文件名</span>
+                      <el-icon class="file-icon"><View /></el-icon>
+                    </div>
+                  </div>
+                  <div class="fileItem">
+                    <span class="label">展业资格证</span>
+                    <div class="fileName">
+                      <span class="file-name">文件名</span>
+                      <el-icon class="file-icon"><View /></el-icon>
+                    </div>
+                  </div>
+                </template>
+              </el-descriptions-item>
+            </el-descriptions>
+          </div>
+        </el-tab-pane>
+      </el-tabs>
+    </div>
+    <el-dialog
+      v-model="bankCardDialogShow"
+      title="添加银行卡"
+      width="500"
+    >
+      <addCard></addCard>
+      <template #footer>
+        <div>
+          <el-button plain @click="() => { bankCardDialogShow = false }">取消</el-button>
+          <el-button type="primary">确定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <el-dialog
+      v-model="dialogShow"
+      title="编辑"
+      width="1000"
+    >
+      <addOperation></addOperation>
+      <template #footer>
+        <div>
+          <el-button plain @click="() => { dialogShow = false }">取消</el-button>
+          <el-button type="primary">确定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <el-dialog
+      v-model="bankCardDialogShow"
+      title="添加银行卡"
+      width="500"
+    >
+      <addCard></addCard>
+      <template #footer>
+        <div>
+          <el-button plain @click="() => { bankCardDialogShow = false }">取消</el-button>
+          <el-button type="primary">确定</el-button>
+        </div>
+      </template>
+    </el-dialog>
+    <el-dialog
+      v-model="allocationShow"
+      title="分配管理人"
+      width="800"
+    >
+      <allocation></allocation>
+    </el-dialog>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { ref } from 'vue'
+import addOperation from './modules/addOperation.vue'
+import addCard from './modules/addCard.vue'
+import allocation from './modules/allocation.vue'
+import {ElMessage, ElMessageBox} from 'element-plus'
+import Allocation from "@/views/operationManagement/modules/allocation.vue";
+
+// 更多
+const handleCommand = (e) => {
+  switch (e) {
+    case '删除':
+      ElMessageBox({
+        title: '删除业务员',
+        message: '确定要删除该业务员吗?',
+        type: 'warning',
+        showCancelButton: true,
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+      }).then(( action ) => {
+
+      }).catch(( action ) => {
+
+      })
+      break;
+    case '禁用':
+      ElMessageBox({
+        title: '禁用业务员',
+        message: '确定要禁用该业务员吗?',
+        type: 'warning',
+        showCancelButton: true,
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+      }).then(( action ) => {
+
+      }).catch(( action ) => {
+
+      })
+      break;
+    case '启用':
+      ElMessage({
+        message: '启用成功!',
+        type: 'success',
+      })
+      break;
+    case '分配管理人':
+      allocationShow.value = true
+      break;
+  }
+}
+// 分配管理人
+let allocationShow = ref(false)
+
+// 银行卡列表数据
+let tableData = ref([
+  {name: 1}
+])
+
+// Tabs切换
+let activeName = ref('msg')
+
+// 添加银行卡弹框
+let bankCardDialogShow = ref(false)
+// 添加银行卡
+const addBankCard = () => {
+  bankCardDialogShow.value = true
+}
+// 审核通过
+const checkPass = () => {
+  ElMessage({
+    message: '审核通过!',
+    type: 'success',
+  })
+}
+// 审核不通过
+const checkNotPass = () => {
+  ElMessageBox({
+    title: '审核不通过',
+    showInput: true,
+    inputPlaceholder: '请输入原因',
+    inputValue: '',
+    showCancelButton: true,
+    confirmButtonText: '确定',
+    cancelButtonText: '取消',
+  }).then(( action ) => {
+
+  }).catch(( action ) => {
+
+  })
+}
+
+// 编辑/修改
+let dialogShow = ref(false)
+const editDetail = () => {
+  dialogShow.value = true
+}
+
+
+</script>
+
+<style scoped lang="scss">
+.detail{
+  margin: 0 10px;
+  .state{
+    border: 1px solid rgba(255,0,0,.3);
+    border-radius: 10px;
+    padding: 10px 20px;
+    background: #FFEFEE;
+    display: flex;
+    margin: 5px 0;
+    h3{
+      font-weight: 500;
+      margin: 0 0 10px;
+      color: rgba(0,0,0,.64);
+    }
+    p{
+      margin: 10px 0;
+      color: #888;
+    }
+  }
+  .info{
+    background: white;
+    padding: 5px 10px;
+    border-radius: 10px;
+    :deep(.el-descriptions__title) {
+      width: 100%;
+    }
+    :deep(.el-descriptions__body) {
+      padding-left: 60px;
+    }
+    :deep(.el-tabs__nav-wrap) {
+      padding: 0 25px;
+    }
+    :deep(.el-tabs__item) {
+      font-size: 18px;
+    }
+    .firstName{
+      width: 30px;
+      height: 30px;
+      text-align: center;
+      line-height: 30px;
+      border-radius: 15px;
+      background: #409EFF;
+      color: white;
+      font-size: 18px;
+      margin-right: 10px;
+      margin-left: 20px;
+    }
+    .allName{
+      font-size: 14px;
+    }
+    .other{
+      .fileItem{
+        display: flex;
+        justify-content: flex-start;
+        align-items: center;
+        margin: 10px 0;
+        .label{
+          width: 200px;
+        }
+        .fileName{
+          width: calc(100% - 500px);
+          line-height: 30px;
+          display: flex;
+          align-items: center;
+          padding: 0 20px;
+          &:hover{
+            background: #ccc;
+          }
+          .file-name{
+            width: 200px;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+            margin-right: 20px;
+          }
+          .file-icon{
+            display: flex;
+            justify-content: flex-start;
+            align-items: center;
+            height: 30px;
+            cursor: pointer;
+            &:hover{
+              color: #00a0f4;
+            }
+          }
+        }
+      }
+      :deep(.el-descriptions__title) {
+        padding-left: 20px;
+        font-size: 16px;
+      }
+    }
+  }
+}
+</style>

+ 13 - 0
src/views/operationManagement/team.vue

@@ -0,0 +1,13 @@
+<template>
+  <div class="team">
+
+  </div>
+</template>
+
+<script setup lang="ts">
+
+</script>
+
+<style scoped lang="scss">
+
+</style>

+ 11 - 0
src/views/operationManagement/telemarketing.vue

@@ -0,0 +1,11 @@
+<template>
+  <div>telemarketing</div>
+</template>
+
+<script setup>
+
+</script>
+
+<style scoped>
+
+</style>