添加基地信息

src/pages/plant/base/index.vue

@@ -105,7 +105,7 @@
                                 </view>
                                 <view class="pd-10"></view>
                                 <view v-if="item.gapInfo?.basePic" class="p-rtv">
-                                    <up-image width="100%" :src="item.gapInfo?.basePic" mode="widthFix"> </up-image>
+                                    <image class="w-full h-310" :src="item.gapInfo?.basePic" mode="aspectFill"> </image>
                                     <view class="pl-20 pr-20 pt-10 pb-10 bg-#00000080 c-#ccc f-s-20" style="position: absolute; bottom: 140rpx; right: 0; border-radius: 10rpx 0 0 10rpx"> {{ item?.contactName }}负责</view>
                                     <view class="pl-20 pr-20 pt-10 pb-10 bg-#00000080 c-#ccc f-s-20" style="position: absolute; bottom: 80rpx; right: 0; border-radius: 10rpx 0 0 10rpx"> 公司+合作社</view>
                                     <view class="pl-20 pr-20 pt-10 pb-10 bg-#00000080 c-#ccc f-s-20" style="position: absolute; bottom: 20rpx; right: 0; border-radius: 10rpx 0 0 10rpx"> 经度:E{{ item?.gapInfo?.lng }} 纬度:N{{ item?.gapInfo?.lat }}</view>

src/plant/base/base-edit/index.vue

@@ -73,12 +73,79 @@
                     </up-form-item>
                     <!-- 关联的GAP获评信息 -->
                     <template v-if="+form.baseInfo.gapFlag">
-                        <up-form-item borderBottom label="关联的GAP获评信息" prop="baseInfo.gapId">
-                            <up-button @click="selectGapInfo" type="primary" text="确定" plain>
-                                <up-icon class="mr-10" name="plus" color="#37A954"></up-icon>
-                                <span>请选择要关联的GAP基地获评信息</span>
-                            </up-button>
-                        </up-form-item>
+                        <template v-if="!form.baseInfo.gapId">
+                            <up-form-item borderBottom label="关联的GAP获评信息" prop="baseInfo.gapId">
+                                <up-button @click="selectGapInfo" type="primary" text="确定" plain>
+                                    <up-icon class="mr-10" name="plus" color="#37A954"></up-icon>
+                                    <span>请选择要关联的GAP基地获评信息</span>
+                                </up-button>
+                            </up-form-item>
+                        </template>
+                        <template v-else>
+                            <up-form-item borderBottom label="关联的GAP获评信息" prop="baseInfo.gapId">
+                                <view class="bg-#FBFDFB pd-24 p-rtv flex1 radius-10 gap-info-card">
+                                    <view class="f-s-32 f-w-500 c-#333">{{ form?.baseInfo?.gapInfo?.gapBaseName || '-' }}</view>
+                                    <view class="f-s-24 c-#ccc mb-10">{{ form?.baseInfo?.gapInfo?.ratedDate }}获评</view>
+                                    <view class="d-flex gap-10 flex-wrap">
+                                        <view class="w-330 f-s-28">
+                                            <span class="c-#666">申报品种：</span>
+                                            <span class="c-#333 f-w-500">{{ form?.baseInfo?.gapInfo?.medicineName }}</span>
+                                        </view>
+                                        <view class="w-290 f-s-28">
+                                            <span class="c-#666">基地面积：</span>
+                                            <span class="c-#333 f-w-500">{{ form?.baseInfo?.gapInfo?.area }}{{ form?.baseInfo?.gapInfo?.areaUnit }}</span>
+                                        </view>
+                                        <view class="f-s-28">
+                                            <span class="c-#666">基地地址:</span>
+                                            <span class="c-#333 f-w-500">{{ form?.baseInfo?.gapInfo?.adcodeName }} {{ form?.baseInfo?.gapInfo?.address || '-' }}</span>
+                                        </view>
+                                    </view>
+                                    <view class="card-close pd-10" @click="removeGapInfo">
+                                        <up-icon name="close" size="32rpx" color="#F81242"></up-icon>
+                                    </view>
+                                </view>
+                            </up-form-item>
+                            <up-form-item  borderBottom label="基地具体地址" required prop="baseInfo.gapInfo.adcode">
+                                <!-- <up-input v-model="form.address" placeholder="请选择基地所在省/市/县/镇(乡)" border="none" clearable></up-input> -->
+                                <view v-if="form?.baseInfo?.gapInfo?.adcode" class="f-s-30 c-333 f-w-5 flex1">{{ form?.baseInfo?.gapInfo?.adcodeName }} </view>
+                                <view v-else class="f-s-30 c-ccc f-w-4 flex1">请选择基地所在省/市/县/镇(乡)</view>
+                            </up-form-item>
+                            <up-form-item borderBottom prop="baseInfo.gapInfo.address">
+                                <view class="f-s-30 c-#ccc">{{ form?.baseInfo?.gapInfo?.address || '-' }}</view>
+                            </up-form-item>
+                            <up-form-item  borderBottom prop="baseInfo.gapInfo.basePic" required>
+                                <view class="flex1 ov-hd">
+                                    <view class="d-flex a-c mb-10" style="margin-bottom: 5px">
+                                        <view class="f-s-30 c-#666">基地范围</view>
+                                    </view>
+                                    <view class="bg-#ccc d-flex ov-hd p-rtv">
+                                        <image class="w-full" v-if="form.baseInfo.gapInfo?.basePic" :src="form.baseInfo.gapInfo.basePic" mode="widthFix" />
+                                        <image class="w-full h-380" v-else src="@/static/images/plant/base/select_base_gap.png" mode="widthFix" />
+                                    </view>
+                                </view>
+                            </up-form-item>
+                            <view class="h-1" id="areaPppp"></view>
+                            <up-form-item required borderBottom label="基地面积" prop="baseInfo.gapInfo.area">
+                                <view class="f-s-30 c-#ccc">{{ form?.baseInfo?.gapInfo?.area || '-' }}</view>
+                                <template #right>
+                                    <span>{{ form.baseInfo.gapInfo.areaUnit }}</span>
+                                </template>
+                            </up-form-item>
+                            <!-- 基地经纬度 -->
+                            <view class="h-1" id="lngpppp"></view>
+                            <view class="h-1" id="latpppp"></view>
+                            <up-form-item required label="基地经纬度" class="form-item-wrap-column">
+                                <view class="d-flex" style="margin-top: -10px">
+                                    <up-form-item class="flex1" prop="baseInfo.gapInfo.lng">
+                                         <view class="f-s-30 c-#ccc flex1">{{ form?.baseInfo?.gapInfo?.lng || '-' }}</view>
+                                    </up-form-item>
+                                    <view class="pd-5"></view>
+                                    <up-form-item class="flex1" prop="baseInfo.gapInfo.lat">
+                                        <view class="f-s-30 c-#ccc flex1">{{ form?.baseInfo?.gapInfo?.lat || '-' }}</view>
+                                    </up-form-item>
+                                </view>
+                            </up-form-item>
+                        </template>
                     </template>
                 </template>
                 <template v-if="!+form.baseInfo.gapFlag && !form.baseInfo.gapId">
