692 lines
18 KiB
Vue
692 lines
18 KiB
Vue
|
<template>
|
|||
|
|
<div class="index">
|
|||
|
|
<div class="index_l whitebg">
|
|||
|
|
<!-- <div class="box titlebox">
|
|||
|
|
<p>{{ parseTime(nowTime) }}</p>
|
|||
|
|
</div> -->
|
|||
|
|
<div class="tables">
|
|||
|
|
<div style="text-align: left">
|
|||
|
|
<el-row type="flex" class="row-bg" justify="space-between">
|
|||
|
|
<el-col :span="24" class="title_name"
|
|||
|
|
>数据总览
|
|||
|
|
<span class="fontgay">最近更新：{{ uptime }}</span>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row
|
|||
|
|
type="flex"
|
|||
|
|
class="row-bg"
|
|||
|
|
justify="space-between"
|
|||
|
|
style="margin-top: 35px; text-align: center"
|
|||
|
|
>
|
|||
|
|
<el-col :span="6" class="col_style">企业成员总数</el-col>
|
|||
|
|
<el-col :span="6" class="col_style">客户总人数</el-col>
|
|||
|
|
<el-col :span="6" class="col_style">客户群总数</el-col>
|
|||
|
|
<el-col :span="6" class="col_style">群成员总数</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row
|
|||
|
|
type="flex"
|
|||
|
|
class="row-bg"
|
|||
|
|
justify="space-between"
|
|||
|
|
style="
|
|||
|
|
margin-top: 10px;
|
|||
|
|
font-size: 35px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #0079de;
|
|||
|
|
text-align: center;
|
|||
|
|
"
|
|||
|
|
>
|
|||
|
|
<el-col :span="6">
|
|||
|
|
<count-to :start-val="0" :end-val="table.userCount" :duration="durationCount" />
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="6">
|
|||
|
|
<count-to :start-val="0" :end-val="table.customerCount" :duration="durationCount" />
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="6">
|
|||
|
|
<count-to :start-val="0" :end-val="table.groupCount" :duration="durationCount" />
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="6">
|
|||
|
|
<count-to
|
|||
|
|
:start-val="0"
|
|||
|
|
:end-val="table.groupMemberCount"
|
|||
|
|
:duration="durationCount"
|
|||
|
|
/>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
<div class="dataall" style="margin-top: 10px">
|
|||
|
|
<div style="text-align: left">
|
|||
|
|
<el-row type="flex" class="row-bg" justify="space-between">
|
|||
|
|
<el-col :span="10" class="title_name">数据趋势</el-col>
|
|||
|
|
<el-col :span="10" style="text-align: right">
|
|||
|
|
<el-radio-group v-model="timeType" style="margin-top: 20px" @change="timeTypeCheck">
|
|||
|
|
<el-radio-button label="today">今日</el-radio-button>
|
|||
|
|
<el-radio-button label="week">本周</el-radio-button>
|
|||
|
|
<el-radio-button label="month">本月</el-radio-button>
|
|||
|
|
<el-radio-button label="reset">
|
|||
|
|
<i class="el-icon-refresh"> </i>
|
|||
|
|
</el-radio-button>
|
|||
|
|
</el-radio-group>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
|
|||
|
|
<el-row
|
|||
|
|
type="flex"
|
|||
|
|
class="row-bg"
|
|||
|
|
justify="space-between"
|
|||
|
|
style="margin-top: 30px; text-align: center"
|
|||
|
|
>
|
|||
|
|
<el-col :span="6">新增客户数</el-col>
|
|||
|
|
<el-col :span="6">新增客群数</el-col>
|
|||
|
|
<el-col :span="6">群新增人数</el-col>
|
|||
|
|
<el-col :span="6">流失客户数</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row
|
|||
|
|
type="flex"
|
|||
|
|
class="row-bg"
|
|||
|
|
justify="space-between"
|
|||
|
|
style="
|
|||
|
|
margin-top: 10px;
|
|||
|
|
font-size: 35px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #0079de;
|
|||
|
|
text-align: center;
|
|||
|
|
"
|
|||
|
|
>
|
|||
|
|
<el-col :span="6">{{ erchatsTable.newContactCnt }}</el-col>
|
|||
|
|
<el-col :span="6">{{ erchatsTable.newChatCnt }}</el-col>
|
|||
|
|
<el-col :span="6">{{ erchatsTable.newMemberCnt || 0 }} </el-col>
|
|||
|
|
<el-col :span="6">{{ erchatsTable.negativeFeedbackCnt }}</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row
|
|||
|
|
type="flex"
|
|||
|
|
class="row-bg"
|
|||
|
|
justify="space-between"
|
|||
|
|
style="margin-top: 10px; text-align: center"
|
|||
|
|
>
|
|||
|
|
<el-col :span="6">
|
|||
|
|
比{{ time }}
|
|||
|
|
<span :class="getClass('newContactCntDiff')">
|
|||
|
|
{{ getArrow('newContactCntDiff') }}
|
|||
|
|
{{ Math.abs(erchatsTable.newContactCntDiff) }}
|
|||
|
|
</span>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="6">
|
|||
|
|
比{{ time }}
|
|||
|
|
<span :class="getClass('newChatCntDiff')">
|
|||
|
|
{{ getArrow('newChatCntDiff') }}
|
|||
|
|
{{ Math.abs(erchatsTable.newChatCntDiff) }}
|
|||
|
|
</span>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="6">
|
|||
|
|
比{{ time }}
|
|||
|
|
<span :class="getClass('newMemberCntDiff')">
|
|||
|
|
{{ getArrow('newMemberCntDiff') }}
|
|||
|
|
{{ Math.abs(erchatsTable.newMemberCntDiff) }}
|
|||
|
|
</span>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="6">
|
|||
|
|
比{{ time }}
|
|||
|
|
<span :class="getClass('negativeFeedbackCntDiff')">
|
|||
|
|
{{ getArrow('negativeFeedbackCntDiff') }}
|
|||
|
|
{{ Math.abs(erchatsTable.negativeFeedbackCntDiff) }}
|
|||
|
|
</span>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
</div>
|
|||
|
|
<div id="fatherbox">
|
|||
|
|
<div id="echart" ref="views"></div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="car card">
|
|||
|
|
<el-row type="flex" justify="space-between">
|
|||
|
|
<el-col :span="24" style="font-size: 24px; line-height: 80px">快捷功能 </el-col>
|
|||
|
|
</el-row>
|
|||
|
|
<el-row :gutter="20">
|
|||
|
|
<el-col :span="6" v-for="(item, i) in car" :key="i">
|
|||
|
|
<div class="grid-content" @click="$router.push(item.url)">
|
|||
|
|
<div class="ac"><img :src="item.img" alt="" /></div>
|
|||
|
|
<div class="ac craname">{{ item.name }}</div>
|
|||
|
|
</div>
|
|||
|
|
</el-col>
|
|||
|
|
</el-row>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
|
|||
|
|
<div class="index_r whitebg">
|
|||
|
|
<div class="qy_R">
|
|||
|
|
<div class="inedx_r_top_t">
|
|||
|
|
<p class="p1">{{ $store.state.user.companyName }}，欢迎登陆本系统</p>
|
|||
|
|
<p class="p2">登录时间：{{ parseTime(new Date()) }}</p>
|
|||
|
|
<p class="p1 p3 margint20">1232</p>
|
|||
|
|
<p class="p2 p4">
|
|||
|
|
版本信息：开源
|
|||
|
|
<span class="fr">可用期限：永久</span>
|
|||
|
|
</p>
|
|||
|
|
<el-row
|
|||
|
|
:gutter="20"
|
|||
|
|
type="flex"
|
|||
|
|
class="row-bg"
|
|||
|
|
justify="center"
|
|||
|
|
style="text-align: center"
|
|||
|
|
>
|
|||
|
|
<el-col :span="10" class="flexspan">
|
|||
|
|
<!-- <img src="@/assets/index/bzwd.png" /> -->
|
|||
|
|
<a href="https://www.yuque.com/linkwechat/help"> 帮助手册</a>
|
|||
|
|
</el-col>
|
|||
|
|
<el-col :span="2"></el-col>
|
|||
|
|
<el-col
|
|||
|
|
:span="10"
|
|||
|
|
class="flexspan"
|
|||
|
|
@click.native="msgInfo('《使用手册》正在加急上线中，敬请关注…')"
|
|||
|
|
>
|
|||
|
|
<!-- <img src="@/assets/index/kfsc.png" /> 开发文档 -->
|
|||
|
|
</el-col
|
|||
|
|
>
|
|||
|
|
</el-row>
|
|||
|
|
</div>
|
|||
|
|
<div class="inedx_r_top_bottom">
|
|||
|
|
<span class="inedx_r_top_bottomp1">
|
|||
|
|
<!-- <img src="@/assets/index/gxrz.png" /> -->
|
|||
|
|
更新日志</span>
|
|||
|
|
<span
|
|||
|
|
class="fr"
|
|||
|
|
style="color: #0079de"
|
|||
|
|
@click="msgInfo('《更新日志》正在加急上线中，敬请关注…')"
|
|||
|
|
>更多</span
|
|||
|
|
>
|
|||
|
|
<ul>
|
|||
|
|
<li v-for="(index, i) in 3" :key="i" @click="msgInfo('暂无内容')">
|
|||
|
|
即将上线，敬请期待
|
|||
|
|
<span class="fr">03-26</span>
|
|||
|
|
</li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
<div class="inedx_r_top_bottom">
|
|||
|
|
<span class="inedx_r_top_bottomp1">
|
|||
|
|
<!-- <img src="@/assets/index/qyxy.png" /> -->
|
|||
|
|
私域学院</span>
|
|||
|
|
<span class="fr" style="color: #0079de">更多</span>
|
|||
|
|
<ul>
|
|||
|
|
<li v-for="(index, i) in 3" :key="i" @click="msgInfo('暂无内容')">
|
|||
|
|
即将上线，敬请期待
|
|||
|
|
<span class="fr">03-26</span>
|
|||
|
|
</li>
|
|||
|
|
</ul>
|
|||
|
|
</div>
|
|||
|
|
<div class="inedx_r_top_bottom" style="text-align: center">
|
|||
|
|
<p style="text-align: left">
|
|||
|
|
<span class="inedx_r_top_bottomp1">
|
|||
|
|
<!-- <img src="@/assets/index/kfq.png" /> -->
|
|||
|
|
官方交流</span>
|
|||
|
|
</p>
|
|||
|
|
<img :src="bossImg" class="img" />
|
|||
|
|
</div>
|
|||
|
|
<div class="inedx_r_top_bottom" style="text-align: center">
|
|||
|
|
<p style="text-align: left">
|
|||
|
|
<span class="inedx_r_top_bottomp1">
|
|||
|
|
<!-- <img src="@/assets/index/khq.png" /> -->
|
|||
|
|
联系客服</span>
|
|||
|
|
</p>
|
|||
|
|
<img :src="bossImg" class="img" />
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</div>
|
|||
|
|
</template>
|
|||
|
|
<script>
|
|||
|
|
// import * as api from '@/api/index'
|
|||
|
|
import * as echarts from 'echarts'
|
|||
|
|
import CountTo from 'vue-count-to'
|
|||
|
|
export default {
|
|||
|
|
name: 'DSIndex0',
|
|||
|
|
components: { CountTo },
|
|||
|
|
data() {
|
|||
|
|
return {
|
|||
|
|
// bossImg: require('@/assets/index/boss.png'),
|
|||
|
|
bossImg: undefined,
|
|||
|
|
car: [
|
|||
|
|
// {
|
|||
|
|
// name: '企业客户',
|
|||
|
|
// url: '/customerManage/customer',
|
|||
|
|
// img: require('@/assets/index/kehgl.png'),
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '员工活码',
|
|||
|
|
// url: '/drainageCode/staff',
|
|||
|
|
// img: require('@/assets/index/neircd.png'),
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '新增群发',
|
|||
|
|
// url: '/customerMaintain/groupMessage/add',
|
|||
|
|
// img: require('@/assets/index/renwb.png'),
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '任务宝',
|
|||
|
|
// url: '/application/taskGroup',
|
|||
|
|
// img: require('@/assets/index/xiaoxqf.png'),
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '新客拉群',
|
|||
|
|
// url: '/communityOperating/newCustomer',
|
|||
|
|
// img: require('@/assets/index/yuanghm.png'),
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '素材中心',
|
|||
|
|
// url: '/customerMaintain/material',
|
|||
|
|
// img: require('@/assets/index/zidgl.png'),
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '关键词群',
|
|||
|
|
// url: '/communityOperating/keywords',
|
|||
|
|
// img: require('@/assets/index/yuanghm.png'),
|
|||
|
|
// },
|
|||
|
|
// {
|
|||
|
|
// name: '会话存档',
|
|||
|
|
// url: '/riskControl/conversation/content',
|
|||
|
|
// img: require('@/assets/index/zidgl.png'),
|
|||
|
|
// },
|
|||
|
|
],
|
|||
|
|
table: {
|
|||
|
|
userCount: 0,
|
|||
|
|
customerCount: 0,
|
|||
|
|
groupCount: 0,
|
|||
|
|
groupMemberCount: 0,
|
|||
|
|
},
|
|||
|
|
erchatsTable: {},
|
|||
|
|
allData: {},
|
|||
|
|
time: '昨天',
|
|||
|
|
uptime: '',
|
|||
|
|
timeType: 'today',
|
|||
|
|
durationCount: 2600,
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
mounted() {
|
|||
|
|
this.erchatInfo()
|
|||
|
|
this.tableInfo()
|
|||
|
|
},
|
|||
|
|
methods: {
|
|||
|
|
timeTypeCheck(type) {
|
|||
|
|
switch (type) {
|
|||
|
|
case 'today':
|
|||
|
|
case 'week':
|
|||
|
|
case 'month':
|
|||
|
|
let json = {
|
|||
|
|
today: '昨天',
|
|||
|
|
week: '上周',
|
|||
|
|
month: '上月',
|
|||
|
|
}
|
|||
|
|
this.time = json[type]
|
|||
|
|
this.erchatsTable = this.allData[type]
|
|||
|
|
this.serErchat()
|
|||
|
|
break
|
|||
|
|
|
|||
|
|
default:
|
|||
|
|
this.time = '昨天'
|
|||
|
|
this.timeType = 'today'
|
|||
|
|
this.refresh()
|
|||
|
|
break
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
tableInfo() {
|
|||
|
|
api.indexTable().then((res) => {
|
|||
|
|
this.table = res.data
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
erchatInfo() {
|
|||
|
|
api.indexEchart().then((res) => {
|
|||
|
|
this.allData = res.data
|
|||
|
|
this.uptime = res.data.updateTime
|
|||
|
|
this.erchatsTable = this.allData.today
|
|||
|
|
this.serErchat()
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
serErchat() {
|
|||
|
|
let data = {
|
|||
|
|
arr0: [],
|
|||
|
|
arr1: [],
|
|||
|
|
arr2: [],
|
|||
|
|
arr3: [],
|
|||
|
|
xData: [],
|
|||
|
|
}
|
|||
|
|
let series = []
|
|||
|
|
this.erchatsTable.dataList.forEach((a) => {
|
|||
|
|
data.xData.push(a.xtime)
|
|||
|
|
data.arr0.push(a.newContactCnt)
|
|||
|
|
data.arr2.push(a.newMemberCnt)
|
|||
|
|
data.arr1.push(a.newChatCnt)
|
|||
|
|
data.arr3.push(a.negativeFeedbackCnt)
|
|||
|
|
})
|
|||
|
|
|
|||
|
|
for (let index = 0; index < 4; index++) {
|
|||
|
|
series.push({
|
|||
|
|
name: ['新增客户数', '新增客群数', '群新增人数', '流失客户数'][index],
|
|||
|
|
type: 'line',
|
|||
|
|
// stack: '总量',
|
|||
|
|
smooth: true,
|
|||
|
|
data: data['arr' + index],
|
|||
|
|
// itemStyle: {
|
|||
|
|
// normal: {
|
|||
|
|
// lineStyle: {
|
|||
|
|
// color: colors[index]
|
|||
|
|
// }
|
|||
|
|
// }
|
|||
|
|
// },
|
|||
|
|
textStyle: {
|
|||
|
|
color: '#fff', // 主标题文字的颜色。
|
|||
|
|
},
|
|||
|
|
})
|
|||
|
|
}
|
|||
|
|
this.drawLine(data.xData, series)
|
|||
|
|
},
|
|||
|
|
drawLine(xData, series) {
|
|||
|
|
let obj = document.getElementById('echart')
|
|||
|
|
let charts = echarts.init(obj)
|
|||
|
|
let timer = 0
|
|||
|
|
window.onresize = function () {
|
|||
|
|
clearTimeout(timer)
|
|||
|
|
timer = setTimeout(() => {
|
|||
|
|
charts.resize()
|
|||
|
|
}, 200)
|
|||
|
|
}
|
|||
|
|
charts.setOption({
|
|||
|
|
color: ['#088AEE', '#E74E59', '#14BF48', '#FA7216'],
|
|||
|
|
tooltip: {
|
|||
|
|
trigger: 'axis',
|
|||
|
|
},
|
|||
|
|
legend: {
|
|||
|
|
data: ['新增客户数', '新增客群数', '群新增人数', '流失客户数'],
|
|||
|
|
},
|
|||
|
|
grid: {
|
|||
|
|
left: '3%',
|
|||
|
|
right: '4%',
|
|||
|
|
bottom: '3%',
|
|||
|
|
containLabel: true,
|
|||
|
|
},
|
|||
|
|
xAxis: {
|
|||
|
|
type: 'category',
|
|||
|
|
boundaryGap: false,
|
|||
|
|
data: xData,
|
|||
|
|
axisLine: {
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#ccc',
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
yAxis: {
|
|||
|
|
type: 'value',
|
|||
|
|
axisLine: {
|
|||
|
|
lineStyle: {
|
|||
|
|
color: '#ccc',
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
series,
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
refresh() {
|
|||
|
|
api.refresh().then((res) => {
|
|||
|
|
this.erchatInfo()
|
|||
|
|
})
|
|||
|
|
},
|
|||
|
|
getClass(key) {
|
|||
|
|
let val = Number(this.erchatsTable[key])
|
|||
|
|
if (val > 0) {
|
|||
|
|
return 'ascend'
|
|||
|
|
} else if (val < 0) {
|
|||
|
|
return 'descend'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
getArrow(key) {
|
|||
|
|
let val = Number(this.erchatsTable[key])
|
|||
|
|
if (val > 0) {
|
|||
|
|
return '↑'
|
|||
|
|
} else if (val < 0) {
|
|||
|
|
return '↓'
|
|||
|
|
} else {
|
|||
|
|
return '-'
|
|||
|
|
}
|
|||
|
|
},
|
|||
|
|
},
|
|||
|
|
}
|
|||
|
|
</script>
|
|||
|
|
<style lang="scss" scoped>
|
|||
|
|
.index {
|
|||
|
|
margin: 0;
|
|||
|
|
width: 100%;
|
|||
|
|
background: #f1f1f1;
|
|||
|
|
|
|||
|
|
// overflow: hidden;
|
|||
|
|
.title_name {
|
|||
|
|
font-size: 24px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
color: #000000;
|
|||
|
|
padding-top: 15px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.col_style {
|
|||
|
|
font-size: 18px;
|
|||
|
|
font-weight: 500;
|
|||
|
|
color: #666;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fontgay {
|
|||
|
|
text-indent: 4em;
|
|||
|
|
color: #999;
|
|||
|
|
font-size: 14px;
|
|||
|
|
font-weight: 200;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#fatherbox {
|
|||
|
|
padding-top: 30px;
|
|||
|
|
height: 380px;
|
|||
|
|
overflow-y: scroll;
|
|||
|
|
overflow: hidden;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
font-size: 16px;
|
|||
|
|
background: #fff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
#echart {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.fr {
|
|||
|
|
float: right;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.descend {
|
|||
|
|
color: #ff0000;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.ascend {
|
|||
|
|
color: green;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.tables {
|
|||
|
|
width: 100%;
|
|||
|
|
height: 200px;
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
padding: 15px;
|
|||
|
|
font-size: 16px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.whitebg {
|
|||
|
|
min-height: 1000px;
|
|||
|
|
float: left;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.index_l {
|
|||
|
|
width: 76%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.circle {
|
|||
|
|
width: 80px;
|
|||
|
|
height: 80px;
|
|||
|
|
background: #999;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
margin: 0 auto;
|
|||
|
|
|
|||
|
|
img {
|
|||
|
|
border-radius: 50%;
|
|||
|
|
width: 80px;
|
|||
|
|
height: 80px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.index_r {
|
|||
|
|
width: 23%;
|
|||
|
|
margin-left: 1%;
|
|||
|
|
|
|||
|
|
.qy_R {
|
|||
|
|
background: #fff;
|
|||
|
|
min-height: 1267px;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
|
|||
|
|
.inedx_r_top_t {
|
|||
|
|
border-radius: 5px;
|
|||
|
|
height: 270px;
|
|||
|
|
background-size: 100% 100%;
|
|||
|
|
// background: url('../../../assets/index/yd.png') no-repeat;
|
|||
|
|
background-size: cover;
|
|||
|
|
padding: 20px 10px 10px 10px;
|
|||
|
|
color: #fff;
|
|||
|
|
|
|||
|
|
.flexspan {
|
|||
|
|
height: 40px;
|
|||
|
|
line-height: 40px;
|
|||
|
|
background: #fff;
|
|||
|
|
color: #0079de;
|
|||
|
|
border-radius: 4px;
|
|||
|
|
margin-top: 30px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.margint20 {
|
|||
|
|
margin-top: 31px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
p {
|
|||
|
|
padding-top: 9px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.p1 {
|
|||
|
|
font-size: 16px;
|
|||
|
|
font-weight: 500;
|
|||
|
|
color: #ffffff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.p2 {
|
|||
|
|
font-size: 14px;
|
|||
|
|
font-weight: 400;
|
|||
|
|
color: #d3e8ff;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.p3 {
|
|||
|
|
font-size: 18px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.p4 {
|
|||
|
|
color: #ffffff;
|
|||
|
|
padding-top: 10px;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.img {
|
|||
|
|
margin: 30px;
|
|||
|
|
width: 175px;
|
|||
|
|
height: 175px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.inedx_r_top_bottom {
|
|||
|
|
padding: 10px 30px;
|
|||
|
|
margin-top: 29px;
|
|||
|
|
|
|||
|
|
.inedx_r_top_bottomp1 {
|
|||
|
|
font-size: 16px;
|
|||
|
|
color: #333333;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ul {
|
|||
|
|
margin-top: 20px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
ul li {
|
|||
|
|
font-size: 14px;
|
|||
|
|
line-height: 35px;
|
|||
|
|
font-weight: 500;
|
|||
|
|
color: #666;
|
|||
|
|
|
|||
|
|
span {
|
|||
|
|
color: #999999;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.box {
|
|||
|
|
width: 100%;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.titlebox {
|
|||
|
|
height: 80px;
|
|||
|
|
padding: 10px 0;
|
|||
|
|
background: #f1f1f1;
|
|||
|
|
|
|||
|
|
p {
|
|||
|
|
line-height: 30px;
|
|||
|
|
margin: 0;
|
|||
|
|
padding: 0;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.adminname {
|
|||
|
|
font-size: 20px;
|
|||
|
|
font-weight: bold;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.dataall {
|
|||
|
|
width: 100%;
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
padding: 20px;
|
|||
|
|
font-size: 16px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.car {
|
|||
|
|
line-height: 70px;
|
|||
|
|
|
|||
|
|
.grid-content {
|
|||
|
|
overflow: hidden;
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
padding: 10px 30px;
|
|||
|
|
|
|||
|
|
.craname {
|
|||
|
|
line-height: 50px;
|
|||
|
|
font-size: 16px;
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
img {
|
|||
|
|
width: 50px;
|
|||
|
|
height: 50px;
|
|||
|
|
border-radius: 50%;
|
|||
|
|
background: #eee;
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
}
|
|||
|
|
|
|||
|
|
.card {
|
|||
|
|
margin-top: 40px;
|
|||
|
|
background: #fff;
|
|||
|
|
border-radius: 5px;
|
|||
|
|
padding: 20px;
|
|||
|
|
font-size: 16px;
|
|||
|
|
}
|
|||
|
|
</style>
|