EditCompanyInfo.ets 8.6 KB
import AreaPickerDialog from '../dialog/AreaPickerDialog'
import { companyTest, companyData } from '../api/userType'
import preferencesUtil from '../utils/preferences'
import baseUrl from '../utils/baseUrl'
import { ValidateInputHandle } from '../utils/validateInputHandle'
import { updateCompanyInfo, getEmailCode, getCompanyInfo } from '../api/user'
import { promptAction } from '@kit.ArkUI';
import { AxiosResponse } from '@ohos/axios'
import PhotoBrowser from '../dialog/PhotoBrowserDialog'
import { uploadFile, uploadResult } from '../utils/uploadFile'
import { request } from '@kit.BasicServicesKit'
import NavHeader from '../components/NavHeader'
@Entry
@Component
struct EditUser {
  @Builder indicatorBuilder(icon: ResourceStr) {
    Image(icon)
  }
  @State isShowCode: boolean = false
  @State companyInfo: companyData = JSON.parse(preferencesUtil.get('XF_COMPANY_INFO', '') as string)
  @State pickerValue:string[] = [this.companyInfo.province, this.companyInfo.city, this.companyInfo.county] //省市区选中值
  @State photoList: string[] = [baseUrl + this.companyInfo.businessLicensePic]
  @State initEmail: string = this.companyInfo.email
  areaController: CustomDialogController = new CustomDialogController({
    builder: AreaPickerDialog({
      value: this.pickerValue,//首次默认选中值
      onChange: (value:string[]) => {//选择改变回调
        this.pickerValue = value
        this.companyInfo.address = this.pickerValue.join(' ')
        this.companyInfo.province = this.pickerValue[0]
        this.companyInfo.city = this.pickerValue[1]
        this.companyInfo.county = this.pickerValue[2]
      }
    }),
    customStyle: true
  })
  photoBrowserController: CustomDialogController = new CustomDialogController({
    builder: PhotoBrowser({ imagesList: this.photoList}),
    customStyle: true,
    offset: { dx: 0, dy: 0 },
    alignment: DialogAlignment.Top,
  })