@@ -100,7 +167,7 @@
                                 <view class="f-s-30 c-#666">基地范围</view>
                             </view>
                             <view class="bg-#ccc d-flex ov-hd p-rtv" @click="mapDrawArea">
-                                <image class="w-full h-380" v-if="form.baseInfo.gapInfo?.basePic" :src="form.baseInfo.gapInfo.basePic" mode="widthFix" />
+                                <image class="w-full" v-if="form.baseInfo.gapInfo?.basePic" :src="form.baseInfo.gapInfo.basePic" mode="widthFix" />
                                 <image class="w-full h-380" v-else src="@/static/images/plant/base/select_base_gap.png" mode="widthFix" />
                                 <view v-if="!form.baseInfo.gapInfo?.basePic" class="btn-aree-center d-flex flex-cln a-c j-c">
                                     <image class="w-52 h-52 mb-10" src="@/static/images/plant/base/draw_area_icon.png" mode="widthFix" />
@@ -115,7 +182,7 @@
                                 <view class="f-s-30 c-#666">基地范围</view>
                             </view>
                             <view class="bg-#ccc d-flex ov-hd p-rtv" @click="mapDrawArea">
-                                <image class="w-full h-380" v-if="form.baseInfo.gapInfo?.basePic" :src="form.baseInfo.gapInfo.basePic" mode="widthFix" />
+                                <image class="w-full" v-if="form.baseInfo.gapInfo?.basePic" :src="form.baseInfo.gapInfo.basePic" mode="widthFix" />
                                 <image class="w-full h-380" v-else src="@/static/images/plant/base/select_base_gap.png" mode="widthFix" />
                                 <view v-if="!form.baseInfo.gapInfo?.basePic" class="btn-aree-center d-flex flex-cln a-c j-c">
                                     <image class="w-52 h-52 mb-10" src="@/static/images/plant/base/draw_area_icon.png" mode="widthFix" />
@@ -637,8 +704,6 @@ const submitForm = async () => {
 
 const mapDrawArea = async () => {
     uni.$on('mapAreaData', (data: any) => {
-        console.log(data);
-
         // 这里可以将 data 赋值给 form 中的相应字段
         form.value.baseInfo.gapInfo.basePic = data.gapInfo.basePic;
         form.value.baseInfo.gapInfo.area = String(data.gapInfo.area);
@@ -709,7 +774,7 @@ const selectGapInfo = () => {
     uni.$on('selectGapInfo', (item: any) => {
         console.log(item);
         form.value.baseInfo.gapId = item.id || undefined;
-        form.value.baseInfo.gapBaseInfo = item;
+        form.value.baseInfo.gapInfo = item;
         uni.$off('selectGapInfo');
     });
     uni.$u.route({
@@ -720,6 +785,16 @@ const selectGapInfo = () => {
         },
     });
 };
+const removeGapInfo = () => {
+    form.value.baseInfo.gapId = undefined;
+    form.value.baseInfo.gapInfo = {
+        adcode: '',
+        adcodeName: '',
+        address: '',
+        areaUnit: mapUnitByBaseType[form.value.baseInfo.baseType],
+        area: undefined,
+    };
+};
 const confirmArea = (area: any) => {
     form.value.baseInfo.gapInfo.adcodeName = area.fullName;
 };
@@ -799,4 +874,12 @@ const mapUnitByBaseType: any = {
     border: 1rpx solid rgba($u-primary, 0.4);
     border-radius: 10rpx;
 }
+.gap-info-card {
+    border: 1rpx solid rgba($u-primary, 0.4);
+    .card-close {
+        position: absolute;
+        top: 0rpx;
+        right: 0rpx;
+    }
+}
 </style>