fix

virgo.wzfrontend/console/src/components/work/staging/client.vue

@@ -0,0 +1,386 @@
+<template>
+	<div class="client-detail-box">
+		<div class="left">
+			<div class="client-avatr bg-box">
+				<div class="logo bg-item">
+					<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/2f7b4bfaf9e64817bc2cb46f3a632b01"
+						alt="" />
+				</div>
+				<div class="content">
+					<div class="name bg-item">温州有极数据科技有限公司</div>
+					<div class="sub-name bg-item">徐先生-18616333631</div>
+				</div>
+			</div>
+			<div class="client-space bg-box">
+				<div class="space-item">
+					<div class="space-key bg-item">房间编号</div>
+					<div class="space-value bg-item">102</div>
+				</div>
+				<div class="space-item">
+					<div class="space-key bg-item">房间位置</div>
+					<div class="space-value bg-item">一号楼-1F</div>
+				</div>
+				<div class="space-item">
+					<div class="space-key bg-item">房间面积</div>
+					<div class="space-value bg-item">120平方米</div>
+				</div>
+			</div>
+			<div class="client-bill bg-box">
+				<div class="title">
+					<span class="label">账单发票</span>
+					<div class="title-option">
+						<div v-for="(item,index) in billList"
+							:class="nowBillId === item.id ?'option-item active':'option-item'"
+							@click="nowBillId = item.id">
+							{{item.name}}
+						</div>
+					</div>
+				</div>
+				<div class="client-list">
+					<div class="alarm-table-box hui-flex">
+						<div class="alarm-title">
+							<div class="alarm-tr">
+								<span class="tr-50">序号</span>
+								<span class="tr-flex">账单期数</span>
+								<span class="tr-flex">账单金额</span>
+								<span class="tr-flex">账单状态</span>
+								<span class="tr-flex">发票状态</span>
+							</div>
+						</div>
+						<div class="alarm-table hui-flex-box">
+							<div class="alarm-tr">
+								<span class="tr-50">01</span>
+								<span class="tr-flex">第1期</span>
+								<span class="tr-flex">1.2万</span>
+								<span class="tr-flex color-green">已付款</span>
+								<span class="tr-flex color-green">已开发票</span>
+							</div>
+							<div class="alarm-tr">
+								<span class="tr-50">02</span>
+								<span class="tr-flex">第2期</span>
+								<span class="tr-flex">1.2万</span>
+								<span class="tr-flex color-green">已付款</span>
+								<span class="tr-flex color-green">已开发票</span>
+							</div>
+							<div class="alarm-tr">
+								<span class="tr-50">03</span>
+								<span class="tr-flex">第3期</span>
+								<span class="tr-flex">1.2万</span>
+								<span class="tr-flex color-green">已付款</span>
+								<span class="tr-flex color-green">已开发票</span>
+							</div>
+							<div class="alarm-tr">
+								<span class="tr-50">04</span>
+								<span class="tr-flex">第4期</span>
+								<span class="tr-flex">1.2万</span>
+								<span class="tr-flex color-green">已付款</span>
+								<span class="tr-flex color-green">已开发票</span>
+							</div>
+							<div class="alarm-tr">
+								<span class="tr-50">05</span>
+								<span class="tr-flex">第5期</span>
+								<span class="tr-flex">1.2万</span>
+								<span class="tr-flex color-green">已付款</span>
+								<span class="tr-flex color-green">已开发票</span>
+							</div>
+							<div class="alarm-tr">
+								<span class="tr-50">06</span>
+								<span class="tr-flex">第6期</span>
+								<span class="tr-flex">1.2万</span>
+								<span class="tr-flex color-green">已付款</span>
+								<span class="tr-flex color-green">已开发票</span>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+		<div class="right bg-box">
+			<div class="hui-flex">
+				<div class="title">
+					<div class="label">基础信息</div>
+				</div>
+				<div class="hui-flex-box">
+					<div class="information-box">
+						<div class="information-item">
+							<div class="information-key">客户类型</div>
+							<div class="information-value">潜在客户</div>
+						</div>
+						<div class="information-item">
+							<div class="information-key">行业</div>
+							<div class="information-value">金融业</div>
+						</div>
+						<div class="information-item">
+							<div class="information-key">需求区间</div>
+							<div class="information-value">2000-3000</div>
+						</div>
+						<div class="information-item">
+							<div class="information-key">装修要求</div>
+							<div class="information-value">精装</div>
+						</div>
+					</div>
+					<div class="information-box">
+						<div class="information-item">
+							<div class="information-key">房租合同</div>
+							<div class="information-value">房租合同.docx</div>
+						</div>
+						<div class="information-item">
+							<div class="information-key">合同编号</div>
+							<div class="information-value">HT11223344</div>
+						</div>
+						<div class="information-item" style="width: 50%;">
+							<div class="information-key">合同时间</div>
+							<div class="information-value">2023-12-15至2024-12-14</div>
+						</div>
+					</div>
+					<div class="information-box">
+						<div class="information-item">
+							<div class="information-key">合同编号</div>
+							<div class="information-value">物业合同.docx</div>
+						</div>
+						<div class="information-item">
+							<div class="information-key">行业</div>
+							<div class="information-value">HT11223344</div>
+						</div>
+						<div class="information-item" style="width: 50%;">
+							<div class="information-key">合同时间</div>
+							<div class="information-value">2023-12-15至2024-12-14</div>
+						</div>
+					</div>
+					<div class="information-box">
+						<div class="information-item" style="width: 100%;">
+							<div class="information-key">企业简介</div>
+							<div class="information-value">
+								企业简介温州有极数据科技有限公司，成立于2023年，是温州市鹿城区创新大赛获奖落地项目，公司主要致力于数字城市、智慧建筑、智慧工厂的管理系统的研发和推广。
+							</div>
+						</div>
+					</div>
+					<div class="information-box">
+						<div class="information-item" style="width: 100%;">
+							<div class="information-key">企业发展</div>
+							<div class="information-value">
+								温州有极数据科技有限公司企业发展
+							</div>
+						</div>
+					</div>
+					<div class="information-box">
+						<div class="information-item" style="width: 100%;">
+							<div class="information-key">知识产权</div>
+							<div class="information-value">
+								温州有极数据科技有限公司知识产权
+							</div>
+						</div>
+					</div>
+					<div class="information-box">
+						<div class="information-item" style="width: 100%;">
+							<div class="information-key">项目申报</div>
+							<div class="information-value">
+								温州有极数据科技有限公司项目申报
+							</div>
+						</div>
+					</div>
+					<div class="information-box">
+						<div class="information-item" style="width: 100%;">
+							<div class="information-key">项目荣誉</div>
+							<div class="information-value">
+								温州有极数据科技有限公司项目荣誉
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				billList: [{
+					id: 1,
+					name: '房租'
+				}, {
+					id: 2,
+					name: '物业'
+				}, {
+					id: 3,
+					name: '水电'
+				}],
+				nowBillId: 1,
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.client-detail-box {
+		width: 100%;
+		height: 100%;
+		display: flex;
+		padding: 15px;
+
+		.title {
+			padding: 10px;
+			display: flex;
+			border-bottom: 1px solid #232A37;
+
+			.label {
+				flex: 1;
+				width: 0;
+				overflow: hidden;
+				font-weight: 500;
+			}
+
+			.title-option {
+				display: flex;
+				align-items: center;
+				background: rgba(26, 38, 60, 0.8);
+				height: 20px;
+				border-radius: 2px;
+			}
+
+			.option-item {
+				width: 60px;
+				height: 20px;
+				color: #818CA2;
+				font-size: 12px;
+				text-align: center;
+				line-height: 20px;
+				border-radius: 2px;
+				cursor: pointer;
+			}
+
+			.option-item.active,
+			.option-item:hover {
+				background: #6c7589;
+				color: #D2E4FF;
+			}
+		}
+
+		.bg-box {
+			background: #2f3746;
+		}
+
+		.bg-item {
+			background: #232A37;
+		}
+
+		img {
+			width: 100%;
+			height: 100%;
+		}
+
+		.left {
+			width: 400px;
+			display: flex;
+			flex-direction: column;
+		}
+
+		.right {
+			margin-left: 10px;
+			flex: 1;
+			width: 0;
+		}
+
+		.information-box {
+			display: flex;
+			padding: 0 10px;
+			margin-top: 15px;
+
+			.information-item {
+				width: 25%;
+			}
+
+			.information-key {
+				color: #7c899f;
+				font-size: 13px;
+				margin-bottom: 4px;
+			}
+		}
+
+		.client-list {
+			flex: 1;
+			height: 0;
+
+			.alarm-title {
+				padding: 0 10px;
+			}
+
+			.alarm-table {
+				padding: 0 10px;
+				margin-bottom: 0;
+
+				.alarm-tr {
+					background: #232A37;
+				}
+			}
+		}
+
+		.client-avatr {
+			width: 100%;
+
+			display: flex;
+			padding: 10px;
+
+			.logo {
+				width: 76px;
+				height: 76px;
+			}
+
+			.content {
+				flex: 1;
+				width: 0;
+				margin-left: 4px;
+			}
+
+			.name {
+				line-height: 36px;
+				margin-bottom: 4px;
+				padding: 0 5px;
+			}
+
+			.sub-name {
+				line-height: 36px;
+				padding: 0 5px;
+			}
+		}
+
+		.client-space {
+			margin-top: 10px;
+			padding: 10px;
+
+			.space-item {
+				display: flex;
+				margin-bottom: 4px;
+
+				&:last-child {
+					margin-bottom: 0;
+				}
+
+				.space-key {
+					width: 80px;
+					margin-right: 4px;
+					line-height: 36px;
+					padding: 0 5px;
+					text-align: center;
+				}
+
+				.space-value {
+					flex: 1;
+					width: 0;
+					line-height: 36px;
+					padding: 0 5px;
+				}
+			}
+		}
+
+		.client-bill {
+			flex: 1;
+			height: 0;
+			margin-top: 10px;
+			display: flex;
+			flex-direction: column;
+		}
+	}
+</style>

