zfire-newmall-admin/src/views/salesPurchasing/mixins/common_form.js

import { required, diyRequired } from '@/components/template/rules_verify.js'
import { listPageV2 } from '@/api/auxiliaryFittings/supplier'
import { goodsPurchaseList, goodsPurchaseDetail } from '@/api/goodsPurchasedStored.js'
import { storageListPageV2 } from '@/api/storage.js'
import ImageUpload from '@/components/file-upload'
export default {
  data() {
    return {
      gysList: [],
      warehouseList: [],
      cgrkOrder: []
    }
  },
  computed: {
    formItems() {
      return [
        {
          md: 24,
          isShow: true,
          name: 'slot-component',
          formItemAttributes: {
            label: '',
            prop: '',
            'label-width': '0px'
          },
          render: (h, { props, onInput }) => {
            var { value } = props
            return (
              <div>
                <el-descriptions
                  border
                  title=""
                  column={4}
                  colon={false}
                  labelStyle={{ width: '8%' }}
                  contentStyle={{ width: '17%' }}
                >
                  <el-descriptions-item label="单据状态">
                    {{ SAVE: '保存', WAIT: '待审核', OK: '通过', FAIL: '失败' }[this.formData.status] || ''}
                  </el-descriptions-item>
                  <el-descriptions-item label="单据编号">{this.formData.id || ''}</el-descriptions-item>
                  <el-descriptions-item label="所属商户" contentStyle={{ width: '42%' }}>
                    {JSON.parse(localStorage.getItem('greemall_user')).companyName}
                  </el-descriptions-item>
                </el-descriptions>
                <el-descriptions
                  border
                  title=""
                  column={3}
                  colon={false}
                  labelStyle={{ width: '8%' }}
                  contentStyle={{ width: '25%' }}
                  style="margin-top:-1px"
                >
                  <el-descriptions-item label="*供应商名称">
                    <div class="redbordererr">
                      <el-form-item
                        label=""
                        lebel-width="0px"
                        prop={`venderId`}
                        rules={[
                          diyRequired.bind(this)((rule, value) => {
                            if (this.logs) {
                              this.logs.push({ errMsg: `*供应商名称不能为空` })
                            }
                            this?.tishicuowu?.()
                            return new Error('必须填写')
                          })
                        ]}
                      >
                        <el-select
                          style="width:100%"
                          value={this.formData.venderId}
                          onInput={val => {
                            this.formData.venderId = val
                          }}
                          placeholder="请选择"
                          disabled={!!~['WAIT', 'OK', 'FAIL'].indexOf(this.formData.status)}
                          onChange={val => {
                            if (val) {
                              this.formData['venderName'] = this.gysList.find(item => item.venderId == val).venderName
                            } else {
                              this.formData['venderName'] = ''
                            }
                            if (!!~['merchandisePurchaseReturn'].indexOf(this?.$route?.name)) {
                              this.formData.goodsPurchaseId = ''
                              this.cgrkOrder = []
                              this.formData.items = []
                              this.getCgrkOrder()
                            }
                            this.formData.planItems = []
                          }}
                        >
                          {this.gysList.map(item => (
                            <el-option key={item.venderId} label={item.venderName} value={item.venderId}></el-option>
                          ))}
                        </el-select>
                      </el-form-item>
                    </div>
                  </el-descriptions-item>
                  <el-descriptions-item
                    label={
                      (JSON.parse(localStorage.getItem('greemall_user')).joinCode === 'NO' ? '' : '*') +
                      (!!~['merchandisePurchaseReturn'].indexOf(this?.$route?.name) ? '出库仓库' : '入库仓库')
                    }
                  >
                    <div class="redbordererr">
                      <el-form-item label="" lebel-width="0px" prop={`storageId`}>
                        <el-select
                          style="width:100%"
                          value={this.formData.storageId}
                          onInput={val => {
                            this.formData.storageId = val
                          }}
                          placeholder="请选择"
                          disabled={
                            !!~['WAIT', 'OK', 'FAIL'].indexOf(this.formData.status) ||
                            !!~['merchandisePurchaseReturn'].indexOf(this?.$route?.name) ||
                            JSON.parse(localStorage.getItem('greemall_user')).joinCode === 'NO'
                          }
                          onChange={val => {
                            if (val) {
                              this.formData['storageName'] = this.warehouseList.find(
                                item => item.storageId == val
                              ).storageName
                            } else {
                              this.formData['storageName'] = ''
                            }
                          }}
                        >
                          {this.warehouseList.map(item => (
                            <el-option key={item.storageId} label={item.storageName} value={item.storageId}></el-option>
                          ))}
                        </el-select>
                      </el-form-item>
                    </div>
                  </el-descriptions-item>
                  {!!~['merchandisePurchaseReturn'].indexOf(this?.$route?.name) ? (
                    <el-descriptions-item label="*采购入库单">
                      <div class="redbordererr">
                        <el-form-item
                          label=""
                          lebel-width="0px"
                          prop={`goodsPurchaseId`}
                          rules={[
                            diyRequired.bind(this)((rule, value) => {
                              if (this.logs) {
                                this.logs.push({ errMsg: `*采购入库单不能为空` })
                              }
                              this?.tishicuowu?.()
                              return new Error('必须填写')
                            })
                          ]}
                        >
                          <el-select
                            style="width:100%"
                            value={this.formData.goodsPurchaseId}
                            onInput={val => {
                              this.formData.goodsPurchaseId = val
                            }}
                            placeholder="请选择"
                            disabled={!!~['WAIT', 'OK', 'FAIL'].indexOf(this.formData.status)}
                            filterable={true}
                            clearable={true}
                            onChange={val => {
                              this.formData.items = []
                              if (val) {
                                goodsPurchaseDetail({ id: val, isQuery: true }).then(res => {
                                  this.joinCode = res.data.joinCode === 'CODE'
                                  this.formData.storageId = res.data.storageId
                                  this.formData.storageName = res.data.storageName
                                  this.formData.isPlan = res.data.isPlan
                                  this.getWarehouseList(1)
                                  this.formData.items = res.data.items.map(item => ({
                                    brandId: item.brandId,
                                    brandName: item.brandName,
                                    mainId: item.mainId,
                                    mainName: item.mainName,
                                    smallId: item.smallId,
                                    smallName: item.smallName,
                                    goodsMaterialId: item.goodsMaterialId,
                                    goodsMaterialName: item.goodsMaterialName,
                                    specsName: item.specsName,
                                    unit: item.unit,
                                    insideQty: item.insideQty,
                                    outQty: item.outQty,
                                    partsQty: item.partsQty,
                                    qty: item.qty,
                                    price: item.price,
                                    amount: item.amount,
                                    stockQty: item.stockQty,
                                    factoryNo: item.factoryNo,
                                    retQty: '',
                                    retInsideQty: '',
                                    retOutQty: '',
                                    retPartsQty: '',
                                    insideCodeQty: '',
                                    outCodeQty: '',
                                    partsCodeQty: '',
                                    retAmount: '',
                                    details: {}
                                  }))
                                  this.formData.planItems = res.data.planItems
                                })
                              }
                            }}
                          >
                            {this.cgrkOrder.map(item => (
                              <el-option
                                key={item.id}
                                label={`${item.id} | 销售金额:${item.totalAmount || '-'} | 入库时间:${
                                  item.examineTime || '-'
                                }`}
                                value={item.id}
                              ></el-option>
                            ))}
                          </el-select>
                        </el-form-item>
                      </div>
                    </el-descriptions-item>
                  ) : !!~['goodsPurchasedStored'].indexOf(this?.$route?.name) ? (
                    <el-descriptions-item label="*是否关联计划单">
                      <el-radio
                        value={this.formData.isPlan}
                        onInput={v => {
                          this.formData.isPlan = v
                        }}
                        label={true}
                      >
                        是
                      </el-radio>
                      <el-radio
                        value={this.formData.isPlan}
                        onInput={v => {
                          this.formData.isPlan = v
                        }}
                        label={false}
                      >
                        否
                      </el-radio>
                    </el-descriptions-item>
                  ) : (
                    <el-descriptions-item label=""></el-descriptions-item>
                  )}
                </el-descriptions>
                <el-descriptions
                  border
                  title=""
                  column={4}
                  colon={false}
                  labelStyle={{ width: '8%' }}
                  contentStyle={{ width: '17%' }}
                  style="margin-top:-1px"
                >
                  {!!~['merchandisePurchaseReturn'].indexOf(this?.$route?.name)
                    ? [
                        <el-descriptions-item label="退货数量">{this.formData.totalQty}</el-descriptions-item>,
                        <el-descriptions-item label="退款金额">{this.formData.totalAmount}</el-descriptions-item>,
                        <el-descriptions-item label=""></el-descriptions-item>,
                        <el-descriptions-item label=""></el-descriptions-item>
                      ]
                    : null}
                  <el-descriptions-item label="制单人">{this.formData.createBy}</el-descriptions-item>
                  <el-descriptions-item label="制单时间">{this.formData.createTime}</el-descriptions-item>
                  <el-descriptions-item label="审核人">{this.formData.examineBy}</el-descriptions-item>
                  <el-descriptions-item label="审核时间">{this.formData.examineTime}</el-descriptions-item>
                </el-descriptions>
                <el-descriptions
                  border
                  title=""
                  column={4}
                  colon={false}
                  labelStyle={{ width: '8%' }}
                  contentStyle={{ width: '17%' }}
                  style="margin-top:-1px"
                >
                  <el-descriptions-item label="*备注" contentStyle={{ width: '92%' }}>
                    <el-input
                      type="textarea"
                      placeholder="请输入内容"
                      value={this.formData.remark}
                      onInput={val => {
                        this.formData.remark = val
                      }}
                      maxlength="200"
                      show-word-limit
                      autosize={{ minRows: 2, maxRows: 4 }}
                      disabled={!!~['WAIT', 'OK', 'FAIL'].indexOf(this.formData.status)}
                    ></el-input>
                  </el-descriptions-item>
                </el-descriptions>
                <el-descriptions
                  border
                  title=""
                  column={4}
                  colon={false}
                  labelStyle={{ width: '8%' }}
                  contentStyle={{ width: '17%' }}
                  style="margin-top:-1px"
                >
                  <el-descriptions-item label="附件" contentStyle={{ width: '92%' }}>
                    <ImageUpload
                      fileList={this.formData.fileUrl}
                      uid="imgSrc666_materials_drawing_images"
                      limit={1}
                      isEdit={!~['WAIT', 'OK', 'FAIL'].indexOf(this.formData.status)}
                      fileType={['image']}
                    />
                  </el-descriptions-item>
                </el-descriptions>
              </div>
            )
          }
        }
      ]
    }
  },
  methods: {
    // 获取供应商列表
    getGysList() {
      listPageV2({
        pageNum: 1,
        pageSize: -1,
        params: [
          { param: 'a.status', compare: '=', value: 'ON' },
          { param: 'a.vender_type', compare: 'like', value: '商品' }
        ]
      }).then(res => {
        this.gysList = res.data.records
      })
    },
    getCgrkOrder() {
      if (this.formData.venderId) {
        goodsPurchaseList({
          pageNum: 1,
          pageSize: -1,
          params: [
            { param: 'a.vender_id', compare: '=', value: this.formData.venderId },
            { param: 'a.status', compare: '=', value: 'OK' }
          ]
        }).then(res => {
          this.cgrkOrder = res.data.records
          if (this.formData.goodsPurchaseId) {
            goodsPurchaseDetail({ id: this.formData.goodsPurchaseId, isQuery: true }).then(res => {
              this.joinCode = res.data.joinCode === 'CODE'
            })
          }
        })
      }
    },
    getWarehouseList(type) {
      storageListPageV2({
        pageNum: 1,
        pageSize: -1,
        params: [
          { param: 'a.type', compare: 'like', value: '商品' },
          { param: 'a.status', compare: '=', value: 'true' }
        ]
      }).then(res => {
        if (JSON.parse(localStorage.getItem('greemall_user')).joinCode != 'NO' && !this.formData.storageId && type) {
          this.formData.storageId = res.data.records[0].storageId
          this.formData.storageName = res.data.records[0].storageName
        }
        this.warehouseList = res.data.records
      })
    }
  }
}