Merge branch 'master' of http://139.196.74.78:10010/r/jagzwxm/ja_web

shuishen

2026-01-17 86c2d61ba9d33f1886cfc904dcaf17f033e4c80a

 uniapps/work-wx/src/subPackages/deviceRegistration/add.vue

@@ -144,45 +144,70 @@
        <u-form-item
                label="所属区域"
                labelWidth="230rpx"
                prop="serialNumber"
                prop="regionCode"
                :borderBottom="true"
                ref="item2"
                @click="isShowRegion = true"
        >
            <view class="select-wrapper">
                <u-input
                        v-model="formParams.serialNumber"
                        border="none"
                        placeholder="请选择"
                        readonly
                ></u-input>
                <view class="select-icon">▼</view>
            </view>
            <u-input
                v-model="formParams.regionText"
                disabled
                disabledColor="#ffffff"
                placeholder="请选择所属区域"
                border="none"
            ></u-input>
            <template #right>
                <up-icon name="arrow-down"></up-icon>
            </template>
        </u-form-item>
        <u-form-item
                label="民用航空器登记证书"
                labelWidth="300rpx"
                prop="aircraftName"
                prop="caacRegistrationCodeText"
                :borderBottom="true"
                ref="item1"
        >
            <u-input
                    v-model="formParams.aircraftName"
                    v-model="formParams.caacRegistrationCodeText"
                    border="none"
                    placeholder="请输入"
            ></u-input>
            <template #right>
                <u-upload
                    @afterRead="afterReadFile"
                    @delete="deletePic"
                    name="6"
                    multiple
                    :maxCount="1"
                >
                    <view class="upload">上传文件</view>
                </u-upload>
            </template>
        </u-form-item>
        <u-form-item
                label="飞行器照片"
                labelWidth="200rpx"
                prop="aircraftName"
                prop="deviceImageText"
                :borderBottom="true"
                ref="item1"
        >
            <u-input
                    v-model="formParams.aircraftName"
                    v-model="formParams.deviceImageText"
                    border="none"
                    placeholder="请输入"
            ></u-input>
            <template #right>
                <u-upload
                    @afterRead="afterReadImage"
                    @delete="deletePic"
                    name="6"
                    multiple
                    :maxCount="1"
                    accept="image"
                >
                    <view class="upload">上传图片</view>
                </u-upload>
            </template>
        </u-form-item>
        <u-form-item
                label="备注"
@@ -197,58 +222,66 @@
                    placeholder="请输入"
            ></u-input>
        </u-form-item>
        <u-button
                type="primary"
                size="small"
                @click="submitForm"
            >
                提交
            </u-button>
        <!-- 飞行器型号 -->
        <u-picker
            :show="showType"
            :columns="[typeList]"
            keyName="label"
            @confirm="onPickerConfirmType"
            @cancel="showType = false"
        />
        <!-- 飞行器厂商 -->
        <u-picker
            :show="showManufacturer"
            :columns="[manufacturerList]"
            keyName="label"
            @confirm="onPickerConfirmManufacturer"
            @cancel="showManufacturer = false"
        />
        <u-picker
            :show="showIsModified"
            :columns="[actionsModified]"
            keyName="label"
            @confirm="onPickerConfirm"
            @cancel="showIsModified = false"
        />
        <u-picker
            :show="showHasInsurance"
            :columns="[actionsHasInsurance]"
            keyName="label"
            @confirm="onPickerConfirmHasInsurance"
            @cancel="showHasInsurance = false"
        />
        <u-datetime-picker
        :show="showPurchaseDate"
        v-model="birthdayValue"
        mode="date"
        @confirm="onPurchaseDate"
        @cancel="showPurchaseDate = false"
        />
        <!-- 所属区域 -->
        <u-cascader 
            :show="isShowRegion"
            v-model="formParams.regionCode"
            :data="areaData"
            value-key="code"
         label-key="name"
         children-key="children"
            :auto-close="true"
            @confirm="onRegionConfirm"
            @close="isShowRegion = false"
            @cancel="isShowRegion = false"
        ></u-cascader>
    </u-form>
    <!-- 飞行器型号 -->
    <u-picker
        :show="showType"
        :columns="[typeList]"
        keyName="label"
        @confirm="onPickerConfirmType"
        @cancel="showType = false"
    />
    <!-- 飞行器厂商 -->
    <u-picker
        :show="showManufacturer"
        :columns="[manufacturerList]"
        keyName="label"
        @confirm="onPickerConfirmManufacturer"
        @cancel="showManufacturer = false"
    />
    <u-picker
        :show="showIsModified"
        :columns="[actionsModified]"
        keyName="label"
        @confirm="onPickerConfirm"
        @cancel="showIsModified = false"
    />
    <u-picker
        :show="showHasInsurance"
        :columns="[actionsHasInsurance]"
        keyName="label"
        @confirm="onPickerConfirmHasInsurance"
        @cancel="showHasInsurance = false"
    />
    <u-datetime-picker
      :show="showPurchaseDate"
      v-model="birthdayValue"
      mode="date"
      @confirm="onPurchaseDate"
      @cancel="showPurchaseDate = false"
    />


    <u-button @click="submitForm" color="#1D6FE9">提交</u-button>
    <!-- <u-button class="submit-button-wrapper" color="#1D6FE9" size="large" @click="submitForm">
            注册
        </u-button> -->