virgo.wzfrontend/console/src/components/work/staging/cost.vue

@@ -0,0 +1,164 @@
+<template>
+	<div class="hui-flex hui-content">
+		<div class="hui-content-title">
+			<div :class="'hui-title-item' + (item.id === nowTitleId?' active':'') " v-for="item in title" :key="item.id"
+				@click="changeTitle(item)">
+				{{item.name}}
+			</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="应收金额" prop="receivable"></el-table-column>
+					<el-table-column label="已收金额" prop="received"></el-table-column>
+					<el-table-column label="累计收费" prop="const"></el-table-column>
+					<el-table-column label="状态">
+						<template slot-scope="scope">
+							<div class="hui-table-tag">
+								<div class="hui-tag hui-tag-info" v-if="!scope.row.state">未缴费</div>
+								<div class="hui-tag hui-tag-success" v-if="scope.row.state === 1">已缴费</div>
+								<div class="hui-tag hui-tag-warning" v-if="scope.row.state === 2">
+									已逾期{{scope.row.day}}天
+								</div>
+							</div>
+						</template>
+					</el-table-column>
+					<el-table-column label="操作" width="80">
+						<template slot-scope="scope">
+							<div class="hui-table-operation">
+								<span class="table-operation" @click="look(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">
+			<cost-detail v-if="drawer" :detail="detail"></cost-detail>
+		</el-drawer>
+	</div>
+</template>
+
+<script>
+	const data = [{
+		id: 1,
+		name: 'xxx公司',
+		receivable: '1.2万',
+		received: '1.2万',
+		const: '24万',
+		state: 1,
+		type: 1,
+		day: 0,
+		billDate: '2024-12-13',
+		costDate: '2024-12-14'
+	}, {
+		id: 2,
+		name: 'xxx公司',
+		receivable: '1.12万',
+		received: '0',
+		const: '14万',
+		state: 2,
+		type: 1,
+		day: 2,
+		billDate: '2024-12-13',
+		costDate: ''
+	}, {
+		id: 3,
+		name: 'xxx公司',
+		receivable: '1.2万',
+		received: '0',
+		const: '11万',
+		state: null,
+		type: 1,
+		day: 0,
+		billDate: '2024-12-22',
+		costDate: ''
+	}, {
+		id: 4,
+		name: 'xxx有限公司',
+		receivable: '1204元',
+		received: '1204元',
+		const: '2.4万',
+		state: 1,
+		type: 2,
+		day: 0,
+		billDate: '2024-12-13',
+		costDate: '2024-12-14'
+	}, {
+		id: 5,
+		name: 'xxx有限公司',
+		receivable: '604元',
+		received: '604元',
+		const: '7362元',
+		state: 1,
+		type: 3,
+		day: 0,
+		billDate: '2024-12-13',
+		costDate: '2024-12-14'
+	}];
+	import costDetail from './costDetail'
+	export default {
+		props: ['nodeType'],
+		data() {
+			return {
+				title: [{
+					id: 1,
+					name: '房租'
+				}, {
+					id: 2,
+					name: '物业'
+				}, {
+					id: 3,
+					name: '水电'
+				}],
+				nowTitleId: 1,
+				tableData: [],
+				currPage: 1,
+				pageSize: 10,
+				totalCount: 0,
+				drawer: false,
+				detail: {}
+			}
+		},
+		created() {
+			this.nowTitleId = this.nodeType;
+			this.init();
+		},
+		methods: {
+			init() {
+				this.tableData = data.filter(node => node.type === this.nowTitleId);
+			},
+			currentChange(currPage) {
+				this.currPage = currPage;
+				this.init();
+			},
+			changeTitle(item) {
+				this.nowTitleId = item.id;
+				this.init();
+			},
+			look(val) {
+				this.detail = val;
+				this.drawer = true;
+			}
+		},
+		components: {
+			costDetail
+		}
+	}
+</script>
+
+<style lang="scss"></style>

