This commit is contained in:
parent
c791769427
commit
84b5fff7f4
Binary file not shown.
After Width: | Height: | Size: 18 KiB |
Binary file not shown.
After Width: | Height: | Size: 19 KiB |
Binary file not shown.
After Width: | Height: | Size: 19 KiB |
Binary file not shown.
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
After Width: | Height: | Size: 17 KiB |
Binary file not shown.
After Width: | Height: | Size: 6.3 KiB |
447
src/view/sy.vue
447
src/view/sy.vue
|
@ -10,10 +10,16 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="item_content">
|
<div class="item_content">
|
||||||
<div class="sr">
|
<div class="sr">
|
||||||
<span class="left">收入:</span><span class="right">{{ data.LivelihoodWelfare.zgylbxzsr }}万元</span>
|
<span class="left">收入:</span
|
||||||
|
><span class="right"
|
||||||
|
>{{ data.LivelihoodWelfare.zgylbxzsr }}万元</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="sr" style="margin-top: 5px">
|
<div class="sr" style="margin-top: 5px">
|
||||||
<span class="left">支出:</span><span class="right">{{ data.LivelihoodWelfare.zgylbxzzc }}万元</span>
|
<span class="left">支出:</span
|
||||||
|
><span class="right"
|
||||||
|
>{{ data.LivelihoodWelfare.zgylbxzzc }}万元</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -21,10 +27,16 @@
|
||||||
<div class="item_title"><span class="blue">工伤</span>保险</div>
|
<div class="item_title"><span class="blue">工伤</span>保险</div>
|
||||||
<div class="item_content">
|
<div class="item_content">
|
||||||
<div class="sr">
|
<div class="sr">
|
||||||
<span class="left">收入:</span><span class="right">{{ data.LivelihoodWelfare.gsbxzsr }}万元</span>
|
<span class="left">收入:</span
|
||||||
|
><span class="right"
|
||||||
|
>{{ data.LivelihoodWelfare.gsbxzsr }}万元</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="sr" style="margin-top: 5px">
|
<div class="sr" style="margin-top: 5px">
|
||||||
<span class="left">支出:</span><span class="right">{{ data.LivelihoodWelfare.gsbxzzc }}万元</span>
|
<span class="left">支出:</span
|
||||||
|
><span class="right"
|
||||||
|
>{{ data.LivelihoodWelfare.gsbxzzc }}万元</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -34,10 +46,16 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="item_content">
|
<div class="item_content">
|
||||||
<div class="sr">
|
<div class="sr">
|
||||||
<span class="left">收入:</span><span class="right">{{ data.LivelihoodWelfare.cxylbxzsr }}万元</span>
|
<span class="left">收入:</span
|
||||||
|
><span class="right"
|
||||||
|
>{{ data.LivelihoodWelfare.cxylbxzsr }}万元</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="sr" style="margin-top: 5px">
|
<div class="sr" style="margin-top: 5px">
|
||||||
<span class="left">支出:</span><span class="right">{{ data.LivelihoodWelfare.cxylbxzzc }}万元</span>
|
<span class="left">支出:</span
|
||||||
|
><span class="right"
|
||||||
|
>{{ data.LivelihoodWelfare.cxylbxzzc }}万元</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -47,10 +65,16 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="item_content">
|
<div class="item_content">
|
||||||
<div class="sr">
|
<div class="sr">
|
||||||
<span class="left">收入:</span><span class="right">{{ data.LivelihoodWelfare.zgyilbxzsr }}万元</span>
|
<span class="left">收入:</span
|
||||||
|
><span class="right"
|
||||||
|
>{{ data.LivelihoodWelfare.zgyilbxzsr }}万元</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="sr" style="margin-top: 5px">
|
<div class="sr" style="margin-top: 5px">
|
||||||
<span class="left">支出:</span><span class="right">{{ data.LivelihoodWelfare.zgyilbxzzc }}万元</span>
|
<span class="left">支出:</span
|
||||||
|
><span class="right"
|
||||||
|
>{{ data.LivelihoodWelfare.zgyilbxzzc }}万元</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -60,10 +84,16 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="item_content">
|
<div class="item_content">
|
||||||
<div class="sr">
|
<div class="sr">
|
||||||
<span class="left">收入:</span><span class="right">{{ data.LivelihoodWelfare.cxyilbxzsr }}万元</span>
|
<span class="left">收入:</span
|
||||||
|
><span class="right"
|
||||||
|
>{{ data.LivelihoodWelfare.cxyilbxzsr }}万元</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="sr" style="margin-top: 5px">
|
<div class="sr" style="margin-top: 5px">
|
||||||
<span class="left">支出:</span><span class="right">{{ data.LivelihoodWelfare.cxyilbxzzc }}万元</span>
|
<span class="left">支出:</span
|
||||||
|
><span class="right"
|
||||||
|
>{{ data.LivelihoodWelfare.cxyilbxzzc }}万元</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -100,10 +130,12 @@
|
||||||
<div class="left_2_bottom_item">
|
<div class="left_2_bottom_item">
|
||||||
<div class="left_2_bottom_item_shang">
|
<div class="left_2_bottom_item_shang">
|
||||||
<div class="left">
|
<div class="left">
|
||||||
<span class="span1">{{ jysyList[0].title }}</span>学校师生比
|
<span class="span1">{{ jysyList[0].title }}</span
|
||||||
|
>学校师生比
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
<div class="right">
|
||||||
<span class="span1">{{ jysyList[0].teacher }}</span>:{{ jysyList[0].student }}
|
<span class="span1">{{ jysyList[0].teacher }}</span
|
||||||
|
>:{{ jysyList[0].student }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="left_2_bottom_item_xia">
|
<div class="left_2_bottom_item_xia">
|
||||||
|
@ -113,7 +145,8 @@
|
||||||
<div class="left_2_bottom_item">
|
<div class="left_2_bottom_item">
|
||||||
<div class="left_2_bottom_item_shang">
|
<div class="left_2_bottom_item_shang">
|
||||||
<div class="left">
|
<div class="left">
|
||||||
<span class="span2">{{ jysyList[1].title }}</span>学校师生比
|
<span class="span2">{{ jysyList[1].title }}</span
|
||||||
|
>学校师生比
|
||||||
</div>
|
</div>
|
||||||
<div class="right">
|
<div class="right">
|
||||||
{{ jysyList[1].teacher }}:{{ jysyList[1].student }}
|
{{ jysyList[1].teacher }}:{{ jysyList[1].student }}
|
||||||
|
@ -166,23 +199,44 @@
|
||||||
<ePie style="margin-bottom: 30px" :list="data.ageGroup"></ePie>
|
<ePie style="margin-bottom: 30px" :list="data.ageGroup"></ePie>
|
||||||
<div class="table">
|
<div class="table">
|
||||||
<div class="table_choose">
|
<div class="table_choose">
|
||||||
<div :class="choose == '1' ? 'choose' : 'noChoose'" @click="change('1')">
|
<div
|
||||||
|
:class="choose == '1' ? 'choose' : 'noChoose'"
|
||||||
|
@click="change('1')"
|
||||||
|
>
|
||||||
公共服务
|
公共服务
|
||||||
</div>
|
</div>
|
||||||
<div :class="choose == '2' ? 'choose' : 'noChoose'" @click="change('2')">
|
<div
|
||||||
|
:class="choose == '2' ? 'choose' : 'noChoose'"
|
||||||
|
@click="change('2')"
|
||||||
|
>
|
||||||
企业服务
|
企业服务
|
||||||
</div>
|
</div>
|
||||||
<div :class="choose == '3' ? 'choose' : 'noChoose'" @click="change('3')">
|
<div
|
||||||
|
:class="choose == '3' ? 'choose' : 'noChoose'"
|
||||||
|
@click="change('3')"
|
||||||
|
>
|
||||||
政务服务
|
政务服务
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<el-table :data="tableData" style="width: 100%; height: 272px" class="table_border" :row-style="rowState"
|
<el-table
|
||||||
:header-cell-style="tableHeaderColor">
|
:data="tableData"
|
||||||
|
style="width: 100%; height: 272px"
|
||||||
|
class="table_border"
|
||||||
|
:row-style="rowState"
|
||||||
|
:header-cell-style="tableHeaderColor"
|
||||||
|
>
|
||||||
<el-table-column prop="company" label="企业名称" width="180" />
|
<el-table-column prop="company" label="企业名称" width="180" />
|
||||||
<el-table-column prop="address" label="项目事项牵头单位" width="180" />
|
<el-table-column
|
||||||
|
prop="address"
|
||||||
|
label="项目事项牵头单位"
|
||||||
|
width="180"
|
||||||
|
/>
|
||||||
<el-table-column prop="finish" label="完成情况">
|
<el-table-column prop="finish" label="完成情况">
|
||||||
<template #default="scope">
|
<template #default="scope">
|
||||||
<div style="letter-spacing: 3px" :style="scope.row.finish ? 'color:#FFFFFF' : 'color:#FFC06E'">
|
<div
|
||||||
|
style="letter-spacing: 3px"
|
||||||
|
:style="scope.row.finish ? 'color:#FFFFFF' : 'color:#FFC06E'"
|
||||||
|
>
|
||||||
{{ scope.row.finish ? "已完成" : "未完成" }}
|
{{ scope.row.finish ? "已完成" : "未完成" }}
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -195,7 +249,11 @@
|
||||||
<div class="flex1">
|
<div class="flex1">
|
||||||
<div class="yd_title mechanism"></div>
|
<div class="yd_title mechanism"></div>
|
||||||
<div class="ylws">
|
<div class="ylws">
|
||||||
<div class="ylws_item" v-for="(item, index) in data.ylwsList" :key="index">
|
<div
|
||||||
|
class="ylws_item"
|
||||||
|
v-for="(item, index) in data.ylwsList"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
<div class="name">{{ item.name }}</div>
|
<div class="name">{{ item.name }}</div>
|
||||||
<div class="value">{{ item.value }}</div>
|
<div class="value">{{ item.value }}</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -204,7 +262,11 @@
|
||||||
<div class="flex1" style="margin-top: 10px">
|
<div class="flex1" style="margin-top: 10px">
|
||||||
<div class="yd_title service"></div>
|
<div class="yd_title service"></div>
|
||||||
<div class="whsy">
|
<div class="whsy">
|
||||||
<div class="whsy_item" v-for="(item, index) in data.whsyList" :key="index">
|
<div
|
||||||
|
class="whsy_item"
|
||||||
|
v-for="(item, index) in data.whsyList"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
<div class="name">{{ item.name }}</div>
|
<div class="name">{{ item.name }}</div>
|
||||||
<div class="value">
|
<div class="value">
|
||||||
{{ item.value }}<span>{{ item.dw }}</span>
|
{{ item.value }}<span>{{ item.dw }}</span>
|
||||||
|
@ -215,7 +277,11 @@
|
||||||
<div class="flex1" style="margin-top: 10px">
|
<div class="flex1" style="margin-top: 10px">
|
||||||
<div class="yd_title last"></div>
|
<div class="yd_title last"></div>
|
||||||
<div class="tysy">
|
<div class="tysy">
|
||||||
<div class="tysy_item" v-for="(item, index) in data.tysyList" :key="index">
|
<div
|
||||||
|
class="tysy_item"
|
||||||
|
v-for="(item, index) in data.tysyList"
|
||||||
|
:key="index"
|
||||||
|
>
|
||||||
<div class="value">
|
<div class="value">
|
||||||
{{ item.value }}<span>{{ item.dw ? item.dw : "" }}</span>
|
{{ item.value }}<span>{{ item.dw ? item.dw : "" }}</span>
|
||||||
</div>
|
</div>
|
||||||
|
@ -226,7 +292,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div class="flex1" style="margin-top: 10px">
|
<div class="flex1" style="margin-top: 10px">
|
||||||
<div class="yd_title last_1"></div>
|
<div class="yd_title last_1"></div>
|
||||||
<table class="table">
|
<!-- <table class="table">
|
||||||
<tbody>
|
<tbody>
|
||||||
<tr v-for="(item, index) in jtsyList" :key="index" style="display: flex; box-sizing: border-box">
|
<tr v-for="(item, index) in jtsyList" :key="index" style="display: flex; box-sizing: border-box">
|
||||||
<td>{{ item.name }}</td>
|
<td>{{ item.name }}</td>
|
||||||
|
@ -244,10 +310,92 @@
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</tbody>
|
</tbody>
|
||||||
</table>
|
</table> -->
|
||||||
|
<div class="jtsyBox">
|
||||||
|
<div class="jtsyBoxtop">
|
||||||
|
<div class="jtsyBoxtop1">
|
||||||
|
<img :src="data.jtsyList[0].img" alt="" />
|
||||||
|
<div>
|
||||||
|
<div class="jtsyname">{{ data.jtsyList[0].name }}</div>
|
||||||
|
<div class="jtsytext">
|
||||||
|
{{ data.jtsyList[0].key1 }}:
|
||||||
|
<span>{{ data.jtsyList[0].key1_value }}</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ data.jtsyList[0].key2 }}:
|
||||||
|
<span>{{ data.jtsyList[0].key2_value }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="jtsyBoxtop1">
|
||||||
|
<img :src="data.jtsyList[1].img" alt="" />
|
||||||
|
<div>
|
||||||
|
<div class="jtsyname">{{ data.jtsyList[1].name }}</div>
|
||||||
|
<div class="jtsytext">
|
||||||
|
{{ data.jtsyList[1].key1 }}:
|
||||||
|
<span>{{ data.jtsyList[1].key1_value }}</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ data.jtsyList[1].key2 }}:
|
||||||
|
<span>{{ data.jtsyList[1].key2_value }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="jtsyBoxbot">
|
||||||
|
<div class="jtsyBoxtop1">
|
||||||
|
<img :src="data.jtsyList[2].img" alt="" />
|
||||||
|
<div>
|
||||||
|
<div class="jtsyname">{{ data.jtsyList[2].name }}</div>
|
||||||
|
<div class="jtsytext">
|
||||||
|
{{ data.jtsyList[2].key1 }}:
|
||||||
|
<span>{{ data.jtsyList[2].key1_value }}</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ data.jtsyList[2].key2 }}:
|
||||||
|
<span>{{ data.jtsyList[2].key2_value }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="jtsyBoxtop1">
|
||||||
|
<img :src="data.jtsyList[3].img" alt="" />
|
||||||
|
<div>
|
||||||
|
<div class="jtsyname">{{ data.jtsyList[3].name }}</div>
|
||||||
|
<div class="jtsytext">
|
||||||
|
{{ data.jtsyList[3].key1 }}:
|
||||||
|
<span>{{ data.jtsyList[3].key1_value }}</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ data.jtsyList[3].key2 }}:
|
||||||
|
<span>{{ data.jtsyList[3].key2_value }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="jtsyBoxtop1">
|
||||||
|
<img :src="data.jtsyList[4].img" alt="" />
|
||||||
|
<div>
|
||||||
|
<div class="jtsyname">{{ data.jtsyList[4].name }}</div>
|
||||||
|
<div class="jtsytext">
|
||||||
|
{{ data.jtsyList[4].key1 }}:
|
||||||
|
<span>{{ data.jtsyList[4].key1_value }}</span>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
{{ data.jtsyList[4].key2 }}:
|
||||||
|
<span>{{ data.jtsyList[4].key2_value }}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Dialog :dialogShow="dialogShow" :columns="tableType.columns" :title="tableType.title" :tableData="tableType.data" @close="close">
|
<Dialog
|
||||||
|
:dialogShow="dialogShow"
|
||||||
|
:columns="tableType.columns"
|
||||||
|
:title="tableType.title"
|
||||||
|
:tableData="tableType.data"
|
||||||
|
@close="close"
|
||||||
|
>
|
||||||
</Dialog>
|
</Dialog>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
@ -259,75 +407,81 @@ import footerball from "../assets/images/sy/footerball.png";
|
||||||
import baskerball from "../assets/images/sy/baskerball.png";
|
import baskerball from "../assets/images/sy/baskerball.png";
|
||||||
import badminton from "../assets/images/sy/badminton.png";
|
import badminton from "../assets/images/sy/badminton.png";
|
||||||
import running from "../assets/images/sy/running.png";
|
import running from "../assets/images/sy/running.png";
|
||||||
import Dialog from "./dialog/dialog.vue";
|
|
||||||
import tableTennis from "../assets/images/sy/tableTennis.png";
|
import tableTennis from "../assets/images/sy/tableTennis.png";
|
||||||
|
|
||||||
|
import ggjtimg from "../assets/images/sy/ggjt.png";
|
||||||
|
import ggjtimg1 from "../assets/images/sy/ggjt1.png";
|
||||||
|
import ggjtimg2 from "../assets/images/sy/ggjt2.png";
|
||||||
|
import ggjtimg3 from "../assets/images/sy/ggjt3.png";
|
||||||
|
import ggjtimg4 from "../assets/images/sy/ggjt4.png";
|
||||||
|
|
||||||
|
import Dialog from "./dialog/dialog.vue";
|
||||||
import { ref, reactive, onMounted, onBeforeMount, computed } from "vue";
|
import { ref, reactive, onMounted, onBeforeMount, computed } from "vue";
|
||||||
import http from "@/utils/request.js";
|
import http from "@/utils/request.js";
|
||||||
import { CircleCloseFilled } from '@element-plus/icons-vue'
|
import { CircleCloseFilled } from "@element-plus/icons-vue";
|
||||||
import { columns } from "element-plus/es/components/table-v2/src/common.mjs";
|
import { columns } from "element-plus/es/components/table-v2/src/common.mjs";
|
||||||
|
|
||||||
// 详情弹框
|
// 详情弹框
|
||||||
const dialogShow = ref(false)
|
const dialogShow = ref(false);
|
||||||
const tableType = reactive({
|
const tableType = reactive({
|
||||||
title: '',
|
title: "",
|
||||||
columns: [
|
columns: [
|
||||||
{
|
{
|
||||||
label: '姓名',
|
label: "姓名",
|
||||||
property: 'name',
|
property: "name",
|
||||||
width: '150'
|
width: "150",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '人员类别',
|
label: "人员类别",
|
||||||
property: 'type',
|
property: "type",
|
||||||
width: '150'
|
width: "150",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '就失业状态',
|
label: "就失业状态",
|
||||||
property: 'status',
|
property: "status",
|
||||||
width: '150'
|
width: "150",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '日期',
|
label: "日期",
|
||||||
property: 'date',
|
property: "date",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
label: '地址',
|
label: "地址",
|
||||||
property: 'address',
|
property: "address",
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
data: [
|
data: [
|
||||||
{
|
{
|
||||||
date: '2016-05-02',
|
date: "2016-05-02",
|
||||||
name: 'John Smith',
|
name: "John Smith",
|
||||||
address: 'No.1518, Jinshajiang Road, Putuo District',
|
address: "No.1518, Jinshajiang Road, Putuo District",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
date: '2016-05-04',
|
date: "2016-05-04",
|
||||||
name: 'John Smith',
|
name: "John Smith",
|
||||||
address: 'No.1518, Jinshajiang Road, Putuo District',
|
address: "No.1518, Jinshajiang Road, Putuo District",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
date: '2016-05-01',
|
date: "2016-05-01",
|
||||||
name: 'John Smith',
|
name: "John Smith",
|
||||||
address: 'No.1518, Jinshajiang Road, Putuo District',
|
address: "No.1518, Jinshajiang Road, Putuo District",
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
date: '2016-05-03',
|
date: "2016-05-03",
|
||||||
name: 'John Smith',
|
name: "John Smith",
|
||||||
address: 'No.1518, Jinshajiang Road, Putuo District',
|
address: "No.1518, Jinshajiang Road, Putuo District",
|
||||||
},
|
},
|
||||||
]
|
],
|
||||||
})
|
});
|
||||||
|
|
||||||
const showDialog = (title) => {
|
const showDialog = (title) => {
|
||||||
dialogShow.value = true
|
dialogShow.value = true;
|
||||||
tableType.title = title
|
tableType.title = title;
|
||||||
}
|
};
|
||||||
|
|
||||||
const close = () => {
|
const close = () => {
|
||||||
dialogShow.value = false
|
dialogShow.value = false;
|
||||||
}
|
};
|
||||||
|
|
||||||
|
|
||||||
const data = reactive({
|
const data = reactive({
|
||||||
PopulationData: {
|
PopulationData: {
|
||||||
|
@ -527,6 +681,7 @@ const data = reactive({
|
||||||
key1_value: "1172491",
|
key1_value: "1172491",
|
||||||
key2: "骑行时长",
|
key2: "骑行时长",
|
||||||
key2_value: "1283h",
|
key2_value: "1283h",
|
||||||
|
img: ggjtimg,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "电动单车",
|
name: "电动单车",
|
||||||
|
@ -534,6 +689,7 @@ const data = reactive({
|
||||||
key1_value: "1172491",
|
key1_value: "1172491",
|
||||||
key2: "骑行时长",
|
key2: "骑行时长",
|
||||||
key2_value: "1283h",
|
key2_value: "1283h",
|
||||||
|
img: ggjtimg1,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "公共汽车",
|
name: "公共汽车",
|
||||||
|
@ -541,6 +697,7 @@ const data = reactive({
|
||||||
key1_value: "176",
|
key1_value: "176",
|
||||||
key2: "乘坐人次",
|
key2: "乘坐人次",
|
||||||
key2_value: "239741",
|
key2_value: "239741",
|
||||||
|
img: ggjtimg2,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "长途汽车",
|
name: "长途汽车",
|
||||||
|
@ -548,6 +705,7 @@ const data = reactive({
|
||||||
key1_value: "133",
|
key1_value: "133",
|
||||||
key2: "客流量",
|
key2: "客流量",
|
||||||
key2_value: "192874",
|
key2_value: "192874",
|
||||||
|
img: ggjtimg3,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: "高铁",
|
name: "高铁",
|
||||||
|
@ -555,6 +713,7 @@ const data = reactive({
|
||||||
key1_value: "23",
|
key1_value: "23",
|
||||||
key2: "客流量",
|
key2: "客流量",
|
||||||
key2_value: "113414",
|
key2_value: "113414",
|
||||||
|
img: ggjtimg4,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
});
|
});
|
||||||
|
@ -654,14 +813,16 @@ const jtsyList = ref([
|
||||||
|
|
||||||
// 县城学校师生比样式
|
// 县城学校师生比样式
|
||||||
const cs = computed(() => {
|
const cs = computed(() => {
|
||||||
let str = `--teacher: ${jysyList.value[0].teacher}; --total: ${jysyList.value[0].teacher + jysyList.value[0].student
|
let str = `--teacher: ${jysyList.value[0].teacher}; --total: ${
|
||||||
}`;
|
jysyList.value[0].teacher + jysyList.value[0].student
|
||||||
|
}`;
|
||||||
return str;
|
return str;
|
||||||
});
|
});
|
||||||
// 农村学校师生比样式
|
// 农村学校师生比样式
|
||||||
const nc = computed(() => {
|
const nc = computed(() => {
|
||||||
let str = `--teacher: ${jysyList.value[1].teacher}; --total: ${jysyList.value[1].teacher + jysyList.value[1].student
|
let str = `--teacher: ${jysyList.value[1].teacher}; --total: ${
|
||||||
}`;
|
jysyList.value[1].teacher + jysyList.value[1].student
|
||||||
|
}`;
|
||||||
return str;
|
return str;
|
||||||
});
|
});
|
||||||
// 服务表格样式
|
// 服务表格样式
|
||||||
|
@ -834,10 +995,25 @@ onBeforeMount(async () => {
|
||||||
.tabelPart {
|
.tabelPart {
|
||||||
height: 60vh;
|
height: 60vh;
|
||||||
padding: 16px;
|
padding: 16px;
|
||||||
background: linear-gradient(270deg, rgba(0, 77, 131, 0.69) 0%, rgba(0, 51, 83, 0.77) 50%, rgba(0, 77, 131, 0.74) 100%), radial-gradient(66% 40% at 50% 0%, rgba(1, 150, 243, 0.55) 0%, rgba(0, 116, 255, 0) 100%);
|
background: linear-gradient(
|
||||||
|
270deg,
|
||||||
|
rgba(0, 77, 131, 0.69) 0%,
|
||||||
|
rgba(0, 51, 83, 0.77) 50%,
|
||||||
|
rgba(0, 77, 131, 0.74) 100%
|
||||||
|
),
|
||||||
|
radial-gradient(
|
||||||
|
66% 40% at 50% 0%,
|
||||||
|
rgba(1, 150, 243, 0.55) 0%,
|
||||||
|
rgba(0, 116, 255, 0) 100%
|
||||||
|
);
|
||||||
box-shadow: inset 0px 0px 56px 0px rgba(100, 191, 255, 0.5);
|
box-shadow: inset 0px 0px 56px 0px rgba(100, 191, 255, 0.5);
|
||||||
border: 2px solid;
|
border: 2px solid;
|
||||||
border-image: linear-gradient(180deg, rgba(21, 150, 255, 1), rgba(0, 157, 227, 0)) 2 2;
|
border-image: linear-gradient(
|
||||||
|
180deg,
|
||||||
|
rgba(21, 150, 255, 1),
|
||||||
|
rgba(0, 157, 227, 0)
|
||||||
|
)
|
||||||
|
2 2;
|
||||||
|
|
||||||
:deep(.el-table) {
|
:deep(.el-table) {
|
||||||
--el-table-bg-color: none;
|
--el-table-bg-color: none;
|
||||||
|
@ -1084,9 +1260,11 @@ onBeforeMount(async () => {
|
||||||
color: #2ef1ff;
|
color: #2ef1ff;
|
||||||
line-height: 26px;
|
line-height: 26px;
|
||||||
text-shadow: 0px 0px 13px rgba(0, 252, 255, 0.5);
|
text-shadow: 0px 0px 13px rgba(0, 252, 255, 0.5);
|
||||||
background: linear-gradient(270deg,
|
background: linear-gradient(
|
||||||
rgba(255, 255, 255, 0) 0%,
|
270deg,
|
||||||
#3976a1 100%);
|
rgba(255, 255, 255, 0) 0%,
|
||||||
|
#3976a1 100%
|
||||||
|
);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1424,26 +1602,26 @@ onBeforeMount(async () => {
|
||||||
// border: 1px solid rgba(255, 255, 255, 0.77);
|
// border: 1px solid rgba(255, 255, 255, 0.77);
|
||||||
background-color: #27628d;
|
background-color: #27628d;
|
||||||
position: relative;
|
position: relative;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
.csbl {
|
.csbl {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: calc(var(--teacher) / var(--total) * 100%);
|
width: calc(var(--teacher) / var(--total) * 100%);
|
||||||
height: 8px;
|
height: 8px;
|
||||||
background-color: #00f5ff;
|
background-color: #00f5ff;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ncbl {
|
.ncbl {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: calc(var(--teacher) / var(--total) * 100%);
|
width: calc(var(--teacher) / var(--total) * 100%);
|
||||||
height: 8px;
|
height: 8px;
|
||||||
background-color: #ffd863;
|
background-color: #ffd863;
|
||||||
border-radius: 8px;
|
border-radius: 8px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
&_xia:nth-child(2){
|
&_xia:nth-child(2) {
|
||||||
background-color: #475e73;
|
background-color: #475e73;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1569,6 +1747,111 @@ onBeforeMount(async () => {
|
||||||
right: 50px;
|
right: 50px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
// 交通事业
|
||||||
|
.jtsyBox {
|
||||||
|
width: 97%;
|
||||||
|
// background-color: skyblue;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #ffffff;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 68px;
|
||||||
|
height: 96px;
|
||||||
|
margin-right: 4px;
|
||||||
|
}
|
||||||
|
.jtsyBoxtop {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
margin-bottom: 15px;
|
||||||
|
padding-top: 20px;
|
||||||
|
.jtsyBoxtop1 {
|
||||||
|
display: flex;
|
||||||
|
span {
|
||||||
|
font-family: TCloudNumber, TCloudNumber;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #ffffff;
|
||||||
|
line-height: 22px;
|
||||||
|
text-shadow: 0px 0px 4px #12fbff;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
.jtsyname {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #ffffff;
|
||||||
|
line-height: 22px;
|
||||||
|
text-shadow: 0px 2px 4px #35e0f9;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.jtsyname::after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 60px;
|
||||||
|
border-bottom: 1px dashed rgba(0, 238, 250, 1); /* 设置虚线 */
|
||||||
|
position: absolute;
|
||||||
|
bottom: -6px;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
.jtsytext {
|
||||||
|
margin-top: 14px;
|
||||||
|
margin-bottom: 2px;
|
||||||
|
// width: 80px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.jtsyBoxbot {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
.jtsyBoxtop1 {
|
||||||
|
display: flex;
|
||||||
|
span {
|
||||||
|
font-family: TCloudNumber, TCloudNumber;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #ffffff;
|
||||||
|
line-height: 22px;
|
||||||
|
text-shadow: 0px 0px 4px #12fbff;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
.jtsyname {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #ffffff;
|
||||||
|
line-height: 22px;
|
||||||
|
text-shadow: 0px 2px 4px #35e0f9;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.jtsyname::after {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 60px;
|
||||||
|
border-bottom: 1px dashed rgba(0, 238, 250, 1); /* 设置虚线 */
|
||||||
|
position: absolute;
|
||||||
|
bottom: -6px;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
.jtsytext {
|
||||||
|
margin-top: 14px;
|
||||||
|
margin-bottom: 2px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.table {
|
.table {
|
||||||
width: 94%;
|
width: 94%;
|
||||||
|
@ -1584,9 +1867,11 @@ onBeforeMount(async () => {
|
||||||
line-height: 40px;
|
line-height: 40px;
|
||||||
width: 170px;
|
width: 170px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
background: linear-gradient(180deg,
|
background: linear-gradient(
|
||||||
rgba(0, 142, 255, 0.35) 0%,
|
180deg,
|
||||||
rgba(0, 142, 255, 0.52) 100%);
|
rgba(0, 142, 255, 0.35) 0%,
|
||||||
|
rgba(0, 142, 255, 0.52) 100%
|
||||||
|
);
|
||||||
box-shadow: inset 0px -2px 0px 0px #00b4ff;
|
box-shadow: inset 0px -2px 0px 0px #00b4ff;
|
||||||
border-radius: 2px 0px 0px 2px;
|
border-radius: 2px 0px 0px 2px;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
@ -1620,7 +1905,7 @@ onBeforeMount(async () => {
|
||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
::v-deep .el-table--enable-row-hover .el-table__body tr:hover>td {
|
::v-deep .el-table--enable-row-hover .el-table__body tr:hover > td {
|
||||||
background-color: #2f4b74;
|
background-color: #2f4b74;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue