This commit is contained in:
duanxiaohai
parent
4c0e350c14
commit
607957ce81
|
|
@ -21,15 +21,33 @@
|
||||||
<div class="yd_title left_2"></div>
|
<div class="yd_title left_2"></div>
|
||||||
<div class="selectLint">
|
<div class="selectLint">
|
||||||
<div class="selectBox">
|
<div class="selectBox">
|
||||||
<el-select v-model="selectData.value1" placeholder="请选择" size="large" @change="selectChange1">
|
<el-select
|
||||||
<el-option v-for="item in selectData.options1" :key="item.value" :label="item.label"
|
v-model="selectData.value1"
|
||||||
:value="item.value" />
|
placeholder="请选择"
|
||||||
|
size="large"
|
||||||
|
@change="selectChange1"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in selectData.options1"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</div>
|
</div>
|
||||||
<div class="selectBox">
|
<div class="selectBox">
|
||||||
<el-select v-model="selectData.value2" placeholder="请选择" size="large" @change="selectChange1">
|
<el-select
|
||||||
<el-option v-for="item in selectData.options2" :key="item.value" :label="item.label"
|
v-model="selectData.value2"
|
||||||
:value="item.value" />
|
placeholder="请选择"
|
||||||
|
size="large"
|
||||||
|
@change="selectChange1"
|
||||||
|
>
|
||||||
|
<el-option
|
||||||
|
v-for="item in selectData.options2"
|
||||||
|
:key="item.value"
|
||||||
|
:label="item.label"
|
||||||
|
:value="item.value"
|
||||||
|
/>
|
||||||
</el-select>
|
</el-select>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -93,18 +111,22 @@
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex1">
|
<div class="flex1">
|
||||||
<div class="funding">
|
<div class="fundingBox">
|
||||||
<!-- <div class="fundings"> -->
|
<div class="funding">
|
||||||
<span>资助项目</span>
|
<span>资助项目</span>
|
||||||
<span>资助数量</span>
|
<span>资助数量</span>
|
||||||
<span>资助金额</span>
|
<span>资助金额</span>
|
||||||
<!-- </div> -->
|
</div>
|
||||||
</div>
|
<div class="rolling">
|
||||||
<div class="rolling">
|
<div
|
||||||
<div v-for="(item, index) in 20" :key="index" class="fundingContent">
|
v-for="(item, index) in 20"
|
||||||
<span class="spot">幼儿资助</span>
|
:key="index"
|
||||||
<span class="spot">379人次</span>
|
class="fundingContent"
|
||||||
<span class="spot">70.88</span>
|
>
|
||||||
|
<span class="spot">幼儿资助</span>
|
||||||
|
<span class="spot">379人次</span>
|
||||||
|
<span class="spot">70.88</span>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -180,7 +202,7 @@
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup>
|
<script setup>
|
||||||
import { ref, reactive, onMounted, onBeforeMount } from 'vue'
|
import { ref, reactive, onMounted, onBeforeMount } from "vue";
|
||||||
import edCSR from "./echarts_education/edCSR.vue";
|
import edCSR from "./echarts_education/edCSR.vue";
|
||||||
import edXX from "./echarts_education/edXX.vue";
|
import edXX from "./echarts_education/edXX.vue";
|
||||||
import edie from "./echarts_education/pie.vue";
|
import edie from "./echarts_education/pie.vue";
|
||||||
|
|
@ -191,109 +213,113 @@ import ePie4 from "./echarts_education/pie4.vue";
|
||||||
import ePieRose from "./echarts_education/pieRose.vue";
|
import ePieRose from "./echarts_education/pieRose.vue";
|
||||||
|
|
||||||
const selectData = reactive({
|
const selectData = reactive({
|
||||||
value1: '111',
|
value1: "111",
|
||||||
value2: 'tes1',
|
value2: "tes1",
|
||||||
options1: [{
|
options1: [
|
||||||
value: '111',
|
{
|
||||||
label: '2023秋季检查',
|
value: "111",
|
||||||
},
|
label: "2023秋季检查",
|
||||||
{
|
},
|
||||||
value: '222',
|
{
|
||||||
label: '2024春季检查',
|
value: "222",
|
||||||
},],
|
label: "2024春季检查",
|
||||||
options2: [{
|
},
|
||||||
value: 'tes1',
|
],
|
||||||
label: '中小学心理健康诊断测验(MHT）',
|
options2: [
|
||||||
},
|
{
|
||||||
{
|
value: "tes1",
|
||||||
value: 'tes2',
|
label: "中小学心理健康诊断测验(MHT）",
|
||||||
label: '小学心理健康诊断测验',
|
},
|
||||||
},
|
{
|
||||||
{
|
value: "tes2",
|
||||||
value: 'tes3',
|
label: "小学心理健康诊断测验",
|
||||||
label: '中学心理健康诊断',
|
},
|
||||||
},],
|
{
|
||||||
|
value: "tes3",
|
||||||
|
label: "中学心理健康诊断",
|
||||||
|
},
|
||||||
|
],
|
||||||
list: [],
|
list: [],
|
||||||
})
|
});
|
||||||
var roseData1 = ref([
|
var roseData1 = ref([
|
||||||
{
|
{
|
||||||
name: '正常',
|
name: "正常",
|
||||||
value: 17
|
value: 17,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '关注',
|
name: "关注",
|
||||||
value: 16
|
value: 16,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '追踪',
|
name: "追踪",
|
||||||
value: 14
|
value: 14,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '异常',
|
name: "异常",
|
||||||
value: 8
|
value: 8,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '警戒',
|
name: "警戒",
|
||||||
value: 8
|
value: 8,
|
||||||
}
|
},
|
||||||
]);
|
]);
|
||||||
var roseData2 = ref([
|
var roseData2 = ref([
|
||||||
{
|
{
|
||||||
name: '正常',
|
name: "正常",
|
||||||
value: 37
|
value: 37,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '关注',
|
name: "关注",
|
||||||
value: 26
|
value: 26,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '追踪',
|
name: "追踪",
|
||||||
value: 24
|
value: 24,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '异常',
|
name: "异常",
|
||||||
value: 18
|
value: 18,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '警戒',
|
name: "警戒",
|
||||||
value: 18
|
value: 18,
|
||||||
}
|
},
|
||||||
]);
|
]);
|
||||||
var roseData3 = ref([
|
var roseData3 = ref([
|
||||||
{
|
{
|
||||||
name: '正常',
|
name: "正常",
|
||||||
value: 227
|
value: 227,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '关注',
|
name: "关注",
|
||||||
value: 169
|
value: 169,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '追踪',
|
name: "追踪",
|
||||||
value: 114
|
value: 114,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '异常',
|
name: "异常",
|
||||||
value: 98
|
value: 98,
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '警戒',
|
name: "警戒",
|
||||||
value: 78
|
value: 78,
|
||||||
}
|
},
|
||||||
]);
|
]);
|
||||||
const selectChange1 = () => {
|
const selectChange1 = () => {
|
||||||
if(selectData.value1 == '111'){
|
if (selectData.value1 == "111") {
|
||||||
selectData.list = roseData1.value
|
selectData.list = roseData1.value;
|
||||||
}else if(selectData.value2 == 'tes1'){
|
} else if (selectData.value2 == "tes1") {
|
||||||
selectData.list = roseData2.value
|
selectData.list = roseData2.value;
|
||||||
}else if(selectData.value2 == 'tes2'){
|
} else if (selectData.value2 == "tes2") {
|
||||||
selectData.list = roseData3.value
|
selectData.list = roseData3.value;
|
||||||
}else{
|
} else {
|
||||||
selectData.list = roseData1.value
|
selectData.list = roseData1.value;
|
||||||
}
|
}
|
||||||
}
|
};
|
||||||
onBeforeMount(() => {
|
onBeforeMount(() => {
|
||||||
selectData.list = roseData1.value
|
selectData.list = roseData1.value;
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
@ -338,6 +364,7 @@ onBeforeMount(() => {
|
||||||
width: 582px;
|
width: 582px;
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
padding-left: 10px;
|
padding-left: 10px;
|
||||||
|
padding-right: 10px;
|
||||||
background-image: url(@/assets/images/center_bg.png);
|
background-image: url(@/assets/images/center_bg.png);
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
|
|
@ -918,59 +945,65 @@ onBeforeMount(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.funding {
|
.fundingBox {
|
||||||
width: 520px;
|
|
||||||
height: 34px;
|
|
||||||
margin-top: 20px;
|
|
||||||
// padding: 10px 0 14px 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background-image: url(@/assets/eduImg/jyImg17.png);
|
|
||||||
background-repeat: no-repeat;
|
|
||||||
background-size: 100% 100%;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-around;
|
.funding {
|
||||||
// align-items: center;
|
width: 520px;
|
||||||
// justify-content: center;
|
height: 34px;
|
||||||
// flex-direction: column;
|
margin-top: 20px;
|
||||||
// justify-content: space-between;
|
// padding: 10px 0 14px 0;
|
||||||
span {
|
box-sizing: border-box;
|
||||||
font-family: PingFangSC, PingFang SC;
|
background-image: url(@/assets/eduImg/jyImg17.png);
|
||||||
font-weight: 500;
|
background-repeat: no-repeat;
|
||||||
font-size: 14px;
|
background-size: 100% 100%;
|
||||||
color: #ffffff;
|
|
||||||
line-height: 20px;
|
|
||||||
letter-spacing: 3px;
|
|
||||||
}
|
|
||||||
// .fundings{
|
|
||||||
// display: flex;
|
|
||||||
// }
|
|
||||||
}
|
|
||||||
.rolling {
|
|
||||||
height: 16vh;
|
|
||||||
// height: calc(100% - 26px);
|
|
||||||
overflow-y: auto;
|
|
||||||
.fundingContent {
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-around;
|
justify-content: space-around;
|
||||||
margin-top: 10px;
|
// align-items: center;
|
||||||
width: 94%;
|
// justify-content: center;
|
||||||
height: 34px;
|
// flex-direction: column;
|
||||||
box-sizing: border-box;
|
// justify-content: space-between;
|
||||||
background-image: url(@/assets/eduImg/jyImg16.png);
|
|
||||||
|
|
||||||
span {
|
span {
|
||||||
font-family: PingFangSC, PingFang SC;
|
font-family: PingFangSC, PingFang SC;
|
||||||
font-weight: 400;
|
font-weight: 500;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
line-height: 20px;
|
||||||
letter-spacing: 3px;
|
letter-spacing: 3px;
|
||||||
text-align: left;
|
|
||||||
font-style: normal;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
.rolling {
|
||||||
|
width: 100%;
|
||||||
|
height: 14vh;
|
||||||
|
// height: calc(100% - 26px);
|
||||||
|
overflow-y: auto;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
.fundingContent {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-around;
|
||||||
|
margin-top: 10px;
|
||||||
|
width: 92%;
|
||||||
|
height: 34px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
background-image: url(@/assets/eduImg/jyImg16.png);
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 14px;
|
||||||
|
color: #ffffff;
|
||||||
|
letter-spacing: 3px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.selectLint {
|
.selectLint {
|
||||||
width: 94%;
|
width: 94%;
|
||||||
|
|
@ -980,7 +1013,7 @@ onBeforeMount(() => {
|
||||||
|
|
||||||
.selectBox {
|
.selectBox {
|
||||||
width: 48%;
|
width: 48%;
|
||||||
background-image: url(@/assets/eduImg/title3.png);
|
background-image: url(@/assets/eduImg/jyImg7.png);
|
||||||
background-repeat: no-repeat;
|
background-repeat: no-repeat;
|
||||||
background-size: 100% 100%;
|
background-size: 100% 100%;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue