feat

pyt

2025-03-17 5f55564fe91bc7aab00a9f773c04196b95b48517

 H5/pages/authentication/authentication.vue

@@ -1,15 +1,15 @@
<template>
   <view class="content">
      <!--    <view class="">
      <view v-if="info.auditStatus === 2" class="">
         <view class="flex a-center color2 fs-44 font-bold">
            <image src="/static/info/审核不通过@2x.png" mode="aspectFill" class="w-46 h-46 mr-15 ml-31"></image>
            审核不通过
         </view>
         <view class="fs-27 color2 lh-38 ml-27 mt-15 mb-23">
            信息填写不规范，请重新填写
            {{ info.refuseReason }}
         </view>
      </view> -->
      <view class="">
      </view>
      <view v-if="info.auditStatus === 0" class="">
         <view class="flex a-center color2 fs-44 font-bold pb-38">
            <image src="/static/info/审核中@2x.png" mode="aspectFill" class="w-46 h-46 mr-15 ml-31"></image>
            审核中
@@ -21,15 +21,17 @@
               姓名
            </view>
            <view class="value">
               <input type="text" placeholder="请输入姓名" placeholder-class="placeholderStyle" class="fs-27" />
               <input type="text" v-model="form.name" :disabled="disable" placeholder="请输入姓名"
                  placeholder-class="placeholderStyle" class="fs-27" />
            </view>
         </view>
         <view class="formItem border1">
            <view class="label">
               身份证号
            </view>
            <view class="value">
               <input type="text" placeholder="请输入身份证号" placeholder-class="placeholderStyle" class="fs-27" />
            <view class="value flex1">
               <input type="text" v-model="form.idNumber" :disabled="disable" placeholder="请输入身份证号"
                  placeholder-class="placeholderStyle" class="fs-27" />
            </view>
         </view>
         <view class="formItem border1">
@@ -37,8 +39,9 @@
               服务社区
            </view>
            <view @tap.stop="showSelectCommunity" class="value flex j-between a-center flex1">
               <text class="placeholderStyle">请选择服务社区</text>
               <image src="/static/Appeal/left.png" mode="aspectFill" class="h-19 w-19"></image>
               <text v-if="address">{{ address }}</text>
               <text v-else class="placeholderStyle">请选择服务社区</text>
               <image src="/static/Appeal/left.png" mode="aspectFill" class="h-19 w-19 ml-10"></image>
            </view>
         </view>
         <view class="formItem border1">
@@ -46,7 +49,8 @@
               服务对象
            </view>
            <view class="value">
               <input type="text" placeholder="请输入服务对象" placeholder-class="placeholderStyle" class="fs-27" />
               <input type="text" v-model="form.serviceTarget" :disabled="disable" placeholder="请输入服务对象"
                  placeholder-class="placeholderStyle" class="fs-27" />
            </view>
         </view>
         <view class="formItem border1">
@@ -54,7 +58,8 @@
               所在党组织
            </view>
            <view class="value">
               <input type="text" placeholder="请输入所在党组织" placeholder-class="placeholderStyle" class="fs-27" />
               <input type="text" v-model="form.partyOrganization" :disabled="disable" placeholder="请输入所在党组织"
                  placeholder-class="placeholderStyle" class="fs-27" />
            </view>
         </view>
         <view class="color1 fs-27 mt-35 ml-31">
