From cfbf7533b8cfc395a110390da23cf6bb641daff9 Mon Sep 17 00:00:00 2001
From: MrShi <1878285526@qq.com>
Date: 星期三, 08 一月 2025 16:05:17 +0800
Subject: [PATCH] Merge branch '2.0.1' of http://139.186.142.91:10010/r/productDev/funingyunwei into 2.0.1
---
admin/src/views/project/components/houseDetails.vue | 741 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++
1 files changed, 741 insertions(+), 0 deletions(-)
diff --git a/admin/src/views/project/components/houseDetails.vue b/admin/src/views/project/components/houseDetails.vue
new file mode 100644
index 0000000..5e61c5c
--- /dev/null
+++ b/admin/src/views/project/components/houseDetails.vue
@@ -0,0 +1,741 @@
+<template>
+ <GlobalWindow
+ title="妤煎畤璇︽儏"
+ :showConfirm="false"
+ :visible.sync="visible"
+ width="800px">
+ <div class="right">
+ <div class="right_head">椤圭洰鍚嶇О</div>
+ <div class="right_cate">
+ <el-tabs v-model="activeName" @tab-click="handleClick">
+ <el-tab-pane label="鎴挎簮淇℃伅" name="houseinfo">
+ <div class="xm">
+ <el-card style="margin-top: 20px;">
+ <div slot="header" class="clearfix">
+ <span>鎴挎簮淇℃伅</span>
+ </div>
+ <div class="xm_info">
+ <div class="xm_info_row" style="width: 25%;">
+ <span>鎵�灞為」鐩�</span>
+ <span>XXXXXXXXXX</span>
+ </div>
+ <div class="xm_info_row" style="width: 25%;">
+ <span>妤煎畤</span>
+ <span>缁煎悎妤�</span>
+ </div>
+ <div class="xm_info_row" style="width: 25%;">
+ <span>妤煎眰</span>
+ <span>1</span>
+ </div>
+ <div class="xm_info_row" style="width: 25%;">
+ <span>鎴垮彿</span>
+ <span>101娲诲姩瀹�</span>
+ </div>
+ <div class="xm_info_row" style="width: 25%; margin-top: 15px;">
+ <span>鎴块棿缂栧彿</span>
+ <span>101</span>
+ </div>
+ <div class="xm_info_row" style="width: 25%; margin-top: 15px;">
+ <span>鏄惁鎷涘晢</span>
+ <span>鍚�</span>
+ </div>
+ <div class="xm_info_row" style="width: 25%; margin-top: 15px;">
+ <span>寤虹瓚闈㈢Н</span>
+ <span>50銕�</span>
+ </div>
+ <div class="xm_info_row" style="width: 25%; margin-top: 15px;">
+ <span>璁＄闈㈢Н</span>
+ <span>50銕�</span>
+ </div>
+ <div class="xm_info_row" style="width: 25%; margin-top: 15px;">
+ <span>璁¤垂闈㈢Н</span>
+ <span>45銕�</span>
+ </div>
+ </div>
+ </el-card>
+ </div>
+ </el-tab-pane>
+ <el-tab-pane label="绉熷鍚堝悓" name="project">
+ <div class="xm">
+ <el-card style="margin-top: 20px;">
+ <div slot="header" class="clearfix">
+ <span>褰撳墠鍦ㄧ鍚堝悓</span>
+ </div>
+ <div class="xm_table">
+ <el-input v-model="input" style="width: 300px; margin-bottom: 15px;" placeholder="璇疯緭鍏ュ悎鍚岀紪鍙�"></el-input>
+ <el-table
+ :data="tableData"
+ border
+ style="width: 100%">
+ <el-table-column
+ prop="date"
+ label="鍚堝悓缂栧彿">
+ </el-table-column>
+ <el-table-column
+ prop="name"
+ label="瀹㈡埛鍚嶇О">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="寮�濮嬫棩鏈�">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="缁撴潫鏃ユ湡">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="绉熻祦鍗曚环">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="绉熻祦闈㈢Н锛堛帯锛�">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="绛捐鏃�">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="鍚堝悓鏉ユ簮">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="鍚堝悓鐘舵��">
+ </el-table-column>
+ </el-table>
+ <div class="xm_table_f">
+ <el-pagination
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ :current-page="page"
+ :page-sizes="[10, 20, 30, 40]"
+ :page-size="pageTotal"
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="total">
+ </el-pagination>
+ </div>
+ </div>
+ </el-card>
+ </div>
+ </el-tab-pane>
+ <el-tab-pane label="宸ュ崟璁板綍" name="second">
+ <div class="xm">
+ <el-card>
+ <div class="xm_one1">
+ <div class="xm_one_row">
+ <span>寰呮寚娲炬暟閲�</span>
+ <span>15</span>
+ </div>
+ <div class="xm_one_row">
+ <span>寰呭鐞嗘暟閲�</span>
+ <span>15</span>
+ </div>
+ <div class="xm_one_row">
+ <span>鏈湀宸ュ崟鏁�</span>
+ <span>15</span>
+ </div>
+ <div class="xm_one_row">
+ <span>绱宸ュ崟鏁�</span>
+ <span>15</span>
+ </div>
+ </div>
+ </el-card>
+ <el-card style="margin-top: 20px;">
+ <div class="xm_table">
+ <div class="xm_table_search">
+ <el-select v-model="value" style="width: 300px; margin-right: 15px;" placeholder="浣嶇疆绫诲瀷">
+ <el-option
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value">
+ </el-option>
+ </el-select>
+ <el-select v-model="value" style="width: 300px;" placeholder="宸ュ崟鍒嗙被">
+ <el-option
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value">
+ </el-option>
+ </el-select>
+ </div>
+ <el-table
+ :data="tableData"
+ border
+ style="width: 100%">
+ <el-table-column
+ prop="date"
+ label="宸ュ崟鍒嗙被">
+ </el-table-column>
+ <el-table-column
+ prop="name"
+ label="鎶ヤ慨鍖哄煙">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="涓婃姤浜�">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="涓婃姤鏃堕棿">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="澶勭悊浜�">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="宸ュ崟鐘舵��">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="鎿嶄綔">
+ </el-table-column>
+ </el-table>
+ <div class="xm_table_f">
+ <el-pagination
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ :current-page="page"
+ :page-sizes="[10, 20, 30, 40]"
+ :page-size="pageTotal"
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="total">
+ </el-pagination>
+ </div>
+ </div>
+ </el-card>
+ </div>
+ </el-tab-pane>
+ <el-tab-pane label="璁惧淇℃伅" name="third">
+ <div class="xm">
+ <div class="xm_chat">
+ <el-card class="xm_chat_row">
+ <div id="chat1"></div>
+ </el-card>
+ <el-card class="xm_chat_row">
+ <div id="chat2"></div>
+ </el-card>
+ </div>
+ <el-card style="margin-top: 20px;">
+ <div class="xm_table">
+ <div class="xm_table_search">
+ <div class="xm_table_search_left">
+ <el-input v-model="input" placeholder="璇疯緭鍏ヨ澶囧悕绉�/缂栫爜" style="width: 200px; margin-right: 15px;"></el-input>
+ <el-select v-model="value" style="width: 200px; margin-right: 15px;" placeholder="璁惧鐘舵��">
+ <el-option
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value">
+ </el-option>
+ </el-select>
+ <el-button type="primary">鏌ヨ</el-button>
+ <el-button>娓呯┖</el-button>
+ </div>
+ <el-button type="primary">鏂板</el-button>
+ </div>
+ <el-table
+ :data="tableData"
+ border
+ style="width: 100%">
+ <el-table-column
+ prop="date"
+ label="宸ュ崟鍒嗙被">
+ </el-table-column>
+ <el-table-column
+ prop="name"
+ label="鎶ヤ慨鍖哄煙">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="涓婃姤浜�">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="涓婃姤鏃堕棿">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="澶勭悊浜�">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="宸ュ崟鐘舵��">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="鎿嶄綔">
+ </el-table-column>
+ </el-table>
+ <div class="xm_table_f">
+ <el-pagination
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ :current-page="page"
+ :page-sizes="[10, 20, 30, 40]"
+ :page-size="pageTotal"
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="total">
+ </el-pagination>
+ </div>
+ </div>
+ </el-card>
+ </div>
+ </el-tab-pane>
+ <el-tab-pane label="璧勪骇淇℃伅" name="fourth">
+ <div class="xm">
+ <el-card>
+ <div slot="header" class="clearfix">
+ <span>璧勪骇娓呭崟</span>
+ </div>
+ <div class="xm_table">
+ <div class="xm_table_search">
+ <div class="xm_table_search_left">
+ <el-input v-model="input" placeholder="璇疯緭鍏ヨ祫浜у悕绉�/缂栫爜" style="width: 200px; margin-right: 15px;"></el-input>
+ <el-select v-model="value" style="width: 200px; margin-right: 15px;" placeholder="璧勪骇鍒嗙被">
+ <el-option
+ v-for="item in options"
+ :key="item.value"
+ :label="item.label"
+ :value="item.value">
+ </el-option>
+ </el-select>
+ <el-button type="primary">鏌ヨ</el-button>
+ <el-button>娓呯┖</el-button>
+ </div>
+ <el-button type="primary">鏂板</el-button>
+ </div>
+ <el-table
+ :data="tableData"
+ border
+ style="width: 100%">
+ <el-table-column
+ prop="date"
+ label="璧勪骇缂栫爜">
+ </el-table-column>
+ <el-table-column
+ prop="name"
+ label="璧勪骇鍚嶇О">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="鏉＄爜">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="鍝佺墝">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="瑙勬牸鍨嬪彿">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="鍗曚綅">
+ </el-table-column>
+ <el-table-column
+ prop="address"
+ label="搴撳瓨鏁伴噺">
+ </el-table-column>
+ </el-table>
+ <div class="xm_table_f">
+ <el-pagination
+ @size-change="handleSizeChange"
+ @current-change="handleCurrentChange"
+ :current-page="page"
+ :page-sizes="[10, 20, 30, 40]"
+ :page-size="pageTotal"
+ layout="total, sizes, prev, pager, next, jumper"
+ :total="total">
+ </el-pagination>
+ </div>
+ </div>
+ </el-card>
+ </div>
+ </el-tab-pane>
+ </el-tabs>
+ </div>
+ </div>
+ </GlobalWindow>
+</template>
+
+<script>
+ import BaseOpera from '@/components/base/BaseOpera'
+ import GlobalWindow from '@/components/common/GlobalWindow'
+ import * as echarts from 'echarts';
+ export default {
+ name: "houseDetails",
+ extends: BaseOpera,
+ components: { GlobalWindow },
+ data() {
+ return {
+ info: {},
+ activeName: 'houseinfo',
+ total: 0,
+ pageTotal: 10,
+ page: 1,
+ tableData: []
+ }
+ },
+ methods: {
+ open (title, target) {
+ this.title = title
+ this.visible = true
+ this.$nextTick(() => {
+ this.reand()
+ this.reand1()
+ })
+ },
+ reand() {
+ var chartDom = document.getElementById('chat1');
+ var myChart = echarts.init(chartDom);
+ var option;
+ option = {
+ tooltip: {
+ trigger: 'item'
+ },
+ legend: {
+ top: '5%',
+ left: 'center'
+ },
+ series: [
+ {
+ name: 'Access From',
+ type: 'pie',
+ radius: ['40%', '80%'],
+ avoidLabelOverlap: false,
+ label: {
+ show: false,
+ position: 'center'
+ },
+ emphasis: {
+ label: {
+ show: true,
+ fontSize: 40,
+ fontWeight: 'bold'
+ }
+ },
+ labelLine: {
+ show: false
+ },
+ data: [
+ { value: 1048, name: '姝ｅ父' },
+ { value: 735, name: '寮傚父' },
+ { value: 580, name: '鎶ュ簾' }
+ ]
+ }
+ ]
+ };
+ option && myChart.setOption(option);
+ },
+ reand1() {
+ var chartDom = document.getElementById('chat2');
+ var myChart = echarts.init(chartDom);
+ var option;
+ // There should not be negative values in rawData
+ const rawData = [
+ [100, 302, 301, 334, 390, 330, 320],
+ [320, 132, 101, 134, 90, 230, 210],
+ [220, 182, 191, 234, 290, 330, 310],
+ [150, 212, 201, 154, 190, 330, 410],
+ [820, 832, 901, 934, 1290, 1330, 1320]
+ ];
+ const totalData = [];
+ for (let i = 0; i < rawData[0].length; ++i) {
+ let sum = 0;
+ for (let j = 0; j < rawData.length; ++j) {
+ sum += rawData[j][i];
+ }
+ totalData.push(sum);
+ }
+ const grid = {
+ left: 100,
+ right: 100,
+ top: 50,
+ bottom: 50
+ };
+ const series = [
+ 'Direct',
+ 'Mail Ad',
+ 'Affiliate Ad',
+ 'Video Ad',
+ 'Search Engine'
+ ].map((name, sid) => {
+ return {
+ name,
+ type: 'bar',
+ stack: 'total',
+ barWidth: '60%',
+ label: {
+ show: true,
+ formatter: (params) => Math.round(params.value * 1000) / 10 + '%'
+ },
+ data: rawData[sid].map((d, did) =>
+ totalData[did] <= 0 ? 0 : d / totalData[did]
+ )
+ };
+ });
+ option = {
+ legend: {
+ selectedMode: false
+ },
+ grid,
+ yAxis: {
+ type: 'value'
+ },
+ xAxis: {
+ type: 'category',
+ data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
+ },
+ series
+ };
+
+ option && myChart.setOption(option);
+ },
+ handleClick(tab, event) {
+ console.log(tab, event);
+ },
+ handleCurrentChange(page) {
+ this.page = page
+ },
+ handleSizeChange(pageTotal) {
+ this.pageTotal = pageTotal
+ },
+ }
+ }
+</script>
+
+<style lang="scss" scoped>
+ .right {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ .right_head {
+ width: 100%;
+ padding: 20px;
+ box-sizing: border-box;
+ font-size: 16px;
+ font-weight: bold;
+ color: black;
+ background: #ffffff;
+ }
+ .right_cate {
+ width: 100%;
+ padding: 0 20px 20px 20px;
+ box-sizing: border-box;
+ background: #ffffff;
+ .xm {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ .xm_house {
+ width: 100%;
+ display: flex;
+ flex-direction: column;
+ align-items: self-end;
+ .xm_house_list {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ margin-top: 10px;
+ .xm_house_list_left {
+ flex-shrink: 0;
+ width: 100px;
+ display: flex;
+ margin-right: 20px;
+ flex-direction: column;
+ .xm_house_list_left_row {
+ width: 100px;
+ height: 100px;
+ background: rgba(242, 242, 242, 1);
+ padding: 20px 0;
+ box-sizing: border-box;
+ margin-bottom: 20px;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: space-between;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ span {
+ &:nth-child(1) {
+ font-size: 18px;
+ color: #333333;
+ font-weight: 400;
+ }
+ &:nth-child(2) {
+ font-size: 12px;
+ color: #929292;
+ }
+ }
+ }
+ }
+ .xm_house_list_right {
+ width: calc(100% - 130px);
+ display: flex;
+ flex-direction: column;
+ .item {
+ width: calc(100% - 130px);
+ display: flex;
+ align-items: center;
+ margin-bottom: 20px;
+ &:last-child {
+ margin-bottom: 0;
+ }
+ .xm_house_list_right_row {
+ height: 100px;
+ width: 300px;
+ background: rgba(198, 224, 167, 0.34509803921568627);
+ padding: 10px 0;
+ box-sizing: border-box;
+ display: flex;
+ align-items: center;
+ flex-direction: column;
+ justify-content: space-between;
+ span {
+ font-size: 14px;
+ color: #000000;
+ }
+ .xm_house_list_right_row_info {
+ display: flex;
+ flex-direction: column;
+ span {
+ &:nth-child(1) {
+ color: #000000;
+ font-size: 14px;
+ }
+ &:nth-child(2) {
+ color: #A5A5A5;
+ font-size: 12px;
+ margin-top: 3px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+ .xm_house_tips {
+ display: flex;
+ align-items: center;
+ .xm_house_tips_row {
+ margin-left: 30px;
+ display: flex;
+ align-items: center;
+ .xm_house_tips_row_d {
+ width: 10px;
+ height: 10px;
+ background: orange;
+ margin-right: 5px;
+ }
+ span {
+ font-size: 16px;
+ color: black;
+ }
+ }
+ }
+ }
+ .xm_chat {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ .xm_chat_row {
+ width: 49%;
+ height: 300px;
+ #chat1 {
+ width: 100%;
+ height: 260px;
+ }
+ #chat2 {
+ width: 100%;
+ height: 260px;
+ }
+ }
+ }
+ .xm_one {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ .xm_one_row {
+ flex: 1;
+ display: flex;
+ flex-direction: column;
+ span {
+ font-size: 16px;
+ color: black;
+ &:nth-child(2) {
+ font-weight: bold;
+ margin: 15px 0;
+ }
+ &:nth-child(3) {
+ color: #666666;
+ }
+ }
+ }
+ }
+ .xm_one1 {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ .xm_one_row {
+ flex: 1;
+ display: flex;
+ align-items: center;
+ justify-content: center;
+ flex-direction: column;
+ span {
+ font-size: 16px;
+ color: black;
+ &:nth-child(2) {
+ font-size: 18px;
+ font-weight: bold;
+ margin-top: 15px;
+ }
+ }
+ }
+ }
+ .xm_table {
+ width: 100%;
+ .xm_table_search {
+ width: 100%;
+ display: flex;
+ align-items: center;
+ justify-content: space-between;
+ margin-bottom: 15px;
+ }
+ .xm_table_f {
+ width: 100%;
+ text-align: right;
+ }
+ }
+ .xm_info {
+ width: 100%;
+ display: flex;
+ flex-wrap: wrap;
+ align-items: center;
+ .xm_info_row {
+ display: flex;
+ flex-direction: column;
+ span {
+ font-size: 16px;
+ &:nth-child(1) {
+ color: #666666;
+ }
+ &:nth-child(2) {
+ color: #000000;
+ margin-top: 15px;
+ }
+ }
+ }
+ }
+ }
+ }
+ }
+</style>
--
Gitblit v1.9.3