apply-assistant-v3/root/detail/fellow.vue

<template>
  <view class="p-root-detail-fellow g_w_all g_h_all g_bg_f_5 g_kuaishou">
    <view v-if="speed == 0">
      <g-loading />
    </view>
    <view v-if="speed == 1">
      <view class="g_h_10"></view>
      <view class="m-photo">
        <g-panel-card-info :info="{
						avatar: cdnBaseImg + 'mock_photo.svg',
						title: '拍照或相册上传',
						num: '系统智能识别并自动填写',
						titleFS: 16,
						imgSize: 72,
					}" radius="0" rightType="image" :rightImage="info.idCardImageUrl" @clickCard="handleClickInfo" />
      </view>
      <view class="g_h_10"></view>
      <g-panel-form-slot :list="[
					{
						icon: '',
						label: '联系电话',
						result: '',
						path: '',
						tip: 'tel',
						type: 'slot',
						pColumn: 12,
					},
				]">
        <slot>
          <!-- #ifdef APP-PLUS || H5 || MP-TOUTIAO || MP-KUAISHOU -->
          <u-input type="number" :clearable="false" :password-icon="false" placeholder="请输入联系电话" input-align="right" class="g_text_r g_w_all" placeholder-style="color:#cccccc;font-size:32rpx;line-height:1" v-model="info.tel" style="width: calc(100vw - (122px);flex: none;" />
          <!-- #endif -->
          <!-- #ifdef MP-WEIXIN -->
          <u-input type="number" :clearable="false" :password-icon="false" placeholder="请输入联系电话" input-align="right" class="g_text_r g_w_all" placeholder-style="color:#cccccc;font-size:32rpx;line-height:1" v-model="info.tel" />
          <!-- #endif -->
        </slot>
      </g-panel-form-slot>
      <view class="g_h_10"></view>
      <g-panel-form-slot
        :list="[
				{
						icon: '',
						label: '姓名',
						result: '',
						value: info.name,
						path: '',
						tip: 'slot-upID',
						img: info.idCardImageUrl,
						placeholder: '手动输入或拍照自动识别 → ',
						type: 'slot',
						pColumn: 8,
						require: true,
					},
					{
						icon: '',
						label: '性别',
						result: '',
						value: info.sex,
						path: '',
						tip: 'slot-sex',
						type: 'slot',
						pColumn: 12,
						require: false,
						customRequire: true,
					},
					{
						icon: '',
						label: '年龄',
						result: '',
						value: info.age,
						path: '',
						tip: 'slot-age',
						placeholder: '请输入年龄',
						type: 'slot',
						pColumn: 12,
						require: false,
					},
					{
						icon: '',
						label: '民族',
						result: '',
						value: info.nation,
						nationIndex: nationIndex,
						path: '',
						tip: 'slot-nation',
						pColumn: 12,
						type: 'slot',
					},
					{
						icon: '',
						label: '身份证号',
						result: '',
						value: info.idCard,
						path: '',
						tip: 'slot-code-idcard',
						placeholder: '请输入身份证号',
						type: 'slot',
						pColumn: 12,
					},
					{
						icon: '',
						label: '家庭住址',
						result: '',
						value: info.address,
						placeholder: '请输入家庭住址',
						path: '',
						tip: 'slot-address',
						type: 'slot',
						pColumn: 12,
					},
				]"
        @changeName="handleClickName"
        @changeSex="handleClickSex"
        @changeAge="handleClickAge"
        @changeNation="handleClickNation"
        @changeIDcard="handleClickIDcard"
        @changeAddress="handleClickAddress"
      ></g-panel-form-slot>
      <g-panel-fixed>
        <slot>
          <view class="g_flex_row_center">
            <g-button btnText="取消" class="g_mr_16" size="small" type="default" @clickBtn="goReturn"></g-button>
            <g-button btnText="确定" class @clickBtn="handleSubmit" size="small" type="primary"></g-button>
          </view>
        </slot>
      </g-panel-fixed>
    </view>
  </view>
</template>

<script>
import { nationlist } from '../../utils/nation.js'
export default {
  onReady() {
    this.G.setNavStyle()
  },
  onShareAppMessage() {
    return this.G.shareFun()
  },
  data() {
    return {
      cdnBaseImg: this.G.store().cdnBaseImg,
      speed: 0,
      info: {},
      nation: nationlist.map((item, index) => {
        return item.name
      }),
      nationIndex: 0,
    }
  },
  onLoad(options) {
    let that = this
    if (options) {
      this.info = options
      if (options.sex) {
        options.sex = Number(options.sex)
      } else {
        options.sex = 1
      }
      that.nation.forEach((item, index) => {
        if (item == that.info.nation) {
          console.log(that.info.nation)
          console.log(index)
          that.nationIndex = index
        }
      })
      that.speed = 0
      setTimeout(() => {
        that.speed = 1
      }, 300)
      console.log('获取老乡信息：', options)
    }
  },
  onShow() {
    let that = this
  },
  created() {
    let that = this
  },
  methods: {
    handleClickName(e) {
      this.info.name = this.info.userName = e
    },
    handleClickSex(e) {
      this.info.sex = e
    },
    handleClickAge(e) {
      this.info.age = e
    },
    handleClickNation(e) {
      let that = this
      console.log(e.name)
      this.info.nation = e.name
      that.nation.forEach((item, index) => {
        if (item == e.name) {
          // console.log(that.info.nation)
          // console.log(index)
          that.nationIndex = index
        }
      })
    },
    handleClickNation(e) {
      let that = this
      console.log(e.name)
      this.info.nation = e.name
      that.nation.forEach((item, index) => {
        if (item == e.name) {
          // console.log(that.info.nation)
          // console.log(index)
          that.nationIndex = index
        }
      })
    },
    handleClickIDcard(e) {
      this.info.idCard = e
    },
    handleClickAddress(e) {
      this.info.address = e
    },
    goReturn() {
      uni.navigateBack()
    },
    handleSubmit() {
      let that = this
      if (!that.G.setReg(that.info.tel, 'tel')) {
        uni.showToast({
          icon: 'none',
          title: '请输入正确的手机号',
        })
        return false
      }

      if (!that.G.setReg(that.info.idCard, 'idcard')) {
        uni.showToast({
          icon: 'none',
          title: '请输入正确的身份证号',
        })
        return false
      }

      if (!that.info.nation) {
        that.info.nation = '汉族'
      }
      that.G.Post(that.api.order_submitFellow, that.info, (res) => {
        uni.showToast({
          icon: 'success',
          title: '保存成功',
        })
        setTimeout(() => {
          that.goReturn()
        }, 300)
      })
    },
    handleClickInfo() {
      let that = this
      that.G.uploadImg((res) => {
        that.info.name = res.info.name
        that.info.sex = res.info.sex
        that.info.age = res.info.age
        that.info.nation = res.info.nationality
        that.info.idCard = res.info.num
        that.info.idCardImageUrl = res.image
        that.info.userName = res.info.name
        that.info.address = res.info.address
        that.nation.forEach((item, index) => {
          if (item == that.info.nation) {
            that.nationIndex = index
          }
        })
      }, 'idcard')
    },
  },
}
</script>

<style></style>