platform-customsdeclaration-ssr/components/common/buts.vue

<template>
  <div class="buts">
    <div class="but">
      <el-button type="blur" @click="accountVerify">客户部验证</el-button>
      <el-button type="blur" @click="storageVerify">仓储部验证</el-button>
    </div>
    <el-dialog
      title="批量检测系统"
      :visible.sync="hasDialog"
      width="50%">
      <template v-if="step === 'one'">
        <div class="dialog-msg">
          <p>产地中英文已查找完成，请检查，并选择是否替换？</p>
          <p>【确定】替换</p>
          <p>【取消】不替换，并重新检查</p>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button @click="cancelClick">取 消</el-button>
          <el-button type="blur" @click="stepOne('two')">确 定</el-button>
        </div>
      </template>
      <template v-if="step === 'two'">
        <div class="dialog-msg">
          <p>本次报关币种：【 <span v-text="sheetInfo.currency"/> 】，请确认币种是否正确？</p>
          <p>【确定】一致</p>
          <p>【取消】不一致，手动修改！</p>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button @click="cancelClick">取 消</el-button>
          <el-button type="blur" @click="jumpStep('three')">确 定</el-button>
        </div>
      </template>
      <template v-if="step === 'three'">
        <div class="dialog-msg">
          <p>您选择的币种为【<span v-text="sheetInfo.currency"/>】</p>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button type="blur" @click="stepNine">确 定</el-button>
        </div>
      </template>
      <template v-if="step === 'four'">
        <div class="dialog-msg">
          <p>【净重 < 毛重】核对完成，请注意核对总净重、总毛重！</p>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button @click="cancelClick">取 消</el-button>
          <el-button type="blur" @click="jumpStep('five')">确 定</el-button>
        </div>
      </template>
      <template v-if="step === 'five'">
        <div class="dialog-msg">
          <p>核对完成，【单价 * 数量 = 总价】正确！</p>
          <p>数量总计为：<span v-text="sheetInfo.totalAmount"/></p>
          <p>箱数总计为：<span v-text="sheetInfo.totalCartonNum"/>箱</p>
          <p>净重总计为：<span v-text="sheetInfo.totalNetWeight"/>KG</p>
          <p>毛重总计为：<span v-text="sheetInfo.totalGrossWeight"/>KG</p>
          <p>总价总计为：<span v-text="sheetInfo.currency"/><span v-text="sheetInfo.totalPrice"/></p>
          <h3>请核对上述数据与《INVOICE》、《PACKING LIST》等原始资料是否一致！</h3>
          <p>【确定】一致</p>
          <p>【取消】不一致，请仔细核对明细，检查错误！</p>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button @click="cancelClick">取 消</el-button>
          <el-button type="blur" @click="stepSix('six')">确 定</el-button>
        </div>
      </template>
      <template v-if="step === 'six'">
        <div class="dialog-msg">
          <p>客户【<span v-text="delivery.companyName"/>】在我司系统的成交方式为【<span v-text="delivery.transactionMode"/>】,请核对并选择此次报关的【<span>成交方式</span>】：</p>
        </div>
        <div slot="footer" class="dialog-footer" style="text-align: center">
          <el-button type="blur" @click="stepSeven(true, 'seven')">F O B</el-button>
          <el-button type="blur" @click="stepSeven(false, 'seven')">C I F</el-button>
        </div>
      </template>
      <template v-if="step === 'seven'">
        <div class="dialog-msg">
          <p>【<span v-text="sheetInfo.commissionCompany"/>】此次报关的成交方式：【<span v-text="sheetInfo.transactionMode"/>】</p>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button type="blur" @click="jumpStep('eight')">确 定</el-button>
        </div>
      </template>
      <template v-if="step === 'eight'">
        <div class="dialog-msg">
          <p>批量检测完成！本检测只是初步检测！请与客户提供的《INVOICE》、《PACKING LIST》等原始资料进行核对！着重核对商品名称、型号、品牌、产地！</p>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button type="blur" @click="stepOver">确 定</el-button>
        </div>
      </template>
      <template v-if="step === 'nine'">
        <div class="dialog-msg">
          <p>序号：</p>
          <p><span v-for="item in weightErr" v-text="item"/></p>
          <p>这些表格的毛重、净重存在异常情况！请仔细核对明细，检查错误！</p>
        </div>
        <div slot="footer" class="dialog-footer">
          <el-button type="blur" @click="cancelClick">确 定</el-button>
        </div>
      </template>
    </el-dialog>
  </div>
</template>