virgo.wzfrontend/console/src/components/work/staging/costDetail.vue

@@ -0,0 +1,57 @@
+<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.receivable}}</div>
+			</div>
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">已收金额</div>
+				<div class="hui-detail-value">{{detail.received}}</div>
+			</div>
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">累计收费</div>
+				<div class="hui-detail-value">{{detail.const}}</div>
+			</div>
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">账单日期</div>
+				<div class="hui-detail-value">{{detail.billDate}}</div>
+			</div>
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">缴费日期</div>
+				<div class="hui-detail-value">{{detail.costDate || '-'}}</div>
+			</div>
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">状态</div>
+				<div class="hui-detail-value">
+					<div class="hui-table-tag">
+						<div class="hui-tag hui-tag-info" v-if="!detail.state">未缴费</div>
+						<div class="hui-tag hui-tag-success" v-if="detail.state === 1">已缴费</div>
+						<div class="hui-tag hui-tag-warning" v-if="detail.state === 2">
+							已逾期{{detail.day}}天
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+	export default {
+		props: ['detail'],
+		data() {
+			return {
+
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

virgo.wzfrontend/console/src/components/work/staging/remind.vue

@@ -0,0 +1,170 @@
+<template>
+	<div class="hui-flex hui-content">
+		<div class="hui-content-title">
+			<div :class="'hui-title-item' + (item.id === nowTitleId?' active':'') " v-for="item in title" :key="item.id"
+				@click="nowTitleId = item.id">
+				{{item.name}}
+			</div>
+		</div>
+		<div class="hui-flex-box">
+			<div class="remind-box">
+				<div class="remind-item">
+					<div class="date">2024-12-13</div>
+					<div class="line-bottom line"></div>
+					<div class="content" @click="drawer = true">
+						<div class="title">重要事件标题</div>
+						<div class="remark">重要事件内容重要事件内容重要事件内容重要事件内容</div>
+						<div class="time">提醒时间：13:00</div>
+						<div class="hui-tag hui-tag-success">已完成</div>
+					</div>
+					<div class="content" @click="drawer = true">
+						<div class="title">重要事件标题</div>
+						<div class="remark">重要事件内容重要事件内容重要事件内容重要事件内容</div>
+						<div class="time">提醒时间：13:00</div>
+						<div class="hui-tag hui-tag-info">待完成</div>
+					</div>
+				</div>
+			</div>
+			<div class="remind-box">
+				<div class="remind-item">
+					<div class="date">2024-12-14</div>
+					<div class="line-top line"></div>
+					<div class="line-bottom line"></div>
+					<div class="content" @click="drawer = true">
+						<div class="title">重要事件标题</div>
+						<div class="remark">重要事件内容重要事件内容重要事件内容重要事件内容</div>
+						<div class="time">提醒时间：13:00</div>
+						<div class="hui-tag hui-tag-info">待完成</div>
+					</div>
+					<div class="content" @click="drawer = true">
+						<div class="title">重要事件标题</div>
+						<div class="remark">重要事件内容重要事件内容重要事件内容重要事件内容</div>
+						<div class="time">提醒时间：13:00</div>
+						<div class="hui-tag hui-tag-info">待完成</div>
+					</div>
+				</div>
+			</div>
+			<div class="remind-box">
+				<div class="remind-item">
+					<div class="date">2024-12-15</div>
+					<div class="line-top line"></div>
+					<div class="content" @click="drawer = true">
+						<div class="title">重要事件标题</div>
+						<div class="remark">重要事件内容重要事件内容重要事件内容重要事件内容</div>
+						<div class="time">提醒时间：13:00</div>
+						<div class="hui-tag hui-tag-info">待完成</div>
+					</div>
+					<div class="content" @click="drawer = true">
+						<div class="title">重要事件标题</div>
+						<div class="remark">重要事件内容重要事件内容重要事件内容重要事件内容</div>
+						<div class="time">提醒时间：13:00</div>
+						<div class="hui-tag hui-tag-info">待完成</div>
+					</div>
+				</div>
+			</div>
+		</div>
+		<el-drawer title="提醒详情" :visible.sync="drawer" :size="400" :append-to-body="true">
+			<remind-detail v-if="drawer"></remind-detail>
+		</el-drawer>
+	</div>
+</template>
+
+<script>
+	import remindDetail from './remindDetail'
+	export default {
+		props: ['nodeType'],
+		data() {
+			return {
+				title: [{
+					id: 1,
+					name: '重要提醒'
+				}, {
+					id: 2,
+					name: '会议提醒'
+				}, {
+					id: 3,
+					name: '收费提醒'
+				}, {
+					id: 4,
+					name: '看房提醒'
+				}],
+				nowTitleId: 1,
+				drawer: false
+			}
+		},
+		created() {
+			this.nowTitleId = this.nodeType;
+		},
+		components: {
+			remindDetail
+		}
+	}
+</script>
+
+<style lang="scss">
+	.remind-box {
+		padding: 15px;
+
+		.remind-item {
+			position: relative;
+			padding-left: 100px;
+			padding-top: 30px;
+		}
+
+		.date {
+			position: absolute;
+			background: #2f3746;
+			padding: 5px 10px;
+			border-radius: 4px;
+			width: 100px;
+			text-align: center;
+			top: 0;
+			left: 0;
+		}
+
+		.content {
+			background: #2f3746;
+			border-radius: 4px;
+			padding: 10px;
+			margin-top: 10px;
+			position: relative;
+
+			.hui-tag {
+				position: absolute;
+				top: 15px;
+				right: 15px;
+			}
+
+			.title {
+				font-weight: 500;
+				font-size: 15px;
+				margin-bottom: 5px;
+			}
+
+			.remark {
+				margin-bottom: 5px;
+			}
+
+			.time {
+				font-size: 12px;
+			}
+		}
+
+		.line {
+			position: absolute;
+			border: 1px solid #2f3746;
+		}
+
+		.line-top {
+			top: -15px;
+			left: 50px;
+			height: 15px;
+		}
+
+		.line-bottom {
+			top: 0;
+			left: 50px;
+			bottom: -15px;
+		}
+	}
+</style>

virgo.wzfrontend/console/src/components/work/staging/remindDetail.vue

@@ -0,0 +1,32 @@
+<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">标题标题标题</div>
+			</div>
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">事件内容</div>
+				<div class="hui-detail-value">内容内容内容内容</div>
+			</div>
+			<div class="hui-detail-item">
+				<div class="hui-detail-label">提醒事件</div>
+				<div class="hui-detail-value">2024-12-13 13:00</div>
+			</div>
+		</div>
+	</div>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		}
+	}
+</script>
+
+<style>
+</style>

virgo.wzfrontend/console/src/views/work/iot/device/index.vue

@@ -8,7 +8,7 @@
 				</div>
 				<div class="hui-left-tree-content">
 					<el-collapse>
-						<el-collapse-item v-for="item in treedData" :key="item.id">
+						<el-collapse-item v-for="item in treeData" :key="item.id">
 							<template slot="title">
 								<i class="iconfont huifont-shuzhuangcaidantubiao"></i>
 								<span class="el-collapse-name">{{item.name}}</span>
@@ -143,7 +143,7 @@
 				currPage: 1,
 				pageSize: 10,
 				totalCount: 0,
-				treedData: [],
+				treeData: [],
 				defaultProps: {
 					children: 'children',
 					label: 'name'
@@ -161,8 +161,9 @@
 				sign: 'device'
 			}).then(res => {
 				if (res.state) {
-					this.treedData = [res.data];
-					this.returnChildren(this.treedData);
+					this.treeData = res.data;
+					this.returnChildren(this.treeData);
+					console.log(this.treeData);
 				}
 			})
 			this.init();