</view>
</template>
<script setup>
import { aircraftInfoSaveApi } from '@/api/index'
import { ref, computed } from 'vue'
import { aircraftInfoSaveApi,uploadFileApi,areaDataApi } from '@/api/index'
import { ref, computed, onMounted } from 'vue'
import dayjs from 'dayjs'

const formRef = ref(null);
@@ -269,8 +302,12 @@
    hasInsurance: '', // 是否有保险
    hasInsuranceText: '', // 是否有保险文本
    region: '', // 所属区域
    regionCode: '', // 所属区域
    regionText: '', // 所属区域文本
    caacRegistrationCode: '', // 民用航空器登记证书
    caacRegistrationCodeText: '', // 民用航空器登记证书文本
    deviceImage: '', // 飞行器照片
    deviceImageText: '', // 飞行器照片文本
    remarks: '', // 备注
})

@@ -315,6 +352,38 @@
const onPurchaseDate = (e) => {
    formParams.value.purchaseDate = dayjs(e.value).format('YYYY-MM-DD')
    showPurchaseDate.value = false
}

const findRegionNamesByCodes = (codes, areaData) => {
  const result = []
  let currentData = areaData
  
  for (const code of codes) {
    // 转换为字符串比较（因为code可能是字符串类型）
    const codeStr = code.toString()
    const item = currentData.find(item => item.code === codeStr)
    
    if (!item) {
      console.warn(`未找到code为 ${codeStr} 的行政区划`)
      break
    }
    
    result.push(item.name)
    currentData = item.children || []
  }
  
  return result
}

