ccongli
/
YX-SCM
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

客户详情基本功能

Browse Source
pull/1/head
mhsnet 1 year ago
parent 85be686266
commit 448843f07a
6 changed files with 273 additions and 73 deletions
Show Stats Download Patch File Download Diff File

32
yunxi-ui-admin-vue3/src/styles/cus.scss
Unescape View File

@ -0,0 +1,32 @@
.xy-card-info.is-always-shadow {
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
}
.xy-card-info {
border: 0px;
.el-card__header {
padding: 16px 0px;
background-color: inherit;
.xy-card-info-icona {
top: 10px;
width: 5px;
height: 24px;
float: left;
background-color: #005EFE;
}
.xy-card-info-text {
margin-left: 10px;
}
}
.el-card__body {
padding: 15px 0px;
.el-row {
margin: 10px;
}
}
}

1
yunxi-ui-admin-vue3/src/styles/index.scss
Unescape View File

@ -1,6 +1,7 @@
@import './var.css'; @import './var.css';
@import 'element-plus/theme-chalk/dark/css-vars.css'; @import 'element-plus/theme-chalk/dark/css-vars.css';
@import './font.scss'; @import './font.scss';
@import './cus.scss';
* { * {
font-family: 'AlibabaPuHuiTi-3-55-Regular'; font-family: 'AlibabaPuHuiTi-3-55-Regular';

192
yunxi-ui-admin-vue3/src/views/xxjj/subjectBasic/CustomerDetails.vue
Unescape View File

@ -1,42 +1,137 @@
<template> <template>
<el-card class="box-card"> <div>
<template #header> <el-card class="box-card xy-y1">
<el-button type="" link icon="ep:Back">返回</el-button> <template #header>
</template> <el-button type="" link>返回</el-button>
<template #default> </template>
<el-button type="" link icon="ep:back">返回</el-button> <template #default>
cs <el-row>
</template> <el-col :span="24">
</el-card> <el-row>
<el-col :span="12">
<ContentWrap> <div style="float: left;"><el-image style="width: 100px; height: 100px" fit="fill" /></div>
<el-tabs v-model="activeTabN" class="xy-tabs"> <div style="height: 100px; line-height: 100px;float: left;">江阴华润制钢有限公司（一级客户）</div>
</el-col>
<el-col :span="12">
<div style="float: right;">
<el-space :size="10">
<el-button type="primary">编辑信息</el-button>
<el-button>更新业务进度</el-button>
<el-button>申请评级</el-button>
<el-button>更新业务进度</el-button>
<el-select placeholder="更多操作" style="width: 100px;">
<el-option label="业务配置" :value="1" />
<el-option label="业务配置" :value="1" />
</el-select>
</el-space>
</div>
</el-col>
</el-row>
</el-col>
</el-row>
<el-row>
<el-col :span="24" style="background-color: #F7F8FA; padding: 24px;">
<el-row>
<el-col :span="6">
<el-row>
<el-col :span="6" class="xy-label">客户编号：</el-col>
<el-col :span="18" class="xy-text">C20230822001</el-col>
</el-row>
</el-col>
<el-col :span="6">
<el-row>
<el-col :span="6" class="xy-label">企业性质：</el-col>
<el-col :span="18" class="xy-text">外资企业</el-col>
</el-row>
</el-col>
<el-col :span="6">
<el-row>
<el-col :span="6" class="xy-label">行业分类：</el-col>
<el-col :span="18" class="xy-text">行业分类</el-col>
</el-row>
</el-col>
<el-col :span="6">
<el-row>
<el-col :span="8">状态</el-col>
<el-col :span="8">业务进度</el-col>
<el-col :span="8">信用等级</el-col>
</el-row>
</el-col>
</el-row>
<el-row>
<el-col :span="6">
<el-row>
<el-col :span="6" class="xy-label">创建时间：</el-col>
<el-col :span="18" class="xy-text">2023-08-23 23:26:08</el-col>
</el-row>
</el-col>
<el-col :span="6">
<el-row>
<el-col :span="6" class="xy-label">默认联系人：</el-col>
<el-col :span="18" class="xy-text">李总（13112345678）</el-col>
</el-row>
</el-col>
<el-col :span="6">
<el-row>
<el-col :span="6" class="xy-label">归属人员：</el-col>
<el-col :span="18" class="xy-text">张总 (已锁定，到期时间10/30)</el-col>
</el-row>
</el-col>
<el-col :span="6">
<el-row>
<el-col :span="8">已启用</el-col>
<el-col :span="8">正在跟进</el-col>
<!-- <el-col :span="8"><el-rate :model-value="2" clearable /></el-col> -->
</el-row>
</el-col>
</el-row>
</el-col>
</el-row>
</template>
</el-card>
<el-tabs v-model="activeTabN">
<el-tab-pane label="基础信息" name="tabN1"> <el-tab-pane label="基础信息" name="tabN1">
<InfoBasic /> <template v-if="activeTabN == 'tabN1'">
<InfoBasic />
</template>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="资质信息" name="tabN2"> <el-tab-pane label="资质信息" name="tabN2">
<InfoQualification /> <template v-if="activeTabN == 'tabN2'">
<InfoQualification />
</template>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="财务信息" name="tabN3"> <el-tab-pane label="财务信息" name="tabN3">
<InfoFinancial /> <template v-if="activeTabN == 'tabN3'">
<InfoFinancial />
</template>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="合同信息" name="tabN4"> <el-tab-pane label="合同信息" name="tabN4">
<InfoContract /> <template v-if="activeTabN == 'tabN4'">
<InfoContract />
</template>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="销售订单" name="tabN5"> <el-tab-pane label="销售订单" name="tabN5">
<InfoSaleOrder /> <template v-if="activeTabN == 'tabN5'">
<InfoSaleOrder />
</template>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="结算信息" name="tabN6"> <el-tab-pane label="结算信息" name="tabN6">
<InfoSettlement /> <template v-if="activeTabN == 'tabN6'">
<InfoSettlement />
</template>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="操作记录" name="tabN7"> <el-tab-pane label="操作记录" name="tabN7">
<InfoOperationRecords /> <template v-if="activeTabN == 'tabN7'">
<InfoOperationRecords />
</template>
</el-tab-pane> </el-tab-pane>
<el-tab-pane label="日志记录" name="tabN8"> <el-tab-pane label="日志记录" name="tabN8">
<InfoLogging /> <template v-if="activeTabN == 'tabN8'">
<InfoLogging />
</template>
</el-tab-pane> </el-tab-pane>
</el-tabs> </el-tabs>
</ContentWrap> </div>
</template> </template>
<script setup lang="ts" name="CustomerDetails"> <script setup lang="ts" name="CustomerDetails">
@ -48,6 +143,7 @@ import InfoSaleOrder from './src/InfoSaleOrder.vue'
import InfoSettlement from './src/InfoSettlement.vue' import InfoSettlement from './src/InfoSettlement.vue'
import InfoOperationRecords from './src/InfoOperationRecords.vue' import InfoOperationRecords from './src/InfoOperationRecords.vue'
import InfoLogging from './src/InfoLogging.vue' import InfoLogging from './src/InfoLogging.vue'
const activeTabN = ref('tabN1') const activeTabN = ref('tabN1')
</script> </script>
@ -57,6 +153,58 @@ const activeTabN = ref('tabN1')
padding-left: 10px; padding-left: 10px;
} }
} }
.xy-card {
.el-card__header {
background-color: #F7F8FA;
}
}
.xy-card-info.is-always-shadow {
box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
}
.xy-card-info {
border: 0px;
.el-card__header {
padding: 16px 0px;
background-color: inherit;
.xy-card-info-icona {
top: 10px;
width: 5px;
height: 24px;
float: left;
background-color: #005EFE;
}
.xy-card-info-text {
margin-left: 10px;
}
}
.el-card__body {
padding: 15px 0px;
.el-row {
margin: 10px;
}
}
}
</style> </style>
<style lang="scss" scoped></style> <style lang="scss" scoped>
.xy-y1 {
.xy-label {
text-align: right;
color: #86909C;
}
.xy-text {
color: #1D2129;
}
}
</style>