virgo.wzfrontend/console/src/views/work/iot/security/monitor.vue

@@ -1,334 +1,337 @@
-<template>
-	<div class="work-monitor">
-		<div class="yui-tree-box">
-			<div class="hui-left-tree">
-				<div class="hui-left-tree-title">
-					<svg-icon name="zhuangshi" width="16" height="20"></svg-icon>
-					<span class="hui-left-tree-sub">摄像列表</span>
-				</div>
-				<div class="hui-left-tree-content">
-					<project-item-tree @treeclick="treeclick"></project-item-tree>
-				</div>
-			</div>
-			<div class="hui-tree-content">
-				<model type="monitor" fileId="10000786668235" @tipClick="tipClick"></model>
-			</div>
-			<div class="placeholder"></div>
-		</div>
-		<div :class="'monitor-box' + (isOpen?' open':'')">
-			<div class="monitor-tag" @click="isOpen = !isOpen">
-				<div class="iconfont-box">
-					<i class="iconfont huifont-a-zhankaishousuo"></i>
-				</div>
-			</div>
-			<div class="hui-flex box-background">
-				<div class="monitor-box-title">
-					二号楼 / 二层
-				</div>
-				<div class="monitor-list hui-flex-box">
-					<div class="monitor-item">
-						<div class="monitor-item-box">
-							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
-								alt="" />
-							<div class="monitor-date">2023-12-22 04:12:32</div>
-							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
-							<div class="monitor-operation"></div>
-							<div class="monitor-download">
-								<i class="iconfont huifont-xiazai"></i>
-							</div>
-						</div>
-					</div>
-					<div class="monitor-item">
-						<div class="monitor-item-box">
-							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
-								alt="" />
-							<div class="monitor-date">2023-12-22 04:12:32</div>
-							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
-							<div class="monitor-operation"></div>
-							<div class="monitor-download">
-								<i class="iconfont huifont-xiazai"></i>
-							</div>
-						</div>
-					</div>
-					<div class="monitor-item">
-						<div class="monitor-item-box">
-							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
-								alt="" />
-							<div class="monitor-date">2023-12-22 04:12:32</div>
-							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
-							<div class="monitor-operation"></div>
-							<div class="monitor-download">
-								<i class="iconfont huifont-xiazai"></i>
-							</div>
-						</div>
-					</div>
-					<div class="monitor-item">
-						<div class="monitor-item-box">
-							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
-								alt="" />
-							<div class="monitor-date">2023-12-22 04:12:32</div>
-							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
-							<div class="monitor-operation"></div>
-							<div class="monitor-download">
-								<i class="iconfont huifont-xiazai"></i>
-							</div>
-						</div>
-					</div>
-					<div class="monitor-item">
-						<div class="monitor-item-box">
-							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
-								alt="" />
-							<div class="monitor-date">2023-12-22 04:12:32</div>
-							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
-							<div class="monitor-operation"></div>
-							<div class="monitor-download">
-								<i class="iconfont huifont-xiazai"></i>
-							</div>
-						</div>
-					</div>
-					<div class="monitor-item">
-						<div class="monitor-item-box">
-							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
-								alt="" />
-							<div class="monitor-date">2023-12-22 04:12:32</div>
-							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
-							<div class="monitor-operation"></div>
-							<div class="monitor-download">
-								<i class="iconfont huifont-xiazai"></i>
-							</div>
-						</div>
-					</div>
-				</div>
-			</div>
-		</div>
-		<el-dialog :close-on-click-modal="false" title="摄像头" custom-class="monitor-dialog" :visible.sync="visible" width="900px" height="500px"
-			:append-to-body="true">
-			<div class="hui-dialog">
-				<play-video :width="900" :height="445"></play-video>
-			</div>
-		</el-dialog>
-	</div>
-</template>
-
-<script>
-	import model from '@/components/work/common/model'
-	import projectItemTree from '@/components/common/projectItemTree'
-	export default {
-		data() {
-			return {
-				type: 'device',
-				treeData: [],
-				nowItem: {},
-				defaultProps: {
-					label: 'name'
-				},
-				activeName: [],
-				isOpen: false,
-				visible: false
-			}
-		},
-		created() {},
-		components: {
-			model,
-			projectItemTree
-		},
-		methods: {
-			tipClick() {
-				this.visible = true;
-			}
-		},
-	}
-</script>
-
-<style lang="scss">
-	.el-dialog.monitor-dialog {
-		height: 500px;
-		margin-top: 20vh !important;
-	}
-
-	.work-monitor {
-		position: relative;
-		width: 100%;
-		height: 100%;
-
-		.yui-tree-box {
-			width: 100%;
-			height: 100%;
-		}
-
-		.tree-node {
-			display: flex;
-			align-items: center;
-
-			.tree-node-label {
-				flex: 1;
-				width: 0;
-			}
-
-			i {
-				opacity: 0.5;
-			}
-		}
-
-		.active {
-			color: $--color-primary;
-
-			i {
-				opacity: 1;
-			}
-		}
-
-		.placeholder {
-			width: 400px;
-		}
-
-		.monitor-box {
-			position: absolute;
-			right: 0;
-			top: 0;
-			bottom: 0;
-			width: 412px;
-			padding-left: 12px;
-			background: #11131B;
-
-			.monitor-tag {
-				position: absolute;
-				top: 50%;
-				left: 0px;
-				width: 12px;
-				line-height: 70px;
-				opacity: 0.8;
-				text-align: center;
-				cursor: pointer;
-
-				.iconfont-box {
-					display: inline-block;
-				}
-
-				i {
-					position: relative;
-					font-size: 12px;
-				}
-			}
-
-			.monitor-tag::before {
-				content: '';
-				position: absolute;
-				top: 0;
-				left: 0;
-				right: 0;
-				bottom: 0;
-				border-right: 12px solid #303848;
-				border-top: 6px solid transparent;
-				border-bottom: 6px solid transparent;
-			}
-
-			.monitor-box-title {
-				padding: 20px;
-				padding-bottom: 10px;
-			}
-
-			.monitor-list {
-				padding: 10px 5px 5px 20px;
-				display: flex;
-				flex-wrap: wrap;
-				align-content: flex-start;
-			}
-
-			.monitor-item {
-				padding-bottom: 15px;
-				padding-right: 15px;
-				font-size: 12px;
-				cursor: pointer;
-				width: 100%;
-
-				.monitor-item-box {
-					width: 100%;
-					height: 100%;
-					border: 1px solid #607182;
-					position: relative;
-					height: 200px;
-					overflow: hidden;
-				}
-
-				img {
-					width: 100%;
-					height: 100%;
-				}
-
-				.monitor-date {
-					position: absolute;
-					top: 8px;
-					left: 14px;
-					text-shadow: 0px 1px 2px #000000;
-
-				}
-
-				.monitor-space {
-					position: absolute;
-					bottom: 0;
-					width: 100%;
-					font-size: 12px;
-					padding: 5px 18px;
-				}
-
-				.monitor-operation {
-					width: 100%;
-					position: absolute;
-					height: 30px;
-					background: #000000;
-					bottom: -30px;
-					transition: all 200ms linear;
-				}
-
-				.monitor-download {
-					width: 24px;
-					height: 24px;
-					background: #000000;
-					border-radius: 2px;
-					opacity: 0.79;
-					position: absolute;
-					top: 8px;
-					right: 8px;
-					text-align: center;
-					line-height: 24px;
-					top: -24px;
-					transition: all 200ms linear;
-					padding-right: 1px;
-				}
-			}
-
-			.monitor-item:hover {
-
-				.monitor-item-box {
-					border: 1px solid $--color-primary;
-				}
-
-				.monitor-operation {
-					bottom: 0px;
-				}
-
-				.monitor-download {
-					opacity: 1;
-					top: 8px;
-				}
-			}
-		}
-
-		.open.monitor-box {
-			width: 100%;
-
-
-			.monitor-item {
-				width: 25%;
-				min-width: 360px;
-			}
-
-			.monitor-tag {
-				.iconfont-box {
-					transform: rotate(180deg);
-				}
-			}
-		}
-	}
+<template>
+	<div class="work-monitor">
+		<div class="yui-tree-box">
+			<div class="hui-left-tree">
+				<div class="hui-left-tree-title">
+					<svg-icon name="zhuangshi" width="16" height="20"></svg-icon>
+					<span class="hui-left-tree-sub">摄像列表</span>
+				</div>
+				<div class="hui-left-tree-content">
+					<project-item-tree @treeclick="treeclick"></project-item-tree>
+				</div>
+			</div>
+			<div class="hui-tree-content">
+				<model type="monitor" fileId="10000786668235" @tipClick="tipClick"></model>
+			</div>
+			<div class="placeholder"></div>
+		</div>
+		<div :class="'monitor-box' + (isOpen?' open':'')">
+			<div class="monitor-tag" @click="isOpen = !isOpen">
+				<div class="iconfont-box">
+					<i class="iconfont huifont-a-zhankaishousuo"></i>
+				</div>
+			</div>
+			<div class="hui-flex box-background">
+				<div class="monitor-box-title">
+					二号楼 / 二层
+				</div>
+				<div class="monitor-list hui-flex-box">
+					<div class="monitor-item">
+						<div class="monitor-item-box">
+							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
+								alt="" />
+							<div class="monitor-date">2023-12-22 04:12:32</div>
+							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
+							<div class="monitor-operation"></div>
+							<div class="monitor-download">
+								<i class="iconfont huifont-xiazai"></i>
+							</div>
+						</div>
+					</div>
+					<div class="monitor-item">
+						<div class="monitor-item-box">
+							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
+								alt="" />
+							<div class="monitor-date">2023-12-22 04:12:32</div>
+							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
+							<div class="monitor-operation"></div>
+							<div class="monitor-download">
+								<i class="iconfont huifont-xiazai"></i>
+							</div>
+						</div>
+					</div>
+					<div class="monitor-item">
+						<div class="monitor-item-box">
+							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
+								alt="" />
+							<div class="monitor-date">2023-12-22 04:12:32</div>
+							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
+							<div class="monitor-operation"></div>
+							<div class="monitor-download">
+								<i class="iconfont huifont-xiazai"></i>
+							</div>
+						</div>
+					</div>
+					<div class="monitor-item">
+						<div class="monitor-item-box">
+							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
+								alt="" />
+							<div class="monitor-date">2023-12-22 04:12:32</div>
+							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
+							<div class="monitor-operation"></div>
+							<div class="monitor-download">
+								<i class="iconfont huifont-xiazai"></i>
+							</div>
+						</div>
+					</div>
+					<div class="monitor-item">
+						<div class="monitor-item-box">
+							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
+								alt="" />
+							<div class="monitor-date">2023-12-22 04:12:32</div>
+							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
+							<div class="monitor-operation"></div>
+							<div class="monitor-download">
+								<i class="iconfont huifont-xiazai"></i>
+							</div>
+						</div>
+					</div>
+					<div class="monitor-item">
+						<div class="monitor-item-box">
+							<img src="https://file-node.oss-cn-shanghai.aliyuncs.com/youji/854594e68cd64a41a296be319b295a04"
+								alt="" />
+							<div class="monitor-date">2023-12-22 04:12:32</div>
+							<div class="monitor-space">1号楼-3层-设备间-摄像头001</div>
+							<div class="monitor-operation"></div>
+							<div class="monitor-download">
+								<i class="iconfont huifont-xiazai"></i>
+							</div>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+		<el-dialog :close-on-click-modal="false" title="摄像头" custom-class="monitor-dialog" :visible.sync="visible"
+			width="900px" height="500px" :append-to-body="true">
+			<div class="hui-dialog">
+				<play-video :width="900" :height="445"></play-video>
+			</div>
+		</el-dialog>
+	</div>
+</template>
+
+<script>
+	import model from '@/components/work/common/model'
+	import projectItemTree from '@/components/common/projectItemTree'
+	export default {
+		data() {
+			return {
+				type: 'device',
+				treeData: [],
+				nowItem: {},
+				defaultProps: {
+					label: 'name'
+				},
+				activeName: [],
+				isOpen: false,
+				visible: false
+			}
+		},
+		created() {},
+		components: {
+			model,
+			projectItemTree
+		},
+		methods: {
+			treeclick() {
+
+			},
+			tipClick() {
+				this.visible = true;
+			}
+		},
+	}
+</script>
+
+<style lang="scss">
+	.el-dialog.monitor-dialog {
+		height: 500px;
+		margin-top: 20vh !important;
+	}
+
+	.work-monitor {
+		position: relative;
+		width: 100%;
+		height: 100%;
+
+		.yui-tree-box {
+			width: 100%;
+			height: 100%;
+		}
+
+		.tree-node {
+			display: flex;
+			align-items: center;
+
+			.tree-node-label {
+				flex: 1;
+				width: 0;
+			}
+
+			i {
+				opacity: 0.5;
+			}
+		}
+
+		.active {
+			color: $--color-primary;
+
+			i {
+				opacity: 1;
+			}
+		}
+
+		.placeholder {
+			width: 400px;
+		}
+
+		.monitor-box {
+			position: absolute;
+			right: 0;
+			top: 0;
+			bottom: 0;
+			width: 412px;
+			padding-left: 12px;
+			background: #11131B;
+
+			.monitor-tag {
+				position: absolute;
+				top: 50%;
+				left: 0px;
+				width: 12px;
+				line-height: 70px;
+				opacity: 0.8;
+				text-align: center;
+				cursor: pointer;
+
+				.iconfont-box {
+					display: inline-block;
+				}
+
+				i {
+					position: relative;
+					font-size: 12px;
+				}
+			}
+
+			.monitor-tag::before {
+				content: '';
+				position: absolute;
+				top: 0;
+				left: 0;
+				right: 0;
+				bottom: 0;
+				border-right: 12px solid #303848;
+				border-top: 6px solid transparent;
+				border-bottom: 6px solid transparent;
+			}
+
+			.monitor-box-title {
+				padding: 20px;
+				padding-bottom: 10px;
+			}
+
+			.monitor-list {
+				padding: 10px 5px 5px 20px;
+				display: flex;
+				flex-wrap: wrap;
+				align-content: flex-start;
+			}
+
+			.monitor-item {
+				padding-bottom: 15px;
+				padding-right: 15px;
+				font-size: 12px;
+				cursor: pointer;
+				width: 100%;
+
+				.monitor-item-box {
+					width: 100%;
+					height: 100%;
+					border: 1px solid #607182;
+					position: relative;
+					height: 200px;
+					overflow: hidden;
+				}
+
+				img {
+					width: 100%;
+					height: 100%;
+				}
+
+				.monitor-date {
+					position: absolute;
+					top: 8px;
+					left: 14px;
+					text-shadow: 0px 1px 2px #000000;
+
+				}
+
+				.monitor-space {
+					position: absolute;
+					bottom: 0;
+					width: 100%;
+					font-size: 12px;
+					padding: 5px 18px;
+				}
+
+				.monitor-operation {
+					width: 100%;
+					position: absolute;
+					height: 30px;
+					background: #000000;
+					bottom: -30px;
+					transition: all 200ms linear;
+				}
+
+				.monitor-download {
+					width: 24px;
+					height: 24px;
+					background: #000000;
+					border-radius: 2px;
+					opacity: 0.79;
+					position: absolute;
+					top: 8px;
+					right: 8px;
+					text-align: center;
+					line-height: 24px;
+					top: -24px;
+					transition: all 200ms linear;
+					padding-right: 1px;
+				}
+			}
+
+			.monitor-item:hover {
+
+				.monitor-item-box {
+					border: 1px solid $--color-primary;
+				}
+
+				.monitor-operation {
+					bottom: 0px;
+				}
+
+				.monitor-download {
+					opacity: 1;
+					top: 8px;
+				}
+			}
+		}
+
+		.open.monitor-box {
+			width: 100%;
+
+
+			.monitor-item {
+				width: 25%;
+				min-width: 360px;
+			}
+
+			.monitor-tag {
+				.iconfont-box {
+					transform: rotate(180deg);
+				}
+			}
+		}
+	}
 </style>

