This commit is contained in:
duanxiaohai
parent
b258fe7517
commit
a00e2784e1
|
|
@ -11,7 +11,12 @@
|
|||
<div
|
||||
class="back"
|
||||
@click="back()"
|
||||
v-if="routers.path == '/home/index/table/details' || routers.path == '/home/index/table/jtDetails'"
|
||||
v-if="
|
||||
routers.path == '/home/index/table/details' ||
|
||||
routers.path == '/home/index/table/jtDetails' ||
|
||||
routers.path == '/home/index/table/fitnessServices' ||
|
||||
routers.path == '/home/index/table/afterschoolActivities'
|
||||
"
|
||||
>
|
||||
<img src="@/assets/person/back.png" alt="" />
|
||||
<p>返回</p>
|
||||
|
|
@ -109,15 +114,15 @@ const to = (url) => {
|
|||
});
|
||||
if (url == "/home/index/map") {
|
||||
let menu = tools.data.get("menu");
|
||||
if(menu && menu.indexOf('ggfw:ystp') != -1){
|
||||
if (menu && menu.indexOf("ggfw:ystp") != -1) {
|
||||
data.nowTab = url;
|
||||
data.menushow = false;
|
||||
}
|
||||
}else{
|
||||
} else {
|
||||
data.nowTab = url;
|
||||
data.menushow = false;
|
||||
}
|
||||
|
||||
|
||||
// data.nowTab = url;
|
||||
// data.menushow = false;
|
||||
};
|
||||
|
|
@ -198,19 +203,19 @@ const data = reactive({
|
|||
],
|
||||
nowTab: "/home/index",
|
||||
});
|
||||
const timeT=ref(null);
|
||||
const timeT = ref(null);
|
||||
onMounted(() => {
|
||||
// 初始调用 updateClock 以立即显示时间
|
||||
updateClock();
|
||||
data.nowTab = router.currentRoute.value.fullPath;
|
||||
// 每隔一秒钟调用一次 updateClock 以更新时钟显示
|
||||
timeT.value=setInterval(updateClock, 1000);
|
||||
timeT.value = setInterval(updateClock, 1000);
|
||||
});
|
||||
onBeforeUnmount(() => {
|
||||
if (timeT.value) {
|
||||
clearInterval(timeT.value);
|
||||
console.log('定时器已清除');
|
||||
}
|
||||
console.log("定时器已清除");
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
|
|
|
|||
|
|
@ -121,6 +121,16 @@ const router = createRouter({
|
|||
path: "/home/index/table/jtDetails",
|
||||
component: () => import("../view/jt_details.vue"),
|
||||
},
|
||||
{
|
||||
name: "首页表格全民健身服务详情",
|
||||
path: "/home/index/table/fitnessServices",
|
||||
component: () => import("../view/js_details.vue"),
|
||||
},
|
||||
{
|
||||
name: "首页表格校外活动服务详情",
|
||||
path: "/home/index/table/afterschoolActivities",
|
||||
component: () => import("../view/hd_details.vue"),
|
||||
},
|
||||
{
|
||||
name: "人物图",
|
||||
path: "/home/index/person",
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@ import axios from "axios";
|
|||
import { ElMessage } from "element-plus";
|
||||
import tools from "@/utils/tools";
|
||||
import router from "../router";
|
||||
axios.defaults.baseURL = 'https://jzzf.longyou.gov.cn:998/'
|
||||
// axios.defaults.baseURL = 'https://jzzf.longyou.gov.cn:998/'
|
||||
axios.defaults.timeout = 120000;
|
||||
|
||||
// HTTP request 拦截器
|
||||
|
|
|
|||
|
|
@ -0,0 +1,700 @@
|
|||
<template>
|
||||
<div class="module">
|
||||
<div class="displayFlex">
|
||||
<div class="bt_title">
|
||||
<div class="yd_title">
|
||||
<span>校外活动服务</span>
|
||||
<div class="semi-circle-shadow"></div>
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
<i></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="select">
|
||||
<div class="select_item">
|
||||
<el-date-picker
|
||||
v-model="search1.timeDate"
|
||||
type="daterange"
|
||||
start-placeholder="开始时间"
|
||||
end-placeholder="结束时间"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
@change="searchT('date')"
|
||||
/>
|
||||
</div>
|
||||
<div class="select_item">
|
||||
<el-input
|
||||
v-model="search1.keyword"
|
||||
style="width: 100%"
|
||||
placeholder="地点查询"
|
||||
clearable
|
||||
class="input-with-select"
|
||||
>
|
||||
<template #append>
|
||||
<!-- <el-button style="" :icon="Search" @click="searchT('name')"
|
||||
>搜索</el-button
|
||||
> -->
|
||||
<el-button
|
||||
type="primary"
|
||||
:icon="Search"
|
||||
@click="searchT('name')"
|
||||
>搜索</el-button
|
||||
>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="width: 100%; position: relative">
|
||||
<div class="backgroundVirtual"></div>
|
||||
<el-table
|
||||
border
|
||||
:data="data.tableData"
|
||||
style="width: 100%; height: 810px; margin-bottom: 20px"
|
||||
max-height="850px"
|
||||
class="table_border"
|
||||
:row-style="rowState"
|
||||
:header-cell-style="tableHeaderColor"
|
||||
@row-click="handleRowClick"
|
||||
>
|
||||
<template v-for="item in data.columns">
|
||||
<el-table-column
|
||||
v-if="item.type == 'slot'"
|
||||
:label="item.label"
|
||||
:prop="item.property"
|
||||
:show-overflow-tooltip="item.tooltip"
|
||||
:width="item.width || ''"
|
||||
:align="item.align || 'left'"
|
||||
>
|
||||
<template #default="scope">
|
||||
<!-- 补助类型 -->
|
||||
<div v-if="item.property == 'bzlx'">
|
||||
<div v-if="scope.row.bzlx == '1'">高龄津贴</div>
|
||||
<div v-else>老年人综合能力评估</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-else
|
||||
:label="item.label"
|
||||
:width="item.width || ''"
|
||||
:prop="item.property"
|
||||
:align="item.align || 'left'"
|
||||
:show-overflow-tooltip="item.tooltip"
|
||||
/>
|
||||
</template>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
background
|
||||
layout="prev, pager, next, total"
|
||||
:page-size="pagination.pageSize"
|
||||
:total="pagination.total"
|
||||
prev-text="上一页"
|
||||
next-text="下一页"
|
||||
v-model:current-page="pagination.currentPage"
|
||||
@current-change="handlePagination"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, computed } from "vue";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import http from "@/utils/request.js";
|
||||
import { Search } from "@element-plus/icons-vue";
|
||||
|
||||
const router = useRouter();
|
||||
const routers = useRoute();
|
||||
|
||||
const data = reactive({
|
||||
url: `/api/ggfwyth/pg/fwjgqdxq`,
|
||||
name: "",
|
||||
data: [],
|
||||
columns: [
|
||||
{
|
||||
label: "序号",
|
||||
property: "xh",
|
||||
width: "150",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
label: "服务",
|
||||
property: "fw",
|
||||
align: "center",
|
||||
},
|
||||
|
||||
{
|
||||
label: "时间",
|
||||
property: "sj",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
label: "地点",
|
||||
property: "dd",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
label: "主题",
|
||||
property: "zt",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
label: "人数",
|
||||
property: "rs",
|
||||
align: "center",
|
||||
},
|
||||
],
|
||||
tableData: [],
|
||||
});
|
||||
|
||||
// 表格分页
|
||||
const pagination = reactive({
|
||||
id: "1",
|
||||
total: 0,
|
||||
pageSize: 20,
|
||||
currentPage: 1,
|
||||
});
|
||||
//表格分页切换
|
||||
const handlePagination = (current) => {
|
||||
pagination.currentPage = current;
|
||||
getData();
|
||||
};
|
||||
//表格样式
|
||||
const tableHeaderColor = (arg) => {
|
||||
return {
|
||||
// paddingLeft: "10px",
|
||||
letterSpacing: "1px",
|
||||
fontSize: "20px",
|
||||
height: "79px",
|
||||
backgroundColor: "rgba(23, 62, 115)",
|
||||
color: "#fff",
|
||||
border: "none",
|
||||
textAlign: "center",
|
||||
fontFamily: "PingFangSC, PingFang SC",
|
||||
// boxShadow: " inset 0px 0px 56px 0px rgba(173,221,255,0.5)",
|
||||
};
|
||||
};
|
||||
const rowState = (row) => {
|
||||
if (row.rowIndex % 2 == 0) {
|
||||
return {
|
||||
letterSpacing: "1px",
|
||||
fontSize: "19px",
|
||||
height: "36px",
|
||||
backgroundColor: "rgba(31, 63, 113, 1)",
|
||||
color: "#fff",
|
||||
};
|
||||
} else if (row.rowIndex % 2 !== 0) {
|
||||
return {
|
||||
letterSpacing: "1px",
|
||||
fontSize: "19px",
|
||||
height: "36px",
|
||||
backgroundColor: "rgba(43, 74, 121, 1)",
|
||||
color: "#fff",
|
||||
};
|
||||
}
|
||||
};
|
||||
// 查询
|
||||
const search1 = reactive({
|
||||
timeDate: "",
|
||||
startTime: "",
|
||||
endTime: "",
|
||||
keyword: "",
|
||||
});
|
||||
const searchT = (val) => {
|
||||
if (val == "name") {
|
||||
getData();
|
||||
} else {
|
||||
[search1.startTime = "", search1.endTime = ""] = search1.timeDate || [];
|
||||
throttle(getData, 50);
|
||||
}
|
||||
};
|
||||
//节流
|
||||
var timer;
|
||||
const throttle = (func, limit) => {
|
||||
if (!timer) {
|
||||
timer = setTimeout(() => {
|
||||
func();
|
||||
timer = null;
|
||||
}, limit);
|
||||
}
|
||||
};
|
||||
|
||||
//获取数据
|
||||
const getData = () => {
|
||||
http
|
||||
.get(
|
||||
`/api/ggfwyth/pg/getXwhdfw?keyword=${search1.keyword}&startTime=${search1.startTime}&endTime=${search1.endTime}&page=${pagination.currentPage}&size=${pagination.pageSize}`
|
||||
)
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
data.tableData = res.data;
|
||||
pagination.total = res.count;
|
||||
} else {
|
||||
ElMessage.warning({ message: res.message });
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("请求失败", error);
|
||||
});
|
||||
};
|
||||
onMounted(() => {
|
||||
getData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.module {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
margin-top: 126px;
|
||||
.select {
|
||||
// margin-top: 16px;
|
||||
// margin-bottom: 20px;
|
||||
width: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
.select_item {
|
||||
width: 41%;
|
||||
}
|
||||
}
|
||||
.displayFlex {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 6px 40px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
.bt_title {
|
||||
// width: 585px;
|
||||
width: 100%;
|
||||
font-size: 24px;
|
||||
color: #ffffff;
|
||||
letter-spacing: 2px;
|
||||
text-shadow: inset 0px -2px 2px rgba(255, 255, 255, 0.65);
|
||||
text-align: left;
|
||||
font-style: normal;
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.title {
|
||||
font-size: 28px;
|
||||
color: #ffffff;
|
||||
text-align: left;
|
||||
font-style: normal;
|
||||
font-family: YouSheBiaoTiHei;
|
||||
text-shadow: 0px 2px 4px rgba(56, 50, 50, 0.5);
|
||||
}
|
||||
.lineEnd {
|
||||
height: 3px;
|
||||
border-top: 1px solid #fff;
|
||||
border-bottom: 1px dashed #fff;
|
||||
margin: 17px 0;
|
||||
}
|
||||
.tabPosition {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: #ffffff;
|
||||
font-size: 22px;
|
||||
font-weight: 500;
|
||||
letter-spacing: 1px;
|
||||
|
||||
img {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-right: 10px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.tabPositionBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 12px 0 12px 19px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.tabPositionminBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
// opacity: 0.45;
|
||||
}
|
||||
.tabPositionminBoxBgc {
|
||||
background: #92bdff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.backgroundVirtual {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 79px;
|
||||
font-size: 20px;
|
||||
box-shadow: inset 0px 0px 55px 0px rgba(173, 221, 255, 1);
|
||||
z-index: 99;
|
||||
// background: linear-gradient(
|
||||
// 270deg,
|
||||
// rgba(0, 52, 131, 0.20) 0%,
|
||||
// rgba(0, 32, 83, 0.30) 50%,
|
||||
// rgba(0, 60, 131, 0.40) 100%
|
||||
// );
|
||||
// backdrop-filter: blur(0px);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.yd_title {
|
||||
box-sizing: border-box;
|
||||
width: 585px;
|
||||
height: 31px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
span {
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
font-family: titleNore;
|
||||
margin-left: 20px;
|
||||
color: #fff;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
width: 500px;
|
||||
overflow: hidden; /* 超出一行文字自动隐藏 */
|
||||
text-overflow: ellipsis; /*文字隐藏后添加省略号*/
|
||||
white-space: nowrap;
|
||||
}
|
||||
/* 利用伪元素和两个i元素产生4条线 */
|
||||
.animate-border {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
&::before,
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
}
|
||||
i {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
width: 2px;
|
||||
}
|
||||
&::before {
|
||||
top: 0;
|
||||
left: -100%;
|
||||
background-image: linear-gradient(
|
||||
90deg,
|
||||
transparent,
|
||||
#03e9f4,
|
||||
transparent
|
||||
);
|
||||
|
||||
animation: one 4s linear infinite;
|
||||
}
|
||||
i:nth-child(1) {
|
||||
top: -100%;
|
||||
right: 0;
|
||||
background-image: linear-gradient(
|
||||
180deg,
|
||||
transparent,
|
||||
#03e9f4,
|
||||
transparent
|
||||
);
|
||||
/* 动画名称 动画持续时间 动画渲染函数 动画延迟时间 动画执行次数 */
|
||||
animation: two 4s linear 1s infinite;
|
||||
}
|
||||
&::after {
|
||||
bottom: 0;
|
||||
right: -100%;
|
||||
background-image: linear-gradient(
|
||||
-90deg,
|
||||
transparent,
|
||||
#03e9f4,
|
||||
transparent
|
||||
);
|
||||
animation: three 4s linear 2s infinite;
|
||||
}
|
||||
i:nth-child(2) {
|
||||
bottom: -100%;
|
||||
left: 0;
|
||||
background-image: linear-gradient(
|
||||
360deg,
|
||||
transparent,
|
||||
#03e9f4,
|
||||
transparent
|
||||
);
|
||||
animation: four 4s linear 3s infinite;
|
||||
}
|
||||
}
|
||||
.mxbRecord {
|
||||
display: flex;
|
||||
.text_0 {
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
font-family: titleNore;
|
||||
// margin-right: 20px;
|
||||
padding: 0 10px;
|
||||
width: 90px;
|
||||
z-index: 2;
|
||||
cursor: pointer;
|
||||
background: radial-gradient(
|
||||
circle,
|
||||
rgba(37, 127, 173, 1) 0%,
|
||||
rgba(37, 127, 173, 0) 100%
|
||||
);
|
||||
}
|
||||
.text_2 {
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: #4787a8;
|
||||
font-family: titleNore;
|
||||
// margin-right: 20px;
|
||||
padding: 0 10px;
|
||||
width: 90px;
|
||||
z-index: 2;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
font-size: 16px;
|
||||
font-family: SourceHanSansCN;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 1px;
|
||||
align-items: center;
|
||||
}
|
||||
.text_1 {
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: #4787a8;
|
||||
font-family: titleNore;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.gTitle {
|
||||
position: absolute;
|
||||
color: #acd1f1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
left: 156px;
|
||||
}
|
||||
|
||||
.c {
|
||||
width: 130px;
|
||||
height: 33px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.lampState {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 0;
|
||||
z-index: 6;
|
||||
img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
|
||||
// &:nth-child(3n) {
|
||||
// margin-right: 20px;
|
||||
// }
|
||||
}
|
||||
// .selected {
|
||||
// border-radius: 50%;
|
||||
// background-color: rgba(255, 255, 255, 0.3);
|
||||
// box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
|
||||
// }
|
||||
}
|
||||
.yd_title::before {
|
||||
content: "";
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
background-color: rgba(0, 229, 255, 1);
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
margin-left: 3px;
|
||||
z-index: 2;
|
||||
}
|
||||
.yd_title::after {
|
||||
content: "";
|
||||
width: 90%;
|
||||
height: 1px;
|
||||
background: linear-gradient(to right, #257fad, rgba(37, 127, 173, 0));
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 0;
|
||||
}
|
||||
.semi-circle-shadow {
|
||||
position: absolute;
|
||||
bottom: -5px;
|
||||
left: -24px;
|
||||
width: 30%;
|
||||
height: 20px;
|
||||
background: radial-gradient(
|
||||
circle,
|
||||
rgba(37, 127, 173, 1) 0%,
|
||||
rgba(37, 127, 173, 0) 70%
|
||||
);
|
||||
border-radius: 50%;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
@keyframes one {
|
||||
0% {
|
||||
left: -100%;
|
||||
}
|
||||
50%,
|
||||
100% {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes two {
|
||||
0% {
|
||||
top: -100%;
|
||||
}
|
||||
50%,
|
||||
100% {
|
||||
top: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes three {
|
||||
0% {
|
||||
right: -100%;
|
||||
}
|
||||
50%,
|
||||
100% {
|
||||
right: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes four {
|
||||
0% {
|
||||
bottom: -100%;
|
||||
}
|
||||
50%,
|
||||
100% {
|
||||
bottom: 100%;
|
||||
}
|
||||
}
|
||||
// 表格
|
||||
:deep(.el-table) {
|
||||
background: rgba(32, 64, 115, 1);
|
||||
|
||||
--el-table-border-color: none;
|
||||
border: 1px solid #7aceff;
|
||||
}
|
||||
|
||||
:deep(.el-table--enable-row-hover .el-table__body tr:hover > td) {
|
||||
background-color: #2f4b74;
|
||||
}
|
||||
|
||||
:deep(.el-table__empty-block) {
|
||||
background-color: #122560;
|
||||
}
|
||||
|
||||
:deep(.el-table .el-table__row) {
|
||||
border-bottom: none;
|
||||
}
|
||||
// 分页
|
||||
:deep(.el-pagination > .is-last) {
|
||||
color: #fff !important ;
|
||||
}
|
||||
:deep(.el-pagination.is-background .el-pager li) {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
margin: 0;
|
||||
}
|
||||
:deep(.el-pagination.is-background .el-pager li.is-active) {
|
||||
background: rgba(0, 144, 255, 0.49);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-prev:disabled) {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-next:disabled) {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-prev) {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-next) {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
// 分页
|
||||
.pagePart {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
:deep(.el-pagination) {
|
||||
--el-pagination-button-disabled-bg-color: none;
|
||||
--el-pagination-bg-color: none;
|
||||
--el-pagination-button-bg-color: none;
|
||||
--el-pagination-button-color: #fff;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-prev) {
|
||||
margin: 0;
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-next) {
|
||||
margin: 0;
|
||||
}
|
||||
:deep(.el-pagination) {
|
||||
justify-content: center;
|
||||
}
|
||||
// 日期选择
|
||||
:deep(.el-range-editor.el-input__wrapper) {
|
||||
background: rgba(150, 194, 255, 0.14);
|
||||
}
|
||||
:deep(.el-date-editor .el-range-separator) {
|
||||
color: rgba(255, 255, 255, 0.555);
|
||||
}
|
||||
|
||||
:deep(.el-input-group--append > .el-input__wrapper) {
|
||||
background: rgba(150, 194, 255, 0.14);
|
||||
}
|
||||
:deep(.el-input__inner) {
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
:deep(.el-input-group__append) {
|
||||
background: rgba(28, 171, 193, 1);
|
||||
color: #ffffff;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,719 @@
|
|||
<template>
|
||||
<div class="module">
|
||||
<div class="displayFlex">
|
||||
<div class="bt_title">
|
||||
<div class="yd_title">
|
||||
<span>场馆预约记录</span>
|
||||
<div class="semi-circle-shadow"></div>
|
||||
<div class="animate-border">
|
||||
<i></i>
|
||||
<i></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="select">
|
||||
<div class="select_item">
|
||||
<el-date-picker
|
||||
v-model="search1.timeDate"
|
||||
type="daterange"
|
||||
start-placeholder="预约开始时间"
|
||||
end-placeholder="预约结束时间"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
@change="searchT('date')"
|
||||
/>
|
||||
<!-- <el-date-picker
|
||||
style="width: 45%"
|
||||
v-model="search1.startTime"
|
||||
type="date"
|
||||
placeholder="预约开始时间"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
@change="searchT('date')"
|
||||
/>
|
||||
<span class="demonstration"> - </span>
|
||||
<el-date-picker
|
||||
style="width: 45%"
|
||||
v-model="search1.endTime"
|
||||
type="date"
|
||||
placeholder="预约结束时间"
|
||||
format="YYYY-MM-DD"
|
||||
value-format="YYYY-MM-DD"
|
||||
@change="searchT('date')"
|
||||
/> -->
|
||||
</div>
|
||||
<div class="select_item">
|
||||
<el-input
|
||||
v-model="search1.keyword"
|
||||
style="width: 100%"
|
||||
placeholder="预约学校查询"
|
||||
clearable
|
||||
class="input-with-select"
|
||||
>
|
||||
<template #append>
|
||||
<!-- <el-button style="" :icon="Search" @click="searchT('name')"
|
||||
>搜索</el-button
|
||||
> -->
|
||||
<el-button type="primary" :icon="Search" @click="searchT('name')">搜索</el-button>
|
||||
</template>
|
||||
</el-input>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="width: 100%; position: relative">
|
||||
<div class="backgroundVirtual"></div>
|
||||
<el-table
|
||||
border
|
||||
:data="data.tableData"
|
||||
style="width: 100%; height: 810px; margin-bottom: 20px"
|
||||
max-height="850px"
|
||||
class="table_border"
|
||||
:row-style="rowState"
|
||||
:header-cell-style="tableHeaderColor"
|
||||
@row-click="handleRowClick"
|
||||
>
|
||||
<template v-for="item in data.columns">
|
||||
<el-table-column
|
||||
v-if="item.type == 'slot'"
|
||||
:label="item.label"
|
||||
:prop="item.property"
|
||||
:show-overflow-tooltip="item.tooltip"
|
||||
:width="item.width || ''"
|
||||
:align="item.align || 'left'"
|
||||
>
|
||||
<template #default="scope">
|
||||
<!-- 补助类型 -->
|
||||
<div v-if="item.property == 'bzlx'">
|
||||
<div v-if="scope.row.bzlx == '1'">高龄津贴</div>
|
||||
<div v-else>老年人综合能力评估</div>
|
||||
</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column
|
||||
v-else
|
||||
:label="item.label"
|
||||
:width="item.width || ''"
|
||||
:prop="item.property"
|
||||
:align="item.align || 'left'"
|
||||
:show-overflow-tooltip="item.tooltip"
|
||||
/>
|
||||
</template>
|
||||
</el-table>
|
||||
<el-pagination
|
||||
background
|
||||
layout="prev, pager, next, total"
|
||||
:page-size="pagination.pageSize"
|
||||
:total="pagination.total"
|
||||
prev-text="上一页"
|
||||
next-text="下一页"
|
||||
v-model:current-page="pagination.currentPage"
|
||||
@current-change="handlePagination"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, onMounted, computed } from "vue";
|
||||
import { ElMessage } from "element-plus";
|
||||
import { useRouter, useRoute } from "vue-router";
|
||||
import http from "@/utils/request.js";
|
||||
import { Search } from "@element-plus/icons-vue";
|
||||
|
||||
const router = useRouter();
|
||||
const routers = useRoute();
|
||||
|
||||
const data = reactive({
|
||||
url: `/api/ggfwyth/pg/fwjgqdxq`,
|
||||
name: "",
|
||||
data: [],
|
||||
columns: [
|
||||
{
|
||||
label: "序号",
|
||||
property: "xh",
|
||||
width: "150",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
label: "姓名",
|
||||
property: "xm",
|
||||
align: "center",
|
||||
},
|
||||
|
||||
{
|
||||
label: "预约学校",
|
||||
property: "yyxx",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
label: "预约校区",
|
||||
property: "yyxq",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
label: "预约场馆",
|
||||
property: "yycg",
|
||||
align: "center",
|
||||
},
|
||||
{
|
||||
label: "预约日期",
|
||||
property: "yyrq",
|
||||
align: "center",
|
||||
},
|
||||
|
||||
{
|
||||
label: "预约时段",
|
||||
property: "yysd",
|
||||
align: "center",
|
||||
},
|
||||
],
|
||||
tableData: [],
|
||||
});
|
||||
|
||||
// 表格分页
|
||||
const pagination = reactive({
|
||||
id: "1",
|
||||
total: 0,
|
||||
pageSize: 20,
|
||||
currentPage: 1,
|
||||
});
|
||||
//表格分页切换
|
||||
const handlePagination = (current) => {
|
||||
pagination.currentPage = current;
|
||||
getData();
|
||||
};
|
||||
//表格样式
|
||||
const tableHeaderColor = (arg) => {
|
||||
return {
|
||||
// paddingLeft: "10px",
|
||||
letterSpacing: "1px",
|
||||
fontSize: "20px",
|
||||
height: "79px",
|
||||
backgroundColor: "rgba(23, 62, 115)",
|
||||
color: "#fff",
|
||||
border: "none",
|
||||
textAlign: "center",
|
||||
fontFamily: "PingFangSC, PingFang SC",
|
||||
// boxShadow: " inset 0px 0px 56px 0px rgba(173,221,255,0.5)",
|
||||
};
|
||||
};
|
||||
const rowState = (row) => {
|
||||
if (row.rowIndex % 2 == 0) {
|
||||
return {
|
||||
letterSpacing: "1px",
|
||||
fontSize: "19px",
|
||||
height: "36px",
|
||||
backgroundColor: "rgba(31, 63, 113, 1)",
|
||||
color: "#fff",
|
||||
};
|
||||
} else if (row.rowIndex % 2 !== 0) {
|
||||
return {
|
||||
letterSpacing: "1px",
|
||||
fontSize: "19px",
|
||||
height: "36px",
|
||||
backgroundColor: "rgba(43, 74, 121, 1)",
|
||||
color: "#fff",
|
||||
};
|
||||
}
|
||||
};
|
||||
// 查询
|
||||
const search1 = reactive({
|
||||
timeDate: "",
|
||||
startTime: "",
|
||||
endTime: "",
|
||||
keyword: "",
|
||||
});
|
||||
const searchT = (val) => {
|
||||
if (val == "name") {
|
||||
getData();
|
||||
} else {
|
||||
[search1.startTime = "", search1.endTime = ""] = search1.timeDate || [];
|
||||
throttle(getData, 50);
|
||||
}
|
||||
};
|
||||
//节流
|
||||
var timer;
|
||||
const throttle = (func, limit) => {
|
||||
if (!timer) {
|
||||
timer = setTimeout(() => {
|
||||
func();
|
||||
timer = null;
|
||||
}, limit);
|
||||
}
|
||||
};
|
||||
|
||||
//获取数据
|
||||
const getData = () => {
|
||||
http
|
||||
.get(
|
||||
`/api/ggfwyth/pg/getQmjsfw?keyword=${search1.keyword}&startTime=${search1.startTime}&endTime=${search1.endTime}&page=${pagination.currentPage}&size=${pagination.pageSize}`
|
||||
)
|
||||
.then((res) => {
|
||||
if (res.code == 200) {
|
||||
data.tableData = res.data;
|
||||
pagination.total = res.count;
|
||||
} else {
|
||||
ElMessage.warning({ message: res.message });
|
||||
}
|
||||
})
|
||||
.catch((error) => {
|
||||
console.error("请求失败", error);
|
||||
});
|
||||
};
|
||||
onMounted(() => {
|
||||
getData();
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.module {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
margin-top: 126px;
|
||||
.select {
|
||||
// margin-top: 16px;
|
||||
// margin-bottom: 20px;
|
||||
width: 50%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
.select_item {
|
||||
width: 41%;
|
||||
}
|
||||
}
|
||||
.displayFlex {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 6px 40px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
box-sizing: border-box;
|
||||
.bt_title {
|
||||
// width: 585px;
|
||||
width: 100%;
|
||||
font-size: 24px;
|
||||
color: #ffffff;
|
||||
letter-spacing: 2px;
|
||||
text-shadow: inset 0px -2px 2px rgba(255, 255, 255, 0.65);
|
||||
text-align: left;
|
||||
font-style: normal;
|
||||
margin-bottom: 20px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.title {
|
||||
font-size: 28px;
|
||||
color: #ffffff;
|
||||
text-align: left;
|
||||
font-style: normal;
|
||||
font-family: YouSheBiaoTiHei;
|
||||
text-shadow: 0px 2px 4px rgba(56, 50, 50, 0.5);
|
||||
}
|
||||
.lineEnd {
|
||||
height: 3px;
|
||||
border-top: 1px solid #fff;
|
||||
border-bottom: 1px dashed #fff;
|
||||
margin: 17px 0;
|
||||
}
|
||||
.tabPosition {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
color: #ffffff;
|
||||
font-size: 22px;
|
||||
font-weight: 500;
|
||||
letter-spacing: 1px;
|
||||
|
||||
img {
|
||||
width: 18px;
|
||||
height: 18px;
|
||||
margin-right: 10px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.tabPositionBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin: 12px 0 12px 19px;
|
||||
cursor: pointer;
|
||||
}
|
||||
.tabPositionminBox {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 200px;
|
||||
height: 50px;
|
||||
|
||||
border-radius: 4px;
|
||||
cursor: pointer;
|
||||
// opacity: 0.45;
|
||||
}
|
||||
.tabPositionminBoxBgc {
|
||||
background: #92bdff;
|
||||
}
|
||||
}
|
||||
}
|
||||
.backgroundVirtual {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 79px;
|
||||
font-size: 20px;
|
||||
box-shadow: inset 0px 0px 55px 0px rgba(173, 221, 255, 1);
|
||||
z-index: 99;
|
||||
// background: linear-gradient(
|
||||
// 270deg,
|
||||
// rgba(0, 52, 131, 0.20) 0%,
|
||||
// rgba(0, 32, 83, 0.30) 50%,
|
||||
// rgba(0, 60, 131, 0.40) 100%
|
||||
// );
|
||||
// backdrop-filter: blur(0px);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.yd_title {
|
||||
box-sizing: border-box;
|
||||
width: 585px;
|
||||
height: 31px;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
span {
|
||||
font-size: 28px;
|
||||
font-weight: 500;
|
||||
font-family: titleNore;
|
||||
margin-left: 20px;
|
||||
color: #fff;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
width: 500px;
|
||||
overflow: hidden; /* 超出一行文字自动隐藏 */
|
||||
text-overflow: ellipsis; /*文字隐藏后添加省略号*/
|
||||
white-space: nowrap;
|
||||
}
|
||||
/* 利用伪元素和两个i元素产生4条线 */
|
||||
.animate-border {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
&::before,
|
||||
&::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
}
|
||||
i {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
height: 100%;
|
||||
width: 2px;
|
||||
}
|
||||
&::before {
|
||||
top: 0;
|
||||
left: -100%;
|
||||
background-image: linear-gradient(
|
||||
90deg,
|
||||
transparent,
|
||||
#03e9f4,
|
||||
transparent
|
||||
);
|
||||
|
||||
animation: one 4s linear infinite;
|
||||
}
|
||||
i:nth-child(1) {
|
||||
top: -100%;
|
||||
right: 0;
|
||||
background-image: linear-gradient(
|
||||
180deg,
|
||||
transparent,
|
||||
#03e9f4,
|
||||
transparent
|
||||
);
|
||||
/* 动画名称 动画持续时间 动画渲染函数 动画延迟时间 动画执行次数 */
|
||||
animation: two 4s linear 1s infinite;
|
||||
}
|
||||
&::after {
|
||||
bottom: 0;
|
||||
right: -100%;
|
||||
background-image: linear-gradient(
|
||||
-90deg,
|
||||
transparent,
|
||||
#03e9f4,
|
||||
transparent
|
||||
);
|
||||
animation: three 4s linear 2s infinite;
|
||||
}
|
||||
i:nth-child(2) {
|
||||
bottom: -100%;
|
||||
left: 0;
|
||||
background-image: linear-gradient(
|
||||
360deg,
|
||||
transparent,
|
||||
#03e9f4,
|
||||
transparent
|
||||
);
|
||||
animation: four 4s linear 3s infinite;
|
||||
}
|
||||
}
|
||||
.mxbRecord {
|
||||
display: flex;
|
||||
.text_0 {
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: #ffffff;
|
||||
font-family: titleNore;
|
||||
// margin-right: 20px;
|
||||
padding: 0 10px;
|
||||
width: 90px;
|
||||
z-index: 2;
|
||||
cursor: pointer;
|
||||
background: radial-gradient(
|
||||
circle,
|
||||
rgba(37, 127, 173, 1) 0%,
|
||||
rgba(37, 127, 173, 0) 100%
|
||||
);
|
||||
}
|
||||
.text_2 {
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: #4787a8;
|
||||
font-family: titleNore;
|
||||
// margin-right: 20px;
|
||||
padding: 0 10px;
|
||||
width: 90px;
|
||||
z-index: 2;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.text {
|
||||
display: flex;
|
||||
position: absolute;
|
||||
font-size: 16px;
|
||||
font-family: SourceHanSansCN;
|
||||
font-weight: bold;
|
||||
color: #ffffff;
|
||||
position: absolute;
|
||||
right: 5px;
|
||||
top: 1px;
|
||||
align-items: center;
|
||||
}
|
||||
.text_1 {
|
||||
font-size: 20px;
|
||||
font-weight: 500;
|
||||
color: #4787a8;
|
||||
font-family: titleNore;
|
||||
margin-right: 20px;
|
||||
}
|
||||
.gTitle {
|
||||
position: absolute;
|
||||
color: #acd1f1;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
left: 156px;
|
||||
}
|
||||
|
||||
.c {
|
||||
width: 130px;
|
||||
height: 33px;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
.lampState {
|
||||
position: absolute;
|
||||
top: 0px;
|
||||
right: 0;
|
||||
z-index: 6;
|
||||
img {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-left: 10px;
|
||||
cursor: pointer;
|
||||
|
||||
// &:nth-child(3n) {
|
||||
// margin-right: 20px;
|
||||
// }
|
||||
}
|
||||
// .selected {
|
||||
// border-radius: 50%;
|
||||
// background-color: rgba(255, 255, 255, 0.3);
|
||||
// box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);
|
||||
// }
|
||||
}
|
||||
.yd_title::before {
|
||||
content: "";
|
||||
width: 4px;
|
||||
height: 4px;
|
||||
background-color: rgba(0, 229, 255, 1);
|
||||
border-radius: 50%;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
margin-left: 3px;
|
||||
z-index: 2;
|
||||
}
|
||||
.yd_title::after {
|
||||
content: "";
|
||||
width: 90%;
|
||||
height: 1px;
|
||||
background: linear-gradient(to right, #257fad, rgba(37, 127, 173, 0));
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 0;
|
||||
}
|
||||
.semi-circle-shadow {
|
||||
position: absolute;
|
||||
bottom: -5px;
|
||||
left: -24px;
|
||||
width: 30%;
|
||||
height: 20px;
|
||||
background: radial-gradient(
|
||||
circle,
|
||||
rgba(37, 127, 173, 1) 0%,
|
||||
rgba(37, 127, 173, 0) 70%
|
||||
);
|
||||
border-radius: 50%;
|
||||
z-index: 0;
|
||||
}
|
||||
|
||||
@keyframes one {
|
||||
0% {
|
||||
left: -100%;
|
||||
}
|
||||
50%,
|
||||
100% {
|
||||
left: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes two {
|
||||
0% {
|
||||
top: -100%;
|
||||
}
|
||||
50%,
|
||||
100% {
|
||||
top: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes three {
|
||||
0% {
|
||||
right: -100%;
|
||||
}
|
||||
50%,
|
||||
100% {
|
||||
right: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes four {
|
||||
0% {
|
||||
bottom: -100%;
|
||||
}
|
||||
50%,
|
||||
100% {
|
||||
bottom: 100%;
|
||||
}
|
||||
}
|
||||
// 表格
|
||||
:deep(.el-table) {
|
||||
background: rgba(32, 64, 115, 1);
|
||||
|
||||
--el-table-border-color: none;
|
||||
border: 1px solid #7aceff;
|
||||
}
|
||||
|
||||
:deep(.el-table--enable-row-hover .el-table__body tr:hover > td) {
|
||||
background-color: #2f4b74;
|
||||
}
|
||||
|
||||
:deep(.el-table__empty-block) {
|
||||
background-color: #122560;
|
||||
}
|
||||
|
||||
:deep(.el-table .el-table__row) {
|
||||
border-bottom: none;
|
||||
}
|
||||
// 分页
|
||||
:deep(.el-pagination > .is-last) {
|
||||
color: #fff !important ;
|
||||
}
|
||||
:deep(.el-pagination.is-background .el-pager li) {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
margin: 0;
|
||||
}
|
||||
:deep(.el-pagination.is-background .el-pager li.is-active) {
|
||||
background: rgba(0, 144, 255, 0.49);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-prev:disabled) {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-next:disabled) {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-prev) {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-next) {
|
||||
color: #fff;
|
||||
background: rgba(255, 255, 255, 0.14);
|
||||
border: 1px solid #6bade1;
|
||||
}
|
||||
// 分页
|
||||
.pagePart {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
:deep(.el-pagination) {
|
||||
--el-pagination-button-disabled-bg-color: none;
|
||||
--el-pagination-bg-color: none;
|
||||
--el-pagination-button-bg-color: none;
|
||||
--el-pagination-button-color: #fff;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-prev) {
|
||||
margin: 0;
|
||||
}
|
||||
:deep(.el-pagination.is-background .btn-next) {
|
||||
margin: 0;
|
||||
}
|
||||
:deep(.el-pagination) {
|
||||
justify-content: center;
|
||||
}
|
||||
// 日期选择
|
||||
:deep(.el-range-editor.el-input__wrapper) {
|
||||
background: rgba(150, 194, 255, 0.14);
|
||||
}
|
||||
:deep(.el-date-editor .el-range-separator) {
|
||||
color: rgba(255, 255, 255, 0.555);
|
||||
}
|
||||
|
||||
:deep(.el-input-group--append > .el-input__wrapper) {
|
||||
background: rgba(150, 194, 255, 0.14);
|
||||
}
|
||||
:deep(.el-input__inner) {
|
||||
color: #ffffff;
|
||||
}
|
||||
:deep(.el-input-group__append) {
|
||||
background: rgba(28, 171, 193, 1);
|
||||
color: #ffffff;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -214,21 +214,30 @@ const goto = (val) => {
|
|||
// } else {
|
||||
if (val.name == "公共交通") {
|
||||
router.push({
|
||||
path: "/home/index/table/jtDetails",
|
||||
query: { name: val.name},
|
||||
});
|
||||
}else{
|
||||
path: "/home/index/table/jtDetails",
|
||||
query: { name: val.name },
|
||||
});
|
||||
} else if (val.name == "全民健身服务") {
|
||||
router.push({
|
||||
path: "/home/index/table/details",
|
||||
query: { name: val.name, id: val.id, xh: val.xh },
|
||||
});
|
||||
path: "/home/index/table/fitnessServices",
|
||||
query: { name: val.name },
|
||||
});
|
||||
} else if (val.name == "校外活动服务") {
|
||||
router.push({
|
||||
path: "/home/index/table/afterschoolActivities",
|
||||
query: { name: val.name },
|
||||
});
|
||||
} else {
|
||||
router.push({
|
||||
path: "/home/index/table/details",
|
||||
query: { name: val.name, id: val.id, xh: val.xh },
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
// ElMessage.warning({
|
||||
// message: `${val.name}暂无数据!`,
|
||||
// offset: 100, // 距离窗口顶部的偏移量
|
||||
// });
|
||||
// ElMessage.warning({
|
||||
// message: `${val.name}暂无数据!`,
|
||||
// offset: 100, // 距离窗口顶部的偏移量
|
||||
// });
|
||||
// }
|
||||
};
|
||||
|
||||
|
|
|
|||
Loading…
Reference in New Issue