<template>
  <div class="website-parts-shop-sales">
    <div class="website-parts-shop-sales-sl">
      <el-page-header @back="goBack" content="销售单信息"></el-page-header>
      <br />
      <div style="margin-bottom: -1px">
        <div style="display: flex">
          <div style="width: 50%; margin-right: -1px">
            <el-descriptions :column="2" size="small" border labelClassName="labelClassName">
              <el-descriptions-item>
                <template slot="label"> 网点 </template>
                <div>
                  <el-select
                    filterable
                    :disabled="disabled"
                    v-model="form.websitId"
                    placeholder=""
                    @change="changeWebsit"
                  >
                    <el-option
                      v-for="item in websitList"
                      :key="item.websitId"
                      :label="`(${item.websitId})${item.name}`"
                      :value="item.websitId"
                    >
                    </el-option>
                  </el-select>
                </div>
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label"> 申请类别 </template>
                <div>
                  <el-select
                    placeholder=""
                    :disabled="disabled"
                    size="small"
                    v-model="form.applyCategory"
                    style="width: 100%"
                  >
                    <el-option v-for="item in commonDict" :key="item.value" :label="item.label" :value="item.value">
                    </el-option>
                  </el-select>
                </div>
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label"> 申请类型 </template>
                <div>
                  <el-select
                    placeholder=""
                    :disabled="disabled"
                    size="small"
                    v-model="form.applyType"
                    style="width: 100%"
                  >
                    <el-option label="普通申请" :value="0"> </el-option>
                    <el-option label="急件申请" :value="1"> </el-option>
                    <el-option label="备件申请" :value="2"> </el-option>
                  </el-select>
                </div>
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label"> 发货方式 </template>
                <div style="width: 100%; display: flex; align-items: center">
                  <span v-if="disabled">
                    <el-input
                      :disabled="disabled"
                      size="small"
                      :value="['快递', '自提'][form.deliveryType] || ''"
                    ></el-input>
                  </span>
                  <template v-else>
                    <el-radio v-model="form.deliveryType" :label="1">自提</el-radio>
                    <el-radio
                      :disabled="!{ WORKER: true, CUSTOMER: false }[form.buyPeople]"
                      v-model="form.deliveryType"
                      :label="0"
                      >快递</el-radio
                    >
                  </template>
                </div>
              </el-descriptions-item>
            </el-descriptions>
          </div>
          <div style="width: 50%">
            <el-descriptions :column="2" size="small" border labelClassName="labelClassName">
              <el-descriptions-item>
                <template slot="label"> 销售类型 </template>
                <div style="width: 100%; height: 40px; display: flex; align-items: center">
                  <span v-if="disabled">
                    <el-input
                      :disabled="disabled"
                      size="small"
                      :value="{ WORKER: '师傅', CUSTOMER: '外部客户' }[form.buyPeople] || ''"
                    ></el-input>
                  </span>
                  <template v-else>
                    <el-radio v-model="form.buyPeople" label="CUSTOMER">外部客户</el-radio>
                    <el-radio v-model="form.buyPeople" label="WORKER">师傅</el-radio>
                  </template>
                </div>
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label">
                  {{ { WORKER: '申请服务人员', CUSTOMER: '申请人' }[form.buyPeople] || '申请人' }}
                </template>
                <div>
                  <el-select
                    v-if="form.buyPeople === 'WORKER'"
                    v-model="form.workerId"
                    size="small"
                    :disabled="disabled"
                    filterable
                    placeholder="师傅"
                    style="width: 100%"
                    @change="changeWorkerInfo"
                  >
                    <el-option
                      v-for="item in workerList"
                      :key="item.workerNumber"
                      :label="item.nickName + '-' + item.mobile"
                      :value="item.workerNumber"
                    >
                    </el-option>
                  </el-select>
                  <el-input v-if="form.buyPeople === 'CUSTOMER'" disabled size="small" value="外部客户"></el-input>
                </div>
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label"> 联系电话 </template>
                <div>
                  <el-input
                    :disabled="{ WORKER: true, CUSTOMER: false }[form.buyPeople]"
                    size="small"
                    v-model="form.mobile"
                  ></el-input>
                </div>
              </el-descriptions-item>
              <el-descriptions-item>
                <template slot="label"> 接收单位 </template>
                <div>
                  <el-input
                    :disabled="!{ WORKER: true, CUSTOMER: false }[form.buyPeople]"
                    size="small"
                    v-model="form.receiveUnit"
                  ></el-input>
                </div>
              </el-descriptions-item>
            </el-descriptions>
          </div>
        </div>
      </div>
      <div style="margin-bottom: -1px">
        <el-descriptions :column="2" size="small" border labelClassName="labelClassName">
          <el-descriptions-item>
            <template slot="label"> 发货单位 </template>
            <div>
              <el-input disabled size="small" v-model="form.deliveryUnit"></el-input>
            </div>
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 操作人 </template>
            <div>
              <el-input disabled size="small" v-model="form.updateBy"></el-input>
            </div>
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 收件地址 </template>
            <div>
              <el-input :disabled="disabled" size="small" v-model="form.receiveAddr"></el-input>
            </div>
          </el-descriptions-item>
          <el-descriptions-item>
            <template slot="label"> 详细地址 </template>
            <div>
              <el-input :disabled="disabled" size="small" v-model="form.addr"></el-input>
            </div>
          </el-descriptions-item>
        </el-descriptions>
      </div>
      <div style="margin-bottom: -1px">
        <el-descriptions size="small" border labelClassName="labelClassName">
          <el-descriptions-item labelStyle="width:15.45%">
            <template slot="label"> 备注 </template>
            <div>
              <el-input type="textarea" :rows="2" :disabled="disabled" size="small" v-model="form.remark"></el-input>
            </div>
          </el-descriptions-item>
        </el-descriptions>
      </div>
      <div v-if="form.deliveryType === 0 && ~[2, 3].indexOf(this.type)">
        <el-descriptions size="small" border labelClassName="labelClassName">
          <el-descriptions-item labelStyle="width:15.45%">
            <template slot="label"> 物流单号 </template>
            <div>
              <el-input :disabled="this.type === 2" size="small" v-model="form.logisticsNo"></el-input>
            </div>
          </el-descriptions-item>
        </el-descriptions>
      </div>
      <div style="margin-bottom: 10px; margin-top: 10px; width: 100%">
        <el-table
          :data="form.itemList || []"
          size="mini"
          border
          style="width: 100%"
          header-cell-class-name="headerRowColor"
        >
          <el-table-column label="序号" width="60">
            <template slot-scope="scope">
              <div class="serial_number">{{ scope.$index + 1 }}</div>
            </template>
          </el-table-column>
          <el-table-column label="配件编码" width="180">
            <template slot-scope="scope">
              <el-input v-if="scope.row.id" disabled v-model="scope.row.partsNumber" placeholder=""></el-input>
              <el-select
                v-else
                filterable
                :disabled="disabled"
                v-model="scope.row.partsId"
                placeholder=""
                @change="update(scope.row, scope.$index)"
              >
                <el-option v-for="item in partsList" :key="item.id" :label="item.partsNumber" :value="item.id">
                </el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="配件名称" width="180">
            <template slot-scope="scope">
              <el-input v-if="scope.row.id" disabled v-model="scope.row.partsName" placeholder=""></el-input>
              <el-select
                v-else
                filterable
                :disabled="disabled"
                v-model="scope.row.partsId"
                placeholder=""
                @change="update(scope.row, scope.$index)"
              >
                <el-option v-for="item in partsList" :key="item.id" :label="item.partsName" :value="item.id">
                </el-option>
              </el-select>
            </template>
          </el-table-column>
          <el-table-column label="单位" width="120">
            <template slot-scope="scope">
              <el-input disabled v-model="scope.row.goodsStockUnit" placeholder=""></el-input>
            </template>
          </el-table-column>
          <el-table-column label="市场价" width="120">
            <template slot-scope="scope">
              <el-input disabled type="number" v-model="scope.row.marketPrice" placeholder=""></el-input>
            </template>
          </el-table-column>
          <el-table-column label="销售价" width="120">
            <template slot-scope="scope">
              <el-input disabled type="number" :value="scope.row.salesPrice" placeholder=""></el-input>
            </template>
          </el-table-column>
          <el-table-column label="数量" width="100">
            <template slot-scope="scope">
              <el-input type="number" :disabled="disabled" v-model="scope.row.qty" placeholder=""></el-input>
            </template>
          </el-table-column>
          <el-table-column label="总金额" width="100">
            <template slot-scope="scope">
              <el-input disabled :value="scope.row.salesPrice * scope.row.qty || ''" placeholder=""></el-input>
            </template>
          </el-table-column>
          <el-table-column label="可用库存">
            <template slot-scope="scope">
              <el-input type="number" disabled v-model="scope.row.stockQty" placeholder=""></el-input>
            </template>
          </el-table-column>
          <el-table-column v-if="!disabled" label="操作" width="80">
            <template slot-scope="scope">
              <div class="caozuo">
                <el-button type="danger" size="mini" @click="del(scope.$index)">删除</el-button>
              </div>
            </template>
          </el-table-column>
        </el-table>
        <div style="text-align: right; margin-bottom: 10px; margin-right: 10px">
          <el-button
            v-if="~[0].indexOf(this.type) || ~['SAVE'].indexOf(form.status)"
            size="small"
            type="primary"
            @click="add"
            >添加</el-button
          >
        </div>
      </div>
      <div
        v-if="type != 0 && form.payList && form.payList.length && form.payType !== 'CASH'"
        style="margin-bottom: 10px"
      >
        <el-descriptions :column="4" size="small" border labelClassName="labelClassName">
          <el-descriptions-item labelStyle="width:15.45%">
            <template slot="label"> 支付方式 </template>
            <div>
              <el-input
                disabled
                size="small"
                :value="{ CASH: '现金', WECHAT: '微信', ALLINPAY: '通联' }[form.payList[0].payType]"
              ></el-input>
            </div>
          </el-descriptions-item>
          <el-descriptions-item labelStyle="width:15.45%">
            <template slot="label"> 支付金额 </template>
            <div>
              <el-input disabled size="small" :value="form.payList[0].payValue"></el-input>
            </div>
          </el-descriptions-item>
          <el-descriptions-item labelStyle="width:15.45%">
            <template slot="label"> 下单时间 </template>
            <div>
              <el-input disabled size="small" :value="form.payList[0].createTime"></el-input>
            </div>
          </el-descriptions-item>
          <el-descriptions-item labelStyle="width:15.45%">
            <template slot="label"> 支付状态 </template>
            <div>
              <el-input disabled size="small" :value="{ NO: '否', YES: '是' }[form.payList[0].payFlag]"></el-input>
            </div>
          </el-descriptions-item>
          <el-descriptions-item labelStyle="width:15.45%">
            <template slot="label"> 支付时间 </template>
            <div>
              <el-input disabled size="small" :value="form.payList[0].payTime"></el-input>
            </div>
          </el-descriptions-item>
          <el-descriptions-item labelStyle="width:15.45%">
            <template slot="label"> 支付单号 </template>
            <div>
              <el-input disabled size="small" :value="form.payList[0].orderNo"></el-input>
            </div>
          </el-descriptions-item>
          <el-descriptions-item labelStyle="width:15.45%">
            <template slot="label"> 微信支付流水号 </template>
            <div>
              <el-input disabled size="small" :value="form.payList[0].transactionId"></el-input>
            </div>
          </el-descriptions-item>
          <el-descriptions-item labelStyle="width:15.45%">
            <template slot="label"> 确认人 </template>
            <div>
              <el-input disabled size="small" :value="form.workerName"></el-input>
            </div>
          </el-descriptions-item>
        </el-descriptions>
      </div>
      <div v-if="type != 0" style="margin-bottom: 10px; width: 100%">
        <el-table
          v-if="form.oldRefundManageRecordBeanList"
          :data="form.oldRefundManageRecordBeanList || []"
          size="mini"
          border
          style="margin-bottom: 10px; width: 100%"
          header-cell-class-name="headerRowColor"
        >
          <el-table-column label="是否备用件">
            <template slot-scope="scope">
              <el-input disabled :value="scope.row.isBackup ? '是' : '否'" placeholder=""></el-input>
            </template>
          </el-table-column>
          <el-table-column label="保内/保外">
            <template slot-scope="scope">
              <el-input
                disabled
                :value="{ INNER: '保内', OUTSIDE: '保外' }[scope.row.repairFlag]"
                placeholder=""
              ></el-input>
            </template>
          </el-table-column>
          <el-table-column label="用户姓名">
            <template slot-scope="scope">
              <el-input disabled :value="scope.row.customerName" placeholder=""></el-input>
            </template>
          </el-table-column>
          <el-table-column label="联系电话">
            <template slot-scope="scope">
              <el-input disabled :value="scope.row.customerTel" placeholder=""></el-input>
            </template>
          </el-table-column>
        </el-table>
      </div>
      <div v-if="type != 0" style="margin-bottom: 10px; width: 100%">
        <el-row>
          <el-col>
            <el-table
              :data="form.allPayList"
              size="mini"
              border
              header-cell-class-name="headerRowColor"
              style="width: 100%"
            >
              <el-table-column prop="outTradeNo" label="商户订单号" width="235" />
              <el-table-column prop="orderNo" label="商户单号" width="150" />
              <el-table-column prop="payFlag" label="支付状态" width="80">
                <template slot-scope="scope">
                  {{ { NO: '否', YES: '是' }[scope.row.payFlag] }}
                </template>
              </el-table-column>
              <el-table-column prop="payValue" label="支付金额" width="80" />
              <el-table-column prop="createTime" label="生成时间" width="140" />
              <el-table-column prop="timeExpire" label="失效时间" width="140" />
              <el-table-column prop="mchNo" label="商户号" width="150" />
              <template>
                <el-table-column prop="openid" label="支付账号" show-overflow-tooltip />
                <el-table-column prop="transactionId" label="微信流水号" show-overflow-tooltip />
              </template>
            </el-table>
          </el-col>
        </el-row>
      </div>
      <br />
      <el-row>
        <div style="text-align: right">
          <!-- 新增或者编辑 -->
          <template v-if="~[0, 1].indexOf(this.type)">
            <el-button
              v-if="~[0].indexOf(this.type) || ~['SAVE'].indexOf(form.status)"
              size="small"
              type="primary"
              @click="determine"
              >保存</el-button
            >
            <el-button v-if="~['SAVE', 'SUBMIT'].indexOf(form.status)" size="small" type="primary" @click="createOrder"
              >生成订单</el-button
            >
            <el-button v-if="~[0].indexOf(this.type)" size="small" @click="reset">重置</el-button>
          </template>
          <template>
            <el-button v-if="~['SUBMIT'].indexOf(form.status)" size="small" type="primary" @click="previousStep"
              >上一步</el-button
            >
          </template>
          <!-- 提货 -->
          <template v-if="~[3].indexOf(this.type)">
            <el-button v-if="~['PAYED'].indexOf(form.status)" size="small" type="primary" @click="confirmationDelivery"
              >确认提货</el-button
            >
            <el-button
              v-if="~['PAYED', 'EXCEPTION'].indexOf(form.status)"
              size="small"
              type="danger"
              @click="cancellationDelivery"
              >取消订单</el-button
            >
          </template>
          <!-- 查看 -->
          <template v-if="~['PAYED', 'END'].indexOf(this.type) && !~['EXCEPTION'].indexOf(form.status)">
            <el-button size="small" @click="printHtml">打印出库清单</el-button>
          </template>
        </div>
      </el-row>
    </div>
    <pay-popup-window
      v-if="visible"
      :item="form"
      :visible="visible"
      :partsIsCash="partsIsCash"
      @success="
        () => {
          $emit('goBack')
          $emit('success')
        }
      "
      @setVisible="bool => (visible = bool)"
    />
  </div>
