Kaynağa Gözat

commit 现货和同详情

yu jie 4 yıl önce
ebeveyn
işleme
c0dd551d2a

+ 243 - 235
src/views/information/spot-contract/components/detail/index.vue

@@ -1,273 +1,281 @@
 <template>
-  <!-- 现货合同详情-->
-  <a-modal class="add-custom custom-detail"
-           title="现货合同详情"
-           v-model:visible="visible"
-           centered
-           :maskClosable="false"
-           @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="false"
+             @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'   -->
+                </template>
 
-        <template #applystatus="{ text }">
-          <a>{{ getApplyStatusName(text) }}</a>
-        </template>
+                <template #applystatus="{ text }">
+                    <a>{{ getApplyStatusName(text) }}</a>
+                </template>
 
-        <!-- 发票金额-->
-        <template #invoicetype="{ text }">
-          <a>{{ invoiceStatusName(text) }}</a>
-        </template>
+                <!-- 发票金额-->
+                <template #invoicetype="{ text }">
+                    <a>{{ invoiceStatusName(text) }}</a>
+                </template>
 
-        <!-- 发票类型-->
-        <template #contracttype="{ text }">
-          <a>{{ getPlanContractType(text) }}</a>
-        </template>
+                <!-- 发票类型-->
+                <template #contracttype="{ text }">
+                    <a>{{ getPlanContractType(text) }}</a>
+                </template>
 
-        <!-- 出入库类型 -->
-        <template #inouttype="{ text }">
-          <a>{{ InOutTypeName(text) }}</a>
-        </template>
+                <!-- 出入库类型 -->
+                <template #inouttype="{ text }">
+                    <a>{{ InOutTypeName(text) }}</a>
+                </template>
 
-      </a-table>
-    </div>
-  </a-modal>
+                <!-- 款项类型 -->
+                <template #kxtype="{ text }">
+                    <a>{{ kxtypeName(text) }}</a>
+                </template>
+
+            </a-table>
+        </div>
+    </a-modal>
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType, ref, watchEffect } 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 '@/common/constants/enumsName';
-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';
+    import {defineComponent, PropType, ref, watchEffect} 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 '@/common/constants/enumsName';
+    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: [],
+    export default defineComponent({
+        name: 'spot-contract-detail',
+        components: {InfoDetail},
+        props: {
+            selectedRow: {
+                type: Object as PropType<Ermcp3ContractRsp>,
+                default: {},
+            },
+            businessManager: {
+                type: Array as PropType<ErmcpLoginUserEx[]>,
+                default: [],
+            },
         },
-    },
-    setup: function(props, context) {
-        const { visible, cancel } = closeModal('detail');
-        const tabList = ref<{ key: number; name: string }[]>([]);
+        setup: function (props, context) {
+            const {visible, cancel} = closeModal('detail');
+            const tabList = ref<{ key: number; name: string }[]>([]);
 
-        const activeKey = ref<number>(1);
+            const activeKey = ref<number>(1);
 
-        const loading = ref<boolean>(false);
-        const tableList = ref<any[]>([]);
-        // 表头数据
-        const { columns, registerColumn } = getTableColumns();
-        watchEffect(() => {
-            if (visible.value && props.selectedRow.contracctstatus) {
-                // 审核拒绝和未提交不显示后面的选项
+            const loading = ref<boolean>(false);
+            const tableList = ref<any[]>([]);
+            // 表头数据
+            const {columns, registerColumn} = getTableColumns();
+            watchEffect(() => {
+                if (visible.value && props.selectedRow.contracctstatus) {
+                    // 审核拒绝和未提交不显示后面的选项
 
-                console.log(props.selectedRow.contracctstatus);
+                    console.log(props.selectedRow.contracctstatus);
 
-                tabList.value = [0, 4, 6].includes(props.selectedRow.contracctstatus)
-                    ? [{ key: 1, name: '合同详情' }]
-                    : props.selectedRow.contracttype === 1
-                    ? [
-                          { key: 1, name: '合同详情' },
-                          { key: 2, name: '点价记录' },
-                          { key: 3, name: '交收记录' },
-                          { key: 4, name: '款项记录' },
-                          { key: 5, name: '发票记录' },
-                          { key: 6, name: '入库记录' },
-                          { key: 8, name: '变更记录' },
-                      ]
-                    : [
-                          { key: 1, name: '合同详情' },
-                          { key: 2, name: '点价记录' },
-                          { key: 3, name: '交收记录' },
-                          { key: 4, name: '款项记录' },
-                          { key: 5, name: '发票记录' },
-                          { key: 7, name: '出库记录' },
-                          { key: 8, name: '变更记录' },
-                      ];
-                activeKey.value = 1;
-            }
-        });
-        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;
+                    tabList.value = [0, 4, 6].includes(props.selectedRow.contracctstatus)
+                        ? [{key: 1, name: '合同详情'}]
+                        : props.selectedRow.contracttype === 1
+                            ? [
+                                {key: 1, name: '合同详情'},
+                                {key: 2, name: '点价记录'},
+                                {key: 3, name: '交收记录'},
+                                {key: 4, name: '款项记录'},
+                                {key: 5, name: '发票记录'},
+                                {key: 6, name: '入库记录'},
+                                {key: 8, name: '变更记录'},
+                            ]
+                            : [
+                                {key: 1, name: '合同详情'},
+                                {key: 2, name: '点价记录'},
+                                {key: 3, name: '交收记录'},
+                                {key: 4, name: '款项记录'},
+                                {key: 5, name: '发票记录'},
+                                {key: 7, name: '出库记录'},
+                                {key: 8, name: '变更记录'},
+                            ];
+                    activeKey.value = 1;
+                }
+            });
+
+            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,
-            invoiceStatusName,
-            getPlanContractType,
-            InOutTypeName,
-        };
-    },
-});
+            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;
+    .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 {
+                    background: @m-black11;
+                    width: 100%;
+                    padding: 0 24px;
 
-                .ant-tabs-bar {
-                    margin-bottom: 0;
-                    border-bottom: 0;
-                }
-                .anticon {
-                    color: #88a0ae;
-                }
-                .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-bar {
+                        margin-bottom: 0;
+                        border-bottom: 0;
+                    }
 
-                            .ant-tabs-tab-active.ant-tabs-tab {
-                                color: #3a87f7;
-                            }
+                    .anticon {
+                        color: #88a0ae;
+                    }
+
+                    .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-ink-bar {
-                                width: 70px !important;
-                                background: #3a87f7;
-                                .rounded-corners(1px);
+                                .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
 >;