jjx-web-sign-only/pages/enquiry/quote.vue

<template>
  <view>
    <top-bar></top-bar>
    <common-header></common-header>
    <category-bar></category-bar>

    <view class="page-nav">
      <el-breadcrumb separator="/">
        <el-breadcrumb-item :to="{ path: '/' }">首页</el-breadcrumb-item>
        <el-breadcrumb-item>
          <navigator style="display: inline-block;" url="/pages/enquiry/list">询价单</navigator>
        </el-breadcrumb-item>
        <el-breadcrumb-item>填写报价信息</el-breadcrumb-item>
      </el-breadcrumb>
    </view>

    <view class="page-main">
      <quote-remain-num v-if="reloaded" :amount="sheet.quoteAmount" type="enquiry" :id="enquiryId"/>
      <vk-data-form
        ref="form1"
        v-model="form1.data"
        :action="form1.props.action"
        :columns="form1.props.columns"
        :rules="form1.props.rules"
        :form-type="form1.props.formType"
        :loading.sync="form1.props.loading"
        :auto-close="false"
        :need-alert="false"
        :show-cancel="false"
        label-width="160px"
        @success="onFormSuccess"
        @fail="onFormFail"
      >
        <template v-slot:totalPrice>
          <el-input v-model="form1.data.totalPrice" placeholder="请输入货款总价"
                    @change="formatNumber"></el-input>
        </template>
      </vk-data-form>
    </view>


    <common-footer></common-footer>
  </view>
</template>

<script>
export default {
  data() {
    return {
      sheet: null,
      enquiryId: null,
      reloaded: false,
      // 表单相关开始-----------------------------------------------------------
      form1: {
        // 表单请求数据，此处可以设置默认值
        data: {
          // radio: 1,
          // checkbox : [1,2]
          sheetId: null,
          totalPrice: null,
        },
        // 表单属性
        props: {
          // 表单请求地址
          action: "client/enquiry/quote/kh/addQuote",
          // 表单字段显示规则
          columns: [
            {
              key: "totalPrice",
              title: "货款总价(人民币:元)",
              type: "html"
            },
            // {key: "totalPrice", title: "货款总价(人民币:元)", type: "number", precision: 2},
            {
              key: "files",
              title: "附件",
              type: "file",
              accept: '.pdf',
              tips: '仅支持PDF文档，报价附件将生成标准合同附件，请认真审阅。'
            },
            {key: "remark", title: "报价单详情", type: "textarea"},
            {key: "supplierExt", title: "供应商合同补充条款", type: "textarea", autosize: {minRows: 4, maxRows: 10},},
          ],
          // 表单验证规则
          rules: {
            totalPrice: [
              {required: true, message: "货款总价不能为空", trigger: "change,blur"},
            ]
          },
          // add 代表添加 update 代表修改
          formType: "",
          // 表单是否在请求中
          loading: false,
          // 是否显示表单1 的弹窗
          show: false
        }
      },
      // 表单相关结束-----------------------------------------------------------
    };
  },
  onLoad(options = {}) {
    console.log(options)
    const {
      enquiryId
    } = options
    if (!enquiryId) {
      vk.navigateTo('/pages/process/sheet/list');
      return
    }

    this.enquiryId = enquiryId
    this.form1.data.sheetId = enquiryId
    this.getEnquiryDetail()
  },
  computed: {

    totalPriceStr() {
      if (this.totalPrice == 0) {
        return "零元"
      }
      return vk.myfn.convertCurrency(this.totalPrice / 100)
    }
  },
  methods: {
    onFormSuccess() {
      vk.redirectTo({url: `/pages/enquiry/detail?id=${this.enquiryId}`})
    },
    onFormFail(data) {
      if (data.data.code === 12) {
        this.$confirm(data.data.msg, '提示', {
          confirmButtonText: '确定',
          showCancelButton: false,
          type: 'warning'
        }).then(() => {
          vk.redirectTo({url: `/pages/user/user?menu=grade`})
        })
      } else {
        this.$confirm(data.data.msg, '提示', {
          confirmButtonText: '确定',
          showCancelButton: false,
          type: 'warning'
        }).then(() => {
          vk.navigateBack()
        })
      }
    },

    // 提交报价单
    async submit() {

      const data = await vk.userCenter.getCurrentUserInfo();
      const {userInfo} = data
      if (userInfo.remainQuoteNum === 0 || !userInfo.remainQuoteNum) {

      }

      // this.$confirm(`今日报价次数${userInfo.quoteTimes || 0}, 是否继续?`, '提示', {
      //     confirmButtonText: '确定',
      //     cancelButtonText: '取消',
      //     type: 'warning',
      //     center: true
      // }).then(res => {
      //
      // })

      vk.callFunction({
        url: 'client/enquiry/quote/kh/addQuote',
        title: '请求中...',
        // data: {
        //     sheet: this.sheet,
        //     totalPrice: this.totalPrice
        // },
        success: (data) => {
          this.$message({
            message: "报价成功",
            type: 'success'
          })
        },
        fail: err => {
          console.log(err)

        }
      })


    },
    /**
     * 获取询价单详情
     */
    getEnquiryDetail() {
      vk.callFunction({
        url: 'client/enquiry/sheet/pub/getDetail',
        title: '请求中...',
        data: {
          _id: this.enquiryId
        },
        success: (res) => {
          this.sheet = res.data
        }
      });
    },
    formatNumber(e) {
      this.form1.data.totalPrice = parseFloat(this.form1.data.totalPrice).toFixed(2)
    }
  },
  onShow() {
    this.reloaded = false
    setTimeout(() => {
      this.reloaded = true
    }, 500)
  }
}
</script>

<style lang="scss" scoped>
.page-main {
  width: 1200px;
  margin: 20px auto;
  background-color: #FFFFFF;
  padding: 20px;
}

.description {
  margin-bottom: 40px;
  width: 800px;
}

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

.quote-form {
  width: 260px;
}

.form-footer {
  height: 40px;
  line-height: 40px;
  background: #fff;
  padding-top: 0;
  text-align: center;
  display: block;
}
</style>