web-store-retail-h5/pages/regiest/index.vue

<!--
 * @Descripttion: 
 * @version: 
 * @Author: kBank
 * @Date: 2022-11-21 15:11:22
-->
<template>
  <view class="content">
    <view class="con_top">
      <view class="con_top_i" @click="toRegiest(0)">
        <view>{{ '快速注册' }}</view>
        <view :class="isClick == 0 ? 'bai' : ''"></view>
      </view>
      <view class="con_top_i" @click="toRegiest(1)">
        <view>{{ '普通注册' }}</view>
        <view :class="isClick == 1 ? 'bai' : ''"></view>
      </view>
    </view>
    <view class="zhan"></view>
    <view class="context">
      <u-form :model="form" labelWidth="75" :rules="rules" ref="uForm">
        <u-form-item :label="'申请级别'" borderBottom prop="pkGradeVal">
          <u-input
            v-model="form.pkGradeVal"
            border="none"
            disabledColor="#fff"
            disabled
          />
        </u-form-item>
        <!-- <u-form-item
          :label="'自然国家'"
          @tap="changeCountry(0)"
          borderBottom
        >
          <view class="disFlex justBwn">
            <view class="disFlex">
              <img class="countImg" :src="form.pkCountryImg" alt="" />
              <view>{{ form.pkCountryLabel }}</view>
            </view>
            <u-icon name="arrow-right"></u-icon>
          </view>
        </u-form-item> -->

        <!-- @tap="changeCountry(1)" -->
        <!-- <u-form-item :label="'结算国家'" borderBottom>
          <view class="disFlex justBwn">
            <view class="disFlex">
              <img class="countImg" :src="form.pkSettleCountryImg" alt="" />
              <view>{{ form.pkSettleCountryLabel }}</view>
            </view>
            <u-icon name="arrow-right"></u-icon>
          </view>
        </u-form-item> -->
        <u-form-item :label="'推荐编号'" required borderBottom prop="parent">
          <u-input
            v-model="form.parent"
            @blur="isClick == 0 ? getQuickReg() : getValidPcode()"
            border="none"
          />
        </u-form-item>
        <u-form-item :label="'推荐姓名'" borderBottom prop="parentName">
          <u-input v-model="form.parentName" disabled border="none" />
        </u-form-item>
        <u-form-item
          :label="'安置编号'"
          required
          borderBottom
          prop="placeParent"
        >
          <u-input v-model="form.placeParent" :disabled="pt" border="none" />
        </u-form-item>
        <u-form-item :label="'安置姓名'" borderBottom prop="placeParentName">
          <u-input v-model="form.placeParentName" disabled border="none" />
        </u-form-item>
        <u-form-item
          :label="'安置位置'"
          required
          @click="!pt ? (isPlace = true) : (isPlace = false)"
          borderBottom
          prop="placeDeptLabel"
        >
          <view class="disFlex justBwn">
            <u-input
              v-model="form.placeDeptLabel"
              :disabled="pt"
              border="none"
            />
            <u-icon name="arrow-right"></u-icon>
          </view>
        </u-form-item>
        <u-form-item
          v-if="userInfo.specialRegistration == 1"
          :label="'会员姓名'"
          required
          borderBottom
          prop="memberName"
        >
          <u-input :maxlength="40" v-model="form.memberName" border="none" />
        </u-form-item>
        <u-form-item
          v-if="userInfo.specialRegistration == 1"
          :label="'联系方式'"
          required
          borderBottom
          prop="phone"
        >
          <u-input
            v-if="pkCountry == 1"
            v-model="form.phone"
            maxlength="11"
            type="number"
            border="none"
          />
          <u-input v-else v-model="form.phone" maxlength="30" border="none" />
        </u-form-item>
        <u-form-item
          v-if="userInfo.specialRegistration == 0"
          :label="'会员姓名'"
          required
          borderBottom
          prop="memberName"
        >
          <u-input maxlength="40" v-model="form.memberName" border="none" />
        </u-form-item>
        <u-form-item
          v-if="userInfo.specialRegistration == 0"
          :label="'联系方式'"
          required
          borderBottom
          prop="phone"
        >
          <u-input v-model="form.phone" maxlength="30" border="none" />
        </u-form-item>
        <u-form-item
          :label="'证件号码'"
          borderBottom
          v-if="pageList.card"
          prop="idCard"
        >
          <u-input v-model="form.idCard" border="none" />
        </u-form-item>
        <u-form-item
          :label="'银行名称'"
          v-if="pageList.bankName"
          borderBottom
          @click="isBank = true"
          prop="pkBankLabel"
        >
          <view class="disFlex justBwn">
            <u-input v-model="form.pkBankLabel" border="none" />
            <u-icon name="arrow-right"></u-icon>
          </view>
        </u-form-item>
        <u-form-item
          :label="'银行卡号'"
          v-if="pageList.bankNo"
          borderBottom
          prop="idCard"
        >
          <u-input v-model="form.idCard" border="none" />
        </u-form-item>
        <u-form-item
          :label="'开户支行'"
          v-if="pageList.accountBranch"
          borderBottom
          prop="idCard"
        >
          <u-input v-model="form.idCard" border="none" />
        </u-form-item>
        <u-form-item
          :label="'邮箱'"
          v-if="pageList.mail"
          borderBottom
          prop="idCard"
        >
          <u-input v-model="form.idCard" border="none" />
        </u-form-item>
        <u-form-item
          :label="'发货方式'"
          required
          borderBottom
          @click="pkCountry != 1 ? (isDelivery = true) : ''"
          prop="deliveryWayLabel"
        >
          <view class="disFlex justBwn">
            <u-input
              v-model="form.deliveryWayLabel"
              :disabled="pkCountry == 1"
              border="none"
            />
            <u-icon name="arrow-right"></u-icon>
          </view>
        </u-form-item>
        <u-form-item
          :label="'运输方式'"
          borderBottom
          @click="pkCountry != 1 ? (isTrans = true) : ''"
          :required="isDeliveryWay"
          prop="transTypeLabel"
        >
          <view class="disFlex justBwn">
            <u-input
              v-model="form.transTypeLabel"
              :disabled="pkCountry == 1"
              border="none"
            />
            <u-icon name="arrow-right"></u-icon>
          </view>
        </u-form-item>
        <u-form-item
          v-if="howSure"
          :label="'创客空间'"
          borderBottom
          required
          @click="ishowSure = true"
          prop="makerSpaceMemberLabel"
        >
          <view class="disFlex justBwn">
            <u-input v-model="form.makerSpaceMemberLabel" border="none" />
            <u-icon name="arrow-right"></u-icon>
          </view>
        </u-form-item>
        <!-- <u-form-item
          :label="'仓库'"
          v-if="pkCountry != 1"
          borderBottom
          @click="isCk = true"
          prop="pkStorehouseLabel"
        >
          <view class="disFlex justBwn">
            <u-input v-model="form.pkStorehouseLabel" border="none" />
            <u-icon name="arrow-right"></u-icon>
          </view>
        </u-form-item>
        <u-form-item
          :label="'会员店铺'"
          v-if="pkCountry != 1"
          borderBottom
          @click="isDp = true"
          prop="pkMemberStoreLabel"
        >
          <view class="disFlex justBwn">
            <u-input v-model="form.pkMemberStoreLabel" border="none" />
            <u-icon name="arrow-right"></u-icon>
          </view>
        </u-form-item> -->
        <view class="subTxt" v-if="isDeliveryWay">
          <view class="subTxt1">{{ '收货人信息' }}</view>
          <span
            class="subTxt2"
            v-show="pkCountry == userInfo.pkCountry"
            @click="addAdress"
          >
            <u-icon color="#fff" name="plus-circle-fill"></u-icon>
            <view>{{ '添加' }}</view>
          </span>
        </view>
        <view v-if="isDeliveryWay">
          <u-form-item :label="'收货人'" borderBottom prop="recName">
            <u-input
              v-model.trim="form.recName"
              border="none"
              :maxlength="40"
              :placeholder="'请输入收货人'"
            />
          </u-form-item>
          <u-form-item
            :label="'收货电话'"
            borderBottom
            prop="recPhone"
            v-if="pkCountry == 1"
          >
            <u-input
              v-model.trim="form.recPhone"
              border="none"
              type="number"
              :maxlength="11"
              :placeholder="'请输入收货电话'"
            />
          </u-form-item>
          <u-form-item
            :label="'收货电话'"
            borderBottom
            prop="recPhone"
            v-else
          >
            <u-input
              v-model.trim="form.recPhone"
              border="none"
              :maxlength="30"
              :placeholder="'请输入收货电话'"
            />
          </u-form-item>
          <u-form-item
            :label="'收货地址'"
            borderBottom
            prop="diqu"
            @click="getDiqu"
          >
            <view class="disFlex justBwn">
              <u-input
                v-model.trim="form.diqu"
                :placeholder="'请选收货地址'"
                border="none"
              ></u-input>
              <u-icon name="arrow-right"></u-icon>
            </view>
          </u-form-item>
          <u-form-item :label="'详细地址'" borderBottom prop="recAddress">
            <u-input
              v-model.trim="form.recAddress"
              border="none"
              maxlength="200"
              :placeholder="'请输入详细地址'"
            />
          </u-form-item>
          <u-form-item :label="'邮费'" borderBottom>
            <u-input disabled border="none" v-model="form.postage" />
          </u-form-item>
          <u-form-item :label="'备注'" borderBottom>
            <u-input
              v-model="form.remark"
              border="none"
              :placeholder="'请输入备注'"
            />
          </u-form-item>
        </view>
      </u-form>
      <view class="heng"> </view>
      <view
        class="subTxt"
        v-show="isDeliveryWay && pkCountry == userInfo.pkCountry"
      >
        <view class="subTxt1">{{ '历史地址' }}</view>
      </view>
      <u-radio-group
        v-model="moren"
        v-show="isDeliveryWay && pkCountry == userInfo.pkCountry"
        shape="circle"
        placement="column"
        @change="checkRadio"
      >
        <view
          v-for="item in addressList"
          :key="item.pkId"
          class="disFlex address_a"
        >
          <u-radio activeColor="red" :name="item.pkId"></u-radio>
          <view class="address_r">
            <view class="disFlex justBwn">
              <view class="disFlex">
                <view>{{ item.recName }}</view>
                <view class="mr" v-show="item.isDefault == 1">{{
                  '默认'
                }}</view>
              </view>
              <view class="disFlex">
                <u-icon
                  name="edit-pen"
                  @click="editAddress(item)"
                  style="margin-right: 20rpx"
                  color="#999999"
                  size="20"
                ></u-icon>
                <u-icon
                  name="trash"
                  @click="delAds(item.pkId)"
                  color="#999999"
                  size="20"
                ></u-icon>
              </view>
            </view>
            <view class="address_rc">{{ item.recPhone }}</view>
            <view class="tit3">{{ item.recArea }}{{ item.recAddress }}</view>
          </view>
        </view>
      </u-radio-group>
      <view
        v-for="(item, index) in allGoodsData.orderItemsParams"
        :key="index"
        class="goodList"
      >
        <view class="goodList_i">
          <view class="goodList_it">
            <img :src="item.cover1" class="cover" alt="" />
            <view class="goodList_ir">
              <view class="goodList_ib">
                <view class="tit1">
                  {{ item.waresName }}
                </view>
                <view class="tit5"> x{{ item.quantity }} </view>
              </view>
              <view class="goodList_ib">
                <view class="tit2">
                  {{ item.price | numberToCurrency | isLocal }}
                </view>
                <view class="tit3"
                  >PV: {{ item.achieve | numberToCurrency | isLocal }}</view
                >
              </view>
            </view>
          </view>
          <view
            v-for="(stem, sndex) in item.waresItemsParamList"
            :key="sndex"
            v-if="item.energySilo != 1"
            class="product_i"
          >
            <img :src="stem.specCover" alt="" />
            <view class="product_il">
              <view class="tit4"
                >{{ stem.productName }} {{ stem.skuInfo }}</view
              >
              <view class="tit5">x{{ stem.quantity }}</view>
            </view>
          </view>
          <view class="fen">
            <view class="disFlex justBwn">
              <view class="tit3">{{ '商品业绩' }}(PV)</view>
              <view class="tit1">{{
                item.achieveAmount | numberToCurrency
              }}</view>
            </view>
            <view class="disFlex justBwn">
              <view class="tit3">{{ '金额小计' }}</view>
              <view class="tit1">{{
                item.priceAmount | numberToCurrency
              }}</view>
            </view>
          </view>
        </view>
      </view>

      <view class="pad">
        <view class="disFlex justBwn">
          <view class="tit3">{{ '商品金额总计' }}(¥)：</view>
          <view class="tit1">{{
            allGoodsData.priceAmount | numberToCurrency | isLocal
          }}</view>
        </view>
        <view class="disFlex justBwn">
          <view class="tit3">{{ '邮费' }}：</view>
          <view class="tit1">{{
            form.postage | numberToCurrency | isLocal
          }}</view>
        </view>
        <view class="disFlex justBwn">
          <view class="tit3">{{ '总价' }}：</view>
          <view class="tit1">{{
            totalAmont | numberToCurrency | isLocal
          }}</view>
        </view>
        <view class="disFlex justBwn">
          <view class="tit3">{{ '业绩' }}</view>
          <view class="tit1">{{
            allGoodsData.achieveAmount | numberToCurrency | isLocal
          }}</view>
        </view>
      </view>
    </view>
    <!-- 占空 -->
    <view style="height: 296rpx"></view>
    <!-- 底部 -->
    <view class="footer_f">
      <view class="footer">
        <view class="footer_l">
          <u-checkbox-group
            v-model="agreementShow"
            shape="circle"
            activeColor="#FB3024"
            @change="checkboxChange"
          >
            <u-checkbox :name="1"> </u-checkbox>
          </u-checkbox-group>
          <view class="tit3">{{ '请阅读并同意' }}</view>
          <view class="tit2" @click="toAgree"> 《{{ '购买协议' }}》</view>
        </view>
        <view class="footer_r">
          <u-button
            type="success"
            class="uBtn"
            shape="circle"
            :loading="isLoading"
            :loadingText="'购买中'"
            @tap="goBuy"
            color="linear-gradient(to right, #fb3024, #fb3024 )"
            >{{ '购买' }}</u-button
          >
        </view>
      </view>
    </view>
    <!-- 选择国家 -->
    <u-picker
      :show="isCountry"
      @cancel="isCountry = false"
      @confirm="sureCountry"
      :columns="countryList"
      keyName="label"
    ></u-picker>
    <!-- 选择安置位置 -->
    <u-picker
      :show="isPlace"
      @cancel="isPlace = false"
      @confirm="surePlace"
      :columns="placeList"
      keyName="label"
    ></u-picker>
    <!-- 发货方式 -->
    <u-picker
      :show="isDelivery"
      @cancel="isDelivery = false"
      @confirm="sureDelivery"
      :columns="deliList"
      keyName="label"
    ></u-picker>
    <!-- 运输方式 -->
    <u-picker
      :show="isTrans"
      @cancel="isTrans = false"
      @confirm="sureTrans"
      :columns="transList"
      keyName="label"
    ></u-picker>
    <!-- 创客空间 -->
    <u-picker
      :show="ishowSure"
      @cancel="ishowSure = false"
      @confirm="surehowSure"
      :columns="queryCardList"
      keyName="label"
    ></u-picker>
    <!-- 发货仓库 -->
    <u-picker
      :show="isCk"
      @cancel="isCk = false"
      @confirm="sureCk"
      :columns="storehouseList"
      keyName="label"
    ></u-picker>
    <!-- 所属店铺 -->
    <u-picker
      :show="isDp"
      @cancel="isDp = false"
      @confirm="sureDp"
      :columns="storeList"
      keyName="label"
    ></u-picker>
    <!-- 银行名称 -->
    <u-picker
      :show="isBank"
      @cancel="isBank = false"
      @confirm="sureBank"
      :columns="bankList"
      keyName="label"
    ></u-picker>
    <!-- 强制阅读协议 -->
    <mustAgreeMent :waresCodeList="waresCodeList"></mustAgreeMent>
    <agreement ref="agreement"></agreement>
    <u-modal
      :show="delAddress"
      showConfirmButton
      showCancelButton
      :content="'确定要删除该收货地址吗' + '？'"
      confirmColor="#DE3932"
      @confirm="toDel"
      @cancel="delAddress = false"
      ref="uModal"
      :asyncClose="true"
    ></u-modal>
    <v-address
      ref="address"
      :defaultCode="defaultCode"
      @addressData="addressData"
    ></v-address>
  </view>
