|
|
@@ -0,0 +1,1846 @@
|
|
|
+<template>
|
|
|
+ <div class="box" ref="appBox">
|
|
|
+ <!-- <div class="topbox_text">Cart Information</div> -->
|
|
|
+ <div class="contentbox">
|
|
|
+ <p class="cart_f">{{ $t("card.Cart") }}</p>
|
|
|
+ <div class="bottomcontentbox_b">
|
|
|
+ <div class="bottomcontentbox">
|
|
|
+ <!-- <div class="cart_p">
|
|
|
+ <p>Cart Information</p>
|
|
|
+ </div> -->
|
|
|
+ <!-- <div class="input_box">
|
|
|
+ <span>
|
|
|
+ {{$t('inquiry.QuickAdd')}}:
|
|
|
+ </span>
|
|
|
+ <el-input class="catalogInput" placeholder=""></el-input>
|
|
|
+ <span>{{$t('button.addQuoteForm')}}</span>
|
|
|
+ </div> -->
|
|
|
+
|
|
|
+ <el-table
|
|
|
+ class="table_boxf"
|
|
|
+ :empty-text="$t('table.notable')"
|
|
|
+ ref="dataTable"
|
|
|
+ :row-key="getRowKeys"
|
|
|
+ :data="list"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
+ @select-all="checkSelectAll"
|
|
|
+ @select="checkSelect"
|
|
|
+ header-row-class-name="table_header"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ type="selection"
|
|
|
+ :reserve-selection="true"
|
|
|
+ width="40"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ width="120"
|
|
|
+ prop="productCatalog"
|
|
|
+ :label="$t('table.catalog')"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="productName"
|
|
|
+ :label="$t('table.productName')"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ width="120"
|
|
|
+ prop="size"
|
|
|
+ :label="$t('table.size')"
|
|
|
+ ></el-table-column>
|
|
|
+ <el-table-column width="100" :label="$t('table.quantity')">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input-number
|
|
|
+ v-model="scope.row.number"
|
|
|
+ @change="handleChange($event, scope.row)"
|
|
|
+ :min="1"
|
|
|
+ label="描述文字"
|
|
|
+ ></el-input-number>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column width="100" :label="$t('bottomBar.Price')">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span class="price">{{ $t("bottomBar.money") }}</span>
|
|
|
+ <span class="line_total" v-if="$util.localeStorage()">{{
|
|
|
+ scope.row.price
|
|
|
+ }}</span>
|
|
|
+ <span class="line_total" v-if="!$util.localeStorage()">{{
|
|
|
+ scope.row.cnPrice
|
|
|
+ }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <!-- <el-table-column width="120" prop="discountPrice" :label="$t('card.Discount')"> -->
|
|
|
+ <el-table-column width="120" :label="$t('card.Discount')">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span class="price">{{ $t("bottomBar.money") }}</span>
|
|
|
+ <span class="line_total" v-if="$util.localeStorage()">{{
|
|
|
+ scope.row.discountPrice
|
|
|
+ }}</span>
|
|
|
+ <span class="line_total" v-if="!$util.localeStorage()">{{
|
|
|
+ scope.row.cnDiscountPrice
|
|
|
+ }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column width="100" :label="$t('card.Total')">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <span class="price">{{ $t("bottomBar.money") }}</span>
|
|
|
+ <span class="line_total" v-if="$util.localeStorage()">{{
|
|
|
+ scope.row.number * scope.row.discountPrice
|
|
|
+ }}</span>
|
|
|
+ <span class="line_total" v-if="!$util.localeStorage()">{{
|
|
|
+ scope.row.number * scope.row.cnDiscountPrice
|
|
|
+ }}</span>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column width="100" :label="$t('card.Operate')">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <i @click="tapDelete(scope.row)" class="el-icon-delete"></i>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <!-- 移动 -->
|
|
|
+ <el-table
|
|
|
+ class="table_pmd"
|
|
|
+ :empty-text="$t('table.notable')"
|
|
|
+ ref="dataTablewx"
|
|
|
+ :row-key="getRowKeys"
|
|
|
+ :data="list"
|
|
|
+ border
|
|
|
+ style="width: 100%"
|
|
|
+ @select-all="checkSelectAll"
|
|
|
+ @select="checkSelect"
|
|
|
+ header-row-class-name="table_header"
|
|
|
+ >
|
|
|
+ <el-table-column
|
|
|
+ type="selection"
|
|
|
+ :reserve-selection="true"
|
|
|
+ width="40"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="productCatalog"
|
|
|
+ :label="$t('table.catalog')"
|
|
|
+ style="width:20%;"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="productName"
|
|
|
+ :label="$t('table.productName')"
|
|
|
+ style="width:20%"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="size"
|
|
|
+ :label="$t('table.size')"
|
|
|
+ style="width:20%"
|
|
|
+ >
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column :label="$t('table.quantity')" style="width:20%">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-input-number
|
|
|
+ v-model="scope.row.number"
|
|
|
+ @change="handleChange($event, scope.row)"
|
|
|
+ :min="1"
|
|
|
+ label="描述文字"
|
|
|
+ ></el-input-number>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ :label="$t('checkout.More')"
|
|
|
+ style="width:20%"
|
|
|
+ type="expand"
|
|
|
+ >
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-form label-position="left" inline class="demo-table-expand">
|
|
|
+ <el-form-item :label="$t('bottomBar.Price')">
|
|
|
+ <span class="price">{{ $t("bottomBar.money") }}</span>
|
|
|
+ <span v-if="$util.localeStorage()">{{
|
|
|
+ scope.row.price
|
|
|
+ }}</span>
|
|
|
+ <span v-if="!$util.localeStorage()">{{
|
|
|
+ scope.row.cnPrice
|
|
|
+ }}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('card.Discount')">
|
|
|
+ <!-- <div>{{ scope.row.discountPrice }}</div> -->
|
|
|
+ <span class="price">{{ $t("bottomBar.money") }}</span>
|
|
|
+ <span v-if="$util.localeStorage()">{{
|
|
|
+ scope.row.discountPrice
|
|
|
+ }}</span>
|
|
|
+ <span v-if="!$util.localeStorage()">{{
|
|
|
+ scope.row.cnDiscountPrice
|
|
|
+ }}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('card.Total')">
|
|
|
+ <span class="price">{{ $t("bottomBar.money") }}</span>
|
|
|
+ <!-- <div>{{scope.row.number*scope.row.discountPrice}}</div> -->
|
|
|
+ <span v-if="$util.localeStorage()">{{
|
|
|
+ scope.row.number * scope.row.discountPrice
|
|
|
+ }}</span>
|
|
|
+ <span v-if="!$util.localeStorage()">{{
|
|
|
+ scope.row.number * scope.row.cnDiscountPrice
|
|
|
+ }}</span>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('card.Operate')">
|
|
|
+ <i @click="tapDelete(scope.row)" class="el-icon-delete"></i>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+
|
|
|
+ <div class="cart_button">
|
|
|
+ <button @click="tapDeleteAll">{{ $t("card.items") }}</button>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="cart_button_f">
|
|
|
+ <div class="cart_text" v-if="$util.localeStorage()">
|
|
|
+ {{ $t("card.Subtotal") }} :<span
|
|
|
+ >{{ $t("bottomBar.money")
|
|
|
+ }}{{ cartTotal.checkedGoodsDiscount }}</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <div class="cart_text" v-if="!$util.localeStorage()">
|
|
|
+ {{ $t("card.Subtotal") }} :<span
|
|
|
+ >{{ $t("bottomBar.money")
|
|
|
+ }}{{ cartTotal.checkedGoodsDiscount }}</span
|
|
|
+ >
|
|
|
+ </div>
|
|
|
+ <!-- <button @click="tapCheck">{{$t('card.check')}}</button> -->
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <!-- 客户联系信息 -->
|
|
|
+ <div class="customer_box">
|
|
|
+ <div class="customer" v-if="!tokenShow">
|
|
|
+ <div class="title">
|
|
|
+ {{ $t("taps.tips") }}<span class="required">*</span
|
|
|
+ >{{ $t("taps.tipsRequired") }}：
|
|
|
+ </div>
|
|
|
+ <el-form
|
|
|
+ :model="form"
|
|
|
+ class="demo-form-inline"
|
|
|
+ label-position="left"
|
|
|
+ :label-width="langShow ? '160px' : '120px'"
|
|
|
+ :inline="true"
|
|
|
+ >
|
|
|
+ <el-form-item :label="$t('input.email') + '：'" :required="true">
|
|
|
+ <el-input
|
|
|
+ v-model="form.email"
|
|
|
+ :placeholder="$t('input.email')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('register.Fullname') + '：'">
|
|
|
+ <el-input
|
|
|
+ v-model="form.name"
|
|
|
+ :placeholder="$t('register.Fullname')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('register.Company') + '：'">
|
|
|
+ <el-input
|
|
|
+ v-model="form.company"
|
|
|
+ :placeholder="$t('register.Company')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('register.Country') + '：'">
|
|
|
+ <el-select
|
|
|
+ v-if="langShow"
|
|
|
+ v-model="form.country"
|
|
|
+ :placeholder="$t('register.Country')"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in regionList"
|
|
|
+ :key="item.en"
|
|
|
+ :label="item.en"
|
|
|
+ :value="item.en"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ <el-select
|
|
|
+ v-else
|
|
|
+ v-model="form.country"
|
|
|
+ :placeholder="$t('register.Country')"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in regionList"
|
|
|
+ :key="item.cn"
|
|
|
+ :label="item.cn"
|
|
|
+ :value="item.cn"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item :label="$t('register.Account') + '：'">
|
|
|
+ <el-select
|
|
|
+ v-model="form.accountType"
|
|
|
+ :placeholder="$t('register.Account')"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in accountTypeList"
|
|
|
+ :key="$util.localeStorage() ? item.name : item.nameCn"
|
|
|
+ :label="$util.localeStorage() ? item.name : item.nameCn"
|
|
|
+ :value="item.name"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <!-- 收货地址 -->
|
|
|
+ <div class="information customer">
|
|
|
+ <div class="title title_s">
|
|
|
+ {{ $t("checkout.Shipping") }}
|
|
|
+ <div class="horizontal"></div>
|
|
|
+ </div>
|
|
|
+ <disdAddress @onaddress="onaddress" v-if="tokenShow"></disdAddress>
|
|
|
+ <el-form
|
|
|
+ v-else
|
|
|
+ :model="receipt"
|
|
|
+ ref="receipt"
|
|
|
+ class="demo-form-inline"
|
|
|
+ label-position="left"
|
|
|
+ :label-width="langShow ? '160px' : '120px'"
|
|
|
+ :inline="true"
|
|
|
+ >
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('checkout.Name') + '：'"
|
|
|
+ :required="true"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="receipt.name"
|
|
|
+ :placeholder="$t('checkout.Name')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('checkout.Phone') + '：'"
|
|
|
+ :required="true"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="receipt.tel"
|
|
|
+ :placeholder="$t('checkout.Phone')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('checkout.Institute') + '：'"
|
|
|
+ :required="true"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="receipt.company"
|
|
|
+ :placeholder="$t('checkout.Institute')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('order.country') + '：'"
|
|
|
+ :required="true"
|
|
|
+ v-if="langShow"
|
|
|
+ >
|
|
|
+ <el-select
|
|
|
+ v-model="receipt.country"
|
|
|
+ :placeholder="$t('register.Country')"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in regionList"
|
|
|
+ :key="item.en"
|
|
|
+ :label="item.en"
|
|
|
+ :value="item.en"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="省:" :required="true" v-if="!langShow">
|
|
|
+ <el-select
|
|
|
+ v-model="receipt.province"
|
|
|
+ placeholder="省"
|
|
|
+ @change="changeProvince"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in province"
|
|
|
+ :key="item.label"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.label"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="市:" :required="true" v-if="!langShow">
|
|
|
+ <el-select v-model="receipt.city" placeholder="市">
|
|
|
+ <el-option
|
|
|
+ v-for="item in city"
|
|
|
+ :key="item.label"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.label"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('checkout.Addre') + '：'"
|
|
|
+ :required="true"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="receipt.address"
|
|
|
+ :placeholder="$t('checkout.Addre')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('checkout.postal') + '：'"
|
|
|
+ :required="true"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="receipt.postalCode"
|
|
|
+ :placeholder="$t('checkout.postal')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <!-- 账单地址 -->
|
|
|
+ <div class="information customer" v-if="!tokenShow">
|
|
|
+ <div class="title title_s">
|
|
|
+ {{ $t("checkout.Choose") }}
|
|
|
+ <div class="horizontal"></div>
|
|
|
+ </div>
|
|
|
+ <div class="checked_b">
|
|
|
+ <el-checkbox v-model="identical" @change="identicalChange">{{
|
|
|
+ $t("taps.sameAs")
|
|
|
+ }}</el-checkbox>
|
|
|
+ </div>
|
|
|
+ <el-form
|
|
|
+ :model="bill"
|
|
|
+ ref="bill"
|
|
|
+ class="demo-form-inline"
|
|
|
+ label-position="left"
|
|
|
+ :label-width="langShow ? '160px' : '120px'"
|
|
|
+ :inline="true"
|
|
|
+ >
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('checkout.Name') + '：'"
|
|
|
+ :required="true"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="bill.name"
|
|
|
+ :placeholder="$t('checkout.Name')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('checkout.Phone') + '：'"
|
|
|
+ :required="true"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="bill.tel"
|
|
|
+ :placeholder="$t('checkout.Phone')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('checkout.Institute') + '：'"
|
|
|
+ :required="true"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="bill.company"
|
|
|
+ :placeholder="$t('checkout.Institute')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('order.country') + '：'"
|
|
|
+ :required="true"
|
|
|
+ v-if="langShow"
|
|
|
+ >
|
|
|
+ <el-select
|
|
|
+ v-model="bill.country"
|
|
|
+ :placeholder="$t('register.Country')"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in regionList"
|
|
|
+ :key="item.en"
|
|
|
+ :label="item.en"
|
|
|
+ :value="item.en"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="省:" :required="true" v-if="!langShow">
|
|
|
+ <el-select
|
|
|
+ v-model="bill.province"
|
|
|
+ placeholder="省"
|
|
|
+ @change="billProvince"
|
|
|
+ >
|
|
|
+ <el-option
|
|
|
+ v-for="item in province"
|
|
|
+ :key="item.label"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.label"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="市:" :required="true" v-if="!langShow">
|
|
|
+ <el-select v-model="bill.city" placeholder="市">
|
|
|
+ <el-option
|
|
|
+ v-for="item in billCity"
|
|
|
+ :key="item.label"
|
|
|
+ :label="item.label"
|
|
|
+ :value="item.label"
|
|
|
+ >
|
|
|
+ </el-option>
|
|
|
+ </el-select>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('checkout.Addre') + '：'"
|
|
|
+ :required="true"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="bill.address"
|
|
|
+ :placeholder="$t('checkout.Addre')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item
|
|
|
+ :label="$t('checkout.postal') + '：'"
|
|
|
+ :required="true"
|
|
|
+ >
|
|
|
+ <el-input
|
|
|
+ v-model="bill.postalCode"
|
|
|
+ :placeholder="$t('checkout.postal')"
|
|
|
+ ></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ </div>
|
|
|
+ <div class="information customer">
|
|
|
+ <div class="title title_s">
|
|
|
+ {{ $t("checkout.Payout") }}
|
|
|
+ <div class="horizontal"></div>
|
|
|
+ </div>
|
|
|
+ <dissPayment></dissPayment>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div class="checkButtom">
|
|
|
+ <button class="buttom" @click="submit">
|
|
|
+ {{ $t("application.Submit") }}
|
|
|
+ </button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+import region from "@/js/region";
|
|
|
+import provinces from "@/js/provinces";
|
|
|
+import disdAddress from "@/components/diss-address";
|
|
|
+import dissPayment from "@/components/diss-payment";
|
|
|
+export default {
|
|
|
+ components: {
|
|
|
+ disdAddress,
|
|
|
+ dissPayment
|
|
|
+ },
|
|
|
+ name: "mycart",
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ identical: false,
|
|
|
+ rules: [],
|
|
|
+ langShow: this.$util.localeStorage(),
|
|
|
+ regionList: [], // 国家
|
|
|
+ province: [], // 市
|
|
|
+ city: [],
|
|
|
+ billCity: [], // 账单省
|
|
|
+ tokenShow: !!localStorage.getItem("token"),
|
|
|
+ list: [],
|
|
|
+ cartTotal: {
|
|
|
+ checkedGoodsDiscount: 0
|
|
|
+ },
|
|
|
+ checkList: [],
|
|
|
+ selectList: [], // 选中
|
|
|
+ form: {
|
|
|
+ email: "",
|
|
|
+ name: "",
|
|
|
+ accountType: "",
|
|
|
+ country: "",
|
|
|
+ company: "",
|
|
|
+ position: ""
|
|
|
+ },
|
|
|
+ receipt: {
|
|
|
+ // 收货
|
|
|
+ address: "", // 详细收货地址
|
|
|
+ city: "", // 中文版–市
|
|
|
+ company: "", // 企业
|
|
|
+ country: "", // 国家 中文默认传China
|
|
|
+ id: 0,
|
|
|
+ isDefault: false, // 是否默认地址
|
|
|
+ name: "", // 收货人名称
|
|
|
+ postalCode: "", // 邮政编码
|
|
|
+ province: "", // 中文版–省
|
|
|
+ tel: "" // 手机号码
|
|
|
+ },
|
|
|
+ bill: {
|
|
|
+ // 账单
|
|
|
+ address: "", // 详细账单地址
|
|
|
+ city: "", // 中文版–市
|
|
|
+ company: "", // 企业
|
|
|
+ country: "", // 国家 中文默认传China
|
|
|
+ id: 0,
|
|
|
+ isDefault: false, // 是否默认地址
|
|
|
+ name: "", // 账单人名称
|
|
|
+ postalCode: "", // 邮政编码
|
|
|
+ province: "", // 中文版–省
|
|
|
+ tel: "" // 手机号码
|
|
|
+ },
|
|
|
+ accountTypeList: [
|
|
|
+ {
|
|
|
+ name: "Industry",
|
|
|
+ nameCn: "工业客户"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "Academic",
|
|
|
+ nameCn: "科研客户"
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: "Distributor",
|
|
|
+ nameCn: "经销商"
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ delFlagId: "",
|
|
|
+ billId: ""
|
|
|
+ };
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ onaddress(e) {
|
|
|
+ this.delFlagId = e.delFlag;
|
|
|
+ this.billId = e.billId;
|
|
|
+ },
|
|
|
+ identicalChange(e) {
|
|
|
+ // 是否与帐单地址相同
|
|
|
+ if (e) {
|
|
|
+ this.bill = { ...this.receipt };
|
|
|
+ // this.$set(this.bill, this.receipt)
|
|
|
+ } else {
|
|
|
+ this.bill.address = "";
|
|
|
+ this.bill.city = "";
|
|
|
+ this.bill.company = "";
|
|
|
+ this.bill.country = "";
|
|
|
+ this.bill.id = 0;
|
|
|
+ this.bill.isDefault = false;
|
|
|
+ this.bill.name = "";
|
|
|
+ this.bill.postalCode = "";
|
|
|
+ this.bill.province = "";
|
|
|
+ this.bill.tel = "";
|
|
|
+ }
|
|
|
+ },
|
|
|
+ submit() {
|
|
|
+ // 提交
|
|
|
+ if (this.tokenShow) {
|
|
|
+ this.tapsubmit();
|
|
|
+ } else {
|
|
|
+ // console.log(this.checkList, '-------')
|
|
|
+ this.noToken();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ noToken() {
|
|
|
+ if (
|
|
|
+ this.userVerification() &&
|
|
|
+ this.verification() &&
|
|
|
+ this.billVerification()
|
|
|
+ ) {
|
|
|
+ if (this.checkList.length > 0) {
|
|
|
+ this.$api
|
|
|
+ .post("order/submitNoLogin", {
|
|
|
+ cartId: 0,
|
|
|
+ cartList: this.checkList,
|
|
|
+ fpAddress: this.receipt,
|
|
|
+ message: "",
|
|
|
+ shAddress: this.bill,
|
|
|
+ user: this.form
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (res.code === 0) {
|
|
|
+ this.$message({
|
|
|
+ message: this.$t("message.checkoutSuccess"),
|
|
|
+ type: "success"
|
|
|
+ });
|
|
|
+ for (let i = 0; i < this.list.length; i++) {
|
|
|
+ for (let j = 0; j < this.checkList.length; j++) {
|
|
|
+ if (this.list[i].skuId === this.checkList[j].skuId) {
|
|
|
+ this.list.splice(i, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ window.gtag && window.gtag("event", "submit_cart");
|
|
|
+ localStorage.setItem("shoppingCart", JSON.stringify(this.list));
|
|
|
+ localStorage.setItem(
|
|
|
+ "shoppingNum",
|
|
|
+ JSON.stringify(this.list.length)
|
|
|
+ );
|
|
|
+ this.$router.push({ name: "ordersuccess" });
|
|
|
+ } else {
|
|
|
+ this.$message(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.$message(this.$t("button.Itsover"));
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ tapsubmit() {
|
|
|
+ // 登录提交订单
|
|
|
+ this.$api
|
|
|
+ .post("order/submit", {
|
|
|
+ cartId: 0,
|
|
|
+ fpAddress: { id: this.billId },
|
|
|
+ message: "",
|
|
|
+ shAddress: { id: this.delFlagId }
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.$message({
|
|
|
+ message: this.$t("message.checkoutSuccess"),
|
|
|
+ type: "success"
|
|
|
+ });
|
|
|
+ gtag("event", "submit_cart");
|
|
|
+ this.$router.push({ name: "ordersuccess" });
|
|
|
+ } else {
|
|
|
+ this.$message(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 发货地址获取市
|
|
|
+ changeProvince(e) {
|
|
|
+ let that = this;
|
|
|
+ that.receipt.city = "";
|
|
|
+ that.province.forEach(item => {
|
|
|
+ if (item.label == e) {
|
|
|
+ that.city = item.children;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 账单地址获取市
|
|
|
+ billProvince(e) {
|
|
|
+ let that = this;
|
|
|
+ that.bill.city = "";
|
|
|
+ that.province.forEach(item => {
|
|
|
+ if (item.label == e) {
|
|
|
+ that.billCity = item.children;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // tapCheck () {
|
|
|
+ // if (JSON.parse(localStorage.getItem('token'))) {
|
|
|
+ // if (this.cartTotal.checkedGoodsDiscount > 0) {
|
|
|
+ // this.$router.push({name: 'checkout'})
|
|
|
+ // } else {
|
|
|
+ // this.$message.error(this.$t('message.PleaseSelect'))
|
|
|
+ // }
|
|
|
+ // } else {
|
|
|
+ // this.$router.push({name: 'login'})
|
|
|
+ // }
|
|
|
+ // },
|
|
|
+ getRowKeys(row, index) {
|
|
|
+ if (JSON.parse(localStorage.getItem("token"))) {
|
|
|
+ return row.id;
|
|
|
+ } else {
|
|
|
+ return row.skuId;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ checkSelectAll(e) {
|
|
|
+ // 全选
|
|
|
+ let that = this;
|
|
|
+ var obj = [];
|
|
|
+ that.selectList = [];
|
|
|
+ if (JSON.parse(localStorage.getItem("token"))) {
|
|
|
+ if (e.length > 0) {
|
|
|
+ e.forEach(item => {
|
|
|
+ that.selectList.push(item.id);
|
|
|
+ });
|
|
|
+ that.checked(true, that.selectList);
|
|
|
+ } else {
|
|
|
+ that.list.forEach(item => {
|
|
|
+ obj.push(item.id);
|
|
|
+ });
|
|
|
+ that.checked(false, obj);
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (e.length > 0) {
|
|
|
+ var objList = [];
|
|
|
+ e.forEach(item => {
|
|
|
+ let data = {
|
|
|
+ checked: true,
|
|
|
+ id: item.id,
|
|
|
+ number: item.number,
|
|
|
+ productCatalog: item.productCatalog,
|
|
|
+ skuId: item.skuId
|
|
|
+ };
|
|
|
+ objList.push(data);
|
|
|
+ });
|
|
|
+ this.checkList = objList;
|
|
|
+ } else {
|
|
|
+ this.checkList = [];
|
|
|
+ }
|
|
|
+ console.log(e, "============", this.checkList);
|
|
|
+ // this.$router.push({name: 'login'})
|
|
|
+ }
|
|
|
+ },
|
|
|
+ checkSelect(selection, row) {
|
|
|
+ // 单选
|
|
|
+ let that = this;
|
|
|
+ let data = [row.id];
|
|
|
+ if (selection.length > that.selectList.length) {
|
|
|
+ selection.forEach(item => {
|
|
|
+ that.selectList.push(item.id);
|
|
|
+ });
|
|
|
+ this.checked(true, data, row);
|
|
|
+ } else {
|
|
|
+ that.selectList.forEach((item, index) => {
|
|
|
+ if (item == row.id) {
|
|
|
+ that.selectList.splice(index, 1);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ this.checked(false, data, row);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ checked(checked, obj, row) {
|
|
|
+ // checked
|
|
|
+ let that = this;
|
|
|
+ if (JSON.parse(localStorage.getItem("token"))) {
|
|
|
+ that.$api
|
|
|
+ .post("cart/checked", {
|
|
|
+ checked: checked,
|
|
|
+ ids: obj
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ // console.log(res)
|
|
|
+ that.getList();
|
|
|
+ } else {
|
|
|
+ this.$message(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ if (checked) {
|
|
|
+ let data = {
|
|
|
+ checked: true,
|
|
|
+ id: row.id,
|
|
|
+ number: row.number,
|
|
|
+ productCatalog: row.productCatalog,
|
|
|
+ skuId: row.skuId
|
|
|
+ };
|
|
|
+ this.checkList.push(data);
|
|
|
+ } else {
|
|
|
+ for (let i = 0; i < this.checkList.length; i++) {
|
|
|
+ if (this.checkList[i].skuId === row.skuId) {
|
|
|
+ this.checkList.splice(i, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ tapDeleteAll() {
|
|
|
+ // 删除所有
|
|
|
+ let that = this;
|
|
|
+ var obj = [];
|
|
|
+ if (JSON.parse(localStorage.getItem("token"))) {
|
|
|
+ that.list.forEach(item => {
|
|
|
+ obj.push(item.id);
|
|
|
+ });
|
|
|
+ that.$api
|
|
|
+ .post("cart/delete", {
|
|
|
+ checked: true,
|
|
|
+ ids: this.selectList
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ that.getList();
|
|
|
+ } else {
|
|
|
+ this.$message(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.list = [];
|
|
|
+ this.checkList = [];
|
|
|
+ localStorage.removeItem("shoppingCart");
|
|
|
+ localStorage.setItem("shoppingNum", JSON.stringify(this.list.length));
|
|
|
+ }
|
|
|
+ },
|
|
|
+ tapDelete(e) {
|
|
|
+ // 删除
|
|
|
+ let that = this;
|
|
|
+ if (JSON.parse(localStorage.getItem("token"))) {
|
|
|
+ this.$api
|
|
|
+ .post("cart/delete", {
|
|
|
+ checked: true,
|
|
|
+ ids: [e.id]
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.getList();
|
|
|
+ } else {
|
|
|
+ this.$message(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ this.list.forEach((item, index) => {
|
|
|
+ if (item.skuId == e.skuId) {
|
|
|
+ if (this.$util.localeStorage()) {
|
|
|
+ that.cartTotal.checkedGoodsDiscount =
|
|
|
+ that.cartTotal.checkedGoodsDiscount -
|
|
|
+ e.number * e.discountPrice;
|
|
|
+ } else {
|
|
|
+ that.cartTotal.checkedGoodsDiscount =
|
|
|
+ that.cartTotal.checkedGoodsDiscount -
|
|
|
+ e.number * e.cnDiscountPrice;
|
|
|
+ }
|
|
|
+ that.list.splice(index, 1);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ for (let i = 0; i < this.checkList.length; i++) {
|
|
|
+ if (this.checkList[i].skuId === e.skuId) {
|
|
|
+ this.checkList.splice(i, 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ localStorage.setItem("shoppingCart", JSON.stringify(this.list));
|
|
|
+ localStorage.setItem("shoppingNum", JSON.stringify(this.list.length));
|
|
|
+ }
|
|
|
+ },
|
|
|
+ getList() {
|
|
|
+ let that = this;
|
|
|
+ let data = JSON.parse(localStorage.getItem("shoppingCart"));
|
|
|
+ let arry = [];
|
|
|
+ if (JSON.parse(localStorage.getItem("token"))) {
|
|
|
+ if (data && data.length > 0) {
|
|
|
+ data.forEach(item => {
|
|
|
+ var obj = {
|
|
|
+ checked: true,
|
|
|
+ id: item.id,
|
|
|
+ number: item.number,
|
|
|
+ productCatalog: item.productCatalog,
|
|
|
+ skuId: item.skuId
|
|
|
+ };
|
|
|
+ arry.push(obj);
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ arry = null;
|
|
|
+ }
|
|
|
+ this.$api
|
|
|
+ .post("cart/index", {
|
|
|
+ cartList: arry
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.list = res.data.cartList;
|
|
|
+ this.cartTotal = res.data.cartTotal;
|
|
|
+ localStorage.removeItem("shoppingCart");
|
|
|
+ localStorage.setItem(
|
|
|
+ "shoppingNum",
|
|
|
+ JSON.stringify(res.data.cartList.length)
|
|
|
+ );
|
|
|
+ } else {
|
|
|
+ this.$message(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ if (data && data.length > 0) {
|
|
|
+ data.forEach(item => {
|
|
|
+ that.list.push(item);
|
|
|
+ let data = {
|
|
|
+ checked: true,
|
|
|
+ id: item.id,
|
|
|
+ number: item.number,
|
|
|
+ productCatalog: item.productCatalog,
|
|
|
+ skuId: item.skuId
|
|
|
+ };
|
|
|
+ that.checkList.push(data);
|
|
|
+ if (this.$util.localeStorage()) {
|
|
|
+ that.cartTotal.checkedGoodsDiscount +=
|
|
|
+ item.number * item.discountPrice;
|
|
|
+ } else {
|
|
|
+ that.cartTotal.checkedGoodsDiscount +=
|
|
|
+ item.number * item.cnDiscountPrice;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleChange(e, obj) {
|
|
|
+ // 更新
|
|
|
+ let that = this;
|
|
|
+ if (JSON.parse(localStorage.getItem("token"))) {
|
|
|
+ this.$api
|
|
|
+ .post("cart/update", {
|
|
|
+ checked: obj.checked,
|
|
|
+ id: obj.id,
|
|
|
+ number: obj.number,
|
|
|
+ productCatalog: obj.productCatalog,
|
|
|
+ skuId: obj.skuId
|
|
|
+ })
|
|
|
+ .then(res => {
|
|
|
+ if (res.code == 0) {
|
|
|
+ this.getList();
|
|
|
+ } else {
|
|
|
+ this.getList();
|
|
|
+ this.$message(res.msg);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ that.cartTotal.checkedGoodsDiscount = 0;
|
|
|
+ this.list.forEach(item => {
|
|
|
+ if (this.$util.localeStorage()) {
|
|
|
+ that.cartTotal.checkedGoodsDiscount +=
|
|
|
+ item.number * item.discountPrice;
|
|
|
+ } else {
|
|
|
+ that.cartTotal.checkedGoodsDiscount +=
|
|
|
+ item.number * item.cnDiscountPrice;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ localStorage.setItem("shoppingCart", JSON.stringify(this.list));
|
|
|
+ }
|
|
|
+ },
|
|
|
+ verification() {
|
|
|
+ // 收货地址验证
|
|
|
+ if (!this.langShow) {
|
|
|
+ if (!this.receipt.name) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Name") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.tel) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Phone") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.$util.isMobile(this.receipt.tel)) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Phone") + this.$t("message.IncorrectFormat")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.company) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Institute") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.province) {
|
|
|
+ this.$message.error("请选择省份");
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.city) {
|
|
|
+ this.$message.error("请选择市");
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.address) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Addre") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.postalCode) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.postal") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (!this.receipt.name) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Name") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.tel) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Phone") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.$util.isMobile(this.receipt.tel)) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Phone") + this.$t("message.IncorrectFormat")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.company) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Institute") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.country) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("message.PleaseSelects") + this.$t("order.country")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.address) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Addre") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.receipt.postalCode) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.postal") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ billVerification() {
|
|
|
+ // 账单地址验证
|
|
|
+ if (!this.langShow) {
|
|
|
+ if (!this.bill.name) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Name") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.tel) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Phone") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.$util.isMobile(this.bill.tel)) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Phone") + this.$t("message.IncorrectFormat")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.company) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Institute") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.province) {
|
|
|
+ this.$message.error("请选择省份");
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.city) {
|
|
|
+ this.$message.error("请选择市");
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.address) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Addre") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.postalCode) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.postal") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ if (!this.bill.name) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Name") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.tel) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Phone") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.$util.isMobile(this.bill.tel)) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Phone") + this.$t("message.IncorrectFormat")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.company) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Institute") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.country) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("message.PleaseSelects") + this.$t("order.country")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.address) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.Addre") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.bill.postalCode) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("checkout.postal") + this.$t("message.notEmpty")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ initialization() {
|
|
|
+ // 获取个人信息
|
|
|
+ if (JSON.parse(localStorage.getItem("token"))) {
|
|
|
+ var userInfo = JSON.parse(localStorage.getItem("user"));
|
|
|
+ this.form.user = userInfo.name;
|
|
|
+ this.form.accountType = userInfo.accountType;
|
|
|
+ this.form.country = userInfo.country;
|
|
|
+ this.form.company = userInfo.company;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ userVerification() {
|
|
|
+ // 个人信息验证
|
|
|
+ if (!this.form.email) {
|
|
|
+ this.$message.error(
|
|
|
+ this.$t("register.Address") + this.$t("register.Cannot")
|
|
|
+ );
|
|
|
+ return false;
|
|
|
+ } else if (!this.$util.isEmail(this.form.email)) {
|
|
|
+ this.$message.error(this.$t("input.email") + this.$t("message.email"));
|
|
|
+ return false;
|
|
|
+ } else {
|
|
|
+ return true;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ watch: {
|
|
|
+ list(n, o) {
|
|
|
+ let that = this;
|
|
|
+ this.$nextTick(() => {
|
|
|
+ that.selectList = [];
|
|
|
+ that.list.forEach(item => {
|
|
|
+ if (item.checked) {
|
|
|
+ if (that.$refs.appBox.clientWidth > 750) {
|
|
|
+ this.$refs.dataTable.toggleRowSelection(item, true);
|
|
|
+ that.selectList.push(item.id);
|
|
|
+ } else {
|
|
|
+ this.$refs.dataTablewx.toggleRowSelection(item, true);
|
|
|
+ that.selectList.push(item.id);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ });
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {},
|
|
|
+ created() {
|
|
|
+ this.getList();
|
|
|
+ this.regionList = region;
|
|
|
+ this.province = provinces;
|
|
|
+ this.initialization();
|
|
|
+ }
|
|
|
+};
|
|
|
+</script>
|
|
|
+<style lang="scss" scoped>
|
|
|
+@media screen and (min-width: 751px) and (max-width: 9999px) {
|
|
|
+ .box {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+ .topbox_text {
|
|
|
+ font-size: 20px;
|
|
|
+ margin-bottom: 2.4rem;
|
|
|
+ }
|
|
|
+ .contentbox {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .contentbox > .cart_f {
|
|
|
+ font-size: 16px;
|
|
|
+ padding: 1rem 1rem;
|
|
|
+ font-weight: 700;
|
|
|
+ font-family: Arial;
|
|
|
+ color: #005bab;
|
|
|
+ background: #cfe0ef;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottomcontentbox_b {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ padding: 2rem;
|
|
|
+ border: 1px solid #dbdbdb;
|
|
|
+ background: #ffffff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottomcontentbox /deep/ {
|
|
|
+ border: 1px solid #dbdbdb;
|
|
|
+ background: white;
|
|
|
+ padding: 1rem;
|
|
|
+ margin-bottom: 1.6rem;
|
|
|
+ .cart_p {
|
|
|
+ // border-bottom:1px solid #DBDBDB;
|
|
|
+ p {
|
|
|
+ margin-bottom: 1rem;
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 600;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-table {
|
|
|
+ .table_header {
|
|
|
+ color: #005bab;
|
|
|
+ }
|
|
|
+ .el-table__body-wrapper {
|
|
|
+ .el-table__row {
|
|
|
+ .cell {
|
|
|
+ .el-icon-delete {
|
|
|
+ font-size: 18px;
|
|
|
+ color: #005bab;
|
|
|
+ font-weight: 600;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .el-input-number {
|
|
|
+ width: 100% !important;
|
|
|
+ line-height: 30px;
|
|
|
+ .el-input-number__decrease {
|
|
|
+ width: 20px;
|
|
|
+ height: 28px;
|
|
|
+ top: 50%;
|
|
|
+ transform: translateY(-50%);
|
|
|
+ .el-icon-minus {
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-input-number__increase {
|
|
|
+ width: 20px;
|
|
|
+ height: 28px;
|
|
|
+ top: 50%;
|
|
|
+ transform: translateY(-50%);
|
|
|
+ .el-icon-plus {
|
|
|
+ margin-top: -10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-input {
|
|
|
+ .el-input__inner {
|
|
|
+ padding: 0 20px;
|
|
|
+ height: 30px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .input_box /deep/ {
|
|
|
+ display: none;
|
|
|
+ align-items: center;
|
|
|
+ margin: 1rem 0;
|
|
|
+ & > span:nth-of-type(1) {
|
|
|
+ font-size: 14px;
|
|
|
+ float: left;
|
|
|
+ // color: #005BAB;
|
|
|
+ margin-top: 0.3rem;
|
|
|
+ margin-right: 0.5rem;
|
|
|
+ }
|
|
|
+ & > span:nth-of-type(2) {
|
|
|
+ padding: 0 1rem;
|
|
|
+ line-height: 2rem;
|
|
|
+ height: 2rem;
|
|
|
+ border: 1px solid #d3d3d3;
|
|
|
+ display: inline-block;
|
|
|
+ background: #005bab;
|
|
|
+ color: white;
|
|
|
+ border-radius: 0.2rem;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .catalogInput {
|
|
|
+ width: 170px;
|
|
|
+ margin-right: 0.5rem;
|
|
|
+ .el-input__inner {
|
|
|
+ height: 2rem;
|
|
|
+ border: 1px solid #d3d3d3;
|
|
|
+ float: left;
|
|
|
+ border-radius: 0.2rem;
|
|
|
+ text-indent: 0.5rem;
|
|
|
+ padding: 0 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .cart_button {
|
|
|
+ border-bottom: 1px solid #dbdbdb;
|
|
|
+ overflow: hidden;
|
|
|
+ button {
|
|
|
+ margin: 1rem 0;
|
|
|
+ padding: 0.5rem;
|
|
|
+ background: #005bab;
|
|
|
+ color: white;
|
|
|
+ border: none;
|
|
|
+ border-radius: 0.2rem;
|
|
|
+ float: right;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .cart_button_f {
|
|
|
+ overflow: hidden;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: flex-end;
|
|
|
+ .cart_text {
|
|
|
+ font-size: 14px;
|
|
|
+ font-weight: 600;
|
|
|
+ // float: right;
|
|
|
+ color: #005bab;
|
|
|
+ margin-top: 1rem;
|
|
|
+ span {
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 18px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ button {
|
|
|
+ padding: 0.5rem;
|
|
|
+ background: #005bab;
|
|
|
+ color: white;
|
|
|
+ border: none;
|
|
|
+ border-radius: 0.2rem;
|
|
|
+ margin-top: 0.5rem;
|
|
|
+ cursor: pointer;
|
|
|
+ // float: right;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .footer_card {
|
|
|
+ line-height: 1.8;
|
|
|
+ }
|
|
|
+ .table_pmd {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .footerbox_text {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .customer_box {
|
|
|
+ border: 1px solid #dbdbdb;
|
|
|
+ padding: 1rem 2rem;
|
|
|
+ .customer {
|
|
|
+ .title {
|
|
|
+ font-size: 1.2rem;
|
|
|
+ color: #331515;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ font-weight: 600;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ .required {
|
|
|
+ color: red;
|
|
|
+ }
|
|
|
+ .horizontal {
|
|
|
+ width: 60px;
|
|
|
+ height: 1px;
|
|
|
+ background-color: #bdbdbd;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .checked_b {
|
|
|
+ margin: 1rem 0;
|
|
|
+ }
|
|
|
+ .demo-form-inline /deep/ {
|
|
|
+ .el-form-item {
|
|
|
+ width: 48%;
|
|
|
+ .el-form-item__content {
|
|
|
+ width: 60%;
|
|
|
+ .el-select {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .checkButtom {
|
|
|
+ margin-top: 10px;
|
|
|
+ .buttom {
|
|
|
+ margin: 1rem 0 0;
|
|
|
+ padding: 0.5rem 2rem;
|
|
|
+ background: #005bab;
|
|
|
+ color: #fff;
|
|
|
+ border: none;
|
|
|
+ border-radius: 0.2rem;
|
|
|
+ float: right;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+
|
|
|
+@media screen and (min-width: 0px) and (max-width: 750px) {
|
|
|
+ .box {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+ .topbox_text {
|
|
|
+ font-size: 0.18rem;
|
|
|
+ margin-bottom: 0.2rem;
|
|
|
+ }
|
|
|
+ .contentbox {
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ }
|
|
|
+
|
|
|
+ .contentbox > .cart_f {
|
|
|
+ font-size: 0.16rem;
|
|
|
+ padding: 0.2rem 0.14rem;
|
|
|
+ font-weight: 700;
|
|
|
+ font-family: Arial;
|
|
|
+ color: #005bab;
|
|
|
+ background: #cfe0ef;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottomcontentbox_b {
|
|
|
+ margin-top: 0.2rem;
|
|
|
+ width: 100%;
|
|
|
+ overflow: hidden;
|
|
|
+ padding: 0.08rem 0.14rem;
|
|
|
+ border: 1px solid #dbdbdb;
|
|
|
+ background: #ffffff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .bottomcontentbox /deep/ {
|
|
|
+ // margin-top: 0.12rem;
|
|
|
+ // padding: 0rem 0.14rem;
|
|
|
+ overflow: hidden;
|
|
|
+ .table_boxf {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+
|
|
|
+ // 将el-table的展开图标替换为其他图标
|
|
|
+ .el-table__expand-icon {
|
|
|
+ width: 0.2rem;
|
|
|
+ height: 0.2rem;
|
|
|
+ margin: 0 auto;
|
|
|
+ border-radius: 4px;
|
|
|
+ -webkit-transform: rotate(90deg);
|
|
|
+ transform: rotate(90deg);
|
|
|
+ background: #005bab;
|
|
|
+ color: #ffffff;
|
|
|
+ }
|
|
|
+ .el-table__expand-icon .el-icon-arrow-right:before {
|
|
|
+ content: "\";
|
|
|
+ border: 1px solid #ccc;
|
|
|
+ // padding: 2px;
|
|
|
+ border: none;
|
|
|
+ }
|
|
|
+ .el-table__expand-icon--expanded .el-icon-arrow-right:before {
|
|
|
+ content: "\";
|
|
|
+ }
|
|
|
+ .el-table__cell {
|
|
|
+ padding: 0;
|
|
|
+ .el-form-item {
|
|
|
+ margin: 0;
|
|
|
+ width: 100%;
|
|
|
+ border-bottom: 1px solid #dbdbdb;
|
|
|
+ display: flex;
|
|
|
+ .el-form-item__label {
|
|
|
+ width: 40%;
|
|
|
+ padding-left: 0.2rem;
|
|
|
+ border-right: 1px solid #dbdbdb;
|
|
|
+ }
|
|
|
+ .el-form-item__content {
|
|
|
+ width: 60%;
|
|
|
+ padding-left: 0.2rem;
|
|
|
+ background: #f0f5fa;
|
|
|
+ .el-icon-delete {
|
|
|
+ color: #005bab;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .el-table {
|
|
|
+ border: 1px solid #dfdfdf;
|
|
|
+ margin-top: 0.12rem !important ;
|
|
|
+ // margin-bottom:0.14rem !important ;
|
|
|
+ .el-table__header-wrapper {
|
|
|
+ width: 100%;
|
|
|
+ .el-table__header {
|
|
|
+ width: 100% !important;
|
|
|
+ colgroup {
|
|
|
+ // col{
|
|
|
+ // width: 20% !important;
|
|
|
+ // }
|
|
|
+ col:nth-of-type(1) {
|
|
|
+ width: 10% !important;
|
|
|
+ }
|
|
|
+ col:nth-of-type(2) {
|
|
|
+ width: 15% !important;
|
|
|
+ }
|
|
|
+ col:nth-of-type(3) {
|
|
|
+ width: 20% !important;
|
|
|
+ }
|
|
|
+ col:nth-of-type(4) {
|
|
|
+ width: 15% !important;
|
|
|
+ }
|
|
|
+ col:nth-of-type(5) {
|
|
|
+ width: 25% !important;
|
|
|
+ }
|
|
|
+ col:nth-of-type(6) {
|
|
|
+ width: 15% !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ thead {
|
|
|
+ tr {
|
|
|
+ width: 60px !important;
|
|
|
+ th {
|
|
|
+ width: 60px !important;
|
|
|
+ .cell {
|
|
|
+ font-size: 12px;
|
|
|
+ padding: 0 4px;
|
|
|
+ font-family: Arial;
|
|
|
+ font-weight: bold;
|
|
|
+ color: #005bab;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-table__body-wrapper {
|
|
|
+ .el-table__body {
|
|
|
+ width: 100% !important;
|
|
|
+ colgroup {
|
|
|
+ width: 100% !important;
|
|
|
+ col:nth-of-type(1) {
|
|
|
+ width: 10% !important;
|
|
|
+ }
|
|
|
+ col:nth-of-type(2) {
|
|
|
+ width: 15% !important;
|
|
|
+ }
|
|
|
+ col:nth-of-type(3) {
|
|
|
+ width: 20% !important;
|
|
|
+ }
|
|
|
+ col:nth-of-type(4) {
|
|
|
+ width: 15% !important;
|
|
|
+ }
|
|
|
+ col:nth-of-type(5) {
|
|
|
+ width: 25% !important;
|
|
|
+ }
|
|
|
+ col:nth-of-type(6) {
|
|
|
+ width: 15% !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ tbody {
|
|
|
+ .el-table__row {
|
|
|
+ .el-table__cell {
|
|
|
+ &:nth-of-type(2) {
|
|
|
+ .cell {
|
|
|
+ font-family: Arial;
|
|
|
+ color: #005bab;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .cell {
|
|
|
+ font-size: 12px;
|
|
|
+ padding: 0 4px;
|
|
|
+ line-height: 0.24rem;
|
|
|
+ .size_data {
|
|
|
+ .size_q {
|
|
|
+ width: 40% !important;
|
|
|
+ max-width: 100px;
|
|
|
+ .el-input__inner {
|
|
|
+ width: 100% !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-select {
|
|
|
+ max-width: 100px;
|
|
|
+ width: 60% !important;
|
|
|
+ .el-input__inner {
|
|
|
+ padding-right: 16px;
|
|
|
+ }
|
|
|
+ .el-input__suffix {
|
|
|
+ .el-select__caret {
|
|
|
+ width: 16px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-input-number {
|
|
|
+ .el-input-number__decrease {
|
|
|
+ width: 0.16rem;
|
|
|
+ }
|
|
|
+ .el-input-number__increase {
|
|
|
+ width: 0.16rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-table__empty-block {
|
|
|
+ width: 100% !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .size_data {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ .size_q {
|
|
|
+ width: 0.4rem;
|
|
|
+ .el-input__inner {
|
|
|
+ height: 0.24rem;
|
|
|
+ border: 1px solid #dfdfdf;
|
|
|
+ line-height: 0.24rem;
|
|
|
+ padding: 0 0.03rem;
|
|
|
+ width: 0.4rem;
|
|
|
+ // border-radius: 0.2rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-select {
|
|
|
+ width: 0.6rem;
|
|
|
+ .el-input__inner {
|
|
|
+ height: 0.24rem;
|
|
|
+ line-height: 0.24rem;
|
|
|
+ padding-left: 0.05rem;
|
|
|
+ }
|
|
|
+ .el-input__icon {
|
|
|
+ line-height: 0.24rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .el-input-number {
|
|
|
+ width: 100%;
|
|
|
+ .el-input-number__decrease {
|
|
|
+ width: 0.24rem;
|
|
|
+ height: 0.22rem;
|
|
|
+ line-height: 0.22rem;
|
|
|
+ top: 7px;
|
|
|
+ }
|
|
|
+ .el-input-number__increase {
|
|
|
+ width: 0.24rem;
|
|
|
+ height: 0.22rem;
|
|
|
+ line-height: 0.22rem;
|
|
|
+ top: 7px;
|
|
|
+ }
|
|
|
+ .el-input {
|
|
|
+ .el-input__inner {
|
|
|
+ height: 0.26rem;
|
|
|
+ line-height: 0.26rem;
|
|
|
+ padding: 0 0.24rem;
|
|
|
+ border: 1px solid #dfdfdf;
|
|
|
+ &:focus {
|
|
|
+ border: 1px solid #dfdfdf;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .input_box /deep/ {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ & > span:nth-of-type(1) {
|
|
|
+ font-size: 0.12rem;
|
|
|
+ float: left;
|
|
|
+ color: #005bab;
|
|
|
+ margin-right: 0.1rem;
|
|
|
+ }
|
|
|
+ & > span:nth-of-type(2) {
|
|
|
+ // padding: 0 1rem;
|
|
|
+ line-height: 0.28rem;
|
|
|
+ height: 0.28rem;
|
|
|
+ border: 1px solid #d3d3d3;
|
|
|
+ // float: left;
|
|
|
+ display: inline-block;
|
|
|
+ background: #005bab;
|
|
|
+ color: white;
|
|
|
+ cursor: pointer;
|
|
|
+ padding: 0 0.1rem;
|
|
|
+ }
|
|
|
+ .catalogInput {
|
|
|
+ width: 1rem;
|
|
|
+ .el-input__inner {
|
|
|
+ height: 0.28rem;
|
|
|
+ line-height: 0.28rem;
|
|
|
+ // border: none;
|
|
|
+ float: left;
|
|
|
+ padding: 0 0.1rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .cart_button {
|
|
|
+ border-bottom: 1px solid #dbdbdb;
|
|
|
+ overflow: hidden;
|
|
|
+ margin-bottom: 0.2rem;
|
|
|
+ button {
|
|
|
+ width: 100%;
|
|
|
+ margin: 0.2rem 0;
|
|
|
+ height: 0.4rem;
|
|
|
+ background: #005bab;
|
|
|
+ color: white;
|
|
|
+ border: none;
|
|
|
+ border-radius: 4px;
|
|
|
+ font-size: 0.18rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .cart_button_f {
|
|
|
+ overflow: hidden;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ // align-items: flex-end;
|
|
|
+ .cart_text {
|
|
|
+ font-size: 0.16rem;
|
|
|
+ font-weight: 600;
|
|
|
+ margin-bottom: 0.08rem;
|
|
|
+ color: #005bab;
|
|
|
+ span {
|
|
|
+ font-weight: 600;
|
|
|
+ font-size: 0.22rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ button {
|
|
|
+ width: 100%;
|
|
|
+ height: 0.4rem;
|
|
|
+ background: #005bab;
|
|
|
+ color: white;
|
|
|
+ border: none;
|
|
|
+ border-radius: 4px;
|
|
|
+ margin-top: 0.16rem;
|
|
|
+ font-size: 0.18rem;
|
|
|
+ margin-bottom: 0.22rem;
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ .footer_card {
|
|
|
+ display: none;
|
|
|
+ }
|
|
|
+ .footerbox_text {
|
|
|
+ margin-top: 0.2rem;
|
|
|
+ .footer_text {
|
|
|
+ font-size: 0.14rem;
|
|
|
+ line-height: 1.8;
|
|
|
+ word-wrap: break-word;
|
|
|
+ word-break: normal;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .customer_box {
|
|
|
+ border: 1px solid #dbdbdb;
|
|
|
+ padding: 0.1rem 0.1rem;
|
|
|
+ .customer {
|
|
|
+ .title {
|
|
|
+ font-size: 0.12rem;
|
|
|
+ color: #331515;
|
|
|
+ margin-bottom: 20px;
|
|
|
+ font-weight: 600;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ flex-wrap: wrap;
|
|
|
+ // white-space: nowrap;
|
|
|
+ .required {
|
|
|
+ color: red;
|
|
|
+ }
|
|
|
+ .horizontal {
|
|
|
+ width: 60px;
|
|
|
+ height: 1px;
|
|
|
+ background-color: #bdbdbd;
|
|
|
+ margin-left: 10px;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .checked_b {
|
|
|
+ margin: 0.1rem 0;
|
|
|
+ }
|
|
|
+ .demo-form-inline /deep/ {
|
|
|
+ .el-form-item {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ .el-form-item__content {
|
|
|
+ flex: 1;
|
|
|
+ .el-select {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .checkButtom {
|
|
|
+ margin-top: 10px;
|
|
|
+ .buttom {
|
|
|
+ width: 100%;
|
|
|
+ padding: 0.12rem;
|
|
|
+ background: #005bab;
|
|
|
+ color: #fff;
|
|
|
+ border: none;
|
|
|
+ border-radius: 0.1rem;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
+</style>
|
