<template>
  <Detail :selectedRow="contractInfo">
    <fieldset class="formFieldSet">
      <legend>其它信息</legend>
      <Des :list="desList" />
    </fieldset>
  </Detail>
</template>

<script lang="ts">
import { defineComponent, PropType, ref } from 'vue';
import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
import { formatValue } from '@/common/methods';
import Detail from '../common-detail/index.vue';
import { Des, handleDesList } from '@/common/components/commonDes';
import { businessManager, findManagerName } from '../../list/setup';
import { QuerySpotContract } from '@/services/go/ermcp/spot-contract';

export default defineComponent({
  name: 'spot-contract-info-detail',
  components: { Detail, Des },
  props: {
    selectedRow: {
      type: Object as PropType<Ermcp3ContractRsp>,
      default: {},
    },
  },
  setup(props, context) {
    const contractInfo = ref<Ermcp3ContractRsp>();
    // 预览附件
    const { desList, getDesList } = handleDesList();

    // 获取合同详情
    QuerySpotContract({ contractid: props.selectedRow.spotcontractid }).then((res) => {
      if (res.length) {
        contractInfo.value = res[0];

        const { contractmargin, saleuserid, meruserid, tradeusername, remark } = res[0];
        const list = [
          { label: '保证金', value: formatValue(contractmargin) },
          { label: '业务员', value: formatValue(findManagerName(saleuserid, businessManager.value)) },
          { label: '跟单员', value: formatValue(findManagerName(meruserid, businessManager.value)) },
          { label: '交易用户', value: formatValue(tradeusername) },
        ];
        getDesList(list);
      }
    })

    return {
      contractInfo,
      desList,
    };
  },
});
</script>

<style lang="less">
.custom-detail {
    .upload {
        .look {
            margin-left: 0;
        }
    }
}
</style>