  build() {
    Column(){
      NavHeader({title: '修改企业信息'})
      Column(){
        Column(){
          Row(){
            Row(){
              Image($r('app.media.require')).width(20)
              Text('公司名称')
            }.width(90)
            Text(this.companyInfo.companyName).layoutWeight(1).padding({top: 10, bottom: 10})
          }.border({width: {bottom: 1}, color: '#eee'}).padding({top: 10, bottom: 10})
          Row(){
            Row(){
              Image($r('app.media.require')).width(20)
              Text('邮箱')
            }.width(90)
            TextInput({placeholder: '请输入邮箱', text: $$this.companyInfo.email})
              .backgroundColor('#fff').layoutWeight(1).type(InputType.Email)
              .onChange((value) => {
                this.isShowCode = this.initEmail !== value
              })
          }.border({width: {bottom: 1}, color: '#eee'}).padding({top: 10, bottom: 10})
          Row(){
            Row(){
              Image($r('app.media.require')).width(20)
              Text('验证码')
            }.width(90)
            Row(){
              TextInput({placeholder: '请输入验证码', text: $$this.companyInfo.postCode})
                .backgroundColor('#fff').layoutWeight(1).type(InputType.Email)
              Text('获取验证码').fontSize(12).backgroundColor('#1890ff').borderRadius(5)
                .padding({top: 4, bottom: 4, left: 10, right: 10}).fontColor('#fff')
                .onClick(async () => {
                  await getEmailCode(this.companyInfo.email)
                  promptAction.showToast({
                    message: '已发送至邮箱,请查收'
                  })
                })
            }.layoutWeight(1)
          }.border({width: {bottom: 1}, color: '#eee'}).padding({top: 10, bottom: 10})
          .visibility(this.isShowCode ? Visibility.Visible : Visibility.None)
          Row(){
            Row(){
              Image($r('app.media.require')).width(20)
              Text('联系人')
            }.width(90)
            TextInput({placeholder: '请输入身份证号', text: $$this.companyInfo.linkMan})
              .backgroundColor('#fff').layoutWeight(1)
          }.border({width: {bottom: 1}, color: '#eee'}).padding({top: 10, bottom: 10})
          Row(){
            Row(){
              Image($r('app.media.require')).width(20)
              Text('联系人手机')
            }
            TextInput({placeholder: '请输入手机号', text: $$this.companyInfo.lmTel})
              .backgroundColor('#fff').layoutWeight(1).type(InputType.PhoneNumber)
          }.border({width: {bottom: 1}, color: '#eee'}).padding({top: 10, bottom: 10})
          Row(){
            Row(){
              Image($r('app.media.require')).width(20)
              Text('统一社会信用代码')
            }
            TextInput({placeholder: '请输入手机号', text: $$this.companyInfo.businessLicenseNo})
              .backgroundColor('#fff').layoutWeight(1)
              .showError(ValidateInputHandle(this.companyInfo.businessLicenseNo, 'businessLicenseNo') ? '' : '请正确输入社会统一信用代码')
          }.border({width: {bottom: 1}, color: '#eee'}).padding({top: 10, bottom: 10})
          Row(){
            Row(){
              Image($r('app.media.require')).width(20)
              Text('营业执照')
            }.width(90)
            Column({space: 5}){
              Image(baseUrl + this.companyInfo.businessLicensePic || $r('app.media.certificateCard')).width(80)
                .onClick(async () => {
                  let that = this
                  let uploader = await uploadFile() as request.UploadTask
                  // 3. 监控上传错误
                  uploader.on('fail', (err) => {
                    console.log('上传错误--->', JSON.stringify(err))
                  })
                  //   4. 获取服务器返回来的数据
                  uploader.on('headerReceive',(res)=>{
                    let uploadInfo = JSON.parse(res['body']) as uploadResult
                    that.companyInfo.businessLicensePic = uploadInfo.fileName as string
                  })
                })
              Text('请上传营业执照副本才是扫描件').fontSize(12).fontColor('#999')
              Text('图片大小: 1M以内,文件最大尺寸(px): 3508*2480').fontSize(12).fontColor('#666')
            }.layoutWeight(1).margin({left: 20}).alignItems(HorizontalAlign.Start)
          }.border({width: {bottom: 1}, color: '#eee'}).padding({top: 10, bottom: 10})
          Row(){
            Row(){
              Image($r('app.media.require')).width(20)
              Text('地址')
            }.width(70)
            Text(this.pickerValue.join(' ')).layoutWeight(1).padding({top: 8, bottom: 8, left: 16, right: 16})
              .backgroundColor('#fff').fontColor('#999').textOverflow({overflow: TextOverflow.Ellipsis}).maxLines(2)
              .onClick(() => {
                this.areaController?.open()
              })
          }.border({width: {bottom: 1}, color: '#eee'}).padding({top: 10, bottom: 10})
        }.backgroundColor('#fff').width('100%').padding({left: 5, right: 5}).borderRadius(10)
      }.padding(10).margin({bottom: 20, top: 10}).width('100%').layoutWeight(1)
      Row({ space: 10}){
        Text('提交').borderRadius(5).layoutWeight(1).height(30).fontColor('#fff')
          .backgroundColor('#1B65FD').fontSize(14).textAlign(TextAlign.Center)
          .onClick(async () => {
            if(this.companyInfo?.businessLicenseNo == '') {
              return promptAction.showToast({message: '社会统一代码不能为空'})
            } else if(this.companyInfo?.email == '') {
              return promptAction.showToast({message: '邮箱不能为空'})
            } else if(this.companyInfo?.linkMan == '') {
              return promptAction.showToast({message: '联系人不能为空'})
            } else if(this.companyInfo?.lmTel == '') {
              return promptAction.showToast({message: '手机号不能为空'})
            }

            await updateCompanyInfo(this.companyInfo)
            const info: AxiosResponse<companyTest> = await getCompanyInfo()
            preferencesUtil.set('XF_COMPANY_INFO', JSON.stringify(info.data.data))
            this.companyInfo = JSON.parse(preferencesUtil.get('XF_COMPANY_INFO', '') as string)
            promptAction.showToast({
              message: '修改成功',
              duration: 2000
            })
          })
        Text('图片预览').borderRadius(5).layoutWeight(1).height(30).fontColor('#fff')
          .backgroundColor('#1B65FD').fontSize(14).textAlign(TextAlign.Center)
          .onClick(async () => {
            this.photoBrowserController.open()
          })
      }.width('100%').height(40).backgroundColor('#fff').padding({left: 10, right: 10})
    }.width('100%').height('100%').backgroundColor('#f2f3f7')
  }
}