94
yunxi-ui-admin-vue3/src/views/xxjj/subjectBasic/src/InfoBasic.vue
Unescape View File

@ -19,9 +19,9 @@
操作记录 操作记录
</template> </template>
<template #default> <template #default>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
基本信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">基本信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -86,9 +86,9 @@
</el-row> </el-row>
</template> </template>
</el-card> </el-card>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
详细信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">详细信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -143,9 +143,9 @@
</el-row> </el-row>
</template> </template>
</el-card> </el-card>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
合作信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">合作信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -178,9 +178,9 @@
</el-row> </el-row>
</template> </template>
</el-card> </el-card>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
运营信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">运营信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -227,9 +227,9 @@
</el-row> </el-row>
</template> </template>
</el-card> </el-card>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
联系人信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">联系人信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -247,9 +247,9 @@
</el-row> </el-row>
</template> </template>
</el-card> </el-card>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
扩展信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">扩展信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -312,36 +312,54 @@ const tbDataA = [
</script> </script>
<style lang="scss"> <style lang="scss">
.xy-card-b { // .xy-card-b {
margin: 16px 24px; // margin: 16px 24px;
.el-card__header { // .el-card__header {
background-color: #F7F8FA; // background-color: #F7F8FA;
height: 48px; // height: 48px;
padding: 12px 16px; // padding: 12px 16px;
color: #666666; // color: #666666;
} // }
} // }
.xy-card-info-a { // .xy-card {
margin-top: 16px; // .el-card__header {
border: 0px; // background-color: #F7F8FA;
// }
// }
.el-card__header { // .xy-card-info.is-always-shadow {
background-color: inherit; // box-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
padding: 0px; // }
height: 28px;
line-height: 28px;
}
.xy-label { // .xy-card-info {
color: #86909C; // border: 0px;
text-align: right;
}
.xy-text { // .el-card__header {
color: #1D2129; // padding: 16px 0px;
} // background-color: inherit;
}
// .xy-card-info-icona {
// top: 10px;
// width: 5px;
// height: 24px;
// float: left;
// background-color: #005EFE;
// }
// .xy-card-info-text {
// margin-left: 10px;
// }
// }
// .el-card__body {
// padding: 15px 0px;
// .el-row {
// margin: 10px;
// }
// }
// }
</style> </style>