</template>

<script>
import address from "@/components/address.vue";
import mustAgreeMent from "@/components/mustAgreeMent.vue";
import * as api from "@/config/regiest";
import agreement from "@/components/agreement.vue";

export default {
  components: {
    "v-address": address,
    mustAgreeMent,
    agreement,
  },
  data() {
    return {
      isDeliveryWay: true,
      pt: false,
      isDp: false,
      storeList: [],
      storehouseList: [],
      isCk: false,
      delAddress: false,
      waresCodeList: [],
      defaultCode: [],
      moren: "",
      addressList: [],
      deliList: [],
      transList: [],
      queryCardList: [],
      ishowSure: false,
      howSure: false,
      bankList: [],
      isDelivery: false,
      isBank: false,
      isTrans: false,
      placeList: [
        [
          {
            id: 1,
            label: '安置左区',
          },
          {
            id: 2,
            label: '安置右区',
          },
        ],
      ],
      isPlace: false,
      countryIndex: 0,
      isCountry: false,
      userInfo: "",
      countryList: [],
      isClick: 0,
      specialArea: "",
      shoppingArr: [],
      allGoodsData: {},
      pageList: {
        mail: false,
        card: false,
        bankName: false,
        bankNo: false,
        accountBranch: false,
      },

      form: {
        parentName: "",
        deliveryName: '快递发货',
        deliveryWay: 1,
        postage: 0,
        transType: 1,
        pkGradeVal: "",
        placeParentName: "",
      },
      deliList: [],
      diqu: "",
      allData: [],
      goodsNum: 1,
      agreementShow: [],
      priceAmount: 0, //商品总价
      achiveAmount: 0, //总业绩
      totalAmont: 0,
      orderItemsParams: [],
      isLoading: false,
      centerCodeId: "",
      rules: {
        parent: [
          {
            required: true,
            message: '请输入推荐编号',
            trigger: ["blur"],
          },
        ],
        placeParent: [
          {
            required: true,
            validator: this.placeParentPass,
            trigger: ["blur"],
          },
        ],
        placeDeptLabel: [
          {
            required: true,
            validator: this.placeDeptPass,
            trigger: ["blur"],
          },
        ],
        memberName: [
          {
            required: true,
            message: '请输入会员名称',
            trigger: ["blur"],
          },
        ],
        phone: [{ validator: this.phonePass, trigger: ["blur"] }],
        recName: [
          {
            required: true,
            message: '请输入收货人',
            trigger: ["blur"],
          },
        ],
        recPhone: [
          {
            required: true,
            message: '请输入收货电话',
            trigger: ["blur"],
          },
        ],
        diqu: [
          {
            required: true,
            message: '请选择收货地址',
            trigger: ["change", "blur"],
          },
        ],
        recAddress: [
          {
            required: true,
            message: '请输入详细地址',
            trigger: ["blur"],
          },
        ],
        transTypeLabel: [
          { validator: this.transPass, trigger: ["change"] },
          // {
          //     required: this.isDeliveryWay,
          //     message: '请选择运输方式',
          //     trigger: ['change'],
          // },
        ],
        deliveryWayLabel: [
          {
            required: true,
            message: '请选择发货方式',
            trigger: ["change"],
          },
        ],
        makerSpaceMemberLabel: [
          {
            required: true,
            message: '请选择',
            trigger: ["change"],
          },
        ],
      },
      delId: "",
      selTable: [],
    };
  },
  onLoad(options) {
    this.pkCountry = uni.getStorageSync("pkCountry");
    this.specialArea = options.specialArea;
    this.shoppingArr = JSON.parse(options.shoppArr);
    if (options.selTable) {
      let a = JSON.parse(options.selTable);
      let b = a.map((item) => {
        return {
          waresCode: item.waresCode,
          quantity: item.quantity,
          waresItemsParamList: item.productGroup,
          waresName: item.waresName,
          achieve: 0,
          achieveAmount: 0,
          price: 0,
          priceAmount: 0,
          cover1: item.cover1,
          energySilo: 1,
        };
      });
      b.forEach((item) => {
        item.waresItemsParamList = item.waresItemsParamList.map((ctem) => {
          return {
            pkWaresSpecsSku: ctem.pkSkuId,
            quantity: ctem.quantity,
          };
        });
      });
      this.selTable = b;
    }
    // 获取购物车详情
    this.getCatDetail();
    // 获取页面权限
    this.getPageList();
    // 幂等性
    this.getGenerate();
    //  登录信息
    this.userInfo = uni.getStorageSync("User");
  },
  onShow() {
    // 获取地址
    this.getAddressList();
  },
  methods: {
    toAgree() {
      // agreeMent
      this.$refs.agreement.openDig();
    },
    addAdress() {
      uni.navigateTo({
        url: "/pages/address/index",
      });
    },
    editAddress(item) {
      uni.navigateTo({
        url: "/pages/address/index?pkId=" + item.pkId,
      });
    },
    delAds(id) {
      this.delId = id;
      this.delAddress = true;
    },
    toDel() {
      api.delAddress(this.delId).then((res) => {
        uni.showToast({
          title: '删除成功',
          icon: "none",
        });
        this.getAddressList();
      });
      this.delAddress = false;
    },
    getPageList() {
      api.registerList().then((res) => {
        res.data.forEach((item) => {
          if (item.field == "MAILBOX") {
            this.pageList.mail = true;
          } else if (item.field == "CREDENTIALS") {
            this.pageList.card = true;
          } else if (item.field == "BANK_NAME") {
            this.pageList.bankName = true;
          } else if (item.field == "BANK_NO") {
            this.pageList.bankNo = true;
          } else if (item.field == "Account_Branch") {
            this.pageList.accountBranch = true;
          }
        });
      });
    },
    getCatDetail() {
      api
        .shoppingWaresDetail({
          pkCountry: this.pkCountry,
          shoppingIds: this.shoppingArr,
          specialArea: this.specialArea,
        })
        .then((res) => {
          this.allGoodsData = res.data;
          this.waresCodeList = res.data.orderItemsParams.map((item) => {
            return item.waresCode;
          });
          this.allGoodsData.specialArea = this.specialArea;
          this.allGoodsData.pkSettleCountry = this.pkCountry;

          let howSure = this.allGoodsData.orderItemsParams.some(
            (item) => item.isMakerGift == 4 || item.isMakerGift == 0
          );
          this.howSure = howSure;
          this.selTable.forEach((item) => {
            this.allGoodsData.orderItemsParams.push(item);
          });
          this.totalAmont = this.allGoodsData.priceAmount;
          // 快速注册/普通注册
          this.toRegiest(this.isClick);
          // 获取地址
          // this.getAddressList()
          // 获取国家
          this.getCountry();
          // 获取运输方式
          this.getTransList();
          // 获取发货方式
          this.getDeliveryList();
          if (this.pkCountry != 1) {
            //获取会员店铺
            this.getStoreList();
            //获取仓库
            this.getStorehouseList();
          }
          // 获取银行
          this.getBank();
          // 获取省市县
          // this.getAllArea()
          // 获取会员等级
          this.getMember();
        });
    },
    toRegiest(val) {
      this.isClick = val;
      this.resetAll();
      if (val == 0) {
        // 推荐编号赋值
        this.form.parent = this.userInfo.memberCode;
        // 推荐姓名赋值
        this.form.parentName = this.userInfo.memberName;
        this.pt = false;
        // 从推荐编号获取安置信息
        this.getQuickReg();
      } else {
      }
      if (this.pkCountry == 1) {
        this.form.transType = 1;
        this.form.deliveryWay = 1;
      }
    },
    resetAll() {
      this.form.parent = "";
      this.form.placeDeptLabel = "";
      this.form.parentName = "";
      this.form.placeParent = "";
      this.form.placeParentName = "";
      this.form.placeDept = "";
      this.form.memberName = "";
      this.form.phone = "";
      this.form.idCard = "";
      this.form.pkBank = "";
      this.form.cardNumber = "";
      this.form.subBankName = "";
      this.form.email = "";
      this.form.deliveryWay = 1;
      this.form.transType = 1;
      this.$nextTick(() => {
        this.$refs.uForm.clearValidate();
      });
    },
    getMember() {
      let deleteList = [];
      this.shoppingArr.forEach((item) => {
        deleteList.push({
          shoppingId: item,
        });
      });
      this.allGoodsData.deleteList = deleteList;
      api.memLevel(this.allGoodsData).then((res) => {
        this.form.pkGradeVal = res.data.pkGradeVal;
      });
    },
    checkAddress() {},
    getQuickReg() {
      api
        .quickReg({
          parent: this.form.parent,
          specialArea: this.specialArea,
          pkSettleCountry: this.pkCountry,
        })
        .then((res) => {
          if (res.code == 200) {
            this.form.placeDept = res.data.placeDept;
            this.form.placeDeptLabel = res.data.placeDeptVal;
            this.form.placeParent = res.data.placeParent;
            this.form.placeParentName = res.data.placeParentName;
            this.form.parentName = res.data.parentName;
            if (res.data.isFirst) {
              // 普通注册首单
              this.pt = true;
            } else {
              // 普通注册首单
              this.pt = false;
            }
            // 获取创客空间
            if (this.howSure) {
              this.getQueryCard();
            }
            this.$forceUpdate();
          } else {
            console.log(122);
            this.$set(this.form, "parentName", "");
          }
        });
    },
    getValidPcode() {
      api
        .validPcode({
          parent: this.form.parent,
          pkSettleCountry: this.pkCountry,
        })
        .then((res) => {
          if (res.code == 200) {
            this.form.parentName = res.data.parentName;
            if (res.data.isFirst) {
              // 普通注册首单
              this.pt = true;
              this.form.placeDept = res.data.placeDept;
              this.form.placeDeptLabel =
                res.data.placeDept == 1 ? '左区' : '右区';
              this.form.placeParent = res.data.placeParent;
              this.form.placeParentName = res.data.placeParentName;
            } else {
              // 普通注册首单
              this.pt = false;
            }
            // 获取创客空间
            if (this.howSure) {
              this.getQueryCard();
            }
            this.$forceUpdate();
          }
        });
    },
    transPass(rule, value, callback) {
      if (this.isDeliveryWay) {
        if (!value) {
          callback(new Error('请选择运输方式'));
        } else {
          callback();
        }
      } else {
        callback();
      }
    },
    // 安置位置校验
    placeDeptPass(rule, value, callback) {
      if (!value) {
        callback(new Error('请选择安置位置'));
      } else {
        api
          .validPPcode({
            parent: this.form.parent,
            placeParent: this.form.placeParent,
            placeDept: this.form.placeDept,
            pkSettleCountry: this.pkCountry,
          })
          .then((res) => {
            if (res.code == 200) {
              this.form.placeParentName = res.data.placeParentName;
              // this.$nextTick(() => {
              //     this.$refs.uForm.clearValidate()
              // })
              this.$forceUpdate();
              console.log("安置位置校验");
              callback();
            } else {
              callback(new Error(res.msg));
            }
          });
      }
    },
    // 安置编号校验
    placeParentPass(rule, value, callback) {
      if (!value) {
        callback(new Error('请输入安置编号'));
      } else {
        api
          .validPPcode({
            parent: this.form.parent,
            placeParent: value,
            placeDept: this.form.placeDept,
            pkSettleCountry: this.pkCountry,
          })
          .then((res) => {
            if (res.code == 200) {
              this.form.placeParentName = res.data.placeParentName;
              this.$forceUpdate();
              console.log("安置编号校验");
              callback();
            } else {
              this.form.placeParentName = "";
              callback(new Error(res.msg));
            }
          });
      }
    },
    phonePass(rule, value, callback) {
      if (!value) {
        callback(new Error('请输入联系电话'));
        return false;
      }

      api
        .validPhone({
          memberName: this.form.memberName,
          phone: this.form.phone,
          placeParent: this.form.placeParent,
          pkSettleCountry: this.pkCountry,
        })
        .then((res) => {
          if (res.code == 200) {
            callback();
          } else {
            callback(new Error(res.msg));
          }
        });
    },
    getAddressList() {
      api
        .addressList({
          pkCountry: this.pkCountry,
        })
        .then((res) => {
          this.addressList = res.data;
          if (this.pkCountry == this.userInfo.pkCountry) {
            this.addressList.forEach((item) => {
              if (item.isDefault == 1) {
                this.moren = item.pkId;
                this.checkRadio();
              }
            });
          }
        });
    },
    checkboxChange(e) {},
    checkRadio() {
      let arr = [];
      this.addressList.forEach((item) => {
        if (item.pkId == this.moren) {
          this.form.recName = item.recName;
          this.form.nameList = item.recArea;
          this.form.recPhone = item.recPhone;
          this.form.recAddress = item.recAddress;
          this.form.recProvince = item.recProvince;
          this.form.recCity = item.recCity;
          if (item.recCounty) {
            this.form.diqu = `${item.recProvinceVal}-${item.recCityVal}-${item.recCountyVal}`;
            this.form.recCounty = item.recCounty;
          } else {
            this.form.diqu = `${item.recProvinceVal}-${item.recCityVal}`;
            this.form.recCounty = "";
          }
          this.defaultCode = [
            item.recProvince,
            item.recCity,
            item.recCounty || "",
          ];
        }
      });
      this.allGoodsData.deliveryWay = this.form.deliveryWay;
      this.allGoodsData.transType = this.form.transType;
      this.getPostAge();
      this.$forceUpdate();
    },
    getPostAge() {
      let deleteList = [];
      this.shoppingArr.forEach((item) => {
        deleteList.push({
          shoppingId: item,
        });
      });
      this.allGoodsData.deleteList = deleteList;
      api
        .queryPostage(
          Object.assign(
            {
              specialArea: this.specialArea,
              recName: this.form.recName,
              recPhone: this.form.recPhone,
              recAddress: this.form.recAddress,
              recProvince: this.form.recProvince,
              recCity: this.form.recCity,
              recCounty: this.form.recCounty,
              transType: this.form.transType,
              deliveryWay: this.form.deliveryWay,
            },
            this.allGoodsData
          )
        )
        .then((res) => {
          this.form.postage = Number(res.data.postage).toFixed(2);
          this.totalAmont =
            parseFloat(this.allGoodsData.priceAmount) +
            parseFloat(res.data.postage);
        });
    },
    getBank() {
      api.bankList().then((res) => {
        let data = res.data.map((item) => {
          return {
            id: item.pkId,
            label: item.bankName,
          };
        });
        this.bankList = [data];
      });
    },
    getTransList() {
      api.transportList({ pkCountry: this.pkCountry }).then((res) => {
        let data = res.data.map((item) => {
          return {
            id: item.value,
            label: item.label,
          };
        });
        this.transList = [data];
        this.form.transTypeLabel = data[0].label;
        // if (this.pkCountry == 1) {
        //   this.form.transType = 1;
        //   data.forEach((item) => {
        //     if (item.id == 1) {
        //       this.form.transTypeLabel = item.label;
        //     }
        //   });
        // }
      });
    },
    getQueryCard() {
      api
        .queryCard({ specialArea: this.specialArea, parent: this.form.parent })
        .then((res) => {
          let data = res.data.map((item) => {
            return {
              id: item.pkMember,
              label: item.storeName,
            };
          });
          this.queryCardList = [data];
        });
    },
    getDeliveryList() {
      api.deliveryList({ pkCountry: this.pkCountry }).then((res) => {
        let data = res.data.map((item) => {
          return {
            id: item.value,
            label: item.label,
          };
        });
        this.deliList = [data];
        this.form.deliveryWayLabel = data[0].label;
        // if (this.pkCountry == 1) {
        //   this.form.deliveryWay = 1;
        //   data.forEach((item) => {
        //     if (item.id == 1) {
        //       this.form.deliveryWayLabel = item.label;
        //     }
        //   });
        // }
      });
    },
    getStorehouseList() {
      api.storehouseList({ pkCountry: this.pkCountry }).then((res) => {
        let data = res.rows.map((item) => {
          return {
            id: item.pkId,
            label: item.name,
          };
        });
        this.storehouseList = [data];
      });
    },
    getStoreList() {
      api.storeList({ pkCountry: this.pkCountry }).then((res) => {
        let data = res.rows.map((item) => {
          return {
            id: item.pkId,
            label: item.storeName,
          };
        });
        this.storeList = [data];
      });
    },
    sureBank(e) {
      const { value } = e;
      this.form.pkBank = value[0].id;
      this.form.pkBankLabel = value[0].label;
      this.isBank = false;
    },
    sureTrans(e) {
      const { value } = e;
      this.form.transType = value[0].id;
      this.form.transTypeLabel = value[0].label;
      this.isTrans = false;
    },
    surehowSure(e) {
      const { value } = e;
      this.form.makerSpaceMember = value[0].id;
      this.form.makerSpaceMemberLabel = value[0].label;
      this.ishowSure = false;
    },
    sureCk(e) {
      const { value } = e;
      this.form.pkStorehouse = value[0].id;
      this.form.pkStorehouseLabel = value[0].label;
      this.isCk = false;
    },
    sureDp(e) {
      const { value } = e;
      this.form.pkMemberStore = value[0].id;
      this.form.pkMemberStoreLabel = value[0].label;
      this.isDp = false;
    },
    sureDelivery(e) {
      const { value } = e;
      this.form.deliveryWay = value[0].id;
      this.form.deliveryWayLabel = value[0].label;
      if (value[0].id == 2 || value[0].id == 3) {
        this.isDeliveryWay = false;
      } else {
        this.isDeliveryWay = true;
      }
      this.isDelivery = false;
    },
    surePlace(e) {
      const { value } = e;
      this.form.placeDept = value[0].id;
      this.form.placeDeptLabel = value[0].label;
      this.isPlace = false;
    },

    changeCountry(index) {
      this.isCountry = true;
      this.countryIndex = index;
    },
    sureCountry(e) {
      const { value } = e;
      if (this.countryIndex == 0) {
        this.form.pkCountry = value[0].id;
        this.form.pkCountryLabel = value[0].label;
        this.form.pkCountryImg = value[0].img;
      } else {
        this.form.pkSettleCountry = value[0].id;
        this.form.pkSettleCountryLabel = value[0].label;
        this.form.pkSettleCountryImg = value[0].img;
      }
      this.isCountry = false;
    },
    getCountry() {
      api.countryList().then((res) => {
        let data = res.data.map((item) => {
          return {
            img: item.nationalFlag2,
            id: item.pkId,
            label: item.shortName,
          };
        });
        this.countryList = [data];
        this.countryList[0].forEach((item) => {
          if (item.id == this.pkCountry) {
            // this.form.pkCountry = item.id
            // this.form.pkCountryLabel = item.label
            // this.form.pkCountryImg = item.img

            this.form.pkSettleCountry = item.id;
            this.form.pkSettleCountryLabel = item.label;
            this.form.pkSettleCountryImg = item.img;
          }
          if (item.id == this.userInfo.pkCountry) {
            this.form.pkCountry = item.id;
            this.form.pkCountryLabel = item.label;
            this.form.pkCountryImg = item.img;
          }
        });
      });
    },
    getGenerate() {
      api.generate().then((res) => {
        uni.setStorageSync("mToken", res.msg);
      });
    },
    goBuy() {
      this.$refs.uForm.validate().then((res) => {
        if (this.agreementShow.length == 0) {
          uni.showToast({
            title: '请阅读并同意购买协议',
            icon: "none",
            duration: 1500,
          });
          return;
        }
        this.isLoading = true;
        let deleteList = [];
        this.shoppingArr.forEach((item) => {
          deleteList.push({
            shoppingId: item,
          });
        });
        api
          .confirmRegOrder(
            Object.assign({}, this.form, this.allGoodsData, {
              deleteList: deleteList,
            })
          )
          .then((res) => {
            this.isLoading = false;
            if (res.code == 200) {
              uni.navigateTo({
                url:
                  "/pages/pay/index?paramsPost=" +
                  JSON.stringify(
                    Object.assign(
                      { makerSpaceMember: this.form.makerSpaceMember },
                      res.data
                    )
                  ) +
                  "&businessType=1",
              });
            }
          });
      });
    },
    getDiqu() {
      this.$refs.address.setShow();
    },
    confirmPopup() {},
    addressData(diqu, obj) {
      this.form.diqu = diqu;
      this.form.recProvince = obj.province;
      this.form.recCity = obj.city;
      this.form.recCounty = obj.county;
      this.$forceUpdate();
      this.getPostAge();
      // this.queryAdressPostage()
    },
  },
};
</script>