</template>

<script>
import {
  partsPartssalesorderSalesOrderDetail,
  partsPartssalesorderSalesOrderAdd,
  partsPartssalesorderSalesOrderEdit,
  partsPartssalesorderSubmit,
  partsPartssalesorderBackToSave,
  partsPartssalesorderQueryPartsNewQty,
  partsPartssalesorderConfirmDelivery,
  partsPartssalesorderCancel
} from '@/api/material-system/website/website-parts-shop-sales'
import { getWorker } from '@/api/auxiliaryFittings/auxiliarySalesOrder'
import { getWebsit } from '@/api/customerManagement.js'
import { getGoodsList } from '@/api/auxiliaryFittings/auxiliarySalesReturnOrder'
import PayPopupWindow from './pay-popup-window.vue'
import applicationNewRepairParts from '@/components/payTemplate/applicationNewRepairParts'
import { printhtml } from '@/utils/util'
export default {
  components: { PayPopupWindow },
  props: {
    type: {
      type: Number
    },
    item: {
      type: Object
    }
  },
  data() {
    return {
      visible: false,
      disabled: true,
      partsList: [],
      commonDict: [
        { label: '家用空调', value: 'HOME' },
        { label: '商用空调', value: 'TRADE' },
        { label: '生活电器（小家电）', value: 'ELEC' }
      ],
      workerList: [],
      searchLoading: false,
      form: {
        addr: '',
        applyCategory: '',
        applyType: 0,
        area: '',
        buyPeople: '',
        city: '',
        companyWechatId: '',
        companyWechatName: '',
        del: true,
        deliveryType: 1,
        deliveryUnit: '',
        endTime: '',
        err: '',
        examineBy: '',
        examineTime: '',
        identity: '',
        isApply: true,
        itemList: [],
        logisticsNo: '',
        mobile: '',
        oldRefundManageRecordBeanList: [],
        openid: '',
        orderSource: '',
        partsWebsitId: '',
        payConfigId: '',
        payFlag: '',
        payList: [],
        payTime: '',
        payType: '',
        province: '',
        pushFlag: '',
        receiveAddr: '',
        receiveUnit: '',
        remark: '',
        source: '',
        status: '',
        storageId: '',
        storageName: '',
        submitBy: '',
        submitTime: '',
        totalAmount: 0,
        transNotApplyDate: '',
        transactionId: '',
        websitConfirmBy: '',
        websitConfirmDate: '',
        websitId: '',
        websitName: '',
        workerConfirmDate: '',
        workerId: '',
        workerName: ''
      },
      websitList: []
    }
  },
  watch: {
    'form.buyPeople'(newval, oldval) {
      if (oldval !== undefined && oldval !== '') {
        this.form.identity = ''
        this.form.mobile = ''
        this.form.workerId = ''
        this.form.workerName = ''
      }
      if (newval == 'CUSTOMER') {
        this.form.deliveryType = 1
      }
    }
  },
  computed: {
    partsIsCash() {
      var data = this.websitList.find(item => item.websitId === this.form.websitId)
      if (data) {
        return data.partsIsCash
      }
      return true
    }
  },
  mounted() {
    getWebsit({ type: 'C', status: true, queryPartsWebsit: true }).then(res => {
      this.websitList = res.data
      if (res.data.length == 1) {
        this.changeWebsit(this.websitList[0].websitId)
      }
    })
    this.getInitInfo()
  },
  methods: {
    // 获取详情
    getInitInfo(callback) {
      if (~[1, 2, 3].indexOf(this.type) && this.item && this.item.id) {
        partsPartssalesorderSalesOrderDetail({
          id: this.item.id
        })
          .then(res => {
            if (this.type === 3 || ~['SUBMIT'].indexOf(res.data.status)) {
              this.disabled = true
            } else if (~['SAVE'].indexOf(res.data.status)) {
              this.disabled = false
            }
            if (res.data.websitId) {
              this.form = res.data
              this.remoteSearchWorkerMethod(res.data.websitId)
              this.getOptions(res.data.websitId)
            } else {
              this.form = res.data
            }
            callback && callback(res)
          })
          .catch(err => {
            console.log(err)
          })
      } else {
        this.disabled = false
      }
    },

    changeWebsit(v) {
      var data = this.websitList.find(item => item.websitId === v)
      if (data) {
        this.form.websitId = data.websitId
        this.form.websitName = data.websitName
        this.form.partsWebsitId = data.partsWebsitId
      } else {
        this.form.websitId = ''
        this.form.websitName = ''
        this.form.partsWebsitId = ''
      }
      this.remoteSearchWorkerMethod(v)
      this.getOptions(v)
    },

    // 获取选择下拉
    getOptions(websitId) {
      if (websitId) {
        this.searchLoading = true
        getGoodsList({
          type: 'P',
          websitId: websitId
        }).then(res => {
          this.partsList = res.data
        })
      } else {
        this.partsList = []
      }
    },

    // 获取人员信息
    remoteSearchWorkerMethod(websitId) {
      if (websitId) {
        this.searchLoading = true
        getWorker({
          pageNum: 1,
          pageSize: -1,
          params: [{ param: 'b.websit_id', compare: '=', value: websitId }]
        }).then(res => {
          this.searchLoading = false
          this.workerList = res.data.records.filter(item => !!item.workerNumber)
        })
      } else {
        this.workerList = []
      }
    },

    changeWorkerInfo(val) {
      if (val) {
        var selObj = this.workerList.find(value => {
          return value.workerNumber === val
        })
      }
      if (val && selObj) {
        this.form.identity = selObj.idCard
        this.form.mobile = selObj.mobile
        this.form.workerId = selObj.workerNumber
        this.form.workerName = selObj.nickName
      } else {
        this.form.identity = ''
        this.form.mobile = ''
        this.form.workerId = ''
        this.form.workerName = ''
      }
    },

    // 上一步
    previousStep() {
      partsPartssalesorderBackToSave({
        id: this.item.id
      })
        .then(res => {
          if (this.type === 3 || ~['SUBMIT'].indexOf(res.data.status)) {
            this.disabled = true
          } else if (~['SAVE'].indexOf(res.data.status)) {
            this.disabled = false
          }
          if (res.data.websitId) {
            this.form = res.data
            this.remoteSearchWorkerMethod(res.data.websitId)
            this.getOptions(res.data.websitId)
          } else {
            this.form = res.data
          }
        })
        .catch(err => {
          console.log(err)
        })
    },

    add() {
      this.form.itemList.push({ remark: '', stockQty: '', partsNumber: '', qty: '' })
    },

    del(index) {
      this.form.itemList.splice(index, 1)
    },

    reset() {
      this.$data.form = this.$options.data().form
    },

    update(item, index) {
      if (!(item.websitId || this.form.websitId) || !(item.partsWebsitId || this.form.partsWebsitId)) {
        return
      }
      var { id, partsNumber, qty, ...data } = this.partsList.find(item => item.id === this.form.itemList[index].partsId)
      partsPartssalesorderQueryPartsNewQty({
        websitId: item.websitId || this.form.websitId,
        partsWebsitId: item.partsWebsitId || this.form.partsWebsitId,
        partsNumber
      })
        .then(res => {
          this.form.itemList.splice(index, 1, {
            ...item,
            ...(data || {}),
            partsNumber,
            stockQty: res.data ? res.data.qty || 0 : 0,
            remark: item.remark
          })
        })
        .catch(err => {
          this.form.itemList.splice(index, 1, {
            ...item,
            ...(data || {}),
            partsNumber,
            remark: item.remark
          })
        })
    },

    // 保存
    determine(bool = true, callback) {
      if (this.form.itemList && this.form.itemList.length) {
        var data = JSON.parse(JSON.stringify(this.form))
        data.itemList = data.itemList.map(item => {
          return {
            ...item
          }
        })
        ;(this.form.id ? partsPartssalesorderSalesOrderEdit : partsPartssalesorderSalesOrderAdd)(data)
          .then(res => {
            if (bool) {
              this.$message({
                type: 'success',
                message: `${['添加', '保存'][this.type]}成功!`
              })
              this.$emit('goBack')
              this.$emit('success')
            } else {
              callback && callback(res)
            }
          })
          .catch(err => {
            console.log(err)
          })
      } else {
        this.$message({
          type: 'info',
          message: `请添加配件信息！`
        })
      }
    },

    // 生成订单并且打开支付
    createOrder() {
      if (!this.form.id || this.form.status === 'SAVE') {
        this.determine(false, res => {
          partsPartssalesorderSubmit({ id: res.data.id })
            .then(res2 => {
              if (this.type === 3 || ~['SUBMIT'].indexOf(res2.data.status)) {
                this.disabled = true
              } else if (~['SAVE'].indexOf(res2.data.status)) {
                this.disabled = false
              }
              this.$emit('success')
              this.form = res2.data
              this.visible = true
            })
            .catch(err => {
              console.log(err)
            })
        })
      } else {
        this.visible = true
      }
    },

    goBack() {
      this.$emit('goBack')
    },

    printHtml() {
      printhtml(applicationNewRepairParts(this.form))
    },

    confirmationDelivery() {
      if (this.form.deliveryType == 0 && !this.form.logisticsNo) {
        this.$message({
          type: 'info',
          message: `请填写物流单号!`
        })
        return
      }
      this.$confirm('是否确定提货？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          partsPartssalesorderConfirmDelivery({
            id: this.form.id,
            logisticsNo: this.form.logisticsNo
          })
            .then(res2 => {
              this.$message({
                type: 'success',
                message: `提货成功!`
              })
              this.$emit('goBack')
              this.$emit('success')
            })
            .catch(err2 => {
              console.log(err2)
            })
        })
        .catch(() => {})
    },
    cancellationDelivery() {
      this.$confirm('是否确定要取消该订单？', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          partsPartssalesorderCancel({
            id: this.form.id
          })
            .then(res2 => {
              this.$message({
                type: 'success',
                message: `取消成功!`
              })
              this.$emit('goBack')
              this.$emit('success')
            })
            .catch(err2 => {
              console.log(err2)
            })
        })
        .catch(() => {})
    }
  }
}
</script>