@@ -74,41 +79,41 @@
            <!--    <view v-if="imgUrls.includes('loading')" class="w-140 h-140 flex a-center j-center mr-15 border2 br-8">
               <u-loading-icon></u-loading-icon>
            </view> -->
            <image @tap="uploadImg(1)" src="/static/Appeal/add.png" class="w-140 h-140 shrink0" />
         </view>
         <view class="h-146">

         </view>
         <!-- <view class="h-212">
				
         </view> -->
            <image v-if="localImageUrls.length == 0" @tap="uploadImg(1)" src="/static/Appeal/add.png"
               class="w-140 h-140 shrink0" />
      </view>

      <view class="footerButton">
         <view class="btns">
            <view class="ok fs-35 font-bold">
               保存
            </view>
         </view>
      </view>
         <view v-if="detail == 1" class="h-212">

      <!-- <view class="footer">
         </view>
         <view v-else class="h-146">

         </view>
      </view>
      <view v-if="detail == 1" class="footer">
         <view class="tip">
            可编辑后重新提交审核！
         </view>
         <view class="btns">
            <view class="cancel">
            <view class="cancel" @click="back">
               关闭
            </view>
            <view class="ok">
               编辑
            <view class="ok" @click="save">
               {{ disable ? '编辑' : '保存' }}
            </view>
         </view>
      </view> -->

      </view>
      <view v-else class="footerButton">
         <view class="btns">
            <view @click="save" class="ok fs-35 font-bold">
               保存
            </view>
         </view>
      </view>
      <!-- 选择服务社区 -->
      <u-popup :show="selectPopup" round="16rpx" :close-on-click-overlay="false" @open="openSelectPopup">
         <view class="relative">
      <u-popup :show="selectPopup" round="16rpx" @close="selectPopup = false" :safe-area-inset-bottom="false"
         @open="openSelectPopup">
         <view class="relative pb-40">
            <image @tap.stop="selectPopup = false" src="@/static/closeImg.png" class="w-35 h-35 absolute"
               style="right: 31rpx;top: 46rpx;" />
            <view class="txt-center pt-38 pb-40 fs-35 lh-48 font-bold">请选择服务社区</view>
@@ -118,32 +123,46 @@
               <view class="flex1">社区</view>
            </view>
            <view class="mb-20">
               <picker-view :value="value" @change="bindChange" class="picker-view">
               <picker-view :value="value" @change="bindChange" class="picker-view" immediate-change>
                  <picker-view-column>
                     <view class="item" v-for="(item, index) in county" :key="index">
                        {{ item }}
                        {{ item.name }}
                     </view>
                  </picker-view-column>
                  <picker-view-column>
                     <view class="item" v-for="(item, index) in street" :key="index">
                        {{ item }}
                        {{ item.name }}
                     </view>
                  </picker-view-column>
                  <picker-view-column>
                     <view class="item" v-for="(item, index) in community" :key="index">
                        {{ item }}
                        {{ item.name }}
                     </view>
                  </picker-view-column>
               </picker-view>
            </view>
            <view class="submitBtn">确认</view>
            <view class="submitBtn" @click="chooseCommunity">确认</view>
         </view>
      </u-popup>
      <CustomPopup ref="savePop" :isOneBtn="true" @comfirm="back">
         <view class="txt-center fs-31 lh-42 pt-44 pb-35 color5">
            <view class="">
               提交成功，党员信息已提交平
            </view>
            台审核！
         </view>
      </CustomPopup>
   </view>
</template>

