angelo
/
web-zk-admin
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Merge branch 'dev' of 47.94.45.65:angelo/web-zk-admin into test

This commit is contained in:
woody 2025-09-23 10:52:08 +08:00
parent b8dcf545b0 f479b22418
commit 3bd44b7a81
8 changed files with 485 additions and 325 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.env.development
View File

@ -3,6 +3,6 @@ ENV = 'development'
VUE_APP_BASE_API = '/prod-api'
VUE_APP_ADDRESS1 = 'https://t-zk.beida666.com/#/'
VUE_APP_SYSTEM_TYPE = 'KG'
VUE_APP_SYSTEM_TYPE = 'ZK'
# 会员H5端： t-zk.beida666.com
# 管理后台： t-zk-mana.beida666.com

2
.env.production
View File

@ -4,6 +4,6 @@ ENV = 'production'
# base api
VUE_APP_BASE_API = '/prod-api'
VUE_APP_ADDRESS1 = 'https://t-zk.beida666.com/#/'
VUE_APP_SYSTEM_TYPE = 'KG'
VUE_APP_SYSTEM_TYPE = 'ZK'
# 会员H5端： t-zk.beida666.com
# 管理后台： t-zk-mana.beida666.com

83
src/api/archityecture.js
View File

@ -1,54 +1,63 @@
import request from '@/utils/request'
//推荐架构1
// 推荐架构1
export function getTjFramework(params) {
return request({
url: '/member/manage/member-structure/tj-framework',
method: 'get',
params
})
return request({
url: '/member/manage/member-structure/tj-framework',
method: 'get',
params
})
}
//安置架构1
// 安置架构1
export function getAzFramework(params) {
return request({
url: '/member/manage/member-structure/az-framework',
method: 'get',
params
})
return request({
url: '/member/manage/member-structure/three-framework',
method: 'get',
params
})
}
//安置架构5
// 安置架构5
export function getAzFramework5(params) {
return request({
url: '/member/manage/member-structure/az-framework-five',
method: 'get',
params
})
return request({
url: '/member/manage/member-structure/az-framework-five',
method: 'get',
params
})
}
//架构等级展示
// 架构等级展示
export function getAvarerInfo(params) {
return request({
url: '/member/manage/member-structure/get-avatar-info',
method: 'get',
params
})
return request({
url: '/member/manage/member-structure/get-avatar-info',
method: 'get',
params
})
}
//结算期数下拉选
// 结算期数下拉选
export function getMemberSettlePeriod(params) {
return request({
url: '/member/manage/member-structure/get-member-settle-period',
method: 'get',
params
})
return request({
url: '/member/manage/member-structure/get-member-settle-period',
method: 'get',
params
})
}
//转换为base64格式用于图片下载
// 转换为base64格式用于图片下载
export function getUrlBase(data) {
return request({
url: '/member/manage/member-structure/get-url-base64',
method: 'post',
data
})
}
return request({
url: '/member/manage/member-structure/get-url-base64',
method: 'post',
data
})
}
// 查询会员子点位
export function getChildList(params) {
return request({
url: '/member/manage/member-structure/childList',
method: 'get',
params
})
}

4
src/router/index.js
View File