virgo.wzfrontend/console/src/views/work/staging/newProject.vue

@@ -5,7 +5,8 @@
 				<div class="work-project-house">
 					<div class="title">
 						<div class="title-icon"><i></i></div>
-						<span class="label">房源管理</span>
+						<span class="label">房源管理</span>
+						<div class="more" @click="$router.push('/work/space/housing')">查看更多>></div>
 					</div>
 					<div class="box-list box-background">
 						<div class="box-node box-line">
@@ -50,7 +51,7 @@
 						<div class="detail-item">
 							<span class="label">房租费用</span>
 							<span class="detail-icon"></span>
-							<div class="detail-test">
+							<div class="detail-test" @click="openDialog(1,1)">
 								<div class="test-item">
 									<div class="name">应收(万)</div>
 									<div class="number alibaba">120</div>
@@ -68,7 +69,7 @@
 						<div class="detail-item">
 							<span class="label">物业费用</span>
 							<span class="detail-icon"></span>
-							<div class="detail-test">
+							<div class="detail-test" @click="openDialog(1,2)">
 								<div class="test-item">
 									<div class="name">应收(万)</div>
 									<div class="number alibaba">12</div>
@@ -86,7 +87,7 @@
 						<div class="detail-item">
 							<span class="label">水电费用</span>
 							<span class="detail-icon"></span>