12
yunxi-ui-admin-vue3/src/views/xxjj/subjectBasic/src/InfoFinancial.vue
Unescape View File

@ -4,9 +4,9 @@
财务信息 财务信息
</template> </template>
<template #default> <template #default>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
财务信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">财务信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -55,9 +55,9 @@
</el-row> </el-row>
</template> </template>
</el-card> </el-card>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
结算信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">结算信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -80,9 +80,9 @@
</el-row> </el-row>
</template> </template>
</el-card> </el-card>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
分控信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">分控信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>

15
yunxi-ui-admin-vue3/src/views/xxjj/subjectBasic/src/InfoQualification.vue
Unescape View File

@ -4,9 +4,9 @@
资质信息 资质信息
</template> </template>
<template #default> <template #default>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
主体信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">主体信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -75,9 +75,9 @@
</el-row> </el-row>
</template> </template>
</el-card> </el-card>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
代表人信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">代表人信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -95,9 +95,9 @@
</el-row> </el-row>
</template> </template>
</el-card> </el-card>
<el-card class="xy-card-info-a"> <el-card class="xy-card-info">
<template #header> <template #header>
资质信息 <div class="xy-card-info-icona"></div><span class="xy-card-info-text">资质信息</span>
</template> </template>
<template #default> <template #default>
<el-row> <el-row>
@ -175,5 +175,6 @@ const tbDataA = [
] ]
</script> </script>
<style lang="scss"></style> <style lang="scss">
</style>
Write Preview
Loading…
Cancel
Save