<template>
  <div class="exp-form">
    <van-collapse v-model="activeNames">
      <van-collapse-item title="基础信息" name="1">
        <van-field v-model="form.itemCd" label="物料编码" readonly />
        <van-field v-model="form.itemNm" label="物料名称" readonly />
        <van-field v-model="form.applyDt" label="申请日期" readonly />
        <van-field v-model="form.year" label="年份" readonly />
        <van-field v-model="form.uomStr" label="计量单位" readonly  :formatter="formatter">

        </van-field>
        <van-field v-model="form.specType" label="规格型号" readonly />
        <van-field v-model="form.remark" label="备注" readonly />
      </van-collapse-item>
      <van-collapse-item title="行信息" name="2">
        <div v-for="(item,index) in tableDataMx" style="color: #323233">
          <div class="padd" style="display: flex;justify-content: space-between;">
            <span>{{item.tradePartnerName}}</span>
            <span>计划量：{{item.qty}}</span>
          </div>
          <div class="padd" style="display: flex;justify-content: space-between;">
            <span>现汇价格：{{item.priceCash}}</span>
            <span>承兑价格：{{item.priceBill}}</span>
          </div>
          <div class="padd">
            <span>备注：{{item.remark}}</span>
          </div>

          <van-divider />
        </div>

      </van-collapse-item>
    </van-collapse>
  </div>
</template>

<script setup lang="ts">
import { ref, reactive, onMounted, getCurrentInstance } from 'vue'
import { useRouter, useRoute } from 'vue-router'
import { showToast, showDialog, showLoadingToast, showSuccessToast, closeToast } from 'vant'
const { proxy } = getCurrentInstance()

import {
  useWorkflowStore
} from "@/stores/workflow"
const route = useRoute()
import { AddressList , PickerGroup ,showFailToast } from 'vant';
const workflow = useWorkflowStore()

onMounted(() => {
  workflow.setWorkId(route.query.workId);
  getTableData()
  dictData()
})

const activeNames = ref(['1'])

const form = ref({
  id: '',
  signReqNm: '',
  signDt: '',
  otherInformation: '',
  estProfit: null,
  ProcessInstanceSts: '',

  addDeptName: '',
  addTime: '',
  workModel: {
    flowStatusName: ''
  }
})

const getTableData = () => {
  var url = 'sal/PlanHead/queryByWorkId'

  var param = {
    id: workflow.workId
  }

  proxy.$axios.get(url, param).then((response:any) => {
    if (response.data.code == '0') {
      form.value = response.data.data
      form.value.uomStr = form.value.uom
      getTableLine(response.data.data.id)
    } else {
      showFailToast('操作失败！' + response.data.msg);
    }
  })
}

const tableDataMx = ref([])

const getTableLine = (id) =>{
  var url = 'sal/PlanLine/queryAll'
  var param = {
    params: JSON.stringify({fId: id})
  }
  proxy.$axios.post(url, param).then(response => {
    if (response.data.code == 0) {
      tableDataMx.value = response.data.data.records
    } else {
      showFailToast('操作失败！' + response.data.msg);
    }
  });
}

const formatter = () => {
  var re = ''
  if (dictList.value.MEASURING_UNIT){
    for (var i =0 ; i < dictList.value.MEASURING_UNIT.length ; i++){
      if (form.value.uom == dictList.value.MEASURING_UNIT[i].dicCode){
        re =  dictList.value.MEASURING_UNIT[i].dicName
        form.value.uomStr = re
        break;
      }
    }
  }
  return form.value.uomStr
}
const dictList = ref({})
const dictData = () => {
  var url = 'framework/Common/querySelectorList'
  var param = {
    type: JSON.stringify([ 'MEASURING_UNIT'])
  }
  proxy.$axios.get(url, param).then(response => {
    if (response.data.code == '0') {
      dictList.value = response.data.data
    } else {
      showFailToast('操作失败！' + response.data.msg);
    }
  })

}


</script>

<style lang="scss" scoped>
.exp-form {
  background: #f7f8fa;
  padding-bottom: 20px;
}
.padd {
  padding: 3px;
}

.van-collapse-item {
  padding: 10px;
  border-radius: 45px !important;

  .van-cell--clickable {
    border-radius: 10px 10px 0 0;
  }
}

:deep .van-cell {
  border-radius: 10px 10px 0 0;
}

:deep .van-collapse-item__wrapper {
  border-radius: 0 0 10px 10px;
}
</style>