<style lang="scss" scoped>
.content {
  .con_top {
    width: 100%;
    position: fixed;
    display: flex;
    background: #fb3024;
    font-size: 28rpx;
    font-weight: 400;
    color: #ffffff;
    padding: 24rpx 0;
    z-index: 1;
    .con_top_i {
      flex: 1;
      text-align: center;
      .bai {
        width: 52rpx;
        height: 6rpx;
        background: #ffffff;
        margin: 0 auto;
        margin-top: 10rpx;
      }
    }
  }
  .zhan {
    height: 96rpx;
  }
}

.countImg {
  width: 62rpx;
  height: 41rpx;
  margin-right: 20rpx;
}

.context {
}

::v-deep .u-form-item__body {
  padding: 10px 20px;
}

::v-deep .u-input__content {
  padding: 0px 20rpx;
}

::v-deep .u-form-item__body__right__message {
  margin-left: 105px !important;
}

.disFlex {
  display: flex;
  align-items: center;
}

.justBwn {
  width: 100%;
  justify-content: space-between;
}

.goodList {
  display: flex;
  padding: 20rpx;
  border-bottom: 1px solid #eee;
  background: #fff;
}

.cover {
  width: 136rpx;
  height: 136rpx;
  background: #ffffff;
  border: 1px solid #eeeeee;
  border-radius: 10rpx;
}

