fix

virgo.wzfrontend/console/src/assets/scss/index.scss

@@ -57,6 +57,16 @@
 	white-space: nowrap;
 	text-overflow: ellipsis;
 }
+.el-switch {
+	.el-switch__core {
+		background: rgba(255, 255, 255, 0.2);
+		border-color: rgba(255, 255, 255, 0.2);
+	}
+}
+
+.el-switch.is-checked .el-switch__core {
+	background: $--color-primary;
+}
 
 .hui-flex {
 	width: 100%;

virgo.wzfrontend/console/src/components/common/selectHouse.vue

@@ -1,21 +1,33 @@
 <template>
 	<div class="select-house">
-		<el-cascader :options="options" :props="props" collapse-tags clearable></el-cascader>
+		<el-cascader ref="cascader" v-model="selectValue" :options="options" :props="props" collapse-tags clearable
+			@change="change">
+		</el-cascader>
 	</div>
 </template>
 
 <script>
 	import {
-		getProjectDetailById,
+		getHouseTree,
 	} from '@/httpApi/space'
+	import {
+		roomList
+	} from '@/uitls'
+
 	export default {
 		name: 'selectHouse',
+		props: ['ids'],
 		data() {
 			return {
 				options: [],
 				props: {
-					multiple: true
+					multiple: true,
+					value: 'id',
+					label: 'optionName'
 				},
+				selectNodeId: '',
+				selectValue: [],
+				isRequest: false
 			}
 		},
 		created() {
@@ -23,12 +35,62 @@
 		},
 		methods: {
 			init() {
-				getProjectDetailById(this.$store.getters.project.id).then(res => {
+				if (this.isRequest) return;
+				this.isRequest = true;
+				getHouseTree(this.$store.getters.project.id).then(res => {
 					if (res.state) {
-						console.log(res.data);
+						this.options = roomList(res.data.projectItemList || []);
+						this.isRequest = false;
+						if (this.ids) this.initValue();
 					}
 				})
 			},
+			initValue() {
+				let ids = this.ids.split(','),
+					idsBox = [];
+				for (var i = 0; i < ids.length; i++) {
+					idsBox.push(this.findParentIds(this.options, ids[i]));
+				}
+				this.selectValue = idsBox;
+			},
+			change(val) {
+				let node = this.$refs.cascader.getCheckedNodes(true).map(node => node.data.roomId);
+				this.selectNodeId = node.join(',');
+			},
+			findParentIds(dataSource, nodeId) {
+				const parentIds = []; // 用于存储所有父节点ID的数组
+				let nodeRoomId;
+				// 定义一个递归函数，用于遍历整棵树并查找子节点的所有父节点
+				function traverse(node, nodeId) {
+					if (node.roomId == nodeId) { // 如果当前节点的ID等于子节点的ID，则表示已经找到了子节点，可以开始向上查找父节点
+						nodeRoomId = node.id;
+						return true; // 返回true表示已经找到了子节点
+					}
+					if (node.children) { // 如果当前节点有子节点，则继续遍历子节点
+						for (const childNode of node.children) {
+							if (traverse(childNode, nodeId)) { // 如果在子节点中找到了子节点的父节点，则将当前节点的ID添加到父节点ID数组中，并返回true表示已经找到了子节点
+								parentIds.unshift(node.id);
+								return true;
+							}
+						}
+					}
+					return false; // 如果当前节点不是子节点的父节点，则返回false
+				}
+				// 从根节点开始遍历整棵树，并调用递归函数查找子节点的所有父节点
+				for (const node of dataSource) {
+					if (traverse(node, nodeId)) { // 如果在当前节点的子树中找到了子节点的父节点，则直接退出循环
+						break;
+					}
+				}
+				parentIds.push(nodeRoomId);
+				return parentIds; // 返回所有父节点ID的数组
+			}
+		},
+		watch: {
+			ids(newValue, oldValue) {
+				if (this.options.length === 0) return this.init();
+				this.initValue();
+			}
 		},
 	}
 </script>

virgo.wzfrontend/console/src/components/work/crm/agent/detail.vue

@@ -0,0 +1,67 @@
+<template>
+	<div class="hui-detail">
+		<div class="hui-detail-title">基础信息</div>
+		<div class="hui-detail-content">
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">姓名</div>
+				<div class="hui-detail-value">{{detail.name}}</div>
+			</div>
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">联系电话</div>
+				<div class="hui-detail-value">{{detail.phone}}</div>
+			</div>
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">主营商圈</div>
+				<div class="hui-detail-value">{{detail.primaryArea}}</div>
+			</div>
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">备注</div>
+				<div class="hui-detail-value">{{detail.remark}}</div>
+			</div>
+		</div>
+		<div class="hui-detail-title">经纪人名片</div>
+		<div class="hui-detail-content hui-detail-image">
+			<upload ref="upload" :list="detail.businessCard ? JSON.parse(detail.businessCard) : []" type="preview">
+			</upload>
+		</div>
+	</div>
+</template>
+
+<script>
+	import {
+		getAgentDetailById
+	} from '@/httpApi/crm'
+	import upload from '@/components/common/upload'
+	export default {
+		props: ['detailId'],
+		data() {
+			return {
+				detail: {
+					name: '',
+					phone: '',
+					primaryArea: '',
+					remark: '',
+					businessCard: ''
+				}
+			}
+		},
+		created() {
+			if (this.detailId) this.init();
+		},
+		methods: {
+			init() {
+				getAgentDetailById(this.detailId).then(res => {
+					if (res.state) {
+						this.detail = res.data;
+					}
+				})
+			}
+		},
+		components: {
+			upload
+		},
+	}
+</script>
+<style lang="scss">
+
+</style>

virgo.wzfrontend/console/src/components/work/crm/agent/edit.vue

@@ -0,0 +1,108 @@
+<template>
+	<div class="hui-flex hui-dialog">
+		<div class="hui-flex-box hui-dialog-content">
+			<el-form ref="agentForm" label-position="top" :model="agentForm">
+				<el-form-item label="经纪人姓名" prop="name" :rules="[{required: true, message: '请输入经纪人姓名'}]">
+					<el-input type="text" v-model="agentForm.name" placeholder="请输入经纪人姓名"></el-input>
+				</el-form-item>
+				<el-form-item label="联系电话" prop="phone" :rules="agentRulers.phone">
+					<el-input type="text" v-model="agentForm.phone" placeholder="请输入联系电话"></el-input>
+				</el-form-item>
+				<el-form-item label="主营商圈" prop="primaryArea">
+					<el-input type="text" v-model="agentForm.primaryArea" placeholder="请输入主营商圈"></el-input>
+				</el-form-item>
+				<el-form-item label="备注" class="hui-textarea">
+					<el-input type="textarea" v-model="agentForm.remark" placeholder="请输入备注" resize="none">
+					</el-input>
+				</el-form-item>
+				<el-form-item label="经纪人名片" class="hui-textarea">
+					<upload ref="upload" :list="responsibility" type="insert"></upload>
+				</el-form-item>
+			</el-form>
+		</div>
+		<div class="hui-dialog-submit">
+			<el-button size="medium" @click="$emit('callback')">取 消</el-button>
+			<el-button size="medium" type="primary" @click="submit">保 存</el-button>
+		</div>
+	</div>
+</template>
+
+<script>
+	import {
+		insertAgent,
+		getAgentDetailById,
+		updateAgent
+	} from '@/httpApi/crm'
+	import upload from '@/components/common/upload'
+	export default {
+		props: ['isUpdate', 'detailId'],
+		data() {
+			return {
+				agentForm: {
+					name: '',
+					phone: '',
+					primaryArea: '',
+					remark: '',
+					businessCard: ''
+				},
+				agentRulers: {
+					phone: [{
+						required: true,
+						message: '请输入手机号',
+						trigger: 'blur'
+					}, {
+						validator: (rule, value, callback) => {
+							if (!/^1[123456789]\d{9}$/.test(value)) {
+								callback(new Error("请输入正确的手机号"));
+							} else {
+								callback()
+							}
+						},
+						trigger: 'blur'
+					}],
+				},
+				responsibility: []
+			}
+		},
+		created() {
+			this.agentForm['organizationId'] = this.$store.getters.user.organization.id;
+			if (this.isUpdate) {
+				getAgentDetailById(this.detailId).then(res => {
+					if (res.state) {
+						this.agentForm = res.data;
+						if (this.agentForm.businessCard) this.responsibility = JSON.parse(this.agentForm
+							.businessCard);
+					}
+				})
+			}
+		},
+		components: {
+			upload
+		},
+		methods: {
+			submit() {
+				this.$refs.agentForm.validate((valid) => {
+					if (valid) {
+						let postData = JSON.parse(JSON.stringify(this.agentForm));
+						postData['businessCard'] = JSON.stringify(this.$refs.upload.fileList);
+						if (this.isUpdate) {
+							updateAgent(postData).then(this.successFunc);
+						} else {
+							insertAgent(postData).then(this.successFunc);
+						}
+					} else {
+						return false;
+					}
+				});
+			},
+			successFunc(res) {
+				if (res.state) {
+					this.$message.success('操作成功');
+					this.$emit('callback', 'init');
+				}
+			}
+		}
+	}
+</script>
+
+<style lang="scss"></style>

virgo.wzfrontend/console/src/components/work/crm/customer/edit.vue

@@ -54,7 +54,7 @@
 					</el-date-picker>
 				</el-form-item>
 				<el-form-item label="首次带看房源" prop="firsTimeRoom">
-					<select-house></select-house>
+					<select-house ref="selectHouse" :ids="customerForm.firsTimeRoom"></select-house>
 				</el-form-item>
 				<el-form-item label="备注" class="hui-textarea">
 					<el-input type="textarea" v-model="customerForm.remark" placeholder="请输入备注" resize="none">
@@ -132,6 +132,7 @@
 				this.$refs.customerForm.validate((valid) => {
 					if (valid) {
 						let postData = JSON.parse(JSON.stringify(this.customerForm));
+						postData['firsTimeRoom'] = this.$refs.selectHouse.selectNodeId;
 						if (this.isUpdate) {
 							updateCustomer(postData).then(this.successFunc);
 						} else {

virgo.wzfrontend/console/src/httpApi/crm.js

@@ -67,4 +67,61 @@ export function bindProject(data) {
 		method: 'post',
 		data: data
 	})
+}
+/* 
+ * 获取经纪人列表
+ * 
+ */
+export function getAgentListByPage(data) {
+	return request({
+		url: `/manager/agent/${data.currPage}/${data.pageSize}`,
+		method: 'post',
+		data: data
+	})
+}
+/* 
+ * 新增经纪人
+ * 
+ * 
+ */
+export function insertAgent(data) {
+	return request({
+		url: `/manager/agent`,
+		method: 'post',
+		data: data
+	})
+}
+/* 
+ * 编辑经纪人
+ * 
+ * 
+ */
+export function updateAgent(data) {
+	return request({
+		url: `/manager/agent/update`,
+		method: 'put',
+		data: data
+	})
+}
+/* 
+ * 获取经纪人详情
+ * 
+ * 
+ */
+export function getAgentDetailById(id) {
+	return request({
+		url: `/manager/agent/${id}`,
+		method: 'get'
+	})
+}
+/* 
+ * 删除经纪人
+ * 
+ * 
+ */
+export function deleteAgentById(id) {
+	return request({
+		url: `/manager/agent/delete/${id}`,
+		method: 'delete'
+	})
 }

virgo.wzfrontend/console/src/httpApi/space.js

@@ -263,4 +263,15 @@ export function deleteHouseById(id) {
 		url: `/api/projectItemTargetRoom/${id}`,
 		method: 'delete'
 	})
+}
+/* 
+ * 获取房源层级结构
+ * 
+ * 
+ */
+export function getHouseTree(id) {
+	return request({
+		url: `/api/projectItemTargetRoom/level/${id}`,
+		method: 'get'
+	})
 }

virgo.wzfrontend/console/src/uitls/index.js

@@ -357,30 +357,30 @@ export function findParent(dataSource, node) {
  * @param {array} data 树形结构数据源
  * @returns {array} 
  */
-export function roomList(data, type) {
+export function roomList(data) {
 	let newArr = JSON.parse(JSON.stringify(data));
 	let index = 1;
-
 	newArr = newArr.map(item => {
 		item['projectItemId'] = item['id'];
 		item['id'] = index;
 		item['projectItem'] = item;
+		item['optionName'] = item['name'];
 		index++;
 		item['children'] = item.projectItemTargetList.map(target => {
 			target['projectItemTargetId'] = target['id'];
 			target['id'] = index;
 			target['projectItem'] = item;
+			target['optionName'] = target['name'];
 			index++;
-			if (type == 'room') {
-				target['children'] = target.projectItemTargetRoomList.map(room => {
-					room['roomId'] = room['id'];
-					room['id'] = index;
-					room['projectItem'] = item;
-					room['projectItemTarget'] = target;
-					index++;
-					return room;
-				})
-			}
+			target['children'] = target.projectItemTargetRoomList.map(room => {
+				room['roomId'] = room['id'];
+				room['id'] = index;
+				room['projectItem'] = item;
+				room['projectItemTarget'] = target;
+				room['optionName'] = room['roomNumber'];
+				index++;
+				return room;
+			})
 			return target
 		})
 		return item;

virgo.wzfrontend/console/src/uitls/message.js

@@ -40,7 +40,7 @@ export default {
 	messageContent(params) {
 		let message = '';
 		if (params.messageType === 2) {
-			message = `邀请你加入${store.getters.project.name}项目，请及时处理。`
+			message = `邀请你加入<${store.getters.project.name}>项目，请及时处理。`
 		}
 		return message;
 	},

virgo.wzfrontend/console/src/views/work/crm/agent.vue

@@ -1,8 +1,188 @@
-<template>
-</template>
-
-<script>
-</script>
-
-<style>
+<template>
+	<div class="hui-flex hui-content">
+		<div class="hui-content-title">
+			<div class="hui-title-item active">经纪人列表</div>
+		</div>
+		<div class="hui-flex-box hui-flex hui-table">
+			<div class="hui-content-insert">
+				<el-button type="primary" size="medium" @click="insertAgent">新增经纪人</el-button>
+			</div>
+			<div class="hui-flex-box">
+				<el-table :data="tableData" row-key="id" border height="100%">
+					<el-table-column label="序号" width="50">
+						<template slot-scope="scope">
+							<div style="text-align: center;">{{scope.$index + 1}}</div>
+						</template>
+					</el-table-column>
+					<el-table-column label="经纪人名称" prop="name"></el-table-column>
+					<el-table-column label="邀请项目" width="150">
+						<template slot-scope="scope">
+							<div class="hui-table-operation" v-if="!scope.row.status">
+								<span class="table-operation" @click="inviteAgent(scope.row)">发送邀请</span>
+							</div>
+							<div class="hui-table-operation" v-if="scope.row.status === 3">
+								<span class="table-operation" @click="inviteAgent(scope.row)">重新邀请</span>
+							</div>
+						</template>
+					</el-table-column>
+					<el-table-column label="邀请状态" width="150">
+						<template slot-scope="scope">
+							<div v-if="!scope.row.status" class="hui-state">
+								<span class="hui-state-bage hui-state-primary"></span>
+								<span class="hui-state-label">待邀请</span>
+							</div>
+							<div v-if="scope.row.status == 1" class="hui-state">
+								<span class="hui-state-bage hui-state-info"></span>
+								<span class="hui-state-label">邀请中</span>
+							</div>
+							<div v-if="scope.row.status == 2" class="hui-state">
+								<span class="hui-state-bage hui-state-success"></span>
+								<span class="hui-state-label">通过邀请</span>
+							</div>
+							<div v-if="scope.row.status == 3" class="hui-state">
+								<span class="hui-state-bage hui-state-error"></span>
+								<span class="hui-state-label">拒绝邀请</span>
+							</div>
+						</template>
+					</el-table-column>
+					<el-table-column label="操作" width="200">
+						<template slot-scope="scope">
+							<div class="hui-table-operation">
+								<span class="table-operation" @click="lookAgent(scope.row)">详情</span>
+								<span class="table-operation" @click="updateAgent(scope.row)">编辑</span>
+								<span class="table-operation" @click="deleteAgent(scope.row)">删除</span>
+							</div>
+						</template>
+					</el-table-column>
+					<template slot="empty">
+						<empty description="暂无数据"></empty>
+					</template>
+				</el-table>
+			</div>
+			<div class="hui-content-pagination">
+				<el-pagination :page-size="pageSize" :pager-count="9" layout="prev, pager, next" :total="totalCount"
+					@current-change="currentChange">
+				</el-pagination>
+			</div>
+		</div>
+		<el-dialog :title="isUpdate?'编辑':'新增'" :visible.sync="visible" width="900px" :append-to-body="true">
+			<edit v-if="visible" @callback="callback" :isUpdate="isUpdate" :detailId="detailId"></edit>
+		</el-dialog>
+		<el-drawer title="经纪人详情" :visible.sync="drawer" :size="400" :append-to-body="true">
+			<detail v-if="drawer" :detailId="detailId"></detail>
+		</el-drawer>
+	</div>
+</template>
+
+<script>
+	import {
+		getAgentListByPage,
+		deleteAgentById,
+		updateAgent
+	} from '@/httpApi/crm'
+	import {
+		testPhone
+	} from '@/httpApi/organization'
+	import edit from '@/components/work/crm/agent/edit'
+	import detail from '@/components/work/crm/agent/detail'
+	export default {
+		data() {
+			return {
+				tableData: [],
+				currPage: 1,
+				pageSize: 10,
+				totalCount: 0,
+				visible: false,
+				detailId: '',
+				isUpdate: false,
+				drawer: false
+			}
+		},
+		created() {
+			this.init();
+		},
+		methods: {
+			init() {
+				getAgentListByPage({
+					currPage: this.currPage,
+					pageSize: this.pageSize,
+					organizationId: this.$store.getters.organization.id,
+					userId: this.$store.getters.user.id
+				}).then(res => {
+					if (res.state) {
+						this.tableData = res.data.dataList;
+						this.totalCount = res.data.totalCount;
+					}
+				})
+			},
+			currentChange(currPage) {
+				this.currPage = currPage;
+				this.init();
+			},
+			insertAgent() {
+				this.isUpdate = false;
+				this.visible = true;
+			},
+			updateAgent(val) {
+				this.detailId = val.id;
+				this.isUpdate = true;
+				this.visible = true;
+			},
+			lookAgent(val) {
+				this.detailId = val.id;
+				this.drawer = true;
+			},
+			inviteAgent(user) {
+				testPhone(user.phone).then(res => {
+					if (res.state) {
+						this.$confirm('是否邀请该经纪人至当前项目?', () => {
+							this.$msg.send({
+								dataId: user.id,
+								identityId: 2
+							}, {
+								messageType: 2,
+								userIds: res.data.id
+							}).then(node => {
+								if (node.state) {
+									updateAgent({
+										id: user.id,
+										status: 1
+									}).then(res => {
+										if (res.state) {
+											this.init();
+											this.$message.success('邀请成功');
+										}
+									})
+								}
+							})
+						});
+					} else {
+						this.$message.warning('用户不存在，无法绑定');
+					}
+				})
+			},
+			deleteAgent(val) {
+				this.$confirm('确定要删除该经纪人?', () => {
+					deleteAgentById(val.id).then(res => {
+						if (res.state) {
+							this.init();
+							this.$message.success('操作成功');
+						}
+					})
+				});
+			},
+			callback(type) {
+				if (type === 'init') this.init();
+				this.visible = false;
+			}
+		},
+		components: {
+			edit,
+			detail
+		},
+	}
+</script>
+
+<style lang="scss">
+
 </style>

virgo.wzfrontend/console/src/views/work/crm/customer.vue

@@ -5,7 +5,7 @@
 		</div>
 		<div class="hui-flex-box hui-flex hui-table">
 			<div class="hui-content-insert">
-				<el-button type="primary" size="medium" @click="insertProject">新增客户</el-button>
+				<el-button type="primary" size="medium" @click="insertCustomer">新增客户</el-button>
 			</div>
 			<div class="hui-flex-box">
 				<el-table :data="tableData" row-key="id" border height="100%">
@@ -15,19 +15,28 @@
 						</template>
 					</el-table-column>
 					<el-table-column label="客户名称" prop="name"></el-table-column>
+					<el-table-column label="公海客户" width="100">
+						<template slot-scope="scope">
+							<div class="hui-table-operation">
+								<el-switch v-model="scope.row.highSeas" :active-value="1" :inactive-value="2"
+									@change="val=>putHighSeas(val,scope.row)">
+								</el-switch>
+							</div>
+						</template>
+					</el-table-column>
 					<el-table-column label="邀请项目" width="150">
 						<template slot-scope="scope">
-							<div class="hui-table-operation" v-if="scope.row.status === 0">
-								<span class="table-operation" @click="inviteProject(scope.row)">发送邀请</span>
+							<div class="hui-table-operation" v-if="!scope.row.status">
+								<span class="table-operation" @click="inviteCustomer(scope.row)">发送邀请</span>
 							</div>
 							<div class="hui-table-operation" v-if="scope.row.status === 3">
-								<span class="table-operation" @click="inviteProject(scope.row)">重新邀请</span>
+								<span class="table-operation" @click="inviteCustomer(scope.row)">重新邀请</span>
 							</div>
 						</template>
 					</el-table-column>
 					<el-table-column label="邀请状态" width="150">
 						<template slot-scope="scope">
-							<div v-if="scope.row.status == 0" class="hui-state">
+							<div v-if="!scope.row.status" class="hui-state">
 								<span class="hui-state-bage hui-state-primary"></span>
 								<span class="hui-state-label">待邀请</span>
 							</div>
@@ -48,9 +57,9 @@
 					<el-table-column label="操作" width="200">
 						<template slot-scope="scope">
 							<div class="hui-table-operation">
-								<span class="table-operation" @click="lookProject(scope.row)">详情</span>
-								<span class="table-operation" @click="updateProject(scope.row)">编辑</span>
-								<span class="table-operation" @click="deleteProject(scope.row)">删除</span>
+								<span class="table-operation" @click="lookCustomer(scope.row)">详情</span>
+								<span class="table-operation" @click="updateCustomer(scope.row)">编辑</span>
+								<span class="table-operation" @click="deleteCustomer(scope.row)">删除</span>
 							</div>
 						</template>
 					</el-table-column>
@@ -78,7 +87,6 @@
 	import {
 		getCustomerListByPage,
 		deleteCustomerById,
-		bindProject,
 		updateCustomer
 	} from '@/httpApi/crm'
 	import {
@@ -120,20 +128,31 @@
 				this.currPage = currPage;
 				this.init();
 			},
-			insertProject() {
+			insertCustomer() {
 				this.isUpdate = false;
 				this.visible = true;
 			},
-			updateProject(val) {
+			updateCustomer(val) {
 				this.detailId = val.id;
 				this.isUpdate = true;
 				this.visible = true;
 			},
-			lookProject(val) {
+			lookCustomer(val) {
 				this.detailId = val.id;
 				this.drawer = true;
 			},
-			inviteProject(user) {
+			putHighSeas(val, item) {
+				updateCustomer({
+					id: item.id,
+					highSeas: val
+				}).then(res => {
+					if (res.state) {
+						this.init();
+						this.$message.success('操作成功');
+					}
+				})
+			},
+			inviteCustomer(user) {
 				testPhone(user.phone).then(res => {
 					if (res.state) {
 						this.$confirm('是否邀请该客户至当前项目?', () => {
@@ -162,9 +181,9 @@
 					}
 				})
 			},
-			deleteCustomerById(val) {
+			deleteCustomer(val) {
 				this.$confirm('确定要删除该客户?', () => {
-					deleteProjectById(val.id).then(res => {
+					deleteCustomerById(val.id).then(res => {
 						if (res.state) {
 							this.init();
 							this.$message.success('操作成功');
@@ -184,4 +203,6 @@
 	}
 </script>
 
-<style lang="scss"></style>
+<style lang="scss">
+
+</style>

virgo.wzfrontend/console/src/views/work/crm/highseas.vue

@@ -1,9 +1,89 @@
 <template>
-	<div class="high-seas"></div>
+	<div class="hui-flex hui-content">
+		<div class="hui-content-title">
+			<div class="hui-title-item active">公海客户列表</div>
+		</div>
+		<div class="hui-flex-box hui-flex hui-table">
+			<div class="hui-flex-box">
+				<el-table :data="tableData" row-key="id" border height="100%">
+					<el-table-column label="序号" width="50">
+						<template slot-scope="scope">
+							<div style="text-align: center;">{{scope.$index + 1}}</div>
+						</template>
+					</el-table-column>
+					<el-table-column label="客户名称" prop="name"></el-table-column>
+					<el-table-column label="操作" width="200">
+						<template slot-scope="scope">
+							<div class="hui-table-operation">
+								<span class="table-operation" @click="lookProject(scope.row)">详情</span>
+							</div>
+						</template>
+					</el-table-column>
+					<template slot="empty">
+						<empty description="暂无数据"></empty>
+					</template>
+				</el-table>
+			</div>
+			<div class="hui-content-pagination">
+				<el-pagination :page-size="pageSize" :pager-count="9" layout="prev, pager, next" :total="totalCount"
+					@current-change="currentChange">
+				</el-pagination>
+			</div>
+		</div>
+		<el-drawer title="客户详情" :visible.sync="drawer" :size="400" :append-to-body="true">
+			<detail v-if="drawer" :detailId="detailId"></detail>
+		</el-drawer>
+	</div>
 </template>
 
 <script>
+	import {
+		getCustomerListByPage
+	} from '@/httpApi/crm'
+	import detail from '@/components/work/crm/customer/detail'
+	export default {
+		data() {
+			return {
+				tableData: [],
+				currPage: 1,
+				pageSize: 10,
+				totalCount: 0,
+				drawer: false,
+				detailId: '',
+			}
+		},
+		created() {
+			this.init();
+		},
+		methods: {
+			init() {
+				getCustomerListByPage({
+					currPage: this.currPage,
+					pageSize: this.pageSize,
+					organizationId: this.$store.getters.organization.id,
+					highSeas: 1
+				}).then(res => {
+					if (res.state) {
+						this.tableData = res.data.dataList;
+						this.totalCount = res.data.totalCount;
+					}
+				})
+			},
+			currentChange(currPage) {
+				this.currPage = currPage;
+				this.init();
+			},
+			lookProject(val) {
+				this.detailId = val.id;
+				this.drawer = true;
+			}
+		},
+		components: {
+			detail
+		},
+	}
 </script>
 
-<style>
+<style lang="scss">
+
 </style>