<template>
  <view class="page" v-if="loading">
    <view v-if="nowStatus == 40" class="stepBox" style="padding-top: 20px">
      <view v-if="ChooseidentityId == 1">
        <brandInformation ref="brandinfo" :datas="dataOne"></brandInformation>
      </view>
      <view v-if="ChooseidentityId == 2">
        <carrierInformation
          ref="carrierinfo"
          :datas="dataOne"
        ></carrierInformation>
      </view>
    </view>
    
	<companyInformation v-if="nowStatus != 1 && dataOne" :company="dataOne" @change="()=>nowStatus=1"></companyInformation>
	<template v-else>
		<view class="progressBox" v-if="nowStatus != 4">
		  <view class="progressName">
			<text class="cur" :style="{color:mainColor}">{{ stepName }}</text>
			<text class="nex">{{ nextSepName }}</text>
		  </view>
		  <u-line-progress
			class="progress"
			:percent="percent"
			:show-percent="false"
			:height="10"
			inactive-color="#DADCE6"
		   :active-color="mainColor"
		  ></u-line-progress>
		</view>
		<view> </view>

		<view class="stepBox" v-if="nowStatus != 4">
      <view class="stepItem" v-if="step == 1">
        <view
          style="width: 100%; display: flex"
          v-if="dataOne.CompanyStatus && dataOne.CompanyStatus == 2"
        >
          <u-icon name="warning-o" color="#F70027" size="50"></u-icon>
          <span style="margin-left: 10px; color: #f70027">审核未通过</span>
        </view>
        <view
          style="
            width: 100%;
            display: flex;
            margin-bottom: 20px;
            margin-top: 10px;
          "
          v-if="dataOne.CompanyStatus && dataOne.CompanyStatus == 2"
        >
          <span>原因:{{ dataOne.RejectRemark }}</span>
        </view>
        <view v-for="(item, index) in stepOneList" :key="index">
          <view class="itemBox">
            <view class="name">
              {{ item.name }}
              <text class="tip" v-if="item.tip">{{ item.tip }}</text>
            </view>
            <view class="con1" v-if="item.type == 1">
              <input v-if="item.field!='Mobile'"
                class="input"
                type="text"
                v-model="dataOne[item.field]"
                :placeholder="item.text"
                :disabled="nowStatus == 3 || nowStatus == 5 ? true : false"
                placeholder-style="color: #CECECEFF"
                @focus="inputFcous(item)"
              />
              <view v-else style="display: flex;">
                <input
                class="input"
                style="flex: 1;margin-right: 10px;"
                type="text"
                v-model="dataOne[item.field]"
                :placeholder="item.text"
                :disabled="nowStatus == 3 || nowStatus == 5 || isMobile ? true : false"
                placeholder-style="color: #CECECEFF"
                @focus="inputFcous(item)"
                />
                <view v-show="isMobile">
                  <button size="mini"
                  :class="[loadingMobile?'is-hoverPhone':'PhoneNumber']"
                  :loading="loadingMobile"
                  open-type="getPhoneNumber"
                  @getphonenumber="getPhoneNumber">
                    获取手机号
                  </button>
                </view>
              </view>
              
              <view
                v-if="nowStatus != 3 && nowStatus != 5"
                style="
                  width: 50rpx;
                  height: 50rpx;
                  display: flex;
                  align-items: center;
                  justify-content: center;
                  position: absolute;
                  top: -2rpx;
                  right: 10rpx;
                  z-index: 10;
                "
                @click="delInputText(item.field)"
              >
                <image
                  src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/delete.png"
                  v-if="item.delIcon"
                  class="delIcon"
                  mode="widthFix"
                ></image>
              </view>
              
            </view>
            <view class="con2" v-if="item.type == 2">
              <!-- 未上传成功 -->
              <image
                :src="businessLicenseDemo"
                v-if="!businessLicenseUploadIsSuccess"
                class="conImage"
                mode="widthFix"
                @click="chooseImg"
              ></image>
              <!-- 上传成功 -->
              <image
                :src="dataOne.BusinessLicense"
                v-if="businessLicenseUploadIsSuccess"
                class="conImage"
                mode="aspectFill"
              ></image>
              <view
                class="reupload"
                v-if="
                  businessLicenseUploadIsSuccess &&
                  nowStatus != 3 &&
                  nowStatus != 5
                "
                @click="chooseImg"
				:style="{background:mainColor}"
              >
                重新上传
              </view>
            </view>
          </view>
        </view>
      </view>
      <view class="stepItem" v-if="step == 2">
        <view
          style="
            font-size: 21px;
            font-weight: 800;
            color: #1f1f1f;
            text-align: center;
          "
          >请选择您的身份</view
        >
		<view class="company-auth" style="margin-top: 180rpx;">
			<view class="item" v-for="(x,i) in companyTypes" @click="()=>ChooseidentityId=x.id" :key="i" :class="{'active':ChooseidentityId==x.id}" :style="{borderColor:ChooseidentityId==x.id?mainColor:'#E1E2E3'}">
				<view class="type-name">{{ x.name}}</view>
				<image :src="x.image" mode="widthFix"></image>
			</view>
		</view>
	  </view>
      <view class="stepItem" v-if="step == 3" style="padding-bottom: 0">
        <view v-if="ChooseidentityId == 1">
          <brandInformation ref="brandinfo" :datas="dataOne" @finish="()=>getUserCompany()"></brandInformation>
        </view>
        <view v-if="ChooseidentityId == 2">
          <carrierInformation
            ref="carrierinfo"
            :datas="dataOne"
			@finish="()=>getUserCompany()"
          ></carrierInformation>
        </view>
        <view v-if="ChooseidentityId == 3">
          <enterInformation ref="enterinfo" :datas="dataOne" @finish="()=>getUserCompany()"></enterInformation>
        </view>
        <view v-if="ChooseidentityId == 4">
          <buildingInformation ref="buildinginfo" :datas="dataOne" @finish="()=>getUserCompany()"></buildingInformation>
        </view>
      </view>

      <view v-if="step != 3">
        <view class="butBox" @click="nextStep" :style="{background:mainColor,boxShadow:`0rpx 4rpx 40rpx 0rpx ${mainColor}94`}">
          <image src="https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638696208109196782.png" style="width:40%" class="next" mode="widthFix"></image>
        </view>
      </view>
    </view>
	</template>
  </view>