.goodList_i {
  flex: 1;
}

.goodList_it {
  display: flex;
  padding: 0rpx 0 20rpx 0rpx;
  .goodList_ir {
    margin-left: 20rpx;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    .goodList_ib {
      display: flex;
      align-items: center;
      justify-content: space-between;
      img {
        width: 56rpx;
        height: 56rpx;
      }
    }
  }
}

.product_i {
  display: flex;
  align-items: center;
  background: #f6f6f6;
  padding: 28rpx;
  .product_il {
    display: flex;
    align-items: center;
    flex: 1;
    justify-content: space-between;
    margin-left: 20rpx;
  }
  img {
    width: 50rpx;
    height: 50rpx;
    background: #ffffff;
    border: 1px solid #dddddd;
    border-radius: 10rpx;
  }
}

.fen {
  background: #f6f6f6;
  padding: 0 28rpx 28rpx 28rpx;
}

.pad {
  padding: 28rpx;
}

.footer_f {
  position: fixed;
  bottom: 0;
  width: 100%;
  z-index: 10;
  background: #f2f2f2; // height: 296rpx;
}

.footer {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  padding: 20rpx 24rpx 40rpx 20rpx;
  .footer_l {
    display: flex;
    justify-content: center;
    margin: 30rpx 0 40rpx 0;
  }
  .footer_r {
    // flex: 1;
    display: flex;
    align-items: center;
    font-size: 20rpx;
    font-weight: 500;
    color: #333333;
  }
}