// 所属区域确认
const onRegionConfirm = (e) => {
    console.log(e,'888')
    formParams.value.region = e?.join(',')[2] || '' // 用逗号分隔的区域码
    // 通过arrRegion的数组值为[36,3608,360824] 从areaData里面反查出名称
    const regionNames = findRegionNamesByCodes(e, areaData.value)
    console.log(regionNames, '77777')
    formParams.value.regionText = regionNames.join('-') || '' // 用连字符连接的区域名称
    isShowRegion.value = false  
}
// 是否有保险
const actionsHasInsurance = ref([
@@ -372,6 +441,124 @@
  formParams.value.typeText = selected.label
  showType.value = false
}
// 提交文件
function afterReadFile(event) {
    // 获取上传的文件对象
    const file = event.file;
    console.log('上传的文件:', file);
    
    // 显示加载提示
    uni.showLoading({
        title: '上传中...'
    });
    
    // 准备上传参数
    const uploadParams = {
        name: 'file', // 服务器端接收文件的字段名
        file: file, // 传入文件对象
        filePath: file.path || file.url, // 文件路径
    };
    
    // 调用上传文件接口
    uploadFileApi(uploadParams).then(res => {
        uni.hideLoading();
        
        console.log('上传成功结果:', res);
        
        // 根据接口返回的数据结构处理结果
        if (res.data && res.data.code === 200) {
            // 假设接口返回的数据结构是 { url, fileName } 等
            const uploadResult = res.data.data;
            
            // 更新表单数据，将上传结果展示在input内
            formParams.value.caacRegistrationCodeText = uploadResult.fileName || uploadResult.url || '文件上传成功';
            
            // 可以将完整的上传信息保存到表单中，以便提交时使用
            formParams.value.caacRegistrationCode= uploadResult.fileUrl || '文件上传成功';
            
            uni.showToast({
                title: '上传成功',
                icon: 'success'
            });
        } else {
            uni.showToast({
                title: res.msg || '上传失败',
                icon: 'none'
            });
        }
    }).catch(err => {
        uni.hideLoading();
        console.error('上传失败:', err);
        uni.showToast({
            title: '上传失败',
            icon: 'none'
        });
    });
}
// 获取所属单位
const isShowRegion = ref(false)
const areaData = ref([])
// function getAreaData() {
//     areaDataApi().then(res => {
//         if (res.data.code === 200) {
//             areaData.value = res.data.data
//         }
//     })
// }
// 提交图片
function afterReadImage(event) {
    // 获取上传的文件对象
    const file = event.file;
    console.log('上传的文件:', file);
    
    // 显示加载提示
    uni.showLoading({
        title: '上传中...'
    });
    
    // 准备上传参数
    const uploadParams = {
        name: 'file', // 服务器端接收文件的字段名
        file: file, // 传入文件对象
        filePath: file.path || file.url, // 文件路径
    };
    
    // 调用上传文件接口
    uploadFileApi(uploadParams).then(res => {
        uni.hideLoading();
        
        console.log('上传成功结果:', res);
        
        // 根据接口返回的数据结构处理结果
        if (res.data && res.data.code === 200) {
            // 假设接口返回的数据结构是 { url, fileName } 等
            const uploadResult = res.data.data;
            
            // 更新表单数据，将上传结果展示在input内
            formParams.value.deviceImageText = uploadResult.fileName || uploadResult.url || '文件上传成功';
            
            // 可以将完整的上传信息保存到表单中，以便提交时使用
            formParams.value.deviceImage= uploadResult.fileUrl || '文件上传成功';
            
            uni.showToast({
                title: '上传成功',
                icon: 'success'
            });
        } else {
            uni.showToast({
                title: res.msg || '上传失败',
                icon: 'none'
            });
        }
    }).catch(err => {
        uni.hideLoading();
        console.error('上传失败:', err);
        uni.showToast({
            title: '上传失败',
            icon: 'none'
        });
    });
}
// 提交表单
const submitForm = async () => {
    try {
@@ -399,10 +586,39 @@
        // 这里可以添加额外的失败处理逻辑
    }
}
onMounted(async () => {
    // 动态导入xzqhData，确保在使用前已初始化
    const { xzqhData } = await import('@/static/xzqh/index')
    // console.log(xzqhData,'9999')
    // xzqhData.map 循环三层
    // 第一层：省份
    // 第二层：城市
    // 第三层：区县
    areaData.value = xzqhData
    // xzqhData.map(item => ({
    //     label: item.name,
    //     value: item.code,
    //     children: item.children.map(child => ({
    //         label: child.name,
    //         value: child.code,
    //         children: child.children?.map(district => ({
    //             label: district.name,
    //             value: district.code
    //         })) || []
    //     }))
    // }))
    // console.log(areaData.value, '8888')
    
})
</script>
<style scoped lang="scss">
.deviceRegistration {
    padding: 24rpx;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    // padding: 24rpx;
    
    .select-wrapper {
        position: relative;
        width: 100%;
@@ -417,6 +633,29 @@
            pointer-events: none;
        }
    }

    .upload {
        font-family: Source Han Sans CN, Source Han Sans CN;
        font-weight: 400;
        font-size: 15px;
        color: #1D6FE9;
    }

    :deep(.u-form) {
        flex: 1;
        display: flex;
        flex-direction: column;
        overflow-y: auto;
        box-sizing: border-box;
        padding: 24rpx;
    }

    :deep(.u-button) {
        width: 80%;
        padding: 28rpx;
        border-radius: 8rpx 8rpx 8rpx 8rpx;
        margin-bottom: 20rpx;
    }
    
    :deep(.u-form-item) {
        margin-bottom: 40rpx;