-							<div class="detail-test">
+							<div class="detail-test" @click="openDialog(1,3)">
 								<div class="test-item">
 									<div class="name">应收(万)</div>
 									<div class="number alibaba">1.2</div>
@@ -107,7 +108,7 @@
 					<div class="title">
 						<div class="title-icon"><i></i></div>
 						<span class="label">客户管理</span>
-						<div class="more">查看更多>></div>
+						<div class="more" @click="$router.push('/work/crm/customer')">查看更多>></div>
 					</div>
 					<div class="client-box box-background">
 						<div class="client-test">
@@ -146,35 +147,35 @@
 							</div>
 						</div>
 						<div class="client-list">
-							<div class="record-item">
+							<div class="record-item" @click="openDialog(2)">
 								<div class="number">01</div>
 								<div class="value">
 									<div class="hui-ellipsis">xxx科技有限公司</div>
 								</div>
 								<div class="state color-blue">2024-12-03</div>
 							</div>
-							<div class="record-item">
+							<div class="record-item" @click="openDialog(2)">
 								<div class="number">02</div>
 								<div class="value">
 									<div class="hui-ellipsis">xxx科技有限公司</div>
 								</div>
 								<div class="state color-blue">2024-12-03</div>
 							</div>
-							<div class="record-item">
+							<div class="record-item" @click="openDialog(2)">
 								<div class="number">03</div>
 								<div class="value">
 									<div class="hui-ellipsis">xxx科技有限公司</div>
 								</div>
 								<div class="state color-blue">2024-12-03</div>
 							</div>