.tit1 {
  font-size: 28rpx;
  font-family: Source Han Sans CN;
  font-weight: 400;
  color: #333333;
}

.tit2 {
  font-size: 26rpx;
  font-family: Source Han Sans CN;
  font-weight: bold;
  color: #fb3024;
}

.tit3 {
  font-size: 26rpx;
  font-family: Source Han Sans CN;
  font-weight: 400;
  color: #999999;
}

.tit4 {
  font-size: 28rpx;
  font-family: PingFang SC;
  font-weight: 400;
  color: #333333;
}

.tit5 {
  font-size: 24rpx;
  font-family: Source Han Sans CN;
  font-weight: 400;
  color: #999999;
}

.heng {
  height: 20rpx;
  background: #f2f2f2;
}

.subTxt {
  background: #fb3024;
  font-size: 28rpx;
  font-family: Source Han Sans CN;
  font-weight: bold;
  color: #fff;
  padding: 35rpx 27rpx;
  display: flex;
  align-items: center;
  justify-content: space-between;
  .subTxt1 {
    border-left: 4px solid #fff;
    padding: 0 20rpx;
  }
  .subTxt2 {
    display: flex;
    align-items: center;
    view {
      margin-left: 20rpx;
    }
  }
}

.address_a {
  padding: 27rpx;
  border-bottom: 2rpx solid #eee;
}

.address_r {
  flex: 1;
  margin-left: 20rpx;
  font-size: 28rpx;
  font-family: Source Han Sans CN;
  font-weight: bold;
  color: #333333;
}

.address_rc {
  margin: 6rpx 0;
}

.mr {
  margin-left: 20rpx;
  background: #181818;
  border-radius: 16rpx;
  font-size: 20rpx;
  font-family: Source Han Sans CN;
  font-weight: 400;
  color: #ffffff;
  padding: 6rpx 16rpx;
  border-radius: 20px;
}
</style>