</template>

<script>
import rangeSlider from "./components/range-slider.vue";
import carrierInformation from "./components/carrierInformation.vue";
import buildingInformation from "./components/buildingInformation.vue";
import brandInformation from "./components/brandInformation.vue";
import enterInformation from "./components/enterInformation.vue";
import companyInformation from './components/companyInformation.vue'
export default {
  components: {
    rangeSlider,
    carrierInformation,
    buildingInformation,
    brandInformation,
    enterInformation,
	companyInformation
  },
  computed: {},
  data() {
    return {
      pageTitle: "企业认证",
      step: 1,
      nextIcon:
        "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/next.png",
      percent: 33.33,
      ChooseidentityId: -1,
      stepName: "第1步 企业基础资料",
      nextSepName: "第2步",
      // type=1：输入框，2：照片
      stepOneList: [
        {
          name: "营业执照",
          tip: "(点击图片上传营业执照)",
          type: 2,
        },
        {
          name: "企业名称",
          text: "请输入企业名称",
          field: "CompanyName",
          delIcon: false,
          type: 1,
        },
        {
          name: "统一社会信用代码",
          text: "输入18位社会信用代码",
          field: "UnifiedCode",
          delIcon: false,
          type: 1,
        },
        {
          name: "法人代表",
          text: "请输入法人姓名",
          field: "LegalPerson",
          delIcon: false,
          type: 1,
        },
        {
          name: "联系电话",
          text: "请输入11位手机或者带区号座机号码",
          field: "Mobile",
          delIcon: false,
          type: 1,
        },
      ],
      //type=1：输入框，2：步进器，3：多选
      stepTwoList: [
        {
          name: "品牌名称",
          text: "请输入品牌名称",
          field: "BrandName",
          delIcon: false,
          type: 1,
        },
        {
          name: "店铺数量",
          text: "",
          field: "ShopNum",
          type: 2,
        },
        {
          name: "店铺面积",
          text: "",
          field: "",
          type: 3,
        },
        {
          name: "品牌定位",
          text: "请输入品牌定位",
          field: "FullBrandName",
          delIcon: false,
          type: 1,
        },
        {
          name: "客户群体",
          tip: "(可多选)",
          text: "",
          field: "CustomerType",
          type: 4,
        },
      ],
      customList: [], //客户群体
      //type=1：输入框，2：单选，3：范围
      stepThreeList: [
        {
          name: "扩店区域",
          text: "请输入扩店区域",
          field: "StoreExpansion",
          delIcon: false,
          type: 1,
        },
        {
          name: "商品性质 ",
          tip: "(单选)",
          text: "",
          field: "ProjectType",
          type: 2,
        },
        {
          name: "面积要求",
          text: "",
          field: "",
          type: 3,
        },
      ],
      goodsType: [], //商品性质
      goodsTypeValue: "",
      businessLicenseDemo:
        "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/ybminiappupbg.png", //营业执照占位图片
      businessLicenseUploadIsSuccess: false, //营业执照是否上传成功
      access_token: "", //百度ai平台token
      dataOne: {
        CompanyId: 0,
        CompanyName: "",
        BusinessLicense: "", //营业执照
        UnifiedCode: "",
        LegalPerson: "",
        Mobile: "",
        CompanyStatus: 0,
        FirstShopType: 1,
      },
      dataTwo: {
        CompanyId: 0,
        BrandName: "",
        ShopNum: 0,
        BuiltUpArea: 0,
        EndBuiltUpArea: 0,
        FullBrandName: "",
        CustomerType: "",
        CustomerOtherType: "",
      },
      reduceIcon:
        "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/reduceIcon.png",
      addIcon:
        "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/addIcon.png",
      builtArea: [1, 100], //店铺面积
      rangeSliderMin: 0, //区间滑块最小值
      rangeSliderMax: 100, //区间滑块最大值
      dataThree: {
        StoreExpansion: "", //扩展区域
        ProjectType: "", //商品性质
        AreaRequirement: 0, //面积要求
        EndAreaRequirement: 0, //面积要求
      },
      goodsTypeImg: {
        1: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/goodstype-baihuo.png",
        2: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/goodstype-shappingmall.png",
        3: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/goodstype-center.png",
        4: "https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Static/goodstype-other.png",
      },
      AreaRequire: [],
      AreaRequireMin: 0,
      AreaRequireMax: 100,
      finishBtn: "完成",
      newCompanyId: 0,
      nowStatus: 1, //此时的状态
      loading: false,
      editType: 0, //是否是从修改进入的 1是 0否
	  mainColor:'',
	  companyTypes:[
		  {name:'品牌',image:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638696228042995981.png',id:1},
		  {name:'商业',image:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638696228042986140.png',id:2},
		  {name:'企业',image:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638696228219050268.png',id:3},
		  {name:'楼宇',image:'https://viitto-1301420277.cos.ap-chengdu.myqcloud.com/Upload/Goods/638696228045398333.png',id:4},
	  ],
	  isEnterType: false,
    isMobile: true,
    loadingMobile: false,
    };
  },
  methods: {
    getPhoneNumber (e) {
      this.loadingMobile = true
      if(e.detail.errMsg&&e.detail.errMsg=="getPhoneNumber:ok"&&e.detail.code){
        let parms = {
          url: "/api/AppletLogin/GetUserPhoneNumber",
          data: {
            Code: e.detail.code
          }
        };
        this.request2(parms, (res) => {
          if (res.resultCode == 1) {
            this.loadingMobile = false
            if(res.data.code==1) this.dataOne.Mobile = res.data&&res.data.phoneNumber?res.data.phoneNumber:""
            if(!this.dataOne.Mobile||this.dataOne.Mobile==""){
              this.isMobile = false
              wx.showToast({
                icon: 'none',
                title: "请手动输入手机号",
                duration: 1000,
              });
            }
          }
        });
      }else {
        this.isMobile = false
        this.loadingMobile = false
      }
    },
    // 输入框获取焦点
    inputFcous(e) {
      e.delIcon = true;
    },
    delInputText(field) {
      this.dataOne[field] = "";
      this.dataTwo[field] = "";
      this.dataThree[field] = "";
    },
    // 输入框失去焦点
    inputBlur(e) {
      e.delIcon = false;
    },
    // 获取客户群体枚举
    getCustomerTypeEnumList() {
      let parms = {
        url: "/api/AppletTrade/GetCustomerTypeEnumList",
      };
      this.request2(parms, (res) => {
        if (res.resultCode == 1) {
          res.data.map((e) => {
            e.checked = false;
          });
          this.customList = res.data;
        }
      });
    },
    // 获取商品性质
    GetProjectTypeEnumList() {
      let parms = {
        url: "/api/AppletTrade/GetProjectTypeEnumList",
      };
      this.request2(parms, (res) => {
        if (res.resultCode == 1) {
          this.goodsType = res.data;
        }
      });
    },
    //选择营业执照照片
    chooseImg() {
      let that = this;
      uni.chooseImage({
        count: 1, //默认9
        sizeType: ["original", "compressed"], //可以指定是原图还是压缩图，默认二者都有
        sourceType: ["album"], //从相册选择
        success: function (res) {
          wx.getFileSystemManager().readFile({
            filePath: res.tempFilePaths[0],
            encoding: "base64", //编码格式
            success: (ans) => {
              console.log('in')
              that.getImgInfo(ans.data, that.access_token, (_res) => {
                console.log("getImgInfo", _res);
                if (_res.data.direction == 1) {
                  //未定义，图片类型错误
                  wx.showToast({
                    title: "图片类型错误!",
                    icon: "none",
                    duration: 1000,
                  });
                } else {
                  let data = _res.data.words_result;
                  that.upFile(res.tempFilePaths[0], (uploadRes) => {
                    that.dataOne.BusinessLicense = JSON.parse(
                      uploadRes.data
                    ).data;
                    that.businessLicenseUploadIsSuccess = true;
                    that.dataOne.CompanyName = data.单位名称.words;
                    that.dataOne.LegalPerson = data.法人.words;
                    that.dataOne.UnifiedCode = data.社会信用代码.words;
                  });
                }
              });
            },
          });
          //
        },
      });
    },
    //提取营业执照信息
    getImgInfo(data, token, resCall) {
      let that = this;
      uni.request({
        url:
          "https://aip.baidubce.com/rest/2.0/ocr/v1/business_license?access_token=" +
          token,
        method: "POST",
        header: {
          "Content-Type": "application/x-www-form-urlencoded",
        },
        data: {
          image: data,
        },
        success(res) {
          resCall(res);
        },
        fail(res) {
          wx.showToast({
            title: "图片类型错误!",
            icon: "none",
            duration: 1000,
          });
        },
      });
    },
    //图片上传
    upFile(img, resCall) {
      var that = this;
      wx.showLoading({
        title: "上传中",
      });
      let MallBaseId = uni.getStorageSync("mall_UserInfo").MallBaseId
        ? uni.getStorageSync("mall_UserInfo").MallBaseId
        : 1;
      let action =
        that.host2 + "/api/File/UploadTencent?MallBaseId=" + MallBaseId;
      uni.uploadFile({
        url: action,
        filePath: img,
        name: "field",
        formData: {
          user: "test",
        },
        success: (uploadFileRes) => {
          uni.hideLoading();
          resCall(uploadFileRes);
        },
        fail: function (res) {
          that.businessLicenseUploadIsSuccess = false;
          wx.showToast({
            title: "上传失败!",
            icon: "none",
            duration: 1000,
          });
        },
      });
    },
    //获取百度ai平台token
    getAccess_token() {
      let that = this;
      uni.request({
        url: "https://aip.baidubce.com/oauth/2.0/token?grant_type=client_credentials&client_id=uHc6N5qsYBfZs3jrM0DOLXCc&client_secret=8LrTrMzUmBQGPTEu1Nm0UxaVGucXdg6J", // 百度获取token接口地址
        data: {
          grant_type: "client_credentials", // 固定写死
          client_id: "uHc6N5qsYBfZs3jrM0DOLXCc",
          client_secret: "8LrTrMzUmBQGPTEu1Nm0UxaVGucXdg6J",
        },
        method: "POST",
        success(res) {
          that.access_token = res.data.access_token;
        },
        fail(e) {},
      });
    },
    //企业认证
    stepOne() {
      this.dataOne.FirstShopType = this.ChooseidentityId;
      // this.dataOne.CompanyId = 283;
      // this.dataOne.CompanyStatus = -1;    
      let parms = {
        url: "/api/AppletTrade/SetCompanyEnterprise",
        data: this.dataOne,
      };
      this.request2(parms, (res) => {
        if (res.resultCode == 1) {
          this.dataOne.CompanyId = res.data.CompanyId;
          this.dataOne.CompanyStatus = -1;
          if(!this.isEnterType) this.showTemplate(res.data.template_message_list);
          else {
            this.step = 3
            this.stepName = this.companyTypes[this.ChooseidentityId-1].name+'认证信息';
            this.nextSepName = "完成";
            this.percent += this.percent;
          }
        }
      });
    },

    //步骤三

    //返回个人中心
    finish() {
      uni.navigateTo({
        url: "/pages/user-center/user-center",
      });
    },
    //下一步
    nextStep() {
      if (this.percent > 100) {
        this.percent = 100;
      }
      if (this.step <= 4) {
        if (this.step == 1) {
          if(this.dataOne.BusinessLicense==''){
            return wx.showToast({
				icon: 'none',
				title: "请上传营业执照",
				duration: 1000,
            });
          }
          if(this.dataOne.CompanyName==''){
            return wx.showToast({
				icon: 'none',
				title: "请填写企业名称",
				duration: 1000,
            });
          }
          if(this.dataOne.UnifiedCode==''){
            return wx.showToast({
				icon: 'none',
				title: "请填写统一社会信用代码",
				duration: 1000,
            });
          }
          if(this.dataOne.LegalPerson==''){
            return wx.showToast({
				icon: 'none',
				title: "请填写法人代表",
				duration: 1000,
            });
          }
          if(this.dataOne.Mobile==''){
            return wx.showToast({
				icon: 'none',
				title: "请填写联系电话",
				duration: 1000,
            });
          }
          //审核中或审核通过就不提交请求
          if (
            this.nowStatus != 3 &&
            this.nowStatus != 2 &&
            this.nowStatus != 5
          ) {
			this.step++;
			if(this.ChooseidentityId!=-1){
				if(this.isEnterType&&(!this.dataOne.CompanyId||this.dataOne.CompanyId=="")){
					this.stepOne()
					return
				}else{
					this.step = 3;
					this.percent = 100;
					this.stepName = this.companyTypes[this.ChooseidentityId-1].name+'认证信息';
					this.nextSepName = "完成";
					return
				}
				
			}
			this.ChooseidentityId=1
			this.stepName = "第2步 选择身份";
			this.nextSepName = "第3步";
			this.percent += this.percent;
          } else {
            //审核中的去查看
            if (this.nowStatus == 2) {
              //不通过的时候不能去选择身份了
              this.stepOne();
            } else {
              this.step = 3;
              this.percent = 100;
              this.stepName = this.companyTypes[this.ChooseidentityId-1].name;
              this.nextSepName = "完成";
            }
          }
        }else if (this.step == 2) {
          this.stepOne();
        }
      }
    },
    // 审核通过
    backBtn() {
      if (this.percent > 100) {
        this.percent = 100;
      }
      if (this.step == 1) {
        this.stepName = "第2步 选择身份";
        this.nextSepName = "第3步";
        this.step++;
        this.percent += this.percent;
      } else if (this.step == 2) {
        this.step++;
        this.percent += this.percent;
        this.stepName = this.companyTypes[this.ChooseidentityId-1].name+'认证信息';
        this.nextSepName = "完成";
      }
    },

    // 获取公司认证信息
    getUserCompany() {
      let that = this;
      that.loading = false;
      let parms = {
        url: "/api/AppletTrade/GetUserCompanyEnterprise",
      };
      this.request2(parms, (res) => {
        if (res.resultCode == 1 && res.data != null) {
          this.dataOne = res.data;
          this.businessLicenseUploadIsSuccess = true;
          this.dataOne.CompanyId = res.data.CompanyId;
          if (this.dataOne.CompanyStatus == 0 && this.dataOne.IsComplete == 1) {
            //审核中
            this.nowStatus = 3;
          }
          if (this.dataOne.CompanyStatus == 1) {
            //审核通过
            this.nowStatus = 4;
            if (this.editType == 0) {
              //从企业菜单今天 可以看企业菜单但是不能修改
              this.nowStatus = 5;
            }
          }
          if (this.dataOne.CompanyStatus == 2) {
            //审核不通过
            this.nowStatus = 2;
          }
          this.ChooseidentityId = this.dataOne.FirstShopType;
          if(this.dataOne.FirstShopType ){
            if (this.dataOne.FirstShopType == 1) {
              this.pageTitle = "品牌信息";
            } else if(this.dataOne.FirstShopType == 2) {
              this.pageTitle = "载体信息";
            } else if(this.dataOne.FirstShopType == 3) {
              this.pageTitle = "企业信息";
            } else if(this.dataOne.FirstShopType == 4) {
              this.pageTitle = "楼宇信息";
            }
          }
          
        }
        that.loading = true;
      });
    },
    // 单选
    radioChange(e) {
      // console.log(e);
    },
    //显示模板
    showTemplate(template) {
      let that = this;
      uni.requestSubscribeMessage({
        tmplIds: template,
        complete(res) {
          if (that.nowStatus == 2) {
            that.step = 3;
            that.percent = 100;
          } else {
            that.step++;
            that.percent += that.percent;
          }
          this.stepName = this.companyTypes[this.ChooseidentityId-1].name+'认证信息';
          this.nextSepName = "完成";
        },
      });
    },
  },
  onLoad(options) {
    if (options && options.editType) {
      //是否是从修改进去的
      this.editType = options.editType;
    }
	if(options && options.t){
		this.ChooseidentityId=options.t
		this.isEnterType = true
	}else{
		this.ChooseidentityId=-1
	}
    this.getUserCompany();
  },
  created() {},
  mounted() {
    // this.getCustomerTypeEnumList()
    // this.GetProjectTypeEnumList()
	this.mainColor = this.$uiConfig.mainColor
    this.getAccess_token();
    uni.setNavigationBarTitle({
      title: this.pageTitle,
    });
  },
};
</script>

<style lang="scss" scoped>
.page {
  background-color: #f6f6f6;
  min-height: 100vh;
  height: 100%;
  padding-bottom: 70rpx;

  .progressBox {
    width: 650rpx;
    height: 120rpx;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-content: center;

    .progressName {
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 28rpx;
      font-weight: bold;

      .cur {
        color: #f70027;
      }

      .nex {
        color: #b9bcca;
      }
    }

    .progress {
      width: 100%;
    }
  }

  .stepBox {
    width: 680rpx;
    margin: 0 auto;
    background-color: #ffffff;
    box-shadow: 0rpx 10rpx 50rpx 0rpx rgba(218, 220, 230, 0.85);
    border-radius: 30rpx;
    padding: 53rpx 45rpx 70rpx;

    .stepItem {
      width: 100%;
      padding-bottom: 100rpx;

      .itemBox {
        width: 100%;
        margin-bottom: 55rpx;

        .name {
          font-size: 28rpx;
          font-weight: bold;
          color: #1f1f1f;
          margin-bottom: 38rpx;

          .tip {
            font-weight: 400;
            color: #aaaaaaff;
            margin-left: 10rpx;
          }
        }

        .con1 {
          height: 60rpx;
          position: relative;

          .input {
            // width: 100%;
            font-size: 32rpx;
            font-family: PingFang SC;
            font-weight: bold;
            color: #000000;
            border-bottom: 1rpx solid #dadce6;
            padding-bottom: 24rpx;
            vertical-align: baseline;
            padding-right: 50rpx;
          }

          .delIcon {
            width: 32rpx;
            height: 32rpx;
            // width: 100%;
            // height: 100%;
          }
        }

        .con2 {
          width: 100%;
          position: relative;
          overflow: hidden;

          .conImage {
            width: 590rpx;
            height: 367rpx;
            // border: 1rpx solid #000000;
          }

          .reupload {
            width: 185rpx;
            height: 60rpx;
            background-color: #f70027;
            border-radius: 20rpx;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: 28rpx;
            font-weight: bold;
            color: #ffffff;
            position: absolute;
            left: 50%;
            transform: translateX(-50%);
            bottom: 40rpx;
          }
        }

        .con3 {
          // border-bottom: 1rpx solid #DADCE6;
          padding-bottom: 24rpx;
          position: relative;

          .numberBbox {
            display: flex;
            justify-content: space-between;
            align-items: center;

            .numberImg {
              width: 38rpx;
              height: 38rpx;
            }

            .numberInput {
              margin: 0 10rpx;
              flex-grow: 5;
              text-align: center;
            }
          }
        }

        .con4 {
          border-bottom: 1rpx solid #dadce6;
          padding-bottom: 24rpx;

          .customTypeBox {
            display: flex;
            // flex-wrap: wrap;
            justify-content: space-between;
            margin-bottom: 20rpx;

            .customName {
              width: 110rpx;
              height: 50rpx;
              background-color: #ffffff;
              border: 1rpx dashed #1f1f1f;
              opacity: 0.3;
              border-radius: 10rpx;
              display: flex;
              justify-content: center;
              align-items: center;
              font-size: 28rpx;
              font-weight: bold;
              color: #000000;
              // margin-right: 50rpx;
              margin-bottom: 20rpx;
            }

            & :nth-child(4n) > .customName {
              margin-right: 0rpx !important;
            }
          }

          .customTypeInput {
            font-size: 32rpx;
            font-family: PingFang SC;
            font-weight: bold;
            color: #000000;
          }
        }

        .con6 {
          display: flex;
          flex-wrap: wrap;

          .goodsTypeImg {
            width: 278rpx;
            height: 144rpx;
            background-color: #232323;
            opacity: 0.6;
            border-radius: 18rpx;
            margin-bottom: 30rpx;
          }
        }
      }

      .chooseidbox {
        width: 208rpx;
        display: flex;
        flex-direction: column;
        align-items: center;

        .chooseidbox_t {
          width: 100%;
          height: 260rpx;
        }

        .chooseidbox_b {
          width: 15px;
          height: 15px;
          margin-top: 12px;
        }

        image {
          width: 100%;
          height: 100%;
        }
      }
    }
  }

  .butBox {
    margin: 10rpx auto;
    width: 100rpx;
    height: 100rpx;
    background-color: #f70027;
    box-shadow: 0rpx 4rpx 40rpx 0rpx rgba(249, 54, 85, 0.58);
    border-radius: 20rpx;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 28rpx;
    font-weight: bold;
    color: #ffffff;

    .next {
      width: 100%;
      height: auto;
    }
  }

  .skip {
    text-align: center;
    font-size: 28rpx;
    font-weight: 500;
    color: #b7b7b7;
  }
}

.chooseType {
  background-color: #f95771ff !important;
  color: #f70027 !important;
  border: none !important;
}

// 修改滑块样式
/deep/.block {
  background-color: #ffffff;
  border: 4rpx solid #f70027;
  box-shadow: 0rpx 0rpx 10rpx 0rpx rgba(232, 76, 100, 0.74);
  border-radius: 10rpx;
}

.rangeSliderNum {
  display: flex;
  justify-content: space-between;
  align-items: center;
  font-size: 32rpx;
  font-weight: bold;
  color: #000000;
}

/deep/.u-radio-group {
  display: flex;
  flex-wrap: wrap;
}

/deep/.u-radio-group :nth-child(2n) > .u-radio {
  margin-right: 0rpx;
}

/deep/.u-radio {
  position: relative;
  width: 278rpx;
  border-radius: 18rpx;
  margin-right: 30rpx;
}

/deep/.u-radio__icon-wrap {
  position: absolute;
  top: 17rpx;
  right: 17rpx;
  z-index: 10;
}

.sliderCurNumBox {
  display: flex;
  justify-content: center;
  align-items: baseline;

  .sliderCurNum {
    width: 100rpx;
    text-align: center;
    font-size: 40rpx;
    font-weight: 800;
    color: #f70027;
  }
}
/* 在线链接服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
@font-face {
  font-family: "ali-item-title";
  src: url("//at.alicdn.com/wf/webfont/MQHUV6e56ce5/XADjkS2Snr1Y.woff2") format("woff2"),
  url("//at.alicdn.com/wf/webfont/MQHUV6e56ce5/yACEEadsH9Us.woff") format("woff");
  font-display: swap;
}
.company-auth{
	font-family: 'ali-item-title';
	width: 90%;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	
}
.company-auth .item{
	width: calc(50% - 20px);
	margin-right: 20px;
	padding: 20px;
	border: 3px solid #e1e2e3;
	border-radius: 10px;
	color:#e1e2e3;
	text-align: center;
	margin-bottom: 20px;
	font-weight: bold;
}
.company-auth .item .type-name{
	text-align: center;
	font-size: 36rpx;
	margin-bottom: 20rpx;
}
.company-auth .item image{
	opacity: 30%;
	width:70rpx;
	max-height: 70rpx;
}
.company-auth .item.active{
	color:#000;
}
.company-auth .item.active image{
	opacity: unset;
}
.PhoneNumber{
  color:#ffffff;
  background-color:#017edf;
  border-color:#017edf
}
.is-hoverPhone {
	color: black;
	background-color: #C6E6FF ;
	border-color: #C6E6FF;
}
</style>
