input_express_info.vue 2.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128
  1. <template>
  2. <view class="input-express-info p-t-20">
  3. <view class="input-contain bg-white">
  4. <u-field v-model="formInfo.express" :border-bottom="false" label="物流公司" placeholder="请输入物流公司名称">
  5. </u-field>
  6. <u-field v-model="formInfo.number" :border-bottom="false" label="快递单号" placeholder="请输入快递单号">
  7. </u-field>
  8. <u-field v-model="formInfo.remark" :border-bottom="false" label="备注说明" placeholder="选填">
  9. </u-field>
  10. </view>
  11. <view class="upload-contain bg-white m-t-20">
  12. <view class="header flex">
  13. <view class="normal">上传凭证</view>
  14. <view class="sm muted m-l-20">(请上传快递单号凭证)</view>
  15. </view>
  16. <view class="upload">
  17. <u-upload ref="uUpload" :show-progress="false" :header="{token: $store.getters.token}"
  18. :max-count="1" width="160" height="160" :action="action" upload-text="上传图片"
  19. @on-success="onSuccess" @on-remove="onRemove" />
  20. </view>
  21. </view>
  22. <view class="submit-btn">
  23. <button size="lg" class=" br60 bg-primary white lg" @tap="formSubmit">提交</button>
  24. </view>
  25. </view>
  26. </template>
  27. <script>
  28. import {
  29. inputExpressInfo
  30. } from '@/api/user';
  31. import {
  32. baseURL
  33. } from '@/config/app.js';
  34. export default {
  35. data() {
  36. return {
  37. action: baseURL + '/api/file/formimage',
  38. fileList: [],
  39. formInfo: {
  40. express: '',
  41. number: '',
  42. remark: ''
  43. }
  44. };
  45. },
  46. onLoad() {
  47. this.id = this.$Route.query.id
  48. },
  49. methods: {
  50. onSuccess(e) {
  51. this.fileList.push(e.data.base_uri)
  52. },
  53. onRemove(index) {
  54. this.fileList.splice(index, 1)
  55. },
  56. formSubmit(e) {
  57. const {
  58. fileList,
  59. formInfo: {
  60. express,
  61. number,
  62. remark
  63. }
  64. } = this;
  65. if (!express) return this.$toast({
  66. title: '请填写物流公司名称'
  67. });
  68. if (!number) return this.$toast({
  69. title: '请填写快递单号'
  70. });
  71. let data = {
  72. id: this.id,
  73. express_name: express,
  74. invoice_no: number,
  75. express_remark: remark,
  76. express_image: fileList.length ? fileList[0] : ''
  77. };
  78. inputExpressInfo(data).then(res => {
  79. if (res.code == 1) {
  80. this.$toast({
  81. title: '提交成功'
  82. }, {
  83. tab: 3,
  84. url: 1
  85. });
  86. uni.$emit("refreshsale")
  87. }
  88. });
  89. },
  90. }
  91. };
  92. </script>
  93. <style>
  94. .input-contain .input-item {
  95. padding: 24rpx;
  96. }
  97. .input-item .label {
  98. width: 152rpx;
  99. }
  100. .input-item .input {
  101. flex: 1;
  102. }
  103. .upload-contain {
  104. padding: 24rpx 20rpx 44rpx;
  105. }
  106. .upload-contain .header {
  107. margin-bottom: 30rpx;
  108. }
  109. .submit-btn {
  110. margin-top: 50rpx;
  111. margin-left: 26rpx;
  112. margin-right: 26rpx;
  113. }
  114. </style>