|
@@ -1,3 +1,55 @@
|
|
|
<template>
|
|
<template>
|
|
|
- <view>页面内容</view>
|
|
|
|
|
-</template>
|
|
|
|
|
|
|
+ <z-paging ref="paging" bgColor="#F7F7F7" safe-area-inset-bottom paging-class="paging-btm-shadow" scroll-with-animation>
|
|
|
|
|
+ <template #top>
|
|
|
|
|
+ <ut-navbar title="基地详情" :fixed="false" border></ut-navbar>
|
|
|
|
|
+ <view class="bg-fff mb-20">
|
|
|
|
|
+ <view class="pd-5"></view>
|
|
|
|
|
+ <ut-tabs v-model="activeTab" :tabs="tabs" mode="btw" @change="changeActiveTab"></ut-tabs>
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </template>
|
|
|
|
|
+
|
|
|
|
|
+ <template #bottom>
|
|
|
|
|
+ <view class="pd-20 d-flex">
|
|
|
|
|
+
|
|
|
|
|
+ </view>
|
|
|
|
|
+ </template>
|
|
|
|
|
+ </z-paging>
|
|
|
|
|
+</template>
|
|
|
|
|
+<script setup lang="ts">
|
|
|
|
|
+import { useClientRequest } from '@/utils/request';
|
|
|
|
|
+const tabs = reactive([
|
|
|
|
|
+ { label: '基本信息', value: 'base' },
|
|
|
|
|
+ { label: '地块信息', value: 'plot' },
|
|
|
|
|
+ { label: '选址依据及环境信息', value: 'environment' },
|
|
|
|
|
+]);
|
|
|
|
|
+const activeTab = ref('base');
|
|
|
|
|
+const mapUnitByBaseType: any = {
|
|
|
|
|
+ '1': '亩',
|
|
|
|
|
+ '2': '平方米',
|
|
|
|
|
+ '3': '平方米',
|
|
|
|
|
+};
|
|
|
|
|
+const changeActiveTab = (value: string) => {
|
|
|
|
|
+ activeTab.value = value;
|
|
|
|
|
+};
|
|
|
|
|
+</script>
|
|
|
|
|
+<style lang="scss" scoped>
|
|
|
|
|
+.z-paging-wrap {
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ right: 0;
|
|
|
|
|
+ top: 0;
|
|
|
|
|
+ bottom: 0;
|
|
|
|
|
+ left: 0;
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+.btn-aree-center {
|
|
|
|
|
+ position: absolute;
|
|
|
|
|
+ top: 0;
|
|
|
|
|
+ right: 0;
|
|
|
|
|
+ bottom: 0;
|
|
|
|
|
+ left: 0;
|
|
|
|
|
+}
|
|
|
|
|
+.plot-item {
|
|
|
|
|
+ border: 1rpx solid rgba($u-primary, 0.4);
|
|
|
|
|
+ border-radius: 10rpx;
|
|
|
|
|
+}
|
|
|
|
|
+</style>
|