<script>
  export default {
    name: 'ButsView',
    props: ['errMsg'],
    data() {
      return {
        hasDialog: false,
        step: 'five',
        updateMsg: '',
        weightErr: [],
        delivery: {}
      }
    },
    computed: {
      sheetInfo () {
        return this.$store.state.severSheet.details.data.content
      }
    },
    methods: {
      // 取消验证
      cancelClick () {
        this.hasDialog = false
        setTimeout(function() {this.step = 'one'}, 300)
      },
      // 验证跳转
      jumpStep (type) {
        this.step = type
      },
      // 客户部验证信息
      accountVerify () {
        this.hasDialog = true
        this.step = 'one'
      },
      // 客户部验证信息one
      stepOne (type) {
        let params = new FormData
        params.append('id', this.$route.params.id)
        let config = {
          headers: {'Content-Type': 'multipart/form-data'}
        }
        this.$http.post('/CommissionSheet/updateProducingArea', params, config)
          .then(response => {
            if (response.data.success) {
              this.$store.commit('severSheet/REQUEST_DETAILS_SUCCESS', response.data)
              this.step = type
            } else {
              this.$message({
                message: response.data.message,
                type: 'warning'
              })
            }
          })
          .catch(() => {
            this.$message.error('请检查网络是否正常')
          })
      },
      // 客户部验证信息nine
      stepNine () {
        this.weightErr = []
        let list = this.sheetInfo.commissionSheetDetail
        console.log(list)
        for (let i = 0; i < list.length; i++) {
          if (list[i].grossWeight >= 0 && list[i].netWeight >= 0 && (list[i].netWeight >= list[i].grossWeight)) {
            this.weightErr.push(list[i].detno)
          }
        }
        console.log(this.weightErr)
        this.weightErr.length !== 0 ? this.step = 'nine' : this.step = 'four'
      },
      // 客户部验证信息six
      stepSix (type) {
        this.$http.get('/customer/enuu', {params: {enuu: this.sheetInfo.commissionCompanyEnuu}})
          .then(res => {
            if (res.data.success) {
              this.delivery = res.data.content
              this.step = type
            } else {
              this.$message({
                message: res.data.message,
                type: 'warning'
              })
            }
          })
          .catch(() => {
            this.$message.error('请检查网络是否正常！')
          })
      },
      // 客户部验证信息seven
      stepSeven (key, type) {
        let params = new FormData()
        params.append('id', this.$route.params.id)
        params.append('transactionMode', key ? 'fob' : 'cif')
        let config = {
          headers: {'Content-Type': 'multipart/form-data'}
        }
        this.$http.post('/CommissionSheet/transactionMode/update', params, config)
          .then(res => {
            if (res.data.success) {
              this.$store.commit('severSheet/REQUEST_DETAILS_SUCCESS', res.data)
              this.step = type
            } else {
              this.$message({
                message: res.data.message,
                type: 'warning'
              })
            }
          })
          .catch(() => {
            this.$message.error('请检查网络是否正常！')
          })
      },
      // 客户部验证完成
      stepOver () {
        this.updateMsg = '产地中英文替换，本次报关币种' + this.sheetInfo.currency + ','
        this.updateMsg += '净重小于毛重核对完成，完成统计信息核对，成交方式为' + this.sheetInfo.transactionMode + ', 完成检测'
        let params = new FormData
        params.append('id', this.$route.params.id)
        params.append('status', 'success')
        params.append('operatorMessage', this.updateMsg)
        let config = {
          headers: {'Content-Type': 'multipart/form-data'}
        }
        this.$http.post('/CommissionSheet/customService/pass', params, config)
          .then(response => {
            if (response.data.success) {
              this.hasDialog = false
              this.step = 'one'
              this.$message({
                message: '客服部验证信息已发送成功',
                type: 'success'
              })
            } else {
              this.$message({
                message: response.data.message,
                type: 'warning'
              })
            }
          })
          .catch(() => {
            this.$message.error('请检查网络是否正常')
          })
      },
      // 仓储部验证信息
      storageVerify () {
        let params = new FormData
        params.append('id', this.$route.params.id)
        params.append('json', JSON.stringify(this.errMsg))
        params.append('status', 'success')
        let config = {
          headers: {'Content-Type': 'multipart/form-data'}
        }
        this.$http.post('/CommissionSheet/storageValidate', params, config)
          .then(response => {
            if (response.data.success) {
              this.$message({
                message: '仓储部验证信息已发送成功',
                type: 'success'
              })
            } else {
              this.$message({
                message: response.data.message,
                type: 'warning'
              })
            }
          })
          .catch(() => {
            this.$message.error('请检查网络是否正常')
          })
      }
    }
  }
</script>

<style lang="scss" type="text/scss" scoped>
  .buts{
    padding:50px;
    .dialog-msg{
      padding-left:25px;
      p{
        margin-bottom:15px;
        font-size: 16px;
        line-height: 25px;
        color:#333;
        span{
          font-weight: bold;
          margin:0 5px;
        }
      }
    }
  }
</style>