工作台样式

lijinlong
吕天方 8 months ago
parent d8147a02c8
commit 139b39fe12

@ -5,9 +5,9 @@ VUE_APP_TITLE = 金鸡湖现代服务业品牌管理系统
ENV = 'development' ENV = 'development'
# 金鸡湖现代服务业品牌管理系统/开发环境 # 金鸡湖现代服务业品牌管理系统/开发环境
# VUE_APP_BASE_API = 'http://192.168.0.110:9040' VUE_APP_BASE_API = 'http://192.168.0.110:9040'
# 测试环境数据库 # 测试环境数据库
VUE_APP_BASE_API = 'http://39.101.188.84:9040' # VUE_APP_BASE_API = 'http://39.101.188.84:9040'
# 脱敏三方测试用数据库 # 脱敏三方测试用数据库
# VUE_APP_BASE_API = 'http://39.101.188.84:9031' # VUE_APP_BASE_API = 'http://39.101.188.84:9031'
# 正式环境数据库 # 正式环境数据库

@ -1,6 +1,6 @@
{ {
"name": "ruoyi", "name": "ruoyi",
"version": "1.0.202408291508", "version": "1.0.202408291813",
"description": "金鸡湖现代服务业品牌管理系统", "description": "金鸡湖现代服务业品牌管理系统",
"author": "若依", "author": "若依",
"license": "MIT", "license": "MIT",

@ -79,7 +79,7 @@
.home-main { .home-main {
width: 100%; width: 100%;
padding: 10px; padding: 10px;
height: calc(100% - 132px); height: calc(100% - 91px);
display: flex; display: flex;
flex-direction: column; flex-direction: column;
@ -253,7 +253,7 @@
} }
.service-left { .service-left {
padding: 10px 20px; padding: 10px;
.home-mainPro-top, .home-mainPro-top,
.home-mainPro-middle, .home-mainPro-middle,
@ -263,60 +263,77 @@
.pro-left-box, .pro-left-box,
.pro-right-box { .pro-right-box {
width: 50%; height: 100%;
padding: 10px; padding: 10px;
background-color: #F5F8FA; background-color: #F5F8FA;
border-radius: 10px; border-radius: 10px;
display: flex;
flex-direction: column;
}
.pro-left-box {
width: 55%;
}
.pro-right-box {
width: 45%;
} }
} }
.home-mainPro-top { .home-mainPro-top {
height: 35%;
.home-mainPro-top-box { .home-mainPro-top-box {
width: 100%; width: 100%;
height: 28vh; height: 100%;
overflow: hidden; overflow: hidden;
} }
// //
.AFuwufazhanzonglan-box { .AFuwufazhanzonglan-box {
flex: 1;
.AFuwufazhanzonglan { .AFuwufazhanzonglan {
width: 100%; width: 100%;
height: 100%; height: 100%;
display: grid;
grid-template-columns: 1fr;
grid-gap: 15px;
padding-top: 10px;
.AFuwufazhanzonglan-listbox { .AFuwufazhanzonglan-listbox {
width: 100%; width: 100%;
height: 45%;
background: #FFFFFF; background: #FFFFFF;
border-radius: 10px; border-radius: 10px;
margin: 2% 0; // margin: 2% 0;
padding: 5px 5px; padding: 5px 5px;
display: flex; display: flex;
align-items: center; align-items: center;
.AFuwufazhanzonglan-niandu { .AFuwufazhanzonglan-niandu {
width: 3%; width: 5%;
writing-mode: vertical-rl; writing-mode: vertical-rl;
/* 竖直显示,文字从上到下 */ /* 竖直显示,文字从上到下 */
text-align: center; text-align: center;
font-size: 12px; font-size: 12px;
font-family: PingFang-SC;
font-weight: bold;
color: #666666;
line-height: 20px;
} }
.AFuwufazhanzonglan-neirongBox { .AFuwufazhanzonglan-neirongBox {
width: 100%; width: 100%;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: space-between;
.AFuwufazhanzonglan-item { .AFuwufazhanzonglan-item {
width: 95%; // width: 95%;
display: flex; display: flex;
align-items: center; align-items: center;
margin: 0 10px; margin: 0 10px;
flex: 1; // flex: 1;
.AFuwufazhanzonglan-img-box { .AFuwufazhanzonglan-img-box {
width: 65px; width: 50px;
height: 65px; height: 50px;
border-radius: 50%; border-radius: 50%;
background-size: cover; background-size: cover;
background-repeat: no-repeat; background-repeat: no-repeat;
@ -345,34 +362,43 @@
div:nth-child(1) { div:nth-child(1) {
font-size: 20px; font-size: 20px;
font-weight: bold; font-weight: bold;
font-family: DINCondensed, DINCondensed;
font-weight: bold;
line-height: 30px;
margin-right: 5px;
color: #333333;
span { span {
font-family: PingFang-SC, PingFang-SC;
font-weight: bold;
font-size: 12px; font-size: 12px;
color: #737373; line-height: 18px;
color: #666666;
} }
} }
div:nth-child(2) { div:nth-child(2) {
font-size: 14px; // font-size: 14px;
margin-bottom: 5px; // margin-bottom: 5px;
font-size: 14px; // font-size: 14px;
max-width: 100px; // max-width: 100px;
white-space: nowrap; // white-space: nowrap;
/* 不换行 */ // overflow: hidden;
overflow: hidden; // text-overflow: ellipsis;
/* 隐藏溢出的内容 */ font-family: PingFang-SC;
text-overflow: ellipsis; font-weight: 500;
/* 显示省略号 */ font-size: 12px;
color: #666666;
} }
div:nth-child(3) { div:nth-child(3) {
font-family: PingFang-SC;
font-weight: 500;
font-size: 12px;
color: #666666;
} }
} }
} }
} }
} }
} }
} }
@ -385,16 +411,16 @@
.home-mainPro-middle { .home-mainPro-middle {
margin: 10px 0; margin: 10px 0;
height: 40%;
// TOP5
.capitalConditionTOP5-box { .capitalConditionTOP5-box {
padding: 10px 0; flex: 1;
section { section {
margin-top: 10px; margin-top: 10px;
// .el-table--border { .el-table--border {
// border: 1px solid #dfe6ec; border: 1px solid #dfe6ec;
// } }
.el-table { .el-table {
.project-trace-table-ranking { .project-trace-table-ranking {
// padding: 1px 0px; // padding: 1px 0px;
@ -408,22 +434,21 @@
color: #FFFFFF; color: #FFFFFF;
} }
.project-table-Info { .project-trace-table-number {
font-family: AlibabaPuHuiTiR; font-weight: bold;
font-weight: 500;
font-size: 14px; font-size: 14px;
color: #1890FF; text-align: center;
// font-style: normal; font-family: PingFang-SC;
// text-decoration-line: underline; color: #333333;
// text-transform: none;
cursor: pointer;
} }
th { th {
font-weight: bold; font-weight: bold;
font-size: 14px; font-size: 14px;
color: #000;
text-align: center; text-align: center;
font-family: PingFang-SC;
color: #333333;
padding: 0;
.Table-header { .Table-header {
// font-family: AlibabaPuHuiTiM; // font-family: AlibabaPuHuiTiM;
@ -440,9 +465,11 @@
} }
td { td {
font-weight: 500; font-weight: bold;
font-size: 14px; font-size: 14px;
color: #666666; text-align: center;
font-family: PingFang-SC;
color: #333333;
} }
} }
} }
@ -573,6 +600,7 @@
color: #383838; color: #383838;
} }
// TOP5
.left-box-select { .left-box-select {
flex: 1; flex: 1;
display: flex; display: flex;
@ -580,12 +608,22 @@
align-items: center; align-items: center;
.el-select { .el-select {
width: 100px; width: 130px;
.el-input__inner { .el-input__inner {
text-align: center; text-align: center;
height: 30px;
line-height: 30px;
border-color: #0086FF;
color: #0086FF;
}
.el-input--medium .el-input__icon {
line-height: 30px;
color: #0086FF;
} }
} }
.years-select {
margin-right: 10px;
}
} }
} }

@ -1,9 +1,9 @@
<!-- 拨付资金企业申请情况TOP5 --> <!-- 拨付资金企业申请情况TOP5 -->
<template> <template>
<div class="AFuwufazhanzonglan"> <div class="AFuwufazhanzonglan">
<div class="AFuwufazhanzonglan-listbox" v-for="item in tableData"> <div class="AFuwufazhanzonglan-listbox" v-for="item,index in tableData">
<div class="AFuwufazhanzonglan-niandu"> <div class="AFuwufazhanzonglan-niandu">
{{ item.niandu }} {{ item.niandu }}
</div> </div>
<div class="AFuwufazhanzonglan-neirongBox"> <div class="AFuwufazhanzonglan-neirongBox">
<div class="AFuwufazhanzonglan-item" v-for="(itemTow,index) in item.list"> <div class="AFuwufazhanzonglan-item" v-for="(itemTow,index) in item.list">
@ -41,7 +41,7 @@ export default {
}, { }, {
tponumber: "49.9", tponumber: "49.9",
danwei: "%", danwei: "%",
content: "服务业增", content: "服务业增加值GDP比重",
nian: "2023", nian: "2023",
}, },
] ]

@ -16,12 +16,16 @@
<div class="project-trace-table-number">{{ scope.row.fundAmount }}</div> <div class="project-trace-table-number">{{ scope.row.fundAmount }}</div>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="所属项目" align="center" width="130"> <el-table-column label="拨付时间" key="appropriationTime" prop="appropriationTime" align="center" width="120">
<template slot-scope="scope"> <template slot-scope="scope">
<div class="project-table-Info" @click="ProjectInfo(scope.row)">{{ scope.row.projectName }}</div> <div class="project-trace-table-number">{{ scope.row.appropriationTime ? formatDate(scope.row.appropriationTime,2) : '' }}</div>
<!-- <el-button type="text" class="project-table-Info" @click="charu(scope.row)" :disabled="!scope.row.projectId">{{ scope.row.projectName }}</el-button> -->
</template> </template>
</el-table-column> </el-table-column>
<el-table-column label="拨付类型" key="projectName" prop="projectName" align="center" width="130">
<!-- <template slot-scope="scope">
<div class="project-table-Info">{{ scope.row.projectName }}</div>
</template> -->
</el-table-column>
<el-table-column label="所属企业" key="qymc" prop="qymc" align="center" /> <el-table-column label="所属企业" key="qymc" prop="qymc" align="center" />
</el-table> </el-table>
</section> </section>
@ -33,7 +37,7 @@ export default {
return { return {
loading:false, loading:false,
tableData:[], tableData:[],
tabHeader: 200, tabHeader: null,
} }
}, },
props:{ props:{
@ -41,7 +45,7 @@ export default {
type:Number, type:Number,
default:1, default:1,
}, },
yearsChange:{ yearsValue:{
type:Number, type:Number,
default:1, default:1,
}, },
@ -49,17 +53,17 @@ export default {
watch:{ watch:{
typeValue:{ typeValue:{
handler(newVAlue){ handler(newVAlue){
console.log(newVAlue); this.getList();
}, },
}, },
yearsChange:{ yearsValue:{
handler(newVAlue){ handler(newVAlue){
console.log(newVAlue); this.getList();
}, },
}, },
}, },
mounted() { mounted() {
// this.cancalDebounce(); this.cancalDebounce();
window.addEventListener('resize', this.cancalDebounce); window.addEventListener('resize', this.cancalDebounce);
this.getList(); this.getList();
}, },
@ -67,7 +71,7 @@ export default {
// top5 // top5
getList(){ getList(){
this.loading = true; this.loading = true;
top5Fund().then(res=>{ top5Fund({type:this.typeValue,yearsChange:this.yearsValue}).then(res=>{
let arr = []; let arr = [];
let bgc = ['#EE462A','#FF8929','#ffbb00','#5CBC69','#00AEFF'] let bgc = ['#EE462A','#FF8929','#ffbb00','#5CBC69','#00AEFF']
res.data.forEach((element,index) => { res.data.forEach((element,index) => {
@ -95,13 +99,23 @@ export default {
}) })
} }
}, },
formatDate(dateString,id) {
const year = dateString.slice(0, 4);
const month = dateString.slice(4, 6);
const day = dateString.slice(6, 8);
if(id == 1) {
return `${year}${month}${day}`;
} else {
return `${year}-${month}-${day}`;
}
},
// //
cancalDebounce(){ cancalDebounce(){
const element = document.getElementById('zhijinbofu-qingkaung'); // ID const element = document.getElementById('home-mainPro-middle-id'); // ID
const header = document.getElementById('zhijinbofu-header-id'); // ID const header = document.getElementById('TOP-header-id'); // ID
const elementHeight = element.offsetHeight; const elementHeight = element.offsetHeight;
const headerHeight = header.offsetHeight; const headerHeight = header.offsetHeight;
this.tabHeader = elementHeight - headerHeight - 35; this.tabHeader = elementHeight - headerHeight - 30;
} }
}, },
} }

@ -47,12 +47,12 @@
</div> </div>
</div> </div>
<div class="home-mainPro-middle"> <div class="home-mainPro-middle">
<div class="pro-left-box" style="margin-right: 10px;"> <div class="pro-left-box" style="margin-right: 10px;" id="home-mainPro-middle-id">
<div class="box-header" id="zhongdian-header-id"> <div class="box-header" id="TOP-header-id">
<span class="garden"></span> <span class="garden"></span>
<span class="box-header-title">企业获得资金拨付排名TOP5</span> <span class="box-header-title">企业获得资金拨付排名TOP5</span>
<div class="left-box-select"> <div class="left-box-select">
<el-select v-model="yearsChange" placeholder="请选择"> <el-select v-model="yearsChange" class="years-select" placeholder="请选择">
<el-option <el-option
label="当年" label="当年"
:value="1"> :value="1">
@ -75,7 +75,7 @@
</div> </div>
</div> </div>
<div class="capitalConditionTOP5-box"> <div class="capitalConditionTOP5-box">
<table-three :typeValue="typeValue" :yearsChange="yearsChange"></table-three> <table-three :typeValue="typeValue" :yearsValue="yearsChange"></table-three>
</div> </div>
</div> </div>
<div class="pro-right-box"> <div class="pro-right-box">
@ -83,6 +83,9 @@
<span class="garden"></span> <span class="garden"></span>
<span class="box-header-title">当年已申报完成的项目</span> <span class="box-header-title">当年已申报完成的项目</span>
</div> </div>
<div class="wancheng-project">
</div>
</div> </div>
</div> </div>
<div class="home-mainPro-bottom"> <div class="home-mainPro-bottom">

Loading…
Cancel
Save