|
@@ -3,13 +3,15 @@
|
|
|
<div class="search">
|
|
|
<div class="search-floor" @click="showPounp">
|
|
|
<span class="title">位置:</span>
|
|
|
- <span class="title">A栋134</span>
|
|
|
+ <span class="title"
|
|
|
+ >{{ checkPositon.buildingName }}{{ checkPositon.floorName }}</span
|
|
|
+ >
|
|
|
<van-icon class="arrow-down" name="arrow-down" />
|
|
|
</div>
|
|
|
<div class="search-space">
|
|
|
<div class="com-select">
|
|
|
<div class="com-text" @click="showSpaceTypePounp">
|
|
|
- <span>ddfff</span>
|
|
|
+ <span>{{ spaceType.name }}</span>
|
|
|
<van-icon class="arrow-down" name="arrow-down" />
|
|
|
</div>
|
|
|
</div>
|
|
@@ -20,14 +22,18 @@
|
|
|
</div>
|
|
|
</div>
|
|
|
<div class="space-content">
|
|
|
- <div class="space-box" v-for="(item, index) in 10" :key="'space' + index">
|
|
|
+ <div
|
|
|
+ class="space-box"
|
|
|
+ v-for="(item, index) in spaceData"
|
|
|
+ :key="'space' + index"
|
|
|
+ >
|
|
|
<div class="space-item">
|
|
|
- <span class="item-text"
|
|
|
- >项目名称项目名称项目名称项目名称项目名称项目名称</span
|
|
|
- >
|
|
|
+ <span class="item-text">
|
|
|
+ {{ item.spaceName }}
|
|
|
+ </span>
|
|
|
<van-checkbox
|
|
|
class="item-check"
|
|
|
- v-model="checked"
|
|
|
+ v-model="item.checked"
|
|
|
shape="square"
|
|
|
></van-checkbox>
|
|
|
</div>
|
|
@@ -39,16 +45,22 @@
|
|
|
<!--弹出模块-->
|
|
|
<van-popup v-model:show="show" position="bottom">
|
|
|
<van-tree-select
|
|
|
- v-model:active-id="activeId"
|
|
|
- v-model:main-active-index="activeIndex"
|
|
|
- :items="items"
|
|
|
+ @click-nav="checkBuilding"
|
|
|
+ @click-item="checkFloor"
|
|
|
+ v-model:active-id="checkPositon.floorId"
|
|
|
+ v-model:main-active-id="checkPositon.buildingId"
|
|
|
+ :items="positionArr"
|
|
|
/>
|
|
|
</van-popup>
|
|
|
<van-popup v-model:show="showSpaceType" position="bottom">
|
|
|
<div class="space-type">
|
|
|
- <span>ddd</span>
|
|
|
- <span>ddd</span>
|
|
|
- <span>ddd</span>
|
|
|
+ <span
|
|
|
+ v-for="(item, index) in spaceTypeArr"
|
|
|
+ @click="checkSpaceType(item)"
|
|
|
+ :key="'space-type-id' + index"
|
|
|
+ >
|
|
|
+ {{ item.name }}
|
|
|
+ </span>
|
|
|
</div>
|
|
|
</van-popup>
|
|
|
</div>
|
|
@@ -61,7 +73,12 @@ import { Search, TreeSelect, Popup, Checkbox } from "vant";
|
|
|
import { parseImgUrl, setQueryConfig } from "@/utils";
|
|
|
import { store } from "@/store";
|
|
|
import { UserMutationTypes } from "@/store/modules/user/mutation-types";
|
|
|
-import { getBuildingList, getDefaultLocation } from "@/apis/envmonitor";
|
|
|
+import {
|
|
|
+ getBuildingList,
|
|
|
+ getDefaultLocation,
|
|
|
+ getFloorList,
|
|
|
+ getPadSpaceList,
|
|
|
+} from "@/apis/envmonitor";
|
|
|
|
|
|
export default defineComponent({
|
|
|
components: {
|
|
@@ -83,22 +100,45 @@ export default defineComponent({
|
|
|
{ text: "好评排ddd序", value: "b" },
|
|
|
{ text: "销量排序", value: "c" },
|
|
|
];
|
|
|
- const items: any = [
|
|
|
+ let positionArr: any = [];
|
|
|
+ let checkPositon: any = {};
|
|
|
+ const defaultSpaceData: any = {};
|
|
|
+ const buildingData: any = [];
|
|
|
+ const buildingItem: any = {};
|
|
|
+ const floorData: any = [];
|
|
|
+ const spaceTypeArr: any = [
|
|
|
+ {
|
|
|
+ type: "",
|
|
|
+ name: "全部空间",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 0,
|
|
|
+ name: "个人办公室",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 1,
|
|
|
+ name: "开放办公区",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ type: 2,
|
|
|
+ name: "会议室",
|
|
|
+ },
|
|
|
{
|
|
|
- text: "浙江",
|
|
|
- children: [
|
|
|
- { text: "杭州", id: 1 },
|
|
|
- { text: "温州", id: 2 },
|
|
|
- ],
|
|
|
+ type: 99,
|
|
|
+ name: "其它",
|
|
|
},
|
|
|
];
|
|
|
- const buildingData: any = [];
|
|
|
+ const spaceType: any = {
|
|
|
+ type: "",
|
|
|
+ name: "全部空间",
|
|
|
+ };
|
|
|
+ const spaceData: any = [];
|
|
|
const proxyData = reactive({
|
|
|
parseImgUrl: parseImgUrl,
|
|
|
+ spaceType: spaceType,
|
|
|
checked: false,
|
|
|
- activeId: 1,
|
|
|
- activeIndex: 0,
|
|
|
- items: items,
|
|
|
+ positionArr: positionArr,
|
|
|
+ checkPositon: checkPositon,
|
|
|
route: route,
|
|
|
option1: option1,
|
|
|
option2: option2,
|
|
@@ -108,18 +148,25 @@ export default defineComponent({
|
|
|
showHeader: false,
|
|
|
showSpaceType: false,
|
|
|
show: false, // 是否展示选择建筑的页面
|
|
|
+ spaceTypeArr: spaceTypeArr,
|
|
|
showPounp() {
|
|
|
proxyData.show = !proxyData.show;
|
|
|
},
|
|
|
showSpaceTypePounp() {
|
|
|
proxyData.showSpaceType = !proxyData.showSpaceType;
|
|
|
},
|
|
|
+ // 选择空间
|
|
|
+ checkSpaceType(item: any) {
|
|
|
+ proxyData.spaceType = item;
|
|
|
+ proxyData.showSpaceType = false;
|
|
|
+ },
|
|
|
// 设置建筑id
|
|
|
setProjectId() {
|
|
|
let nowProjectId: any = route.query.id;
|
|
|
store.commit(UserMutationTypes.SET_PROJECT_ID, nowProjectId);
|
|
|
},
|
|
|
buildingData: buildingData,
|
|
|
+ buildingItem: buildingItem,
|
|
|
// 获取建筑列表
|
|
|
getBuildingList() {
|
|
|
let params: any = {
|
|
@@ -127,7 +174,7 @@ export default defineComponent({
|
|
|
projectId: store.state.user.projectId, //类型:String 必有字段 备注:项目id
|
|
|
},
|
|
|
};
|
|
|
- getBuildingList(params).then((res) => {
|
|
|
+ return getBuildingList(params).then((res) => {
|
|
|
let resData: any = res;
|
|
|
if (resData.result === "success") {
|
|
|
let content: any = resData?.content ?? [];
|
|
@@ -137,26 +184,142 @@ export default defineComponent({
|
|
|
}
|
|
|
});
|
|
|
},
|
|
|
- // 查询当前平板的默认空间
|
|
|
+ // 格式化建筑数据
|
|
|
+ formateBuildingData() {
|
|
|
+ proxyData.positionArr = [];
|
|
|
+ for (let i = 0; i < proxyData.buildingData.length; i++) {
|
|
|
+ let obj = {
|
|
|
+ text: proxyData.buildingData[i].localName,
|
|
|
+ id: proxyData.buildingData[i].id,
|
|
|
+ children: [],
|
|
|
+ };
|
|
|
+ if (
|
|
|
+ proxyData.buildingData[i].id === proxyData.checkPositon.buildingId
|
|
|
+ ) {
|
|
|
+ proxyData.buildingItem.buildingName =
|
|
|
+ proxyData.buildingData[i].localName;
|
|
|
+ proxyData.floorData.map((item: any) => {
|
|
|
+ item.text = item.localName;
|
|
|
+ if (item.id === proxyData.checkPositon.floorId) {
|
|
|
+ proxyData.checkPositon.floorName = item.localName;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ proxyData.checkPositon.buildingName =
|
|
|
+ proxyData.buildingData[i].localName;
|
|
|
+ obj.children = proxyData.floorData;
|
|
|
+ }
|
|
|
+ proxyData.positionArr.push(obj);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ floorData: floorData,
|
|
|
+ /**
|
|
|
+ * 查询楼层信息
|
|
|
+ */
|
|
|
+ getFloorList() {
|
|
|
+ if (proxyData.buildingItem.buildingId) {
|
|
|
+ let params: any = {
|
|
|
+ criteria: {
|
|
|
+ projectId: store.state.user.projectId,
|
|
|
+ buildingId: proxyData.buildingItem.buildingId,
|
|
|
+ },
|
|
|
+ orders: [
|
|
|
+ {
|
|
|
+ asc: true,
|
|
|
+ column: "localId",
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ };
|
|
|
+ return getFloorList(params)
|
|
|
+ .then((res) => {
|
|
|
+ let resData: any = res;
|
|
|
+ if (res.result === "success") {
|
|
|
+ proxyData.floorData = resData?.content ?? [];
|
|
|
+ } else {
|
|
|
+ proxyData.floorData = [];
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(() => {});
|
|
|
+ }
|
|
|
+ },
|
|
|
+ // 平板默认 空间
|
|
|
+ defaultSpaceData: defaultSpaceData,
|
|
|
+ // 查询当前平板的默认空间await与wait的区别
|
|
|
getDefaultLocation() {
|
|
|
let params: any = {
|
|
|
macAddress: "test",
|
|
|
- projectId: store.state.user.projectId,
|
|
|
+ // projectId: store.state.user.projectId,
|
|
|
};
|
|
|
let paramsStr: any = setQueryConfig(params);
|
|
|
- getDefaultLocation(paramsStr).then((res) => {
|
|
|
+ return getDefaultLocation(paramsStr).then((res) => {
|
|
|
let resData: any = res;
|
|
|
+ proxyData.defaultSpaceData = resData?.data ?? {};
|
|
|
+ proxyData.buildingItem.buildingId =
|
|
|
+ proxyData.defaultSpaceData.buildingId;
|
|
|
+ proxyData.setCheckPersiton();
|
|
|
});
|
|
|
},
|
|
|
+ // 设置选中的位置
|
|
|
+ setCheckPersiton() {
|
|
|
+ proxyData.checkPositon.buildingId =
|
|
|
+ proxyData.defaultSpaceData.buildingId;
|
|
|
+ proxyData.checkPositon.floorId = proxyData.defaultSpaceData.floorId;
|
|
|
+ },
|
|
|
// 设置主空间
|
|
|
goNext() {
|
|
|
+ let data:any= proxyData.spaceData.filter((item:any)=>{
|
|
|
+ return item.checked
|
|
|
+ })
|
|
|
router.push({ name: "setMainSpace" });
|
|
|
},
|
|
|
+ // 选择建筑
|
|
|
+ checkBuilding(index: any) {
|
|
|
+ console.log(index);
|
|
|
+ proxyData.buildingItem.buildingId = proxyData.positionArr[index].id;
|
|
|
+ proxyData.buildingItem.buildingName = proxyData.positionArr[index].text;
|
|
|
+ proxyData.getFloorList();
|
|
|
+ },
|
|
|
+ // 选择楼层
|
|
|
+ checkFloor(item: any) {
|
|
|
+ proxyData.checkPositon.buildingId = item.buildingId;
|
|
|
+ proxyData.checkPositon.buildingName =
|
|
|
+ proxyData.buildingItem.buildingName;
|
|
|
+ proxyData.checkPositon.floorId = item.id;
|
|
|
+ proxyData.checkPositon.floorName = item.localName;
|
|
|
+ },
|
|
|
+ spaceData: spaceData,
|
|
|
+ // 空间列表
|
|
|
+ getPadSpaceList() {
|
|
|
+ let params: any = {
|
|
|
+ floorId: proxyData.checkPositon.floorId,
|
|
|
+ buildingId: proxyData.checkPositon.buildingId,
|
|
|
+ funcType: "",
|
|
|
+ spaceName: "",
|
|
|
+ macAddress: "test",
|
|
|
+ };
|
|
|
+ let str: any = setQueryConfig(params);
|
|
|
+ getPadSpaceList(str).then((res) => {
|
|
|
+ let resData: any = res;
|
|
|
+ if (resData.result === "success") {
|
|
|
+ proxyData.spaceData = resData?.data ?? [];
|
|
|
+ proxyData.spaceData.map((item: any) => {
|
|
|
+ item.checked=false
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ proxyData.spaceData = [];
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async init() {
|
|
|
+ await proxyData.getDefaultLocation();
|
|
|
+ await proxyData.getBuildingList();
|
|
|
+ await proxyData.getFloorList();
|
|
|
+ proxyData.formateBuildingData();
|
|
|
+ proxyData.getPadSpaceList();
|
|
|
+ },
|
|
|
});
|
|
|
onMounted(() => {
|
|
|
- console.log("lll=====")
|
|
|
proxyData.setProjectId();
|
|
|
- proxyData.getDefaultLocation();
|
|
|
+ proxyData.init();
|
|
|
});
|
|
|
return {
|
|
|
...toRefs(proxyData),
|
|
@@ -169,6 +332,7 @@ export default defineComponent({
|
|
|
.choice-space {
|
|
|
.search {
|
|
|
position: fixed;
|
|
|
+ width: 100%;
|
|
|
top: 48px;
|
|
|
left: 0;
|
|
|
display: flex;
|
|
@@ -183,7 +347,7 @@ export default defineComponent({
|
|
|
}
|
|
|
.search-floor {
|
|
|
position: relative;
|
|
|
- width: 226px;
|
|
|
+ width: 320px;
|
|
|
height: 44px;
|
|
|
line-height: 42px;
|
|
|
background: #ffffff;
|
|
@@ -198,6 +362,12 @@ export default defineComponent({
|
|
|
font-size: 16px;
|
|
|
line-height: 26px;
|
|
|
color: #1f2429;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ &:nth-child(2) {
|
|
|
+ width: 225px;
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
.search-space {
|
|
@@ -342,6 +512,12 @@ export default defineComponent({
|
|
|
background-color: $elActiveColor !important;
|
|
|
border-color: $elActiveColor !important;
|
|
|
}
|
|
|
+ .van-tree-select__item--active {
|
|
|
+ color: $elActiveColor;
|
|
|
+ }
|
|
|
+ .van-sidebar-item--select:before {
|
|
|
+ background-color: $elActiveColor;
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
|
|
|