|
|
@@ -1,219 +1,252 @@
|
|
|
<template>
|
|
|
- <!-- 现货合同详情-->
|
|
|
- <a-modal class="add-custom custom-detail"
|
|
|
- title="现货合同详情"
|
|
|
- v-model:visible="visible"
|
|
|
- centered
|
|
|
- :maskClosable="maskClosableFlag"
|
|
|
- @cancel="cancel"
|
|
|
- width="890px">
|
|
|
- <template #footer>
|
|
|
- <a-button key="submit"
|
|
|
- type="primary"
|
|
|
- :loading="loading"
|
|
|
- @click="cancel">关闭
|
|
|
- </a-button>
|
|
|
- </template>
|
|
|
- <a-tabs v-model:activeKey="activeKey"
|
|
|
- @change="tabClick">
|
|
|
- <a-tab-pane v-for="item in tabList"
|
|
|
- :key="item.key"
|
|
|
- :tab="item.name">
|
|
|
- </a-tab-pane>
|
|
|
- </a-tabs>
|
|
|
- <InfoDetail :selectedRow="selectedRow"
|
|
|
- :businessManager="businessManager"
|
|
|
- v-if="activeKey == 1" />
|
|
|
- <div class="tableDatas"
|
|
|
- v-else>
|
|
|
- <a-table class="dialogTable"
|
|
|
- :columns="columns"
|
|
|
- :data-source="tableList"
|
|
|
- :pagination="false">
|
|
|
- <template #status="{ text }">
|
|
|
- <span class="yellow">{{ text }}</span>
|
|
|
- <!-- 审核通过'green' 审核拒绝 'orange' 待审核'yellow' -->
|
|
|
+ <!-- 现货合同详情-->
|
|
|
+ <a-modal class="add-custom custom-detail"
|
|
|
+ title="现货合同详情"
|
|
|
+ v-model:visible="visible"
|
|
|
+ centered
|
|
|
+ :maskClosable="maskClosableFlag"
|
|
|
+ @cancel="cancel"
|
|
|
+ width="890px">
|
|
|
+ <template #footer>
|
|
|
+ <a-button key="submit"
|
|
|
+ type="primary"
|
|
|
+ :loading="loading"
|
|
|
+ @click="cancel">关闭
|
|
|
+ </a-button>
|
|
|
</template>
|
|
|
-
|
|
|
- <template #applystatus="{ text }">
|
|
|
- <a>{{ getApplyStatusName(text) }}</a>
|
|
|
- </template>
|
|
|
-
|
|
|
- </a-table>
|
|
|
- </div>
|
|
|
- </a-modal>
|
|
|
+ <a-tabs v-model:activeKey="activeKey"
|
|
|
+ @change="tabClick">
|
|
|
+ <a-tab-pane v-for="item in tabList"
|
|
|
+ :key="item.key"
|
|
|
+ :tab="item.name">
|
|
|
+ </a-tab-pane>
|
|
|
+ </a-tabs>
|
|
|
+ <InfoDetail :selectedRow="selectedRow"
|
|
|
+ :businessManager="businessManager"
|
|
|
+ v-if="activeKey == 1"/>
|
|
|
+ <div class="tableDatas"
|
|
|
+ v-else>
|
|
|
+ <a-table class="dialogTable"
|
|
|
+ :columns="columns"
|
|
|
+ :data-source="tableList"
|
|
|
+ :pagination="false">
|
|
|
+ <template #status="{ text }">
|
|
|
+ <span class="yellow">{{ text }}</span>
|
|
|
+ <!-- 审核通过'green' 审核拒绝 'orange' 待审核'yellow' -->
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <template #applystatus="{ text }">
|
|
|
+ <a>{{ getApplyStatusName(text) }}</a>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <!-- 发票金额-->
|
|
|
+ <template #invoicetype="{ text }">
|
|
|
+ <a>{{ invoiceStatusName(text) }}</a>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <!-- 发票类型-->
|
|
|
+ <template #contracttype="{ text }">
|
|
|
+ <a>{{ getPlanContractType(text) }}</a>
|
|
|
+ </template>
|
|
|
+
|
|
|
+ <!-- 出入库类型 -->
|
|
|
+ <template #inouttype="{ text }">
|
|
|
+ <a>{{ InOutTypeName(text) }}</a>
|
|
|
+ </template>
|
|
|
+
|
|
|
+
|
|
|
+ </a-table>
|
|
|
+ </div>
|
|
|
+ </a-modal>
|
|
|
</template>
|
|
|
|
|
|
<script lang="ts">
|
|
|
-import { defineComponent, PropType, ref } from 'vue';
|
|
|
-import { closeModal } from '@/common/setup/modal/index';
|
|
|
-import { Ermcp3ContractRsp } from '@/services/go/ermcp/spot-contract/interface';
|
|
|
-import { queryResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
|
|
|
-import { QueryBusinessFp, QueryBusinessKx } from '@/services/go/ermcp/finance-review';
|
|
|
-import { QueryBusinessDj, QueryBusinessJs } from '@/services/go/ermcp/business-review';
|
|
|
-import { QueryAreaStockApply } from '@/services/go/ermcp/inventory-review';
|
|
|
-import { QueryChangeLog } from '@/services/go/ermcp/spot-contract';
|
|
|
-import { ErmcpLoginUserEx } from '@/services/go/ermcp/account/interface';
|
|
|
-import InfoDetail from '../infoDetail/index.vue';
|
|
|
-import { getApplyStatusName } from '@/views/manage/business-review/setup';
|
|
|
-import { getTableColumns } from '@/common/setup/table';
|
|
|
-
|
|
|
-export default defineComponent({
|
|
|
- name: 'spot-contract-detail',
|
|
|
- components: { InfoDetail },
|
|
|
- props: {
|
|
|
- selectedRow: {
|
|
|
- type: Object as PropType<Ermcp3ContractRsp>,
|
|
|
- default: {},
|
|
|
+ import {defineComponent, PropType, ref} from 'vue';
|
|
|
+ import {closeModal} from '@/common/setup/modal/index';
|
|
|
+ import {Ermcp3ContractRsp} from '@/services/go/ermcp/spot-contract/interface';
|
|
|
+ import {queryResultLoadingAndInfo} from '@/common/methods/request/resultInfo';
|
|
|
+ import {QueryBusinessFp, QueryBusinessKx} from '@/services/go/ermcp/finance-review';
|
|
|
+ import {QueryBusinessDj, QueryBusinessJs} from '@/services/go/ermcp/business-review';
|
|
|
+ import {QueryAreaStockApply} from '@/services/go/ermcp/inventory-review';
|
|
|
+ import {QueryChangeLog} from '@/services/go/ermcp/spot-contract';
|
|
|
+ import {ErmcpLoginUserEx} from '@/services/go/ermcp/account/interface';
|
|
|
+ import InfoDetail from '../infoDetail/index.vue';
|
|
|
+ import {getApplyStatusName} from '@/views/manage/business-review/setup';
|
|
|
+ import {getTableColumns} from '@/common/setup/table';
|
|
|
+ import {invoiceStatusName} from "@/views/manage/finance-review/setup";
|
|
|
+ import {getPlanContractType} from "@/views/business/plan/setup";
|
|
|
+ import {InOutTypeName} from "@/views/manage/inventory-review/setup";
|
|
|
+
|
|
|
+ export default defineComponent({
|
|
|
+ name: 'spot-contract-detail',
|
|
|
+ components: {InfoDetail},
|
|
|
+ props: {
|
|
|
+ selectedRow: {
|
|
|
+ type: Object as PropType<Ermcp3ContractRsp>,
|
|
|
+ default: {},
|
|
|
+ },
|
|
|
+ businessManager: {
|
|
|
+ type: Array as PropType<ErmcpLoginUserEx[]>,
|
|
|
+ default: [],
|
|
|
+ },
|
|
|
},
|
|
|
- businessManager: {
|
|
|
- type: Array as PropType<ErmcpLoginUserEx[]>,
|
|
|
- default: [],
|
|
|
- },
|
|
|
- },
|
|
|
- setup: function(props, context) {
|
|
|
- const { visible, cancel } = closeModal('detail');
|
|
|
-
|
|
|
- const tabList = [
|
|
|
- { key: 1, name: '合同详情' },
|
|
|
- { key: 2, name: '点价记录' },
|
|
|
- { key: 3, name: '交收记录' },
|
|
|
- { key: 4, name: '款项记录' },
|
|
|
- { key: 5, name: '发票记录' },
|
|
|
- { key: 6, name: '入库记录' },
|
|
|
- { key: 7, name: '变更记录' },
|
|
|
- ];
|
|
|
- const activeKey = ref<number>(1);
|
|
|
-
|
|
|
- const loading = ref<boolean>(false);
|
|
|
- const tableList = ref<any[]>([]);
|
|
|
- // 表头数据
|
|
|
- const { columns, registerColumn } = getTableColumns();
|
|
|
- function tabClick() {
|
|
|
- const relatedid = props.selectedRow.spotcontractid;
|
|
|
- switch (activeKey.value) {
|
|
|
- case 1:
|
|
|
- break;
|
|
|
- case 2: // 点价记录
|
|
|
- registerColumn('table_pcweb_someprice_detail_dj', []);
|
|
|
- queryResultLoadingAndInfo(QueryBusinessDj, loading, { relatedid }).then((res) => {
|
|
|
- tableList.value = res;
|
|
|
- });
|
|
|
- break;
|
|
|
- case 3: // 交收记录
|
|
|
- registerColumn('table_pcweb_someprice_detail_js', []);
|
|
|
- queryResultLoadingAndInfo(QueryBusinessJs, loading, { relatedid }).then((res) => {
|
|
|
- tableList.value = res;
|
|
|
- });
|
|
|
- break;
|
|
|
- case 4: //款项记录
|
|
|
- registerColumn('table_pcweb_someprice_detail_kx', []);
|
|
|
- queryResultLoadingAndInfo(QueryBusinessKx, loading, { relatedid }).then((res) => {
|
|
|
- tableList.value = res;
|
|
|
- });
|
|
|
- break;
|
|
|
- case 5: // 发票记录
|
|
|
- registerColumn('table_pcweb_someprice_detail_fp', []);
|
|
|
- queryResultLoadingAndInfo(QueryBusinessFp, loading, { relatedid }).then((res) => {
|
|
|
- tableList.value = res;
|
|
|
- });
|
|
|
- break;
|
|
|
- case 6: // 入库记录
|
|
|
- registerColumn('table_pcweb_someprice_detail_stock', []);
|
|
|
- queryResultLoadingAndInfo(QueryAreaStockApply, loading, {
|
|
|
- spotcontractid: relatedid,
|
|
|
- inouttype: '1,3',
|
|
|
- }).then((res) => {
|
|
|
- tableList.value = res;
|
|
|
- });
|
|
|
- break;
|
|
|
- case 7: // 变更记录
|
|
|
- registerColumn('table_pcweb_someprice_detail_change', []);
|
|
|
- queryResultLoadingAndInfo(QueryChangeLog, loading, { RelatedId: relatedid }).then((res) => {
|
|
|
- tableList.value = res;
|
|
|
- });
|
|
|
- break;
|
|
|
+ setup: function (props, context) {
|
|
|
+ const {visible, cancel} = closeModal('detail');
|
|
|
+
|
|
|
+ const tabList = [
|
|
|
+ {key: 1, name: '合同详情'},
|
|
|
+ {key: 2, name: '点价记录'},
|
|
|
+ {key: 3, name: '交收记录'},
|
|
|
+ {key: 4, name: '款项记录'},
|
|
|
+ {key: 5, name: '发票记录'},
|
|
|
+ {key: 6, name: '入库记录'},
|
|
|
+ {key: 7, name: '出库记录'},
|
|
|
+ {key: 8, name: '变更记录'},
|
|
|
+ ];
|
|
|
+ const activeKey = ref<number>(1);
|
|
|
+
|
|
|
+ const loading = ref<boolean>(false);
|
|
|
+ const tableList = ref<any[]>([]);
|
|
|
+ // 表头数据
|
|
|
+ const {columns, registerColumn} = getTableColumns();
|
|
|
+
|
|
|
+ function tabClick() {
|
|
|
+ const relatedid = props.selectedRow.spotcontractid;
|
|
|
+ switch (activeKey.value) {
|
|
|
+ case 1:
|
|
|
+ break;
|
|
|
+ case 2: // 点价记录
|
|
|
+ registerColumn('table_pcweb_someprice_detail_dj', []);
|
|
|
+ queryResultLoadingAndInfo(QueryBusinessDj, loading, {relatedid}).then((res) => {
|
|
|
+ tableList.value = res;
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case 3: // 交收记录
|
|
|
+ registerColumn('table_pcweb_someprice_detail_js', []);
|
|
|
+ queryResultLoadingAndInfo(QueryBusinessJs, loading, {relatedid}).then((res) => {
|
|
|
+ tableList.value = res;
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case 4: //款项记录
|
|
|
+ registerColumn('table_pcweb_someprice_detail_kx', []);
|
|
|
+ queryResultLoadingAndInfo(QueryBusinessKx, loading, {relatedid}).then((res) => {
|
|
|
+ tableList.value = res;
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case 5: // 发票记录
|
|
|
+ registerColumn('table_pcweb_someprice_detail_fp', []);
|
|
|
+ queryResultLoadingAndInfo(QueryBusinessFp, loading, {relatedid}).then((res) => {
|
|
|
+ tableList.value = res;
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case 6: // 入库记录
|
|
|
+ registerColumn('table_pcweb_someprice_detail_stock', []);
|
|
|
+ queryResultLoadingAndInfo(QueryAreaStockApply, loading, {
|
|
|
+ spotcontractid: relatedid,
|
|
|
+ inouttype: '1,3',
|
|
|
+ }).then((res) => {
|
|
|
+ tableList.value = res;
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case 7: // 出库记录
|
|
|
+ registerColumn('table_pcweb_someprice_detail_stock_out', []);
|
|
|
+ queryResultLoadingAndInfo(QueryAreaStockApply, loading, {
|
|
|
+ spotcontractid: relatedid,
|
|
|
+ inouttype: '2,4',
|
|
|
+ }).then((res) => {
|
|
|
+ tableList.value = res;
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ case 8: //// 变更记录
|
|
|
+ registerColumn('table_pcweb_someprice_detail_change', []);
|
|
|
+ queryResultLoadingAndInfo(QueryChangeLog, loading, {RelatedId: relatedid}).then((res) => {
|
|
|
+ tableList.value = res;
|
|
|
+ });
|
|
|
+ break;
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- return {
|
|
|
- visible,
|
|
|
- cancel,
|
|
|
- loading,
|
|
|
- maskClosableFlag: false,
|
|
|
- activeKey,
|
|
|
- columns,
|
|
|
- tableList,
|
|
|
- tabList,
|
|
|
- tabClick,
|
|
|
- getApplyStatusName,
|
|
|
- };
|
|
|
- },
|
|
|
-});
|
|
|
+ return {
|
|
|
+ visible,
|
|
|
+ cancel,
|
|
|
+ loading,
|
|
|
+ maskClosableFlag: false,
|
|
|
+ activeKey,
|
|
|
+ columns,
|
|
|
+ tableList,
|
|
|
+ tabList,
|
|
|
+ tabClick,
|
|
|
+ getApplyStatusName,
|
|
|
+ invoiceStatusName,
|
|
|
+ getPlanContractType,
|
|
|
+ InOutTypeName,
|
|
|
+ };
|
|
|
+ },
|
|
|
+ });
|
|
|
</script>
|
|
|
|
|
|
<style lang="less">
|
|
|
-.custom-detail {
|
|
|
- .ant-modal-content {
|
|
|
- .ant-modal-body {
|
|
|
- padding-top: 0;
|
|
|
- padding-left: 0;
|
|
|
- padding-right: 0;
|
|
|
-
|
|
|
- .ant-tabs {
|
|
|
- background: @m-black11;
|
|
|
- width: 100%;
|
|
|
- padding: 0 24px;
|
|
|
-
|
|
|
- .ant-tabs-bar {
|
|
|
- margin-bottom: 0;
|
|
|
- border-bottom: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .ant-tabs-nav-container {
|
|
|
- .ant-tabs-nav-wrap {
|
|
|
- .ant-tabs-nav {
|
|
|
- .ant-tabs-tab {
|
|
|
- width: 70px;
|
|
|
- margin-right: 43px;
|
|
|
- text-align: center;
|
|
|
- font-size: 16px;
|
|
|
- color: #88a0ae;
|
|
|
- padding: 0;
|
|
|
- line-height: 45px;
|
|
|
- }
|
|
|
-
|
|
|
- .ant-tabs-tab-active.ant-tabs-tab {
|
|
|
- color: #3a87f7;
|
|
|
- }
|
|
|
+ .custom-detail {
|
|
|
+ .ant-modal-content {
|
|
|
+ .ant-modal-body {
|
|
|
+ padding-top: 0;
|
|
|
+ padding-left: 0;
|
|
|
+ padding-right: 0;
|
|
|
+
|
|
|
+ .ant-tabs {
|
|
|
+ background: @m-black11;
|
|
|
+ width: 100%;
|
|
|
+ padding: 0 24px;
|
|
|
+
|
|
|
+ .ant-tabs-bar {
|
|
|
+ margin-bottom: 0;
|
|
|
+ border-bottom: 0;
|
|
|
+ }
|
|
|
|
|
|
- .ant-tabs-ink-bar {
|
|
|
- width: 70px !important;
|
|
|
- background: #3a87f7;
|
|
|
- .rounded-corners(1px);
|
|
|
+ .ant-tabs-nav-container {
|
|
|
+ .ant-tabs-nav-wrap {
|
|
|
+ .ant-tabs-nav {
|
|
|
+ .ant-tabs-tab {
|
|
|
+ width: 70px;
|
|
|
+ margin-right: 43px;
|
|
|
+ text-align: center;
|
|
|
+ font-size: 16px;
|
|
|
+ color: #88a0ae;
|
|
|
+ padding: 0;
|
|
|
+ line-height: 45px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ant-tabs-tab-active.ant-tabs-tab {
|
|
|
+ color: #3a87f7;
|
|
|
+ }
|
|
|
+
|
|
|
+ .ant-tabs-ink-bar {
|
|
|
+ width: 70px !important;
|
|
|
+ background: #3a87f7;
|
|
|
+ .rounded-corners(1px);
|
|
|
+ }
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .tableDatas {
|
|
|
- margin-top: 26px;
|
|
|
- padding: 0 24px;
|
|
|
- overflow: hidden;
|
|
|
+ .tableDatas {
|
|
|
+ margin-top: 26px;
|
|
|
+ padding: 0 24px;
|
|
|
+ overflow: hidden;
|
|
|
|
|
|
- .dialogTable {
|
|
|
- width: 100%;
|
|
|
- overflow: overlay;
|
|
|
+ .dialogTable {
|
|
|
+ width: 100%;
|
|
|
+ overflow: overlay;
|
|
|
+ }
|
|
|
}
|
|
|
- }
|
|
|
|
|
|
- .ant-form.inlineForm {
|
|
|
- margin-top: 20px;
|
|
|
- padding: 0 24px;
|
|
|
+ .ant-form.inlineForm {
|
|
|
+ margin-top: 20px;
|
|
|
+ padding: 0 24px;
|
|
|
+ }
|
|
|
}
|
|
|
-}
|
|
|
</style
|
|
|
>;
|