<script>
   import config from '@/config/index.js'
   import {
      getRegionTree,
      apply,
      getDetail,
      edit
   } from './service.js'
   export default {
      data() {
         return {
@@ -151,80 +170,264 @@
            localImageUrls: [],
            selectPopup: false,
            value: [0, 0, 0],
            confirmValue: [0, 0, 0],
            county: [], //区县
            street: [], //街道
            community: [], //社区
            form: {},
            address: '',
            detail: '',
            disable: false,
            info: {},
            loading: false, // 新增加载状态
            uploading: false // 新增上传状态
         }
      },
      onLoad(e) {
         this.getTree()
         if (e.detail == 1) {
            this.detail = e.detail
            this.disable = true
         }
         if (e.detail == 2) {
            this.detail = e.detail
         }
      },
      methods: {
         bindChange(e) {
         // 返回小程序主页
         back() {
            let userInfo = uni.getStorageSync('userInfo')
            if (userInfo.isAdmin) {
               uni.navigateBack()
            }
         },
         // 提交（优化后）
         async save() {
            if (this.detail && this.disable) {
               this.disable = false
               return
            }
            if (this.loading) return;
            this.loading = true;

            try {
               // 必填字段校验
               const requiredFields = [{
                     field: this.form.name?.trim(),
                     message: '请输入姓名'
                  },
                  {
                     field: this.form.idNumber?.trim(),
                     message: '请输入身份证号'
                  },
                  {
                     field: this.form.districtsCode,
                     message: '请选择区县'
                  },
                  {
                     field: this.form.streetId,
                     message: '请选择街道'
                  },
                  {
                     field: this.form.communityId,
                     message: '请选择社区'
                  },
                  {
                     field: this.imgUrls[0],
                     message: '请上传头像'
                  }
               ];

               const invalidField = requiredFields.find(({
                  field
               }) => !field);
               if (invalidField) {
                  uni.showToast({
                     title: invalidField.message,
                     icon: 'none'
                  });
                  return;
               }

               // 身份证格式校验
               if (!this.validateIdNumber(this.form.idNumber)) {
                  uni.showToast({
                     title: '身份证号码格式不正确',
                     icon: 'none'
                  });
                  return;
               }

               this.form.avatar = this.imgUrls[0];
               if (this.detail) {
                  await edit(this.form);
                  this.loading = false;
               } else {
                  await apply(this.form);
                  this.loading = false;
               }
               this.$refs.savePop.showPopup();
            } catch (error) {
               uni.showToast({
                  title: '提交失败，请重试',
                  icon: 'none'
               });
            } finally {
               this.loading = false;
            }
         },

         // 新增身份证验证方法
         validateIdNumber(id) {
            const reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
            return reg.test(id);
         },
         //选择服务社区
         chooseCommunity() {
            this.form.districts = this.county[this.value[0]].name
            this.form.districtsCode = this.county[this.value[0]].id
            this.form.street = this.street[this.value[1]].name
            this.form.streetId = this.street[this.value[1]].id
            this.form.community = this.community[this.value[2]].name
            this.form.communityId = this.community[this.value[2]].id

            this.address = `${this.form.districts}-${this.form.street}-${this.form.community}`;
            this.confirmValue = this.value
            this.selectPopup = false
         },
         // 获取社区树结构（优化后）
         async getTree() {
            try {
               let userInfo = uni.getStorageSync('userInfo');
               const res = await getRegionTree();
               if (this.detail) {
                  const res1 = await getDetail();
                  this.info = res1.data
                  userInfo = res1.data
                  this.form.name = userInfo.name
                  this.form.idNumber = userInfo.idNumber
                  this.form.serviceTarget = userInfo.serviceTarget
                  this.form.partyOrganization = userInfo.partyOrganization
                  this.form.avatar = userInfo.avatar
                  this.localImageUrls = [userInfo.avatar]
                  this.imgUrls = [userInfo.avatar]
               }
               this.county = res.data;
               if (userInfo?.districtsCode && userInfo?.streetId && userInfo?.communityId) {
                  const index1 = this.county.findIndex(item => userInfo.districtsCode === item.id);
                  if (index1 !== -1) {
                     this.street = this.county[index1].children;
                     const index2 = this.street.findIndex(item => userInfo.streetId === item.id);
                     if (index2 !== -1) {
                        this.community = this.street[index2].children;
                        const index3 = this.community.findIndex(item => userInfo.communityId === item.id);
                        if (index3 !== -1) {
                           this.confirmValue = [index1, index2, index3];
                           this.form = {
                              ...this.form,
                              districts: this.county[index1].name,
                              districtsCode: this.county[index1].id,
                              street: this.street[index2].name,
                              streetId: this.street[index2].id,
                              community: this.community[index3].name,
                              communityId: this.community[index3].id
                           };
                           this.address = `${this.form.districts}-${this.form.street}-${this.form.community}`;
                        }
                     }
                  }
               }
            } catch (error) {
               uni.showToast({
                  title: '获取社区信息失败',
                  icon: 'none'
               });
            }
         },
         // 切换社区
         bindChange(e, index) {
            if (e.detail.value[0] != this.value[0]) {
               e.detail.value[1] = 0
               e.detail.value[2] = 0
            }
            if (e.detail.value[1] != this.value[1]) {
               e.detail.value[2] = 0
            }
            this.value = e.detail.value
            this.street = this.county[this.value[0]].children
            this.community = this.street[this.value[1]].children
         },
         showSelectCommunity() {
            if (!this.disable) {
            this.selectPopup = true
            }
         },
         delImg(item) {
            if (!this.disable) {
            this.localImageUrls = this.localImageUrls.filter(i => i != item)
            this.imgUrls = this.imgUrls.filter(i => i != item)
            }
         },
         viewImage(item) {
            uni.previewImage({
               urls: [item]
            })
         },
         // 图片上传（优化后）
         uploadImg() {
            if (this.uploading || this.disable) return;
            this.uploading = true;

            uni.chooseImage({
               count: 1,
               success: (chooseImageRes) => {
                  this.imgUrls.push('loading')
                  let imgPathList = chooseImageRes.tempFilePaths;
               success: async (chooseImageRes) => {
                  try {
                     this.imgUrls.push('loading');
                     const imgPathList = chooseImageRes.tempFilePaths;
                  if (imgPathList.length > 0) {
                     uni.uploadFile({
                        const res = await uni.uploadFile({
                        url: config.imageUrl,
                        filePath: imgPathList[0],
                        timeout: 1000 * 45,
                        name: 'file',
                        header: {
                           Authorization: uni.getStorageSync('token')
                        },
                        success: (res) => {
                           if (JSON.parse(res.data).code == 200) {
                              this.imgUrls = this.imgUrls.filter(item => item !=
                                 'loading')
                              this.$nextTick(() => {
                                 this.imgUrls.push(JSON.parse(res.data)
                                    .data)
                                 this.localImageUrls.push(imgPathList[0])
                              })
                           }
                        });

                        const data = JSON.parse(res.data);
                        if (data.code === 200) {
                           this.imgUrls = this.imgUrls.filter(item => item !== 'loading');
                           this.imgUrls.push(data.data);
                           this.localImageUrls.push(imgPathList[0]);
                           } else {
                              this.imgUrls = this.imgUrls.filter(
                                 item => item != 'loading')
                           throw new Error('上传失败');
                        }
                     }
                  } catch (error) {
                     this.imgUrls = this.imgUrls.filter(item => item !== 'loading');
                              uni.showToast({
                                 title: '上传失败，请重新上传',
                                 icon: 'none',
                                 mask: true
                              })
                     });
                           }
                        },
                        fail: (err) => {
                           this.imgUrls = this.imgUrls.filter(
                              item => item != 'loading')
               fail: () => {
                           uni.showToast({
                              title: '上传失败，请重新上传',
                              icon: 'none',
                              mask: true
                           })
                        }
                     })
                  }
                     title: '选择图片失败',
                     icon: 'none'
                  });
               },
               fail: () => {}
            })
               complete: () => {
                  this.uploading = false;
               }
            });
         },
         openSelectPopup() {
            this.county = ['仁和区']
            this.street = ['仁和镇']
            this.community = ['仁和街社区']
            this.value = this.confirmValue
            this.street = this.county[this.value[0]].children
            this.community = this.street[this.value[1]].children
         }
      }
   }
@@ -338,6 +541,14 @@
      color: #fff;
   }

   .color5 {
      color: #666160;
   }

   .bgcolor5 {
      background-color: rgba(0, 0, 0, .23);
   }

   .placeholderStyle {
      color: #B2B2B2;
   }