@ -588,7 +588,7 @@ export const constantRoutes = [
{
path: 'architecture',
name: 'Arcgurecture',
meta: { title: '安置架构' },
meta: { title: '阶段架构' },
component: ParentView,
redirect: 'architecture/index',
children: [
@ -596,7 +596,7 @@ export const constantRoutes = [
path: 'azjg',
name: 'PlacementStructure',
component: () => import('@/views/framework/architecture/index'),
meta: { title: '安置架构' }
meta: { title: '阶段架构' }
},
{
path: 'azjg2',

121
src/views/framework/architecture/components/member-info-dialog.vue Normal file
View File

@ -0,0 +1,121 @@
<template>
<el-dialog
:visible.sync="ifShow"
:close-on-click-modal="false"
width="516px"
>
<div class="rendercontent">
<div ref="htmlContent">
<div class="toprender">
<div class="leftimg">
<img
class="img1"
:src="'data:image/png;base64,' + treeData.avatarUrlBase64"
>
<img
class="img2"
:src="'data:image/png;base64,' + treeData.countryUrl2Base64"
>
</div>
<div class="centerbox">
<div class="lineboex">
<div class="linetitle">会员编号</div>
<div class="linecontent">{{ treeData.memberCode }}</div>
</div>
<div class="lineboex">
<div class="linetitle">会员姓名</div>
<div class="linecontent">{{ treeData.name }}</div>
</div>
<div class="lineboex">
<div class="linetitle">安置部门</div>
<div class="linecontent">{{ `第${treeData.placeDept}部门` }}</div>
</div>
<div class="lineboex">
<div class="linetitle">{{ '支付日期' }}</div>
<div class="linecontent">{{ treeData.payDate }}</div>
</div>
</div>
<div class="rightimg">
<img
:src="
'data:image/png;base64,' + treeData.settleCountryUrl2Base64
"
>
<div>{{ '结算国家' }}</div>
</div>
</div>
<div class="bottomrender">
<div class="flexbox">
<div class="thetitle">{{ '业绩' }}({{ isLocals() }})</div>
<div class="linecontent">{{ '真实新增' }}</div>
<div class="linecontent">首购新增</div>
<div class="linecontent">复购新增</div>
<div class="linecontent">真实累计</div>
<div class="linecontent">首购累计</div>
<div class="linecontent">复购累计</div>
<div class="linecontent">首购结余</div>
<div class="linecontent">复购结余</div>
<!-- <div class="linecontent">新増套数</div>
<div class="linecontent">累计套数</div> -->
</div>
<div class="flexbox">
<div class="thetitle">左区</div>
<div class="linecontent">{{ treeData.leftRealNewPv }}</div>
<div class="linecontent">{{ treeData.leftFirstPurchaseAdd }}</div>
<div class="linecontent">
{{ treeData.leftRepeatPurchaseAdd }}
</div>
<div class="linecontent">{{ treeData.leftRealTotal || 0 }}</div>
<div class="linecontent">{{ treeData.leftFirstTotal || 0 }}</div>
<div class="linecontent">
{{ treeData.leftRepeatPurchaseTotal || 0 }}
</div>
<div class="linecontent">{{ treeData.leftFirstSurplus || 0 }}</div>
<div class="linecontent">
{{ treeData.leftRepeatPurchaseSurplus || 0 }}
</div>
<!-- <div class="linecontent">{{ treeData.aNewBox || 0 }}</div>
<div class="linecontent">{{ treeData.aSumBox || 0 }}</div> -->
</div>
<div class="flexbox">
<div class="thetitle">右区</div>
<div class="linecontent">{{ treeData.rightRealNewPv }}</div>
<div class="linecontent">
{{ treeData.rightFirstPurchaseAdd }}
</div>
<div class="linecontent">
{{ treeData.rightRepeatPurchaseAdd }}
</div>
<div class="linecontent">{{ treeData.rightRealTotal }}</div>
<div class="linecontent">{{ treeData.rightFirstTotal }}</div>
<div class="linecontent">
{{ treeData.rightRepeatPurchaseTotal }}
</div>
<div class="linecontent">{{ treeData.rightFirstSurplus }}</div>
<div class="linecontent">
{{ treeData.rightRepeatPurchaseSurplus }}
</div>
<!-- <div class="linecontent">{{ treeData.bNewBox || 0 }}</div>
<div class="linecontent">{{ treeData.bSumBox || 0 }}</div> -->
</div>
</div>
</div>
<div class="footerbox">
<div class="footerbtn btn1" @click="downloadImage">下载图片</div>
<div class="footerbtn btn2" @click="copyText">复制文字</div>
<!-- <div class="footerbtn btn3" @click="goTop(treeData)">置顶</div> -->
</div>
</div>
</el-dialog>
</template>
<script>
export default {
}
</script>
<style>
</style>

588
src/views/framework/architecture/index.vue
View File

@ -8,22 +8,12 @@
<div class="thetopbox">
<el-form ref="form" :model="queryParams" label-width="100px">
<el-row>
<el-col :span="4">
<TopMemberSelect ref="topMemberSelect" @change="TopMemberHandleChange" />
</el-col>
<el-col :span="4">
<el-form-item :label="'会员编号'" prop="memberCode">
<el-input
v-model="queryParams.memberCode"
clearable
/></el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="'结算期数'" prop="memberSettlePeriodId">
<el-select
v-model="queryParams.memberSettlePeriodId"
clearable
:placeholder="'请选择'"
@change="getChildNodeList"
>
<el-option
v-for="item in memberSettlePeriodList"
@ -35,21 +25,59 @@
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="'展示层数'" prop="level">
<el-form-item :label="'会员编号'" prop="memberCode">
<el-input
v-model="queryParams.level"
v-model="queryParams.memberCode"
clearable
/></el-form-item></el-col>
@blur="getChildNodeList"
/>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item :label="'是否固定'" prop="cantz">
<el-select v-model="cantz" clearable :placeholder="'请选择'">
<el-form-item label="阶段" prop="stage">
<el-select
v-model="queryParams.stage"
placeholder="请选择"
@change="getChildNodeList"
>
<el-option
v-for="(item, index) in tzList"
v-for="(item, index) in levelList"
:key="index"
:label="item.label"
:value="item.value"
/>
</el-select> </el-form-item></el-col>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="状态" prop="stageStatus">
<el-select
v-model="queryParams.stageStatus"
:placeholder="'请选择'"
@change="getChildNodeList"
>
<el-option
v-for="(item, index) in statusEnum"
:key="index"
:label="item.label"
:value="item.value"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-form-item label="子点位" prop="childNode">
<el-select v-model="queryParams.childNode" clearable filterable :placeholder="'请选择'">
<el-option
v-for="(item, index) in childNodeList"
:key="index"
:label="item.childNode"
:value="item.childNode"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4" style="margin-left: 30px">
<div class="searchbox">
<el-button
@ -58,7 +86,6 @@
@click="getSearch"
> {{ '搜索' }}</el-button>
<el-button @click="resetHandle"> {{ '重置' }}</el-button>
<el-button @click="goback"> {{ '返回' }}</el-button>
</div>
</el-col>
</el-row>
@ -66,14 +93,13 @@
</div>
<div class="lefttop">
<div v-for="(item, index) in avaerInfoList" :key="index" class="single">
<img :src="item.value" alt="">
<div class="singletitle">{{ item.name }}</div>
<!-- <img :src="item.value" alt=""> -->
<!-- <div class="singletitle">{{ item.name }}</div> -->
</div>
</div>
<!-- <el-scrollbar style="width: 100%; height: 100%"> -->
<div class="tree">
<div class="tree-content" @wheel="handleWheel" @mousedown.stop="move">
<div :style="{ transform: `scale(${scale})` }">
<div :style="{ transform: `scale(${scale})`, height: '100%' }">
<vue2-org-tree
ref="orgTree"
style="height: 100%"
@ -89,115 +115,7 @@
</div>
</div>
<!-- </el-scrollbar> -->
<el-dialog
:visible.sync="ifShow"
:close-on-click-modal="false"
width="516px"
>
<div class="rendercontent">
<div ref="htmlContent">
<div class="toprender">
<div class="leftimg">
<img
class="img1"
:src="'data:image/png;base64,' + treeData.avatarUrlBase64"
>
<img
class="img2"
:src="'data:image/png;base64,' + treeData.countryUrl2Base64"
>
</div>
<div class="centerbox">
<div class="lineboex">
<div class="linetitle">会员编号</div>
<div class="linecontent">{{ treeData.memberCode }}</div>
</div>
<div class="lineboex">
<div class="linetitle">会员姓名</div>
<div class="linecontent">{{ treeData.name }}</div>
</div>
<div class="lineboex">
<div class="linetitle">安置部门</div>
<div class="linecontent">{{ `第${treeData.placeDept}部门` }}</div>
</div>
<div class="lineboex">
<div class="linetitle">{{ '支付日期' }}</div>
<div class="linecontent">{{ treeData.payDate }}</div>
</div>
</div>
<div class="rightimg">
<img
:src="
'data:image/png;base64,' + treeData.settleCountryUrl2Base64
"
>
<div>{{ '结算国家' }}</div>
</div>
</div>
<div class="bottomrender">
<div class="flexbox">
<div class="thetitle">{{ '业绩' }}({{ isLocals() }})</div>
<div class="linecontent">{{ '真实新增' }}</div>
<div class="linecontent">首购新增</div>
<div class="linecontent">复购新增</div>
<div class="linecontent">真实累计</div>
<div class="linecontent">首购累计</div>
<div class="linecontent">复购累计</div>
<div class="linecontent">首购结余</div>
<div class="linecontent">复购结余</div>
<!-- <div class="linecontent">新増套数</div>
<div class="linecontent">累计套数</div> -->
</div>
<div class="flexbox">
<div class="thetitle">左区</div>
<div class="linecontent">{{ treeData.leftRealNewPv }}</div>
<div class="linecontent">{{ treeData.leftFirstPurchaseAdd }}</div>
<div class="linecontent">
{{ treeData.leftRepeatPurchaseAdd }}
</div>
<div class="linecontent">{{ treeData.leftRealTotal || 0 }}</div>
<div class="linecontent">{{ treeData.leftFirstTotal || 0 }}</div>
<div class="linecontent">
{{ treeData.leftRepeatPurchaseTotal || 0 }}
</div>
<div class="linecontent">{{ treeData.leftFirstSurplus || 0 }}</div>
<div class="linecontent">
{{ treeData.leftRepeatPurchaseSurplus || 0 }}
</div>
<!-- <div class="linecontent">{{ treeData.aNewBox || 0 }}</div>
<div class="linecontent">{{ treeData.aSumBox || 0 }}</div> -->
</div>
<div class="flexbox">
<div class="thetitle">右区</div>
<div class="linecontent">{{ treeData.rightRealNewPv }}</div>
<div class="linecontent">
{{ treeData.rightFirstPurchaseAdd }}
</div>
<div class="linecontent">
{{ treeData.rightRepeatPurchaseAdd }}
</div>
<div class="linecontent">{{ treeData.rightRealTotal }}</div>
<div class="linecontent">{{ treeData.rightFirstTotal }}</div>
<div class="linecontent">
{{ treeData.rightRepeatPurchaseTotal }}
</div>
<div class="linecontent">{{ treeData.rightFirstSurplus }}</div>
<div class="linecontent">
{{ treeData.rightRepeatPurchaseSurplus }}
</div>
<!-- <div class="linecontent">{{ treeData.bNewBox || 0 }}</div>
<div class="linecontent">{{ treeData.bSumBox || 0 }}</div> -->
</div>
</div>
</div>
<div class="footerbox">
<div class="footerbtn btn1" @click="downloadImage">下载图片</div>
<div class="footerbtn btn2" @click="copyText">复制文字</div>
<!-- <div class="footerbtn btn3" @click="goTop(treeData)">置顶</div> -->
</div>
</div>
</el-dialog>
<div v-show="false" ref="copyContent" class="copyContent">
<div>{{ '会员编号' }}：{{ treeData.memberCode }}</div>
<div>{{ '会员姓名' }}：{{ treeData.name }}</div>
@ -247,22 +165,18 @@
</template>
<script>
import html2canvas from 'html2canvas'
import topBar from '@/components/topBar'
import {
getAzFramework,
getAvarerInfo,
getMemberSettlePeriod,
getUrlBase
getChildList
} from '@/api/archityecture'
import TopMemberSelect from '@/components/top-member-select/index.vue'
import { isLocals } from '../../../utils/numberToCurrency'
import tabBarMixin from './mixins/tab-bar'
export default {
name: 'Azjg',
components: {
topBar,
TopMemberSelect
topBar
},
mixins: [tabBarMixin],
data() {
@ -270,10 +184,20 @@ export default {
moren: 'azjg',
queryParams: {
memberSettlePeriodId: '', // 期数
memberCode: '', // 会员编号
level: 7,
type: 1
memberCode: 'KG71227311', // 会员编号
stage: 1,
stageStatus: '',
childNode: ''
},
levelList: [
{ value: 1, label: '一阶段' },
{ value: 2, label: '二阶段' },
{ value: 3, label: '三阶段' }
],
statusEnum: [
{ value: 0, label: '已完成' },
{ value: 1, label: '未完成' }
],
basicSwitch: false,
basicInfo: { id: null, label: null },
data: {},
@ -281,33 +205,31 @@ export default {
ifShow: false,
avaerInfoList: [],
memberSettlePeriodList: [], // 期数
cantz: 0, // 0不可拖拽,1可拖拽
tzList: [
{ value: 0, label: '是' },
{ value: 1, label: '否' }
],
scale: 1,
loading: false
loading: false,
childNodeList: []
}
},
created() {
// this.getSearch()
this.getAvarerInfo()
getMemberSettlePeriod().then((res) => {
if (res.code === 200) {
this.memberSettlePeriodList = (res.data || []).filter(item => item.isThisDay !== 0)
this.queryParams.memberSettlePeriodId = this.memberSettlePeriodList[0].pkId
}
})
},
methods: {
TopMemberHandleChange(val) {
if (val) {
this.queryParams.memberCode = val
this.getSearch()
}
},
handleWheel(event) {
if (this.cantz == 1) {
event.preventDefault()
const delta = Math.sign(event.deltaY)
const newScale = this.scale - delta * 0.1
this.scale = Math.max(0.01, Math.min(newScale, 10))
}
// 暂时禁用滚轮缩放功能
// event.preventDefault()
// const delta = Math.sign(event.deltaY)
// const newScale = this.scale - delta * 0.1
// this.scale = Math.max(0.01, Math.min(newScale, 10))
return
},
isLocals,
copyText() {
@ -334,69 +256,8 @@ export default {
}
tempInput.remove()
window.getSelection().removeAllRanges()
// const targetElement = document.querySelector(".copyContent");
// // 创建一个 Range 对象并选择要复制的元素
// const range = document.createRange();
// range.selectNode(targetElement);
// // 将 Range 对象添加到选区中
// const selection = window.getSelection();
// selection.removeAllRanges();
// selection.addRange(range);
// // 获取选区中的HTML内容
// const htmlContent = targetElement.innerHTML;
// // 使用 Clipboard API 将HTML内容复制到剪贴板中
// navigator.clipboard
// .write([
// new ClipboardItem({
// "text/html": new Blob([htmlContent], { type: "text/html" }),
// }),
// ])
// .then(() => {
// this.$message({
// message: "文字复制成功",
// type: "success",
// });
// })
// .catch((error) => {
// this.$message({
// message: "文字复制失败",
// type: "warning",
// });
// });
},
// // 清除选区
// selection.removeAllRanges();
},
async downloadImage() {
const element = this.$refs.htmlContent
// 使用html2canvas将节点生成为图片
const canvas = await html2canvas(element)
const image = canvas.toDataURL('image/png')
// 复制图片到剪贴板
try {
await navigator.clipboard.write([
new ClipboardItem({
'image/png': await new Promise((resolve) =>
canvas.toBlob(resolve, 'image/png')
)
})
])
this.$message({
message: '复制成功',
type: 'success'
})
} catch (error) {
// this.$message({
// message: "复制失败",
// type: "warning",
// });
}
// 下载图片到本地
const link = document.createElement('a')
link.href = image
link.download = 'image.png'
link.click()
},
// 返回
goback() {
this.queryParams.memberCode = this.data.parentMemberCode
@ -405,9 +266,6 @@ export default {
// 拖拽移动
move(e) {
if (this.cantz == 0) {
return
}
const odiv = e.currentTarget // 获取元素
console.log(e)
@ -433,19 +291,7 @@ export default {
document.onmouseup = null
}
},
getAvarerInfo() {
getAvarerInfo().then((res) => {
this.avaerInfoList = res.data
})
getMemberSettlePeriod().then((res) => {
this.memberSettlePeriodList = res.data
this.memberSettlePeriodList.forEach((ele) => {
if (ele.isThisDay == 0) {
this.queryParams.memberSettlePeriodId = ele.pkId
}
})
})
},
// 鼠标移入
onMouseover(e, data) {
this.basicInfo = data
@ -457,15 +303,41 @@ export default {
},
// 渲染节点
renderContent(h, data) {
return (
<div class='neibox'>
<img
on-click={() => this.showPover(data)}
on-contextmenu={() => this.rightClick(this.$event, data)}
src={data.avatarUrl}
></img>
</div>
)
if (Object.keys(data).length > 0) {
return (
<div class='render-content-item'>
{/* 节点编号 */}
{data.nodeCode !== '0-root' && (
<div class='node-code'>
<span>{data.nodeCode}</span>
</div>
)}
{/* 会员信息或空点位 */}
<div class='node-content'>
{data.memberCode && data.memberName ? (
<div class='member-info'>
<div class='member-details'>
<div class='member-code'>{data.memberCode}</div>
<div class='member-name'>{data.memberName}</div>
</div>
</div>
) : (
<div class='empty-node'>
<div class='empty-avatar'>
<i class='el-icon-plus'></i>
</div>
<div class='empty-text'>空点位</div>
<div class='status-indicator inactive'></div>
</div>
)}
</div>
</div>)
} else {
return null
}
},
// 右键点击
rightClick(e, data) {
@ -473,20 +345,7 @@ export default {
this.queryParams.memberCode = data.memberCode
this.getSearch()
},
showPover(row) {
getUrlBase({
countryUrl2: row.countryUrl2,
settleCountryUrl2: row.settleCountryUrl2,
avatarUrl: row.avatarUrl
}).then((res) => {
this.treeData = row
this.treeData.countryUrl2Base64 = res.countryUrl2Base64
this.treeData.settleCountryUrl2Base64 = res.settleCountryUrl2Base64
this.treeData.avatarUrlBase64 = res.avatarUrlBase64
this.ifShow = true
})
},
// 点击节点
NodeClick(e, data) {},
// 默认展开
@ -515,17 +374,15 @@ export default {
},
// 展开
onExpand(e, data) {
// if ("expand" in data) {
// data.expand = !data.expand;
// if (!data.expand && data.children) {
// this.collapse(data.children);
// }
// } else {
// this.$set(data, "expand", true);
// }
},
getSearch() {
console.log(this.queryParams, '...this.')
if (!this.queryParams.childNode || !this.queryParams.memberCode) {
this.$message.warning('会员编号和子点位不能为空')
return
}
this.loading = true
getAzFramework(this.queryParams).then((res) => {
this.data = res.data[0]
this.toggleExpand(this.data, true)
@ -533,15 +390,26 @@ export default {
this.loading = false
})
},
resetHandle() {
this.$refs.topMemberSelect.reset()
this.queryParams = {
memberSettlePeriodId: '', // 期数
memberCode: '', // 会员编号
level: 7,
stage: 7,
type: 1
}
this.getSearch()
},
getChildNodeList() {
if (!this.queryParams.memberCode) {
return
}
getChildList(this.queryParams).then((res) => {
if (res.code === 200) {
this.childNodeList = res.data || []
}
})
}
}
}
@ -590,14 +458,11 @@ export default {
display: block;
}
::v-deep .org-tree-node-label-inner {
background: rgba(0, 0, 0, 0);
// list-style-type: none;
border-radius: 50%;
background: transparent !important;
padding: 0 !important;
border: none;
width: 5.6px;
height: 25px;
box-shadow: none !important;
display: flex;
align-items: center;
justify-content: center;
@ -613,16 +478,181 @@ export default {
background: rgba(1, 1, 1, 0) !important;
overflow-x: auto;
}
::v-deep .neibox {
padding: 0;
::v-deep .render-content-item {
border-radius: 12px;
margin: auto;
z-index: 99;
img {
width: 36px;
height: 36px;
margin-top: -6px;
border-radius: 50%;
padding: 0;
border: none;
max-width: 200px;
text-align: center;
background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
transition: all 0.3s ease;
overflow: hidden;
position: relative;
&:hover {
transform: translateY(-2px);
box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
}
&::before {
content: '';
position: absolute;
top: 0;
left: 0;
right: 0;
height: 3px;
background: linear-gradient(90deg, #ff6b6b, #4ecdc4, #45b7d1, #96ceb4);
}
.node-code {
background: rgba(255, 255, 255, 0.1);
padding: 8px 12px;
display: flex;
align-items: center;
justify-content: center;
gap: 6px;
font-size: 12px;
font-weight: 600;
color: rgba(255, 255, 255, 0.9);
backdrop-filter: blur(10px);
border-bottom: 1px solid rgba(255, 255, 255, 0.1);
i {
font-size: 14px;
color: #ffd700;
}
span {
letter-spacing: 0.5px;
}
}
.node-content {
padding: 16px;
background: rgba(255, 255, 255, 0.95);
backdrop-filter: blur(10px);
position: relative;
}
.member-info {
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
position: relative;
.member-avatar {
width: 48px;
height: 48px;
border-radius: 50%;
background: linear-gradient(135deg, #667eea, #764ba2);
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 4px;
box-shadow: 0 4px 16px rgba(102, 126, 234, 0.3);
i {
font-size: 24px;
color: white;
}
}
.member-details {
text-align: center;
.member-code {
font-size: 13px;
font-weight: 600;
color: #2c3e50;
margin-bottom: 2px;
letter-spacing: 0.3px;
}
.member-name {
font-size: 12px;
color: #7f8c8d;
font-weight: 500;
}
}
.status-indicator.active {
position: absolute;
top: -2px;
right: -2px;
width: 12px;
height: 12px;
background: #27ae60;
border-radius: 50%;
border: 2px solid white;
box-shadow: 0 2px 8px rgba(39, 174, 96, 0.3);
animation: pulse-green 2s infinite;
}
}
.empty-node {
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
opacity: 0.8;
position: relative;
.empty-avatar {
width: 48px;
height: 48px;
border-radius: 50%;
background: linear-gradient(135deg, #bdc3c7, #95a5a6);
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 4px;
border: 2px dashed #95a5a6;
transition: all 0.3s ease;
i {
font-size: 20px;
color: white;
}
}
.empty-text {
font-size: 12px;
color: #7f8c8d;
font-weight: 500;
}
.status-indicator.inactive {
position: absolute;
top: -2px;
right: -2px;
width: 12px;
height: 12px;
background: #95a5a6;
border-radius: 50%;
border: 2px solid white;
box-shadow: 0 2px 8px rgba(149, 165, 166, 0.3);
}
&:hover .empty-avatar {
background: linear-gradient(135deg, #3498db, #2980b9);
border-color: #3498db;
transform: scale(1.05);
}
}
}
@keyframes pulse-green {
0%, 100% {
opacity: 1;
transform: scale(1);
}
50% {
opacity: 0.7;
transform: scale(1.1);
}
}

8
src/views/framework/architecture/mixins/tab-bar.js
View File

@ -5,11 +5,11 @@ export default {
{
name: '方案一',
path: 'azjg'
},
{
name: '方案五',
path: 'azjg5'
}
// {
// name: '方案五',
// path: 'azjg5'
// }
]
}
}

2
vue.config.js
View File

@ -44,7 +44,7 @@ module.exports = {
},
proxy: {
'/prod-api': {
target: 'http://192.168.0.86:8080',
target: 'http://192.168.0.106:8080/',
changeOrigin: true,
pathRewrite: { '^/prod-api': '' }
}