-							<div class="record-item">
+							<div class="record-item" @click="openDialog(2)">
 								<div class="number">04</div>
 								<div class="value">
 									<div class="hui-ellipsis">xxx科技有限公司</div>
 								</div>
 								<div class="state color-blue">2024-12-03</div>
 							</div>
-							<div class="record-item">
+							<div class="record-item" @click="openDialog(2)">
 								<div class="number">05</div>
 								<div class="value">
 									<div class="hui-ellipsis">xxx科技有限公司</div>
@@ -220,6 +221,7 @@
 					<div class="title">
 						<div class="title-icon"><i></i></div>
 						<span class="label">设备管理</span>
+						<div class="more" @click="$router.push('/work/iot/security/monitor')">查看更多>></div>
 					</div>
 					<div class="monitor-box box-background">
 						<div class="monitor-item">
@@ -242,31 +244,31 @@
 					<div class="title">
 						<div class="title-icon"><i></i></div>
 						<span class="label">事件提醒</span>
-						<div class="more">查看更多>></div>
+						<div class="more" @click="openDialog(3,1)">查看更多>></div>
 					</div>
 					<div class="people-list box-background">
-						<div class="people-item">
+						<div class="people-item" @click="openDialog(3,1)">
 							<div class="people-value">
 								<span class="number alibaba">10</span>
 								<span class="unit">项</span>
 							</div>
 							<div class="people-tab">重要事件</div>
 						</div>
