Project Init

src/components/pictureUpload/index.vue

@@ -1,6 +1,7 @@
 <template>
-  <el-image :preview-teleported="true" :preview-src-list="[previewUrl]" v-if="previewUrl?.length>0&&previewUrl!='[]'"
-            :src="previewUrl" class="box" />
+  <el-image :preview-teleported="true" :preview-src-list="previewList"
+            v-if="fileUrl?.length>0"
+            :src="previewList[0]" class="box" />
   <el-upload class="box" action="#" :show-file-list="false" :http-request="upload" :accept="accept">
     <el-icon class="avatar-uploader-icon">
       <Plus />
@@ -8,19 +9,20 @@
   </el-upload>
 
   <el-dialog v-model="watchImg" width="50%" :show-close="false">
-    <img :src="previewUrl" style="width: 100%" />
+    <img :src="previewList[0]" style="width: 100%" />
   </el-dialog>
 
 </template>
 
 <script setup lang="ts">
-import { onMounted, ref, watch } from "vue";
+import { computed, onMounted, ref, watch } from "vue";
 import { fileUpload } from "/@/api/common";
 import { Delete, Download, Plus, ZoomIn } from "@element-plus/icons-vue";
 import type { UploadInstance, UploadProps, UploadRawFile, UploadFile } from "element-plus";
 import { genFileId } from "element-plus";
 import { ElNotification } from "element-plus/es";
 import { log } from "/@/api/backend/routine/AdminInfo";
+import * as process from "process";
 
 
 const dialogImageUrl = ref("");
@@ -42,19 +44,26 @@ const props = defineProps({
   }
 });
 
+//上传图片路径
+let fileUrl = ref<string>("");
 
 watch(() => props.modelValue, (newVal) => {
-  previewUrl.value = newVal;
+  fileUrl.value = newVal;
 });
 
 
 onMounted(() => {
-  previewUrl.value = props.modelValue;
+  fileUrl.value = props.modelValue;
 });
 
-// const emit = defineEmits(["update:fileUrl"]);
-const emit = defineEmits(["input","update:modelValue"]);
 
