fix : 修复首页数据展示
This commit is contained in:
@@ -15,7 +15,7 @@
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-form-item label="创建时间">
|
||||
<span>{{ formData.createTime }}</span>
|
||||
<span>{{ formData.articleTime }}</span>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
|
||||
@@ -43,13 +43,13 @@
|
||||
<el-empty image-size="88" description="暂无待办数据~"/>
|
||||
</div>
|
||||
<div v-for="item in todoList" class="todo-border">
|
||||
<!-- <div class="status-style"-->
|
||||
<!-- :style="{'background-color': item.status == 0 ? '#F55815' : item.status == 1 ? '#20BDA1' : '#4C52EA'}">-->
|
||||
<!-- {{ item.status == 0 ? '加急' : item.status == 1 ? '正常' : '逾期' }}-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="status-style">-->
|
||||
<!-- {{item.targetState}}-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="status-style"-->
|
||||
<!-- :style="{'background-color': item.status == 0 ? '#F55815' : item.status == 1 ? '#20BDA1' : '#4C52EA'}">-->
|
||||
<!-- {{ item.status == 0 ? '加急' : item.status == 1 ? '正常' : '逾期' }}-->
|
||||
<!-- </div>-->
|
||||
<!-- <div class="status-style">-->
|
||||
<!-- {{item.targetState}}-->
|
||||
<!-- </div>-->
|
||||
<div v-if="item.targetState !== null|| item.targetState !== undefined" style="margin-bottom: 14px">
|
||||
<Tag dictType="todo_type" :value="item.targetState"/>
|
||||
</div>
|
||||
@@ -147,7 +147,7 @@
|
||||
</div>
|
||||
</div>
|
||||
<div class="notice-block">
|
||||
<div v-for="(item,index) in noticeList" class="notice">
|
||||
<div v-for="(item,index) in noticeList" class="notice" @click="handleGoToArticleDetail(item)">
|
||||
<span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>{{ item.articleTitle }}
|
||||
</div>
|
||||
</div>
|
||||
@@ -202,9 +202,11 @@
|
||||
<div>
|
||||
<div class="total-money">总资金:{{ toThousands(totalMoney) }}</div>
|
||||
<div v-for="(item,index) in moneyData" class="legend">
|
||||
<div class="money-dot" :style="{'background-color': colorList[index]}"></div>
|
||||
<div class="company-name">{{ item.companyName }}</div>
|
||||
<div>{{ toThousands(item.money) }}</div>
|
||||
<div style="display: flex;align-items: center">
|
||||
<div class="money-dot" :style="{'background-color': moneyColorList[index]}"></div>
|
||||
<div class="company-name">{{ item.name }}</div>
|
||||
</div>
|
||||
<div>{{ toThousands(item.value) }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -215,7 +217,7 @@
|
||||
<el-col :xs="24" :sm="24" :md="24" :lg="10" :xl="10">
|
||||
<el-card shadow="never" class="todo-bg">
|
||||
<el-tabs v-model="docActiveTab" editable @tab-add="goToArticleList">
|
||||
<template #add-icon >
|
||||
<template #add-icon>
|
||||
更多
|
||||
<el-icon color="#1F63E6" size="18">
|
||||
<ArrowRight/>
|
||||
@@ -224,10 +226,10 @@
|
||||
</template>
|
||||
<el-tab-pane label="规章制度" name="first">
|
||||
<div class="notice-block rules-block">
|
||||
<div v-for="(item,index) in rulesList" class="notice">
|
||||
<!-- <div>-->
|
||||
<!-- <span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>{{ item.title }}-->
|
||||
<!-- </div>-->
|
||||
<div v-for="(item,index) in rulesList" class="notice" @click="handleGoToArticleDetail(item)">
|
||||
<!-- <div>-->
|
||||
<!-- <span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>{{ item.title }}-->
|
||||
<!-- </div>-->
|
||||
<div :style="{'color': item.isRead ? '#1F63E6' : 'rgba(0,0,0,0.5)'}">
|
||||
<span>{{ item.articleTitle }}</span>
|
||||
<span class="dot" v-if="item.isRead"></span>
|
||||
@@ -241,10 +243,10 @@
|
||||
<div v-if="helpDocList&&helpDocList.length==0">
|
||||
<el-empty image-size="135" description="暂无帮助文档~"/>
|
||||
</div>
|
||||
<div v-for="(item,index) in helpDocList" class="notice">
|
||||
<!-- <div>-->
|
||||
<!-- <span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>{{ item.title }}-->
|
||||
<!-- </div>-->
|
||||
<div v-for="(item,index) in helpDocList" class="notice" @click="handleGoToArticleDetail(item)">
|
||||
<!-- <div>-->
|
||||
<!-- <span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>{{ item.title }}-->
|
||||
<!-- </div>-->
|
||||
<div>
|
||||
{{ item.articleTitle }}
|
||||
</div>
|
||||
@@ -254,8 +256,8 @@
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="常见问题" name="third">
|
||||
<div class="notice-block rules-block">
|
||||
<div v-for="(item,index) in problemList" class="notice">
|
||||
<!-- <span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>-->
|
||||
<div v-for="(item,index) in problemList" class="notice" @click="handleGoToArticleDetail(item)">
|
||||
<!-- <span>{{ index > 8 ? '' : 0 }}{{ index + 1 }}</span>-->
|
||||
<div>
|
||||
{{ item.articleTitle }}
|
||||
</div>
|
||||
@@ -398,7 +400,8 @@ const data = reactive({
|
||||
fundPieCharts: null,
|
||||
moneyPieCharts: null,
|
||||
})
|
||||
const colorList = ref(['#5c60ca', '#a159da', '#4bd566'])
|
||||
|
||||
const moneyColorList = ref(['#5c60ca', '#a159da', '#5cdcd3', '#4bd566', '#a965ff', '#3BA272', '#ef6567', '#9A60B4', '#f9c956',])
|
||||
const fundPieOption = ref({
|
||||
tooltip: {
|
||||
trigger: 'item'
|
||||
@@ -448,12 +451,12 @@ const fundPieOption = ref({
|
||||
radius: [65, 90],
|
||||
center: ['50%', '50%'],
|
||||
top: '10%',
|
||||
left:'8',
|
||||
left: '8',
|
||||
label: {
|
||||
show: true,
|
||||
formatter: '{b}\n{d}%'
|
||||
// formatter: params => {
|
||||
// console.log(params)
|
||||
// console.log(params)
|
||||
// },
|
||||
},
|
||||
itemStyle: {
|
||||
@@ -480,15 +483,15 @@ const fundPieOption = ref({
|
||||
}
|
||||
},
|
||||
data: [
|
||||
{value: 75, name: '专项资金',label:{color:'#6201FF'}},
|
||||
{value: 20, name: '非专项资金',label:{color:'#1AA4AD'}, selected: true},
|
||||
{value: 75, name: '专项资金', label: {color: '#6201FF'}},
|
||||
{value: 20, name: '非专项资金', label: {color: '#1AA4AD'}, selected: true},
|
||||
],
|
||||
},
|
||||
{
|
||||
name: '',
|
||||
type: 'pie',
|
||||
top: '10%',
|
||||
left:'8',
|
||||
left: '8',
|
||||
clockWise: false,
|
||||
hoverAnimation: false,
|
||||
radius: ['70%', '70%'],//边框大小
|
||||
@@ -516,10 +519,10 @@ const fundPieOption = ref({
|
||||
})
|
||||
const moneyPieOption = ref({
|
||||
tooltip: {
|
||||
show:false,
|
||||
show: false,
|
||||
trigger: 'item'
|
||||
},
|
||||
color: colorList,
|
||||
// color: moneyColorList.value,
|
||||
series: [
|
||||
{
|
||||
type: 'pie',
|
||||
@@ -535,99 +538,123 @@ const moneyPieOption = ref({
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
borderWidth: 10,//设置边框粗细
|
||||
borderColor: '#fff'
|
||||
|
||||
normal: {
|
||||
borderWidth: 10,//设置边框粗细
|
||||
borderColor: '#fff',
|
||||
color: function (colors) {
|
||||
const colorList = moneyColorList.value;
|
||||
|
||||
return colorList[colors.dataIndex];
|
||||
}
|
||||
},
|
||||
|
||||
},
|
||||
data: [
|
||||
{value: 30000, name: '智汇未来科技公司',},
|
||||
{value: 10000, name: '云航信息技术公司'},
|
||||
{value: 5000, name: '融智投资管理公司'},
|
||||
{value: 5000, name: '智汇未来科技公司',},
|
||||
{value: 3000, name: '云航信息技术公司'},
|
||||
{value: 12345, name: '融智投资管理公司'},
|
||||
],
|
||||
},
|
||||
]
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
onMounted(async () => {
|
||||
// getTodoList()
|
||||
// getResearchChart()
|
||||
init()
|
||||
await getResearchChart()
|
||||
|
||||
noticeList.value = await getArticleList(0)
|
||||
rulesList.value = await getArticleList(1)
|
||||
helpDocList.value = await getArticleList(2)
|
||||
problemList.value = await getArticleList(3)
|
||||
await initFundCharts()
|
||||
})
|
||||
const goToArticleList=()=>{
|
||||
const handleGoToArticleDetail = (row) => {
|
||||
router.push({
|
||||
name: 'Article/detail',
|
||||
query: {
|
||||
id: row.articleId
|
||||
}
|
||||
})
|
||||
}
|
||||
const goToArticleList = () => {
|
||||
router.push({
|
||||
name: 'Manage',
|
||||
})
|
||||
}
|
||||
const goToResearchFund=()=>{
|
||||
const goToResearchFund = () => {
|
||||
router.push({
|
||||
name: 'Dev'
|
||||
})
|
||||
}
|
||||
const goToSpecialFund=()=>{
|
||||
const goToSpecialFund = () => {
|
||||
router.push({
|
||||
name: 'Fund'
|
||||
})
|
||||
}
|
||||
const refreshTodoOrDoneList=()=>{
|
||||
const refreshTodoOrDoneList = () => {
|
||||
// getTodoList()
|
||||
}
|
||||
const init =async () => {
|
||||
noticeList.value =await getArticleList(0)
|
||||
rulesList.value =await getArticleList(1)
|
||||
helpDocList.value =await getArticleList(2)
|
||||
problemList.value =await getArticleList(3)
|
||||
const initFundCharts = () => {
|
||||
data.fundPieCharts = echarts.init(document.getElementById('fundPie')).setOption(fundPieOption.value)
|
||||
}
|
||||
const initMoneyCharts = () => {
|
||||
data.moneyPieCharts = echarts.init(document.getElementById('moneyPie')).setOption(moneyPieOption.value)
|
||||
}
|
||||
const getTodoList=()=>{
|
||||
const getTodoList = () => {
|
||||
getHomeInfo().then(res => {
|
||||
if (res.code === 1000) {
|
||||
// todoList.value=res.data.rows
|
||||
// todoNum.value=res.data.total
|
||||
}else{
|
||||
} else {
|
||||
ElNotification({
|
||||
title: '提示',
|
||||
message: res.msg,
|
||||
type: 'error'
|
||||
type: 'error'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
const getResearchChart=()=>{
|
||||
const getResearchChart = () => {
|
||||
getResearchFundChart().then(res => {
|
||||
if (res.code === 1000) {
|
||||
console.info("🚀 ~method:res -----", res.data,res.data.rdCompanyList)
|
||||
if(moneyPieOption.value.series&&moneyPieOption.value.series?.length>0){
|
||||
moneyPieOption.value.series[0].data=res.data.rdCompanyList
|
||||
console.info("🚀 ~method:res -----", res.data, res.data.rdCompanyList)
|
||||
totalMoney.value = res.data.totalAmount
|
||||
moneyData.value = res.data.rdCompanyList
|
||||
if (moneyPieOption.value.series && moneyPieOption.value.series?.length > 0) {
|
||||
moneyPieOption.value.series[0].data = res.data.rdCompanyList
|
||||
initMoneyCharts()
|
||||
}
|
||||
init()
|
||||
}else{
|
||||
} else {
|
||||
ElNotification({
|
||||
title: '提示',
|
||||
message: res.msg,
|
||||
type: 'error'
|
||||
type: 'error'
|
||||
})
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const getArticleList=async (articleType)=>{
|
||||
let {data,code,msg}=await getArticle({articleType:articleType})
|
||||
if (code === 1000) {
|
||||
return data.rows
|
||||
// todoList.value=res.data.rows
|
||||
// todoNum.value=res.data.total
|
||||
}else{
|
||||
ElNotification({
|
||||
title: '提示',
|
||||
message: msg,
|
||||
type: 'error'
|
||||
})
|
||||
}
|
||||
const getArticleList = async (articleType) => {
|
||||
let {data, code, msg} = await getArticle({articleType: articleType})
|
||||
if (code === 1000) {
|
||||
return data.rows
|
||||
// todoList.value=res.data.rows
|
||||
// todoNum.value=res.data.total
|
||||
} else {
|
||||
ElNotification({
|
||||
title: '提示',
|
||||
message: msg,
|
||||
type: 'error'
|
||||
})
|
||||
}
|
||||
}
|
||||
window.addEventListener('resize', () => {
|
||||
console.info("🚀 ~method:resize -----")
|
||||
data.fundPieCharts = null
|
||||
data.moneyPieCharts = null
|
||||
init()
|
||||
initFundCharts()
|
||||
initMoneyCharts()
|
||||
})
|
||||
|
||||
const clickGotoListPage = (item) => {
|
||||
@@ -748,31 +775,34 @@ const handleView = (row) => {
|
||||
@media only screen and (max-width: 1500px) {
|
||||
.statistics {
|
||||
.block {
|
||||
width: 300px!important;
|
||||
width: 300px !important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1420px) {
|
||||
.statistics {
|
||||
.block {
|
||||
width: 280px!important;
|
||||
width: 280px !important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1344px) {
|
||||
.statistics {
|
||||
.block {
|
||||
width: 260px!important;
|
||||
width: 260px !important;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1270px) {
|
||||
.statistics {
|
||||
.block {
|
||||
width: 240px!important;
|
||||
width: 240px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -789,14 +819,15 @@ const handleView = (row) => {
|
||||
}
|
||||
.statistics {
|
||||
.block {
|
||||
width: 320px!important;
|
||||
width: 320px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1120px) {
|
||||
.statistics {
|
||||
.block {
|
||||
width: 290px!important;
|
||||
width: 290px !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -844,6 +875,7 @@ const handleView = (row) => {
|
||||
.legend {
|
||||
margin-top: 14px;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
|
||||
> div:last-child {
|
||||
@@ -859,7 +891,7 @@ const handleView = (row) => {
|
||||
letter-spacing: 1px;
|
||||
margin-left: 10px;
|
||||
margin-right: 30px;
|
||||
white-space: nowrap;
|
||||
//white-space: nowrap;
|
||||
}
|
||||
|
||||
.money-dot {
|
||||
@@ -910,17 +942,19 @@ const handleView = (row) => {
|
||||
height: 2px !important;
|
||||
background-color: #1476E3 !important;
|
||||
}
|
||||
|
||||
:deep(.el-tabs__new-tab ) {
|
||||
width: auto !important;
|
||||
border: none !important;
|
||||
color: #1476E3;
|
||||
font-size: 14px;
|
||||
line-height: 51px!important;
|
||||
height: 51px!important;
|
||||
line-height: 51px !important;
|
||||
height: 51px !important;
|
||||
margin: 0 0 0 -93px !important;
|
||||
z-index: 99;
|
||||
position: relative;
|
||||
&:hover{
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
@@ -947,6 +981,7 @@ const handleView = (row) => {
|
||||
.el-tabs__item.is-active {
|
||||
color: #1F63E6;
|
||||
}
|
||||
|
||||
//#1476E3
|
||||
}
|
||||
}
|
||||
@@ -998,15 +1033,22 @@ const handleView = (row) => {
|
||||
|
||||
.top-left {
|
||||
//flex: 0.8;
|
||||
.notice-title{
|
||||
margin-top: 10px;margin-left: 14px;color: #000000;letter-spacing: 1px;font-size: 16px;
|
||||
>span{
|
||||
.notice-title {
|
||||
margin-top: 10px;
|
||||
margin-left: 14px;
|
||||
color: #000000;
|
||||
letter-spacing: 1px;
|
||||
font-size: 16px;
|
||||
|
||||
> span {
|
||||
color: #F40E0E;
|
||||
>span{
|
||||
|
||||
> span {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.todo-bg {
|
||||
margin-top: 10px;
|
||||
|
||||
@@ -1086,7 +1128,8 @@ const handleView = (row) => {
|
||||
.time {
|
||||
width: 80px;
|
||||
margin-left: 23px;
|
||||
&:last-child{
|
||||
|
||||
&:last-child {
|
||||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
@@ -1195,9 +1238,10 @@ const handleView = (row) => {
|
||||
|
||||
.rules-block {
|
||||
height: 343px !important;
|
||||
margin-top: 0!important;
|
||||
margin-top: 0 !important;
|
||||
|
||||
.notice {
|
||||
cursor: pointer;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
@@ -1205,7 +1249,7 @@ const handleView = (row) => {
|
||||
line-height: 47px !important;
|
||||
color: rgba(0, 0, 0, 0.5) !important;
|
||||
|
||||
>div:first-child {
|
||||
> div:first-child {
|
||||
position: relative;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
@@ -1270,6 +1314,7 @@ const handleView = (row) => {
|
||||
}
|
||||
|
||||
.notice {
|
||||
cursor: pointer;
|
||||
//min-width: 300px;
|
||||
height: 75px;
|
||||
line-height: 75px;
|
||||
|
||||
@@ -16,7 +16,7 @@
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="研发资金金额(元)" prop="rdAmount" >
|
||||
<el-input
|
||||
v-model="formData.rdAmount"
|
||||
@@ -27,7 +27,7 @@
|
||||
/>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8">
|
||||
<el-col :span="6">
|
||||
<el-form-item label="研发资金日期" prop="rdDate">
|
||||
<el-date-picker
|
||||
v-model="formData.rdDate"
|
||||
@@ -39,8 +39,8 @@
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="8" >
|
||||
<el-form-item label="备注" prop="remarks">
|
||||
<el-col :span="6" >
|
||||
<el-form-item label="备注" prop="remarks" style="margin-left: -70px">
|
||||
<el-input v-model="formData.remarks" placeholder="请输入备注" clearable></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
@@ -297,4 +297,7 @@ onMounted(async () => {
|
||||
}
|
||||
}
|
||||
}
|
||||
:deep(.el-date-editor--month) {
|
||||
width: 100%;
|
||||
}
|
||||
</style>
|
||||
|
||||
Reference in New Issue
Block a user