From bf58722dfd03ea1513f3acc7331d4d4403fca76e Mon Sep 17 00:00:00 2001
From: shuishen <1109946754@qq.com>
Date: Fri, 18 Mar 2022 11:48:37 +0800
Subject: [PATCH] Merge branch 'master' of http://192.168.0.105:10010/r/school-web
---
src/components/mobilePopupOurAfter/index.vue | 290 +++++++++++++++++++++++++++++++++++++++++++++++----------
1 files changed, 237 insertions(+), 53 deletions(-)
diff --git a/src/components/mobilePopupOurAfter/index.vue b/src/components/mobilePopupOurAfter/index.vue
index d5714e1..6cb7644 100644
--- a/src/components/mobilePopupOurAfter/index.vue
+++ b/src/components/mobilePopupOurAfter/index.vue
@@ -1,30 +1,67 @@
<template>
- <div id="mobilePopupOurAfter">
+ <div
+ class="mobilePopupOurAfter"
+ :class="{ ismBigPopupAfter: mBigPopupAfter }"
+ >
+ <!-- v-if="mBigPopupAfter" -->
<div class="m_p_a_heard">
<div><i class="el-icon-menu icon"></i></div>
+ 校区列表
<div @click="closeBigPopupAfter"><i class="el-icon-close icon"></i></div>
</div>
<div class="m_p_a_center">
<div class="m_p_a_center_group">
<div
- class="m_p_a_center_once"
+ :class="[
+ 'm_p_a_center_once',
+ item.name ? '' : 'm_p_a_center_once_notblue',
+ ]"
v-for="(item, index) in choiceDataUp"
- @click="openBigPopup(item)"
+ @click="item.name ? openBigPopup(item) : ''"
:key="index"
>
<div class="m_p_a_c_o_up"><i :class="[item.icon]"></i></div>
- <div class="m_p_a_c_o_down">{{ item.name }}</div>
+ <div class="m_p_a_c_o_down">{{ item.seeName || item.name }}</div>
</div>
</div>
<div class="m_p_a_center_group">
<div
- class="m_p_a_center_once"
+ :class="[
+ 'm_p_a_center_once',
+ item.name ? '' : 'm_p_a_center_once_notblue',
+ ]"
v-for="(item, index) in choiceDataDown"
- @click="openBigPopup(item)"
+ @click="item.name ? openBigPopup(item) : ''"
:key="index"
>
<div class="m_p_a_c_o_up"><i :class="[item.icon]"></i></div>
- <div class="m_p_a_c_o_down">{{ item.name }}</div>
+ <div class="m_p_a_c_o_down">{{ item.seeName || item.name }}</div>
+ </div>
+ </div>
+ <div
+ class="m_p_a_heard m_p_a_hdheard"
+ style="justify-content: center"
+ v-show="avtivityData.length > 0 && useHD"
+ >
+ 活动列表
+ </div>
+ <div
+ class="m_p_a_center_group"
+ v-for="(act, index) in avtivityData"
+ :key="index"
+ v-show="avtivityData.length > 0 && useHD"
+ >
+ <div
+ :class="[
+ 'm_p_a_center_once',
+ item.name ? '' : 'm_p_a_center_once_notblue',
+ ]"
+ v-for="(item, index) in act"
+ @click="item.name ? openHDPopup(item) : ''"
+ :key="index"
+ >
+ <div class="m_p_a_c_o_up"><i :class="[item.icon]"></i></div>
+ <div class="m_p_a_c_o_down">{{ item.seeName || item.name }}</div>
</div>
</div>
</div>
@@ -32,48 +69,53 @@
</template>
<script>
-import { getList } from "@/api/mobile/orgnav/index"; //机构单位
-import { getChildNavList } from "@/api/mobile/public/arc"; //校园建筑
+import { mapGetters } from "vuex";
+import { getList } from "@/api/mobile/orgnav/index"; // 机构单位
+import { getChildNavList } from "@/api/mobile/public/arc"; // 校区建筑
import {
- getListlivingFacilitiesr,
- getListsupermarket,
- getListmedical,
- getListmail,
- getListbathroom,
- getListduplicate,
- getListnetwork,
- getListaed,
- getListsignal,
-} from "@/api/mobile/livingFacilities/index"; //生活设施
-import { getListparking } from "@/api/mobile/stop/index"; //停车场
+ // getListlivingFacilitiesr,
+ // getListsupermarket,
+ // getListmedical,
+ // getListmail,
+ // getListbathroom,
+ // getListduplicate,
+ // getListnetwork,
+ // getListaed,
+ // getListsignal,
+ // getListtransference,
+ getListLifeOnce, // 所有的
+} from "@/api/mobile/livingFacilities/index"; // 生活设施
+// import { getListdoor } from "@/api/mobile/outIn/index"; //出入口
+// import { getListparking } from "@/api/mobile/stop/index"; //停车场
+import { getActivity } from "@/api/mobile/hd/hd"; //活动
export default {
name: "mobilePopupOurAfter",
+ computed: {
+ ...mapGetters(["mBigPopupAfter"]),
+ },
data() {
return {
choiceValue: "",
choiceDataUp: [
{
+ // seeName: "校区内机构导览",
name: "机构单位",
icon: "el-icon-s-cooperation",
opendata: "openData1",
},
{
- name: "校园建筑",
+ name: "校区建筑",
opendata: "openData2",
icon: "el-icon-s-management",
},
{
+ // seeName: "生活服务设施",
name: "生活设施",
opendata: "openData3",
icon: "el-icon-s-flag",
},
],
choiceDataDown: [
- {
- name: "文化风景",
- opendata: "openData4",
- icon: "el-icon-s-opportunity",
- },
{
name: "出入口",
opendata: "openData5",
@@ -84,6 +126,23 @@
opendata: "openData6",
icon: "el-icon-s-flag",
},
+ {
+ // name: "文化风景",
+ name: "活动",
+ opendata: "openData4",
+ icon: "el-icon-s-opportunity",
+ },
+ ],
+ avtivityData: [
+ // [
+ // {
+ // name: "活动",
+ // opendata: "openData4",
+ // icon: "el-icon-s-opportunity",
+ // },
+ // {},
+ // {},
+ // ],
],
openData1: [
{ name: "党群机构", type: 1, method: getList },
@@ -95,37 +154,118 @@
openData2: [
{ name: "行政办公", type: 1, method: getChildNavList },
{ name: "教学科研", type: 2, method: getChildNavList },
- { name: "校内场馆", type: 3, method: getChildNavList },
+ { name: "校区场馆", type: 3, method: getChildNavList },
{ name: "宿舍公寓", type: 4, method: getChildNavList },
{ name: "文化风景", type: 5, method: getChildNavList },
{ name: "家属住宅", type: 6, method: getChildNavList },
{ name: "其他楼宇", type: 7, method: getChildNavList },
],
+ // openData3: [
+ // { name: "食堂餐厅", type: 1, method: getListlivingFacilitiesr },
+ // { name: "购物超市", type: 2, method: getListsupermarket },
+ // { name: "校区内医疗", type: 3, method: getListmedical },
+ // { name: "邮寄快递", type: 4, method: getListmail },
+ // { name: "校区浴室", type: 5, method: getListbathroom },
+ // { name: "圈存机", type: 6, method: getListtransference },
+ // { name: "打字复印", type: 7, method: getListduplicate },
+ // { name: "AED", type: 8, method: getListaed },
+ // { name: "银行网点", type: 9, method: getListnetwork },
+ // { name: "通信营业厅", type: 10, method: getListsignal },
+ // ],
+ // openData6: [{ name: "停车场", type: 1, method: getListparking }],
+ // openData5: [{ name: "出入口", type: 1, method: getListdoor }],
openData3: [
- { name: "食堂餐厅", type: 1, method: getListlivingFacilitiesr },
- { name: "购物超市", type: 2, method: getListsupermarket },
- { name: "校内医疗", type: 3, method: getListmedical },
- { name: "邮寄快递", type: 4, method: getListmail },
- { name: "学生浴室", type: 5, method: getListbathroom },
- // { name: "圈存机", type: 6 ,method:getListlivingFacilitiesr},
- { name: "打字复印", type: 7, method: getListduplicate },
- { name: "AED", type: 8, method: getListaed },
- { name: "银行网点", type: 9, method: getListnetwork },
- { name: "通信营业厅", type: 10, method: getListsignal },
+ { name: "食堂餐厅", type: 1, method: getListLifeOnce },
+ { name: "购物超市", type: 2, method: getListLifeOnce },
+ { name: "校区医疗", type: 3, method: getListLifeOnce },
+ { name: "邮寄快递", type: 4, method: getListLifeOnce },
+ { name: "校区浴室", type: 5, method: getListLifeOnce },
+ // { name: "圈存机", type: 6, method: getListLifeOnce },
+ { name: "打字复印", type: 7, method: getListLifeOnce },
+ { name: "银行网点", type: 8, method: getListLifeOnce },
+ { name: "AED", type: 9, method: getListLifeOnce },
+ { name: "通信营业厅", type: 10, method: getListLifeOnce },
+ { name: "停车场", type: 11, method: getListLifeOnce },
+ { name: "出入口", type: 12, method: getListLifeOnce },
],
openData4: [
- { name: "文化风景", type: 1, method: getListlivingFacilitiesr },
+ { name: "文化风景", type: 5, method: getChildNavList },
+ { name: "活动", type: 1, method: getActivity },
],
- openData5: [
- { name: "出入口", type: 1, method: getListlivingFacilitiesr },
- ],
- openData6: [{ name: "停车场", type: 1, method: getListparking }],
+ openData6: [{ name: "停车场", type: 11, method: getListLifeOnce }],
+ openData5: [{ name: "出入口", type: 12, method: getListLifeOnce }],
+ useHD: false,
};
},
- mounted() {},
+ mounted() {
+ this.getActivitys();
+ if (this.useHD) {
+ this.choiceDataDown[3] = { name: "" };
+ }
+ },
methods: {
- openBigPopup(val) {
+ //活动点击事件
+ openHDPopup(val) {
+ console.log(val);
+ //开启底部弹窗 关闭本弹窗
let d = {
+ state: true,
+ value: val,
+ };
+ this.$store.commit("set_showActivity", d);
+ this.closeBigPopupAfter();
+ },
+ //获取活动数据
+ getActivitys() {
+ let that = this;
+ getActivity().then((res) => {
+ const data = res.data.data.records;
+ let datas = [...data];
+ let num = datas.length;
+ //划分出每组3个的二维数组
+ let many = parseInt(num / 3); //整数组
+ let over = parseInt(num % 3); //余数组
+ //赋值整数组
+ let integers = [];
+ let i = 0;
+ for (let index = 0; index < many; index++) {
+ let integersins = [];
+ for (let indexs = 0; indexs < 3; indexs++) {
+ integersins.push({
+ name: datas[i].hdname,
+ opendata: datas[i],
+ icon: "el-icon-s-opportunity",
+ });
+ i++;
+ }
+ integers.push(integersins);
+ }
+ //赋值余数组
+ let integersOvers = [];
+ for (let overI = 0; overI < over; overI++) {
+ integersOvers.push({
+ name: datas[i].hdname,
+ opendata: datas[i],
+ icon: "el-icon-s-opportunity",
+ });
+ i++;
+ }
+ let lastOver = 3 - over;
+ for (let overM = 0; overM < lastOver; overM++) {
+ integersOvers.push({ data: "not" });
+ }
+ integers.push(integersOvers);
+ that.avtivityData = integers;
+ });
+ },
+ openBigPopup(val) {
+ if (val.name == "活动" && !this.useHD) {
+ this.openHDPopup(this.avtivityData[0][0]);
+ //隐藏右侧栏
+ this.$store.commit("SET_SeeAndNotSee", false);
+ return;
+ }
+ const d = {
main: this[val.opendata],
qurey: val.name,
};
@@ -145,22 +285,46 @@
align-items: center;
justify-content: center;
}
-#mobilePopupOurAfter {
+.mobilePopupOurAfter {
+ font-size: 18px;
position: fixed;
top: 37.5%;
- left: 13.5%;
+ // left: 13.5%;
+ left: -1000px;
width: 75%;
- height: 25%;
+ height: auto;
+ min-height: 155px;
background-color: #fff;
+ box-shadow: 0px 0px 5px #29baf1;
+ transition: all 0.5s;
+ // background-image: linear-gradient(
+ // // 135deg,
+ // #28bbf06c 30px,
+ // #28bbf06c 30px,
+ // // #28bbf06c 50%,
+ // // transparent 50%
+ // #28bbf06c 100%,
+ // transparent 100%
+ // ),
+ // linear-gradient(
+ // // -45deg,
+ // transparent 30px,
+ // #28bbf06c 30px,
+ // // #28bbf06c 50.1%,
+ // // transparent 50%
+ // #28bbf06c 100%,
+ // transparent 100%
+ // );
z-index: 300;
.m_p_a_heard {
width: 100%;
height: 35px;
box-sizing: border-box;
padding: 5px 15px;
+ color: #fff;
@extend .flexCenter;
justify-content: space-between;
- background-color: #a40000;
+ background-color: #29baf1;
div {
width: 35px;
height: 35px;
@@ -171,25 +335,45 @@
color: #fff;
}
}
+ .m_p_a_hdheard {
+ margin: 5px 0;
+ }
.m_p_a_center {
width: 100%;
- height: calc(100% - 35px);
+ // height: calc(100% - 35px);
+ height: auto;
@extend .flexCenter;
flex-direction: column;
+ padding: 10px 0;
.m_p_a_center_group {
width: 100%;
- height: 40%;
+ height: auto;
@extend .flexCenter;
.m_p_a_center_once {
width: 30%;
- height: 100%;
- background-color: #a40000;
+ height: 50px;
+ // background-image: linear-gradient(#29baf1, #28bbf06c);
+ // background-color: #a40000;
+ background-color: #29baf1;
color: #fff;
+ // border: 2px solid rgba(105, 215, 255, 0.658);
border: 2px solid rgb(255, 255, 255);
@extend .flexCenter;
flex-direction: column;
+ // &:hover {
+ // background-image: linear-gradient(#09b7fc, #28bbf0a4);
+ // }
+ }
+ .m_p_a_center_once_notblue {
+ background-color: #fff !important;
}
}
}
}
-</style>
\ No newline at end of file
+.ismBigPopupAfter {
+ left: 13.5%;
+}
+.m_p_a_c_o_down {
+ font-size: 14px;
+}
+</style>
--
Gitblit v1.9.3