+let previewList = computed(() => {
+  const baseUrl = import.meta.env.VITE_AXIOS_BASE_URL;
+  return [baseUrl + "/uploadFile/" + fileUrl.value];
+});
+
+// const emit = defineEmits(["update:fileUrl"]);
+const emit = defineEmits(["input", "update:modelValue"]);
 
 
 const handlePictureCardPreview = (file: UploadFile) => {
@@ -62,8 +71,6 @@ const handlePictureCardPreview = (file: UploadFile) => {
   dialogVisible.value = true;
 };
 
-//上传图片路径
-let previewUrl = ref<string>("");
 
 function upload(file: any) {
   //大小限制为0时为不限制
@@ -77,10 +84,8 @@ function upload(file: any) {
   let fd = new FormData();
   fd.append("file", file.file);
   fileUpload(fd).then(res => {
-    previewUrl.value = res.data.previewUrl;
-    console.log(previewUrl.value);
-    // emit("update:fileUrl", previewUrl.value);
-    emit("update:modelValue", previewUrl.value);
+    fileUrl.value = res.data.fileUrl;
+    emit("update:modelValue", res.data.fileUrl);
   });
 }
 

src/components/pictureUpload/multiple.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="imgViewBox" v-for="(item ,index) in previewUrl">
     <!-- <img v-if="previewUrl?.length>0" :src="item" class="box" style="cursor: pointer" @click="clickImg(item)"/> -->
-    <el-image ref="imageRef" :preview-teleported="true" :preview-src-list="previewUrl" :initial-index="index"
+    <el-image :preview-teleported="true" :preview-src-list="previewUrl" :initial-index="index"
               :src="item" class="box" />
     <div class="imgDeleteBtn">
       <el-icon
@@ -27,7 +27,7 @@
 </template>
 
 <script setup lang="ts">
-import { onBeforeMount, onMounted, ref, watch } from "vue";
+import { computed, onBeforeMount, onMounted, ref, watch } from "vue";
 import { fileUpload } from "/@/api/common";
 import { Delete, Download, Plus, ZoomIn } from "@element-plus/icons-vue";
 import { ElNotification } from "element-plus/es";
@@ -50,30 +50,37 @@ const props = defineProps({
   }
 });
 
-const imageRef = ref();
-
 onMounted(() => {
   if (props.modelValue?.length > 0) {
-    previewUrl.value = JSON.parse(props.modelValue);
+    fileUrl.value = JSON.parse(props.modelValue);
   } else {
-    previewUrl.value = [];
+    fileUrl.value = [];
   }
 });
 
 watch(() => props.modelValue, () => {
   if (props.modelValue?.length > 0) {
-    previewUrl.value = JSON.parse(props.modelValue);
+    fileUrl.value = JSON.parse(props.modelValue);
   } else {
-    previewUrl.value = [];
+    fileUrl.value = [];
   }
 });
 
 
-const emit = defineEmits(["input"]);
+const emit = defineEmits(["update:modelValue"]);
 
 
 //上传图片路径
-let previewUrl = ref<Array<any>>([]);
+let fileUrl = ref<Array<any>>([]);
+
+let previewUrl = computed(() => {
+  let res = [];
+  for (let i of fileUrl.value) {
+    const baseUrl = import.meta.env.VITE_AXIOS_BASE_URL;
+    res.push(baseUrl + "/uploadFile/" + i);
+  }
+  return res;
+});
 
 function upload(file: any) {
   //大小限制为0时为不限制
@@ -84,14 +91,15 @@ function upload(file: any) {
   let fd = new FormData();
   fd.append("file", file.file);
   fileUpload(fd).then(res => {
-    previewUrl.value.push(res.data.previewUrl);
-    emit("input", JSON.stringify(previewUrl.value));
+    fileUrl.value.push(res.data.fileUrl);
+    emit("update:modelValue", JSON.stringify(fileUrl.value));
+
   });
 }
 
 function del(index: number) {
-  previewUrl.value.splice(index, 1);
-  emit("input", JSON.stringify(previewUrl.value));
+  fileUrl.value.splice(index, 1);
+  emit("update:modelValue", JSON.stringify(fileUrl.value));
 }
 
 

src/views/backend/enterprise/mediapromotion/ad/popupForm.vue

@@ -2,7 +2,7 @@
   <!-- 对话框表单 -->
   <el-dialog custom-class="ba-operate-dialog" :close-on-click-modal="false"
              :model-value="baTable.form.operate ? true : false" @close="baTable.toggleForm"
-             width="30%"
+             width="900px"
   >
     <template #header>
       <div class="title" v-drag="['.ba-operate-dialog', '.el-dialog__header']" v-zoom="'.ba-operate-dialog'">
@@ -28,6 +28,9 @@
           <el-form-item prop="adUrl" label="上传图片">
             <pictureUpload v-model="baTable.form.items!.adUrl" @input="test"></pictureUpload>
           </el-form-item>
+          <el-form-item  prop="adContent" label="广告文案">
+            <editor v-model="baTable.form.items!.adContent"></editor>
+          </el-form-item>
         </el-form>
       </div>
     </el-scrollbar>
@@ -52,6 +55,7 @@ import { ElNotification } from "element-plus/es";
 import pictureUpload from "/@/components/pictureUpload/index.vue";
 import request from "/@/api/request";
 import { store } from "/@/api/controllerUrls";
+import editor from "/@/components/editor/index.vue";
 
 const formRef = ref<InstanceType<typeof ElForm>>();
 const baTable = inject("baTable") as baTableClass;
@@ -60,7 +64,7 @@ const baTable = inject("baTable") as baTableClass;
 const rules: Partial<Record<string, FormItemRule[]>> = reactive({
   adStatus: [{ required: true, message: "请选择", trigger: "blur" }],
   adTitle: [{ required: true, message: "请选择", trigger: "blur" }],
-  adUrl: [{ required: true, message: "请选择", trigger: "blur" }],
+  // adUrl: [{ required: true, message: "请选择", trigger: "blur" }],
 });
 
 watch(()=>baTable.form.items!.adUrl,(n,o)=>{

src/views/backend/enterprise/mediapromotion/advertisement.vue

@@ -1,113 +0,0 @@
-<template>
-    <div class="default-main ba-table-box">
-        <el-alert class="ba-table-alert" v-if="baTable.table.remark" :title="baTable.table.remark" type="info"
-                  show-icon/>
-        <el-row>
-            <el-col :span="24">
-                <!-- 表格顶部菜单 -->
-                <TableHeader :buttons="['refresh', 'add', 'edit', 'delete', 'comSearch']"
-                             quick-search-placeholder="通过标题模糊搜索"
-                             @action="baTable.onTableHeaderAction"/>
-                <!-- 表格 -->
-                <!-- 要使用`el-table`组件原有的属性，直接加在Table标签上即可 -->
-                <Table @action="baTable.onTableAction"/>
-
-            </el-col>
-        </el-row>
-
-        <!-- 表单 -->
-        <PopupForm ref="formRef"/>
-
-    </div>
-</template>
-
-<script setup lang="ts">
-import {ref, onMounted, provide} from 'vue'
-import {advertisement, document} from '/@/api/controllerUrls'
-import Table from '/@/components/table/index.vue'
-import TableHeader from '/@/components/table/header/index.vue'
-import {defaultOptButtons} from '/@/components/table'
-import PopupForm from './popupForm.vue'
-import {baTableApi} from '/@/api/common'
-import baTableClass from '/@/utils/baTable'
-
-
-const tableRef = ref()
-const baTable = new baTableClass(
-    new baTableApi(advertisement),
-    {
-        dblClickNotEditColumn: [undefined, 'status'],
-        column: [
-            {type: 'selection', align: 'center', operator: false},
-            {label: '标题', prop: 'adTitle', align: 'left', operator: 'LIKE'},
-            {
-                label: '场景',
-                prop: 'sceneType',
-                align: 'center',
-                width: '120',
-                render: 'tag',
-                operator: '=',
-                replaceValue:{0:'开机',1:'轮播'}
-            },
-            {
-                label: '类型',
-                prop: 'adType',
-                align: 'center',
-                width: '120',
-                render: 'tag',
-                operator: '=',
-                custom: { 0: '', 1: '' ,2:''},
-                replaceValue:{0:'展示',1:'推广',2:'好物'}
-            },
-            {
-                label: '曝光量',
-                prop: 'viewCount',
-                align: 'center',
-                width: '120',
-                operator: false
-            },
-            {
-                label: '是否上架',
-                prop: 'adStatus',
-                align: 'center',
-                width: '120',
-                render: 'tag',
-                operator: '=',
-                custom: { 0: 'success', 1: 'info' },
-                replaceValue:{0:'上架',1:'下架'}
-            },
-            {label: '创建人', prop: 'creatorName', align: 'center', width: '120', operator: false},
-            {label: '创建时间', prop: 'createTime', align: 'center', width: '170', operator: false},
-            {
-                label: '操作',
-                align: 'center',
-                width: '160',
-                render: 'buttons',
-                buttons: defaultOptButtons(),
-                operator: false
-            },
-        ],
-    },
-    {
-        defaultItems: {
-            sceneType:0
-        },
-    },
-    {
-        // 获得编辑数据后
-        requestEdit: () => {
-            if (baTable.form.items && !baTable.form.items.icon) baTable.form.items.icon = 'el-icon-Minus'
-        },
-    }
-)
-
-provide('baTable', baTable)
-
-onMounted(() => {
-    baTable.mount()
-    baTable.getIndex()
-})
-</script>
-
-
-<style scoped lang="scss"></style>

src/views/backend/enterprise/mediapromotion/popupForm.vue

@@ -1,213 +0,0 @@
-<template>
-    <!-- 对话框表单 -->
-    <el-dialog custom-class="ba-operate-dialog" :close-on-click-modal="false"
-               :model-value="baTable.form.operate ? true : false" @close="baTable.toggleForm">
-        <template #header>
-            <div class="title" v-drag="['.ba-operate-dialog', '.el-dialog__header']" v-zoom="'.ba-operate-dialog'">
-                {{ baTable.form.operate ? baTable.form.operate == 'edit' ? '编辑' : '添加' : '无标题' }}
-            </div>
-        </template>
-        <el-scrollbar v-loading="baTable.form.loading" class="ba-table-form-scrollbar">
-            <div class="ba-operate-form" :class="'ba-' + baTable.form.operate + '-form'"
-                 :style="'width: calc(100% - ' + baTable.form.labelWidth! / 2 + 'px)'">
-                <el-form ref="formRef" @keyup.enter="baTable.onSubmit(formRef)" :model="baTable.form.items"
-                         label-position="right" :label-width="baTable.form.labelWidth + 'px'" :rules="rules"
-                         v-if="!baTable.form.loading">
-                    <el-form-item prop="adTitle" label="广告标题">
-                        <el-input v-model="baTable.form.items!.adTitle"></el-input>
-                    </el-form-item>
-                    <el-form-item prop="sceneType" label="场景">
-                        <el-select v-model="baTable.form.items!.sceneType" placeholder="请选择场景" style="width: 100%"
-                                   clearable>
-                            <el-option label="开机" :value="0"/>
-                            <el-option label="轮播" :value="1"/>
-                        </el-select>
-                    </el-form-item>
-                    <el-form-item prop="adType" label="类型">
-                        <el-select v-model="baTable.form.items!.adType" placeholder="请选择类型" style="width: 100%"
-                                   clearable
-                                   @change="onChange">
-                            <el-option label="展示" :value="0"/>
-                            <el-option label="推广" :value="1"/>
-                            <el-option label="好物" :value="2"/>
-                        </el-select>
-                    </el-form-item>
-                    <el-form-item prop="documentId" label="关联" v-if="baTable.form.items.adType>0">
-                        <el-select v-model="baTable.form.items!.documentId" placeholder="请选择关联" style="width: 100%"
-                                   clearable
-                                   filterable>
-                            <el-option v-for="(item,index) in datas.selectList" :label="item.label" :value="item.value"
-                                       :key="index"/>
-                        </el-select>
-                    </el-form-item>
-                    <el-form-item prop="adStatus" label="状态">
-                        <el-select v-model="baTable.form.items!.adStatus" placeholder="请选择状态" style="width: 100%"
-                                   clearable>
-                            <el-option label="下架" :value="1"/>
-                            <el-option label="上架" :value="0"/>
-                        </el-select>
-                    </el-form-item>
-                    <el-form-item prop="screenDisplayHorizontalUrl" label="大屏横屏展示"
-                                  v-if="baTable.form.items!.sceneType==0">
-                        <pictureUpload v-model="baTable.form.items!.screenDisplayHorizontalUrl"></pictureUpload>
-                    </el-form-item>
-                    <el-form-item prop="screenDisplayVerticalUrl" label="大屏竖屏展示"
-                                  v-if="baTable.form.items!.sceneType==0">
-                        <pictureUpload v-model="baTable.form.items!.screenDisplayVerticalUrl"></pictureUpload>
-                    </el-form-item>
-                    <el-form-item prop="screenDisplayHorizontalUrl" label="大屏轮播展示"
-                                  v-if="baTable.form.items!.sceneType==1">
-                        <pictureUpload v-model="baTable.form.items!.screenDisplayHorizontalUrl"></pictureUpload>
-                    </el-form-item>
-                    <el-form-item prop="appDisplayUrl" label="移动APP展示">
-                        <pictureUpload v-model="baTable.form.items!.appDisplayUrl"></pictureUpload>
-                    </el-form-item>
-                    <div style="font-size: 10px;color: #92969a;margin-left: 150px">
-                        仅限jpg/png格式文件，大小不超过1MB
-                    </div>
-                </el-form>
-            </div>
-        </el-scrollbar>
-        <template #footer>
-            <div :style="'width: calc(100% - ' + baTable.form.labelWidth! / 1.8 + 'px)'">
-                <el-button @click="baTable.toggleForm('')">取消</el-button>
-                <el-button v-blur :loading="baTable.form.submitLoading" @click="baTable.onSubmit(formRef)"
-                           type="primary">
-                    {{ baTable.form.operateIds && baTable.form.operateIds.length > 1 ? '保存并编辑下一项' : '保存' }}
-                </el-button>
-            </div>
-        </template>
-    </el-dialog>
-</template>
-
-<script setup lang="ts">
-import {ref, reactive, inject, onMounted, watch} from 'vue'
-import type baTableClass from '/@/utils/baTable'
-import type {ElForm, FormItemRule} from 'element-plus'
-import request from '/@/api/request'
-import {document} from '/@/api/controllerUrls'
-import pictureUpload from '/@/components/pictureUpload/index.vue'
-import {getRecommendList} from '/@/api/backend/enterprise/advertisement'
-
-const formRef = ref<InstanceType<typeof ElForm>>()
-const baTable = inject('baTable') as baTableClass
-
-onMounted(() => {
-    getDocList()
-})
-
-let datas = reactive({
-    selectList: [],
-})
-
-function getDocList() {
-    request.index(document, undefined, 'list').then((res) => {
-        datas.selectList = []
-        baTable.form.items!.documentId = ''
-        res.data.map((item: any) => {
-            let selectItem = {
-                label: item.documentTitle,
-                value: item.id,
-            }
-            datas.selectList.push(selectItem)
-        })
-
-    })
-}
-
-const onChange = (val: any) => {
-    if (val === 1) {
-        getDocList()
-    }
-
-    if (val === 2) {
-        getRecommendList().then((res) => {
-            datas.selectList = []
-            baTable.form.items!.documentId = ''
-            res.data.map((item: any) => {
-                let selectItem = {
-                    label: item.recommendTitle,
-                    value: item.id,
-                }
-
-                datas.selectList.push(selectItem)
-            })
-        })
-    }
-}
-
-const rules: Partial<Record<string, FormItemRule[]>> = reactive({
-    adTitle: [
-        {
-            required: true,
-            message: '请输入标题',
-            trigger: 'blur',
-        },
-    ],
-    sceneType: [
-        {
-            required: true,
-            message: '请选择场景',
-            trigger: 'blur',
-        },
-    ],
-    adType: [
-        {
-            required: true,
-            message: '请选择类型',
-            trigger: 'blur',
-        },
-    ],
-    documentId: [
-        {
-            required: true,
-            message: '请选择关联',
-            trigger: 'blur',
-        },
-    ],
-    adStatus: [
-        {
-            required: true,
-            message: '请选择状态',
-            trigger: 'blur',
-        },
-    ],
-})
-</script>
-
-<style scoped lang="scss">
-.avatar-uploader {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    position: relative;
-    border-radius: var(--el-border-radius-small);
-    box-shadow: var(--el-box-shadow-light);
-    border: 1px dashed var(--color-sub-1);
-    cursor: pointer;
-    overflow: hidden;
-    width: 110px;
-    height: 110px;
-}
-
-.avatar-uploader:hover {
-    border-color: var(--color-primary);
-}
-
-.avatar {
-    width: 110px;
-    height: 110px;
-    display: block;
-}
-
-.image-slot {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    height: 100%;
-}
-</style>
-
-function getRecommendList() {
-throw new Error('Function not implemented.')
-}

src/views/backend/enterprise/project/map/popupForm.vue

@@ -157,6 +157,7 @@ function selectCommunity(event: any) {
 
 function onSubmit(){
   delete baTable.form.items!.communityName
+  console.log(baTable.form.items);
   baTable.onSubmit(formRef.value)
 }
 

src/views/backend/enterprise/project/parking/index.vue

@@ -1,105 +1,130 @@
 <template>
   <div class="default-main ">
-    <div style="display: flex;justify-content: space-between;background: #ffffff;padding: 20px 20px">
+    <div style="display: flex;justify-content: space-between;background: #ffffff;padding: 20px">
       <div style="display: flex;align-items: center">
-        <span>区县：</span>
-        <el-select v-model="districtId" placeholder="请选择区县" style="width: 150px;margin-right: 10px" @change="selectDstrict"
-                   :clearable="true">
-          <el-option v-for="item in districtList" :label="item.districtName" :value="item.id"></el-option>
-        </el-select>
-        <span>小区：</span>
-        <el-select v-model="communityId" placeholder="请选择小区" style="width: 150px;margin-right: 10px"
-                   @change="selectCommunity" :clearable="true">
-          <el-option v-for="item in communityList" :label="item.communityName" :value="item.id"></el-option>
-        </el-select>
-        <span>楼号：</span>
-        <el-select v-model="buildingId" placeholder="请选择楼号" style="width: 150px;margin-right: 10px" @change="selectBuilding"
-                   :clearable="true">
-          <el-option v-for="item in buildingList" :label="item.buildingNumber" :value="item.id"></el-option>
-        </el-select>
+        <!--        <span>区县：</span>-->
+        <!--        <el-select v-model="districtId" placeholder="请选择区县" style="width: 150px;margin-right: 10px"-->
+        <!--                   @change="selectDstrict"-->
+        <!--                   :clearable="true">-->
+        <!--          <el-option v-for="item in districtList" :label="item.districtName" :value="item.id"></el-option>-->
+        <!--        </el-select>-->
+        <!--        <span>小区：</span>-->
+        <!--        <el-select v-model="communityId" placeholder="请选择小区" style="width: 150px;margin-right: 10px"-->
+        <!--                   @change="selectCommunity" :clearable="true">-->
+        <!--          <el-option v-for="item in communityList" :label="item.communityName" :value="item.id"></el-option>-->
+        <!--        </el-select>-->
+        <!--        <span>楼号：</span>-->
+        <!--        <el-select v-model="buildingId" placeholder="请选择楼号" style="width: 150px;margin-right: 10px"-->
+        <!--                   @change="selectBuilding"-->
+        <!--                   :clearable="true">-->
+        <!--          <el-option v-for="item in buildingList" :label="item.buildingNumber" :value="item.id"></el-option>-->
+        <!--        </el-select>-->
         <el-button v-if="auth('add')" type="primary" :disabled="buildingId == ''"
-                   @click="openDialog('add')">登记车位</el-button>
+                   @click="openDialog('add')">登记车位
+        </el-button>
         <el-button v-if="auth('map')" type="primary" :disabled="buildingId == ''"
-                   @click="parkingMapRef.open(buildingId)">车位绑定</el-button>
+                   @click="parkingMapRef.open(buildingId)">车位绑定
+        </el-button>
       </div>
       <div>
-        <el-input v-model="quickSearch" placeholder="通过车位编号模糊检索" @change="getData"  clearable></el-input>
+        <el-input v-model="quickSearch" placeholder="通过车位编号模糊检索" @change="getData" clearable></el-input>
       </div>
     </div>
 
-
-    <el-table :data="parkingData" border @row-dblclick="detailDialogRef.open($event)">
-      <el-table-column prop="districtName" label="区县"></el-table-column>
-      <el-table-column prop="communityName" label="小区"></el-table-column>
-      <el-table-column prop="parkingNumber" label="车位编号"></el-table-column>
-      <el-table-column prop="parkingType" label="车位类型" width="100">
-        <template #default="{ row }">
-          <span>{{ row.parkingType == 1 ? '车库' : '车位' }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="售卖类型">
-        <template #default="{ row }">
-          <el-tag v-if="row.isSale == 1" style="margin: 0 5px;">出售</el-tag>
-          <el-tag v-if="row.isHire == 1" style="margin: 0 5px;">出租</el-tag>
-        </template>
-      </el-table-column>
-      <el-table-column label="销售金额" width="100">
-        <template #default="{ row }">
-          <span v-if="row.isSale == 1" style="margin: 0 5px;">{{ row.salePrice }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="出售状态" width="100">
-        <template #default="{ row }">
-          <el-tag v-if="row.isSale == 1" :type="row.saleStatus == 1 ? 'info' : 'success'" style="margin: 0 5px;">{{ row.saleStatus
-            == 1 ? '已售' : '待售' }}</el-tag>
-        </template>
-      </el-table-column>
-      <el-table-column label="租金" width="100">
-        <template #default="{ row }">
-          <span v-if="row.isHire == 1" style="margin: 0 5px;">{{ row.hirePrice }}</span>
-        </template>
-      </el-table-column>
-      <el-table-column label="出租状态" width="100">
-        <template #default="{ row }">
-          <el-tag v-if="row.isHire == 1" :type="row.hireStatus == 1 ? 'info' : 'success'" style="margin: 0 5px;">{{ row.hireStatus
-            == 1 ? '已租' : '待租' }}</el-tag>
+    <div
+      style="display: flex;background-color: #ffffff;width: 100%;padding: 0 20px 20px 20px;justify-content: space-between">
+      <el-tree node-key="id" :expand-on-click-node="false" :data="treeData"
+               style="width: 250px;border: #d0d0d0 1px solid" highlight-current @nodeClick="treeNodeClick">
+        <template #default="{node,data}">
+          <span>{{ data.label ? data.label : data.buildingNumber }}</span>
         </template>
-      </el-table-column>
-      <el-table-column label="是否标记" width="100">
-        <template #default="{ row }">
-          <el-tag :type="row.mapId == 0 ? 'danger' : 'success'" style="margin: 0 5px;">{{ row.mapId
-          == 0 ? '未标记' : '已标记' }}</el-tag>
-        </template>
-      </el-table-column>
-      <el-table-column label="操作" width="150" header-align="center">
-        <template #default="{ row }">
-          <div style="display: flex;justify-content: center;">
-            <el-button v-if="auth('edit')" class="table-operate" size="small" type="warning" @click="openDialog('edit', row)">
-              <icon name="el-icon-edit"></icon>
-            </el-button>
-            <el-popconfirm width="220" confirm-button-text="确定" cancel-button-text="取消" title="是否确定删除?"
-              @confirm="deleteRow(row)">
-              <template #reference>
-                <el-button v-if="auth('del')"  class="table-operate" type="danger" size="small">
-                  <icon name="el-icon-delete"></icon>
+      </el-tree>
+
+      <div style="width: calc(100% - 270px);">
+        <div style="color: #3f6ad8">
+          <span>当前位置：</span>
+          <span>{{ dir }}</span>
+        </div>
+        <el-table style="margin-top: 10px" :data="parkingData" border @row-dblclick="detailDialogRef.open($event)">
+          <el-table-column prop="districtName" label="区县"></el-table-column>
+          <el-table-column prop="communityName" label="小区"></el-table-column>
+          <el-table-column prop="parkingNumber" label="车位编号"></el-table-column>
+          <el-table-column prop="parkingType" label="车位类型" width="100">
+            <template #default="{ row }">
+              <span>{{ row.parkingType == 1 ? "车库" : "车位" }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="售卖类型">
+            <template #default="{ row }">
+              <el-tag v-if="row.isSale == 1" style="margin: 0 5px;">出售</el-tag>
+              <el-tag v-if="row.isHire == 1" style="margin: 0 5px;">出租</el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="销售金额" width="100">
+            <template #default="{ row }">
+              <span v-if="row.isSale == 1" style="margin: 0 5px;">{{ row.salePrice }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="出售状态" width="100">
+            <template #default="{ row }">
+              <el-tag v-if="row.isSale == 1" :type="row.saleStatus == 1 ? 'info' : 'success'" style="margin: 0 5px;">
+                {{ row.saleStatus
+              == 1 ? "已售" : "待售" }}
+              </el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="租金" width="100">
+            <template #default="{ row }">
+              <span v-if="row.isHire == 1" style="margin: 0 5px;">{{ row.hirePrice }}</span>
+            </template>
+          </el-table-column>
+          <el-table-column label="出租状态" width="100">
+            <template #default="{ row }">
+              <el-tag v-if="row.isHire == 1" :type="row.hireStatus == 1 ? 'info' : 'success'" style="margin: 0 5px;">
+                {{ row.hireStatus
+              == 1 ? "已租" : "待租" }}
+              </el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="是否标记" width="100">
+            <template #default="{ row }">
+              <el-tag :type="row.mapId == 0 ? 'danger' : 'success'" style="margin: 0 5px;">{{ row.mapId
+              == 0 ? "未标记" : "已标记" }}
+              </el-tag>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" width="150" header-align="center">
+            <template #default="{ row }">
+              <div style="display: flex;justify-content: center;">
+                <el-button v-if="auth('edit')" class="table-operate" size="small" type="warning"
+                           @click="openDialog('edit', row)">
+                  <icon name="el-icon-edit"></icon>
                 </el-button>
-              </template>
-            </el-popconfirm>
-
-          </div>
-        </template>
-      </el-table-column>
-    </el-table>
-    <el-pagination style="background: #ffffff;padding: 20px 20px"
-      v-model:current-page="currentPage"
-      v-model:page-size="pageSize"
-      :page-sizes="[10, 20, 50, 100]"
-      :background = "true"
-      layout="sizes, prev, pager, next, jumper"
-      :total="total"
-      @size-change="handleSizeChange"
-      @current-change="handleCurrentChange"
-    />
+                <el-popconfirm width="220" confirm-button-text="确定" cancel-button-text="取消" title="是否确定删除?"
+                               @confirm="deleteRow(row)">
+                  <template #reference>
+                    <el-button v-if="auth('del')" class="table-operate" type="danger" size="small">
+                      <icon name="el-icon-delete"></icon>
+                    </el-button>
+                  </template>
+                </el-popconfirm>
+
+              </div>
+            </template>
+          </el-table-column>
+        </el-table>
+        <el-pagination style="background: #ffffff;padding: 20px 20px"
+                       v-model:current-page="currentPage"
+                       v-model:page-size="pageSize"
+                       :page-sizes="[10, 20, 50, 100]"
+                       :background="true"
+                       layout="sizes, prev, pager, next, jumper"
+                       :total="total"
+                       @size-change="handleSizeChange"
+                       @current-change="handleCurrentChange"
+        />
+      </div>
+    </div>
 
     <editDialog ref="editDialogRef" @close="getData"></editDialog>
     <markDialog ref="parkingMapRef" @close="getData"></markDialog>
@@ -112,32 +137,34 @@
 
 import { auth } from "/@/utils/common";
 import request from "/@/api/request";
-import { building_list, community_list, district_list, parking } from "/@/api/controllerUrls";
-import { onMounted, ref } from "vue";
-import editDialog from "./editDialog.vue"
-import markDialog from "./markDialog.vue"
-import detailDialog from "./detailDialog.vue"
+import { building_list, buildingTree, community_list, district_list, parking } from "/@/api/controllerUrls";
+import { computed, onMounted, ref } from "vue";
+import editDialog from "./editDialog.vue";
+import markDialog from "./markDialog.vue";
+import detailDialog from "./detailDialog.vue";
 
 
 onMounted(() => {
-  getDistrictList()
-  getData()
-})
+  getDistrictList();
+  getData();
+  getInitData();
+});
 
-let districtId = ref('')
+let districtId = ref("");
 
-let editDialogRef = ref()
-let parkingMapRef = ref()
-let detailDialogRef = ref()
+let editDialogRef = ref();
+let parkingMapRef = ref();
+let detailDialogRef = ref();
 
-let quickSearch = ref('')
+let quickSearch = ref("");
 
-let total = ref(0)
-let currentPage = ref(1)
-let pageSize = ref(10)
+let total = ref(0);
+let currentPage = ref(1);
+let pageSize = ref(10);
 
 //区县列表
-let districtList = ref([])
+let districtList = ref([]);
+
 function getDistrictList() {
   request.index(district_list, {}, "").then((res: any) => {
     if (res.code == 1) {
@@ -146,7 +173,7 @@ function getDistrictList() {
   });
 }
 
-let communityId = ref('')
+let communityId = ref("");
 
 //小区列表
 let communityList = ref([]);
@@ -158,15 +185,15 @@ function selectDstrict(event: any) {
   }, "").then((res: any) => {
     if (res.code == 1) {
       communityList.value = res.data;
-      communityId.value = ''
-      buildingId.value = ''
-      getData()
+      communityId.value = "";
+      buildingId.value = "";
+      getData();
     }
   });
 }
 
 
-let buildingId = ref('')
+let buildingId = ref("");
 //楼号列表
 let buildingList = ref([]);
 
@@ -177,45 +204,87 @@ function selectCommunity(event: any) {
   }, "").then((res: any) => {
     if (res.code == 1) {
       buildingList.value = res.data;
-      buildingId.value = ''
-      getData()
+      buildingId.value = "";
+      getData();
     }
   });
 }
 
 
-let parkingData = ref([])
+let parkingData = ref([]);
 
 function selectBuilding(event: any) {
-  getData()
+  getData();
 }
 
 
+//树相关
+let treeData = ref([]);
+let dir = ref("");
+
+function getInitData() {
+  request.index(buildingTree, {}, "").then((res: any) => {
+    if (res.code == 1) {
+      treeData.value = res.data;
+    }
+  });
+}
+
+function treeNodeClick(node: any, data: any) {
+  console.log(data);
+  districtId.value = "";
+  communityId.value = "";
+  buildingId.value = "";
+  if (data.level == 1) {
+    districtId.value = data.data.id;
+    dir.value = data.data.label;
+  } else if (data.level == 2) {
+    communityId.value = data.data.id;
+    districtId.value = data.parent.data.id;
+    dir.value = data.parent.data.label + " / " + data.data.label;
+  } else {
+    buildingId.value = data.data.id;
+    communityId.value = data.parent.data.id;
+    districtId.value = data.parent.parent.data.id;
+    dir.value = data.parent.parent.data.label + " / " + data.parent.data.label + " / " + data.data.buildingNumber;
+  }
+  getData();
+}
+
+let defaultExpanded = computed(() => {
+  let res = [];
+  for (let row of treeData.value) {
+    res.push(row.id);
+  }
+  return res;
+});
+
+
 function getData() {
   request.index(parking, {
     districtId: districtId.value,
     communityId: communityId.value,
     buildingId: buildingId.value,
-    quickSearch:quickSearch.value,
-    limit:pageSize.value,
-    page:currentPage.value
+    quickSearch: quickSearch.value,
+    limit: pageSize.value,
+    page: currentPage.value
   }).then((res: any) => {
     if (res.code == 1) {
       parkingData.value = res.data.list;
-      total.value = +res.data.total
+      total.value = +res.data.total;
     }
   });
 }
 
 const handleSizeChange = (val: number) => {
-  getData()
-}
+  getData();
+};
 const handleCurrentChange = (val: number) => {
-  getData()
-}
+  getData();
+};
 
 function openDialog(type: string, data: any = {}) {
-  editDialogRef.value.open(type, data, districtId, communityId, buildingId)
+  editDialogRef.value.open(type, data, districtId, communityId, buildingId);
 }
 
 
@@ -224,7 +293,7 @@ function deleteRow(row: any) {
     ids: [row.id]
   }).then((res: any) => {
     if (res.code == 1) {
-      getData()
+      getData();
     }
   });
 }

src/views/backend/system/auth/dataScreen/index.vue

@@ -23,7 +23,7 @@
 
 <script setup lang="ts">
 import {ref, onMounted, provide} from 'vue'
-import {advertisement, coupon, dataScreen, document} from '/@/api/controllerUrls'
+import {dataScreen} from '/@/api/controllerUrls'
 import Table from '/@/components/table/index.vue'
 import TableHeader from '/@/components/table/header/index.vue'
 import {defaultOptButtons} from '/@/components/table'
@@ -32,6 +32,7 @@ import {baTableApi} from '/@/api/common'
 import baTableClass from '/@/utils/baTable'
 
 
+
 const tableRef = ref()
 const baTable = new baTableClass(
     new baTableApi(dataScreen),