-						<div class="people-item">
+						<div class="people-item" @click="openDialog(3,2)">
 							<div class="people-value">
 								<span class="number alibaba">10</span>
 								<span class="unit">项</span>
 							</div>
 							<div class="people-tab">会议提醒</div>
 						</div>
-						<div class="people-item">
+						<div class="people-item" @click="openDialog(3,3)">
 							<div class="people-value">
 								<span class="number alibaba">10</span>
 								<span class="unit">项</span>
 							</div>
 							<div class="people-tab">收费提醒</div>
 						</div>
-						<div class="people-item">
+						<div class="people-item" @click="openDialog(3,4)">
 							<div class="people-value">
 								<span class="number alibaba">10</span>
 								<span class="unit">项</span>
@@ -374,21 +376,25 @@
 								{{item.name}}
 							</div>
 						</div>
+						<div class="more" @click="$router.push('/work/operation/week/work')">查看更多>></div>
 					</div>
 					<div class="client-list box-background">
-						<div class="record-item">
+						<div class="record-item"
+							@click="$router.push('/work/operation/week/detail?id=U2FsdGVkX18gMsWVAvzOE8YoA53iuS%2FkMJHksfWIz1o%3D')">
 							<div class="number">01</div>
 							<div class="value">
 								<div class="hui-ellipsis">项目名称第4周周报</div>
 							</div>
 						</div>
-						<div class="record-item">
+						<div class="record-item"
+							@click="$router.push('/work/operation/week/detail?id=U2FsdGVkX18gMsWVAvzOE8YoA53iuS%2FkMJHksfWIz1o%3D')">
 							<div class="number">02</div>
 							<div class="value">
 								<div class="hui-ellipsis">项目名称第3周周报</div>
 							</div>
 						</div>
-						<div class="record-item">
+						<div class="record-item"
+							@click="$router.push('/work/operation/week/detail?id=U2FsdGVkX18gMsWVAvzOE8YoA53iuS%2FkMJHksfWIz1o%3D')">
 							<div class="number">03</div>
 							<div class="value">
 								<div class="hui-ellipsis">项目名称第2周周报</div>
@@ -400,21 +406,22 @@
 					<div class="title">
 						<div class="title-icon"><i></i></div>
 						<span class="label">项目日志</span>
+						<div class="more" @click="$router.push('/work/operation/log/person')">查看更多>></div>
 					</div>
 					<div class="client-list box-background">
-						<div class="record-item">
+						<div class="record-item" @click="$router.push('/work/operation/log/person')">
 							<div class="number">01</div>
 							<div class="value">
 								<div class="hui-ellipsis">xxx在xxx时间新增工单</div>
 							</div>
 						</div>
-						<div class="record-item">
+						<div class="record-item" @click="$router.push('/work/operation/log/person')">
 							<div class="number">02</div>
 							<div class="value">
 								<div class="hui-ellipsis">xxx在xxx时间处理工单</div>
 							</div>
 						</div>
-						<div class="record-item">
+						<div class="record-item" @click="$router.push('/work/operation/log/person')">
 							<div class="number">03</div>
 							<div class="value">
 								<div class="hui-ellipsis">xxx在xxx时间新增资产</div>
@@ -423,14 +430,22 @@
 					</div>
 				</div>
 			</div>
-		</div>
-		
+		</div>
+		<el-dialog :close-on-click-modal="false" :title="title" :visible.sync="visible"
+			:width="title=='客户详情'?'1100px':'900px'" :append-to-body="true">
+			<cost v-if="title=='本月费用列表' && visible" :nodeType="nodeType"></cost>
+			<client v-if="title=='客户详情' && visible"></client>
+			<remind v-if="title=='事件提醒' && visible" :nodeType="nodeType"></remind>
+		</el-dialog>
 	</div>
 </template>
 
 <script>
 	import progressBar from '@/components/show/progressBar'
 	import weatherIcon from '@/components/common/weatherIcon'
+	import cost from '@/components/work/staging/cost'
+	import client from '@/components/work/staging/client'
+	import remind from '@/components/work/staging/remind'
 	export default {
 		data() {
 			return {
@@ -452,14 +467,33 @@
 					id: 2,
 					name: '月报'
 				}],
-				nowWorkId: 1
+				nowWorkId: 1,
+				title: '',
+				visible: false,
+				nodeType: 1
 			}
 		},
 		created() {},
-		methods: {},
+		methods: {
+			openDialog(type, nodeType) {
+				if (type === 1) {
+					this.title = '本月费用列表';
+					this.nodeType = nodeType;
+				} else if (type === 2) {
+					this.title = '客户详情';
+				} else if (type === 3) {
+					this.title = '事件提醒';
+					this.nodeType = nodeType;
+				}
+				this.visible = true;
+			}
+		},
 		components: {
 			progressBar,
-			weatherIcon
+			weatherIcon,
+			cost,
+			client,
+			remind
 		}
 	}
 </script>
@@ -544,6 +578,7 @@
 			.more {
 				color: $--color-primary;
 				font-size: 12px;
+				cursor: pointer;
 			}
 		}
 
@@ -859,7 +894,7 @@
 
 				.client-list {
 					height: 128px;
-					padding-top: 15px;
+					padding-top: 15px;
 					margin-top: 0;
 				}
 			}