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.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.getWarehouseList()
                                  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.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>
                  ) : (
                    <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(){
		storageListPageV2({
          pageNum: 1,
          pageSize: -1,
          params: [{param: "a.type", compare: "like", value: "商品"}]
        }).then(res => {
			if(JSON.parse(localStorage.getItem('greemall_user')).joinCode != "NO"){
				this.formData.storageId = res.data.records[0].storageId
				this.formData.storageName = res.data.records[0].storageName
			}
          this.warehouseList = res.data.records
        })
	}
  }
}