<style lang="scss" scoped>
.website-parts-shop-sales {
  min-width: 860px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
  background: #fff;
  overflow: hidden;
  .website-parts-shop-sales-sl {
    padding: 20px;
    width: 100%;
    height: 100%;
    overflow: auto;
  }
  .sizeinput {
    width: 100%;
    height: 100%;
    position: relative;
    .inputjh {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      display: flex;
      justify-content: space-between;
      align-items: center;
      ::v-deep .el-input {
        margin: 0 5px;
        &:first-child {
          margin-left: 0 !important;
        }
        &:last-child {
          margin-right: 0 !important;
        }
      }
    }
  }
  .serial_number {
    width: 100%;
    height: 100%;
    padding: 6px !important;
    text-align: center;
  }
  .caozuo {
    width: 100%;
    height: 36px;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  ::v-deep .is-disabled {
    .el-textarea__inner,
    .el-input__inner {
      background-color: #fff;
      border-color: #fff;
    }
    .el-input__suffix {
      display: none;
    }
  }
  ::v-deep th .cell {
    width: 100%;
    height: 100%;
    text-align: center;
  }
  ::v-deep .el-table__cell {
    .el-select,
    .el-input,
    .el-textarea__inner,
    .el-input__inner {
      height: 36px !important;
      border: none !important;
    }
  }
  ::v-deep .cell {
    height: 100%;
    padding: 0 !important;
  }
  ::v-deep .labelClassName {
    width: 120px !important;
  }
  ::v-deep .headerRowColor {
    .cell {
      height: 100%;
      padding: 6px !important;
    }
  }
}
</style>
