Merge branch 'master' of http://47.101.159.18:3000/Muchinfo/MTP2.0_WEB

src/common/components/firstMenu/index.vue

@@ -17,7 +17,7 @@
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, PropType } from 'vue';
+import { defineComponent, PropType, computed, ref } from 'vue';
 
 interface Key {
     [propName: string]: string;
@@ -35,10 +35,17 @@ export default defineComponent({
             default: '',
             type: String,
         },
+        selectedKey: {
+            default: ['0'],
+            type: Array as PropType<string[]>,
+        },
     },
     components: {},
     setup(props, context) {
         const current = ref<string[]>(['0']);
+        computed(() => {
+            current.value = props.selectedKey;
+        });
         function menuClick(value: any) {
             const index = +value.key;
             context.emit('selectMenu', props.list[index]);

src/common/methods/table/interface.ts

@@ -1,4 +1,3 @@
-
 interface CustomRender {
     customRender: string;
 }
@@ -17,4 +16,5 @@ export interface TableKey {
     table_pcweb_delivery: string; // 现货合同
     table_pcweb_userinfo: string; // 客户资料
     table_pcweb_warehouse: string; // 仓库信息
-}
+    table_pcweb_purchase: string; // 采购合同
+}

src/common/setup/buttonPermission/interface.ts

@@ -20,5 +20,8 @@ export interface BtnType {
     spot_contract_btn_resubmit: string; // 现货合同 重新提交
     spot_contract_btn_modify: string; // 现货合同 修改
     spot_contract_btn_delete: string; // 现货合同 删除
+    spot_contract_btn_finish: string; // 现货合同 正常完结
+    spot_contract_btn_check: string; // 现货合同 审核
+    spot_contract_btn_cancel: string; // 现货合同 撤销
 
 }

src/common/setup/modal/interface.ts

@@ -16,6 +16,9 @@ export interface ModalName {
     modifySpotContract: string; // 修改现货合同
     deleteSpotContract: string; // 删除现货合同
     spotContractDetail: string; // 现货合同详情
+    spotContractFinish: string; // 现货合同 正常完结
+    spotContractCheck: string; // 现货合同 审核
+    spotContractCancel: string; // 现货合同 撤销
 
     addGoods: string; // 新增商品
 

src/layout/components/header.vue

@@ -0,0 +1,101 @@
+<template>
+  <div>
+    <img src="../../assets/images/logoHeader.png" />
+    <span>深圳市多元世纪信息技术股份有限公司</span>
+  </div>
+  <div class="m-layout-header-right">
+    <div @click="openDrawer">
+      <span>{{ username }}，您好！</span>
+    </div>
+    <div class="relative">
+      <!-- <a-input-search ref="userNameInput"
+                          class="searchInput"
+                          readonly
+                          placeholder="请输入代码/名称"
+                          @pressEnter="search">
+          </a-input-search> -->
+      <!-- <a-icon type="search" /> -->
+    </div>
+    <div class="news-container">
+      <a-badge @click="openNotice">
+        <svg class="icon svg-icon"
+             aria-hidden="true">
+          <use xlink:href="#icon-xiaoxi"></use>
+        </svg>
+      </a-badge>
+    </div>
+    <div>
+      <a-popover v-model:visible="visible"
+                 trigger="click"
+                 placement="bottomRight">
+        <template #content>
+          <div v-for="item in setMenu"
+               @click="chooseSetMenu(item.path)"
+               :key="item.path">{{ item.name }}</div>
+        </template>
+        <a-avatar :size="24">
+          <template #icon>
+            <UserOutlined />
+          </template>
+        </a-avatar>
+      </a-popover>
+      <Setting />
+    </div>
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref, provide } from 'vue';
+import APP from '@/services';
+import { openModal } from '@/common/setup/modal/index';
+
+// 设置
+const setFn = () => {
+    const visible = ref<boolean>(false);
+    const chooseSetupItem = ref<string>('');
+    provide('ControlModal', chooseSetupItem);
+    const setMenu = [
+        // { name: '修改密码', path: 'password' },
+        // { name: '收货地址', path: 'addresss' },
+        // // {name: '发票', path: 'setup-password'},
+        // { name: '手机号码绑定/解绑', path: 'phone' },
+        // { name: '关于我们', path: 'aboutUs' },
+        { name: '退出', path: 'logout' },
+    ];
+    const { openAction } = openModal('logout');
+    function chooseSetMenu(path: string) {
+        // chooseSetupItem.value = path;
+        openAction();
+        console.log(path);
+        visible.value = false;
+    }
+
+    return { visible, setMenu, chooseSetMenu };
+};
+
+// 搜索
+const onSearch = () => {
+    function search(value: string) {
+        console.log(value);
+    }
+    return { search };
+};
+export default defineComponent({
+    props: {
+        collapsed: {
+            default: true,
+            type: Boolean,
+        },
+    },
+    setup() {
+        const username = APP.get('username');
+        const { openAction: openNotice } = openModal('notice');
+        return {
+            username,
+            openNotice,
+            ...setFn(),
+            ...onSearch(),
+        };
+    },
+});
+</script>

src/layout/components/main.vue

@@ -0,0 +1,49 @@
+<template>
+  <div class="exposure">
+    <firstMenu :list="list"
+               :value="'title'"
+               :selectedKey="selectedKey"
+               @selectMenu="selectMenu" />
+    <router-view />
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent, inject, ref, Ref, watchEffect } from 'vue';
+import firstMenu from '@/common/components/firstMenu/index.vue';
+import { useRouter } from 'vue-router';
+import { OperationTabMenu } from '@/services/go/commonService/interface';
+
+export default defineComponent({
+    name: 'main',
+    components: {
+        firstMenu,
+    },
+    setup() {
+        const router = useRouter();
+        const list = inject('thirdMenuList') as Ref<OperationTabMenu[]>;
+        const selectedKey = ref<string[]>(['0']);
+        // watchEffect(() => {
+        //     list.value.forEach((e, i) => {
+        //         if (router.currentRoute.value.fullPath.includes(e.code)) {
+        //             console.log('i', i);
+
+        //             selectedKey.value = [`${i}`];
+        //         }
+        //     });
+        // });
+        // 切换路由
+        function selectMenu(item: OperationTabMenu) {
+            router.push({ name: item.code });
+        }
+
+        return { selectMenu, list, selectedKey };
+    },
+});
+</script>
+
+<style lang="less">
+.sexposure {
+}
+</style
+>;

src/layout/components/menu.vue

@@ -0,0 +1,118 @@
+<template>
+  <a-menu theme="dark"
+          mode="inline"
+          class="left-menu"
+          v-model:selectedKeys="selectedKeys"
+          v-model:openKeys="openKeys"
+          @click="menuClick">
+    <a-sub-menu v-for="item in menuList"
+                :key="item.code">
+      <template #title>
+        <span>
+          <svg class="icon svg-icon"
+               aria-hidden="true">
+            <use :xlink:href="fontIcon(item.code)"></use>
+          </svg>
+          <span class="menu-item_title"
+                v-show="!collapsed">{{ item.title }}</span>
+        </span>
+      </template>
+      <a-menu-item :key="subItem.code"
+                   v-for="subItem in item.children">
+        <span>{{ subItem.title }}</span>
+      </a-menu-item>
+    </a-sub-menu>
+  </a-menu>
+</template>
+
+<script lang="ts">
+import { computed, defineComponent, ref, SetupContext, unref, watchEffect } from 'vue';
+import APP from '@/services';
+import { initData } from '@/common/methods';
+import { OperationTabMenu } from '@/services/go/commonService/interface';
+
+function handleMenu(context: SetupContext) {
+    const selectedKeys = ref<string[]>(['1-1']);
+    const openKeys = ref<string[]>(['1']);
+    const preOpenKeys = ref<string[]>(['1']);
+    const menuList = APP.getRef('menus');
+    function menuClick(value: any) {
+        const arr = value.keyPath.reverse();
+        const first = menuList.value.find((e: OperationTabMenu) => e.code === arr[0]);
+        if (first) {
+            const seconde = first.children.find((e: OperationTabMenu) => e.code === arr[1]);
+            seconde && context.emit('chooseMenu', seconde);
+        }
+    }
+    // 一级菜单图标
+    function fontIcon(code: string): string {
+        let result = 'icon-jinrongfenxi';
+        switch (code) {
+            case 'market':
+                result = 'icon-jinrongfenxi';
+                break;
+            case 'info':
+                result = 'icon-zhangdan';
+                break;
+            case 'business':
+                result = 'icon-renwu';
+                break;
+            case 'manage':
+                result = 'icon-quanxian';
+                break;
+            case 'search':
+                result = 'icon-chazhaojilu';
+                break;
+            case 'report':
+                result = 'icon-bingtu';
+                break;
+        }
+        return '#' + result;
+    }
+    return { selectedKeys, menuList, openKeys, preOpenKeys, menuClick, fontIcon };
+}
+
+export default defineComponent({
+    props: {
+        collapsed: {
+            default: true,
+            type: Boolean,
+        },
+    },
+    setup(props, context) {
+        const { selectedKeys, openKeys, menuList, menuClick, preOpenKeys, fontIcon } = handleMenu(context);
+        watchEffect(() => {
+            if (props.collapsed) {
+                preOpenKeys.value = openKeys.value;
+                openKeys.value = [];
+            } else {
+                openKeys.value = preOpenKeys.value;
+            }
+        });
+        initData(() => {
+            // 处理路由跳转到菜单栏里第一个对应的页面
+            const list = unref(menuList);
+            if (list.length && list[0].children && list[0].children.length) {
+                // 处理修改具体某个菜单栏，主要处理页面刷新
+                let firstIndex = 0,
+                    secondeIndex = 0;
+                for (let i = 0; i < list.length; i++) {
+                    for (let j = 0; j < list[i].children.length; j++) {
+                        if (window.location.hash.includes(list[i].children[j].code)) {
+                            firstIndex = i;
+                            secondeIndex = j;
+                            break;
+                        }
+                    }
+                }
+                const temp = list[firstIndex].children[secondeIndex];
+                const code = temp.code;
+                selectedKeys.value = [code];
+                openKeys.value = [list[firstIndex].code];
+                context.emit('chooseMenu', temp);
+            }
+        });
+        return { selectedKeys, openKeys, menuList, menuClick, fontIcon };
+    },
+});
+</script>

src/layout/components/top.vue

@@ -0,0 +1,244 @@
+<template>
+  <a-layout class="layout-top">
+    <a-layout-header class="m-layout-header">
+      <Header />
+    </a-layout-header>
+    <a-layout class="middleLayout">
+      <a-layout-sider class="m-layout-left"
+                      width="180"
+                      v-model:collapsed="collapsed"
+                      @collapse="collapse"
+                      collapsible>
+        <Menu @chooseMenu="chooseMenu"
+              :collapsed="collapsed" />
+      </a-layout-sider>
+      <a-layout-content :style="{ background: '#0E0E0F', flex: 1 }">
+        <!-- <Drawer :title="'挂牌'"
+                :visible="visible"></Drawer> -->
+        <!-- <Main /> -->
+        <router-view />
+      </a-layout-content>
+    </a-layout>
+  </a-layout>
+</template>
+<script lang="ts">
+import { UserOutlined } from '@ant-design/icons-vue';
+import { defineComponent, ref, provide, unref } from 'vue';
+import Setting from '@/views/setting/index.vue';
+import CapitalInfo from '@/common/components/capitalInfo/index.vue';
+import SecondMenu from '@/common/components/secondeMenu/index.vue';
+import APP from '@/services';
+import { initData } from '@/common/methods';
+import { useRouter } from 'vue-router';
+import Drawer from '@/common/components/drawer/index.vue';
+import Header from './header.vue';
+import Menu from './menu.vue';
+import Main from './main.vue';
+import { OperationTabMenu } from '@/services/go/commonService/interface';
+
+//     // 配置是否显示下半部分
+//     function setShowBottomPart(code: string): boolean {
+//         // 显示下半部分 这里保存的是市场对应的 code
+//         const show: string[] = [''];
+//         return show.includes(code);
+//     }
+
+export default defineComponent({
+    name: 'layout-top',
+    components: {
+        Setting,
+        UserOutlined,
+        CapitalInfo,
+        SecondMenu,
+        Drawer,
+        Main,
+        Menu,
+        Header,
+    },
+    setup(props, context) {
+        const router = useRouter();
+        const list = ref<OperationTabMenu[]>([]);
+        // 配置是否显示下半部分
+        function setShowBottomPart(code: string) {
+            // 显示下半部分 这里保存的是市场对应的 code
+            const show: string[] = [''];
+            context.emit('chooseMenu', show.includes(code));
+        }
+        // 选中菜单
+        function chooseMenu(value: OperationTabMenu) {
+            list.value = value.children;
+            setShowBottomPart(value.code);
+            router.push({ name: value.code as string });
+        }
+        // 选中菜单的数据
+        provide('thirdMenuList', list);
+        // 控制菜单是否隐藏
+        const collapsed = ref<boolean>(false);
+        function collapse(show: boolean) {
+            collapsed.value = show;
+        }
+
+        return {
+            collapsed,
+            collapse,
+            chooseMenu,
+        };
+    },
+});
+</script>
+<style lang="less">
+.layout-top {
+    .flex;
+    width: 100%;
+    height: 100%;
+    flex-direction: column;
+    .m-layout-header {
+        width: 100%;
+        height: 40px;
+        line-height: 40px;
+        background: @m-grey0;
+        color: @m-grey1;
+        padding: 0 20px;
+        .flex();
+        justify-content: space-between;
+        img {
+            margin-right: 16px;
+            width: 20px;
+            height: 20px;
+        }
+        .searchInput.ant-input-affix-wrapper {
+            width: 240px;
+            height: 30px;
+            line-height: 30px;
+            font-size: 14px;
+            background: @m-grey9;
+            border: 0;
+            vertical-align: middle;
+            padding-left: 40px;
+            position: relative;
+            .rounded-corners(15px);
+            .ant-input {
+                background: @m-grey9;
+                color: @m-white0;
+            }
+            .ant-input-suffix {
+                margin-left: -215px;
+                .ant-input-search-icon {
+                    color: @m-grey10;
+                }
+            }
+        }
+        .m-layout-header-right {
+            .flex();
+            .news-container {
+                padding-left: 10px;
+                padding-right: 16px;
+                .ant-badge {
+                    margin-top: 7px;
+                    cursor: pointer;
+                    > svg {
+                        font-size: 24px;
+                    }
+                    .ant-badge-dot {
+                        box-shadow: 0 0 0 1px @m-red0;
+                    }
+                }
+            }
+
+            .ant-avatar-icon {
+                margin-top: -3px;
+            }
+        }
+    }
+
+    .middleLayout {
+        flex: 1;
+        width: 100%;
+        .inlineflex;
+        border-bottom: 1px solid @m-black2;
+        .m-layout-left {
+            height: 100%;
+            background: @m-black4;
+            .ant-layout-sider-children {
+                ul.ant-menu.ant-menu-inline {
+                    li.ant-menu-submenu {
+                        padding-bottom: 0;
+                        .ant-menu-submenu-title {
+                            color: @m-grey2;
+                            font-size: 16px;
+                            height: 60px;
+                            line-height: 60px;
+                            margin-top: 0;
+                            margin-bottom: 0;
+                            padding: 5px 0;
+                            .icon {
+                                font-size: 20px;
+                            }
+                            .menu-item_title {
+                                display: inline-block;
+                                font-size: 16px;
+                                margin-left: 15px;
+                            }
+                        }
+                        .ant-menu-sub {
+                            .ant-menu-item {
+                                padding-left: 60px !important;
+                                margin-top: 5px;
+                                margin-bottom: 5px;
+                            }
+                        }
+                    }
+                    li.ant-menu-submenu-open {
+                        .ant-menu-submenu-title {
+                            color: @m-white0;
+                            .icon {
+                                color: @m-white0;
+                            }
+                        }
+                        .ant-menu-sub {
+                            .ant-menu-item.ant-menu-item-selected {
+                                background-color: @m-blue0;
+                            }
+                        }
+                    }
+                }
+            }
+            .ant-layout-sider-trigger {
+                width: 100%;
+                height: 40px;
+                line-height: 40px;
+                background: @m-black0;
+                position: absolute;
+            }
+        }
+        .ant-menu-vertical {
+            .ant-menu-submenu-vertical {
+                height: 60px;
+                line-height: 60px;
+                padding: 5px 0;
+                .ant-menu-submenu-title {
+                    height: 50px;
+                    line-height: 50px;
+                    .icon {
+                        font-size: 20px;
+                    }
+                }
+            }
+            .ant-menu-submenu {
+                .ant-menu-submenu-title {
+                    .menu-item_title {
+                        display: none;
+                    }
+                }
+            }
+        }
+    }
+
+    .bottomLayout {
+        width: 100%;
+        flex: none;
+        height: @bottomHeight;
+        .inlineflex;
+    }
+}
+</style>

src/layout/index.vue

@@ -1,64 +1,63 @@
 <template>
-    <div class="layout">
-        <LayoutTop @chooseMenu="chooseMenu" />
-        <template v-if="isShowBottomPart">
-            <div class="sliderLayout">
-                <div class="shortLine"></div>
-            </div>
-            <LayoutBottom />
-        </template>
-    </div>
+  <div class="layout">
+    <LayoutTop @chooseMenu="chooseMenu" />
+    <template v-if="isShowBottomPart">
+      <div class="sliderLayout">
+        <div class="shortLine"></div>
+      </div>
+      <LayoutBottom />
+    </template>
+  </div>
 </template>
 <script lang="ts">
-    import LayoutTop from './top.vue';
-    import LayoutBottom from './bottom.vue';
+import LayoutTop from './components/top.vue';
+import LayoutBottom from './components/bottom.vue';
+import { defineComponent, ref } from 'vue';
 
-    import { defineComponent, ref } from 'vue';
-
-    // 控制下半部分是否显示
-    function submitBottomIsShow() {
-        const isShowBottomPart = ref<boolean>(false);
-        function chooseMenu(value: boolean) {
-            isShowBottomPart.value = value;
-        }
-        return { isShowBottomPart, chooseMenu };
+// 控制下半部分是否显示
+function submitBottomIsShow() {
+    const isShowBottomPart = ref<boolean>(false);
+    function chooseMenu(value: boolean) {
+        isShowBottomPart.value = value;
     }
+    return { isShowBottomPart, chooseMenu };
+}
 
-    export default defineComponent({
-        name: 'layout',
-        components: {
-            LayoutTop,
-            LayoutBottom,
-        },
-        setup() {
-            const { isShowBottomPart, chooseMenu } = submitBottomIsShow();
-            const visible = ref<boolean>(true);
+export default defineComponent({
+    name: 'layout',
+    components: {
+        LayoutTop,
+        LayoutBottom,
+    },
+    setup() {
+        const { isShowBottomPart, chooseMenu } = submitBottomIsShow();
+        const visible = ref<boolean>(true);
 
-            return { isShowBottomPart, chooseMenu, visible };
-        },
-    });
+        return { isShowBottomPart, chooseMenu, visible };
+    },
+});
 </script>
 <style lang="less">
-    .layout {
-        .flex;
+.layout {
+    .flex;
+    width: 100%;
+    height: 100%;
+    flex-direction: column;
+    .sliderLayout {
         width: 100%;
-        height: 100%;
-        flex-direction: column;
-        .sliderLayout {
-            width: 100%;
-            height: 4px;
-            background: #242a2e;
-            border-top: 1px solid @m-grey5;
-            border-bottom: 1px solid @m-grey5;
-            position: relative;
-            .shortLine {
-                width: 30px;
-                height: 2px;
-                background: #4b5861;
-                border-radius: 1px;
-                .position(absolute, 50%, auto, auto, 50%);
-                transform: translate(-50%, -50%);
-            }
+        height: 4px;
+        background: #242a2e;
+        border-top: 1px solid @m-grey5;
+        border-bottom: 1px solid @m-grey5;
+        position: relative;
+        .shortLine {
+            width: 30px;
+            height: 2px;
+            background: #4b5861;
+            border-radius: 1px;
+            .position(absolute, 50%, auto, auto, 50%);
+            transform: translate(-50%, -50%);
         }
     }
+}
 </style>

src/layout/top.vue

@@ -1,462 +0,0 @@
-<template>
-    <a-layout class="layout-top">
-        <a-layout-header class="m-layout-header">
-            <div>
-                <img src="../assets/images/logoHeader.png" />
-                <span>深圳市多元世纪信息技术股份有限公司</span>
-            </div>
-            <div class="m-layout-header-right">
-                <div @click="openDrawer">
-                    <span>{{ username }}，您好！</span>
-                </div>
-                <div class="relative">
-                    <!-- <a-input-search ref="userNameInput"
-                          class="searchInput"
-                          readonly
-                          placeholder="请输入代码/名称"
-                          @pressEnter="search">
-          </a-input-search> -->
-                    <!-- <a-icon type="search" /> -->
-                </div>
-                <div class="news-container">
-                    <a-badge @click="openNotice">
-                        <svg class="icon svg-icon" aria-hidden="true">
-                            <use xlink:href="#icon-xiaoxi"></use>
-                        </svg>
-                    </a-badge>
-                </div>
-                <div>
-                    <a-popover v-model:visible="visible" trigger="click" placement="bottomRight">
-                        <template #content>
-                            <div v-for="item in setMenu" @click="chooseSetMenu(item.path)" :key="item.path">{{ item.name }}</div>
-                        </template>
-                        <a-avatar :size="24">
-                            <template #icon>
-                                <UserOutlined />
-                            </template>
-                        </a-avatar>
-                    </a-popover>
-                    <Setting />
-                </div>
-            </div>
-        </a-layout-header>
-        <a-layout class="middleLayout">
-            <a-layout-sider class="m-layout-left" width="180" v-model:collapsed="collapsed" @collapse="collapse" collapsible>
-                <a-menu theme="dark" mode="inline" class="left-menu" v-model:selectedKeys="selectedKeys" v-model:openKeys="openKeys" @click="menuClick">
-                    <a-sub-menu v-for="item in menuList" :key="item.code">
-                        <template #title>
-                            <span>
-                                <svg class="icon svg-icon" aria-hidden="true">
-                                    <use :xlink:href="fontIcon(item.code)"></use>
-                                </svg>
-                                <span class="menu-item_title" v-show="!collapsed">{{ item.title }}</span>
-                            </span>
-                        </template>
-                        <a-menu-item :key="subItem.code" v-for="subItem in item.children">
-                            <span>{{ subItem.title }}</span>
-                        </a-menu-item>
-                    </a-sub-menu>
-                </a-menu>
-            </a-layout-sider>
-            <a-layout-content :style="{ background: '#0E0E0F', flex: 1 }">
-                <Drawer :title="'挂牌'" :visible="visible"></Drawer>
-                <router-view />
-            </a-layout-content>
-        </a-layout>
-    </a-layout>
-</template>
-<script lang="ts">
-    import { UserOutlined } from '@ant-design/icons-vue';
-    import { defineComponent, ref, provide, unref } from 'vue';
-    import Setting from '@/views/setting/index.vue';
-    import CapitalInfo from '@/common/components/capitalInfo/index.vue';
-    import SecondMenu from '@/common/components/secondeMenu/index.vue';
-    import APP from '@/services';
-    import { initData } from '@/common/methods';
-    import { useRouter } from 'vue-router';
-    import { openModal } from '@/common/setup/modal/index';
-    import Drawer from '@/common/components/drawer/index.vue';
-
-    // 菜单栏
-    const handleMenu = () => {
-        const collapsed = ref<boolean>(false);
-        const selectedKeys = ref<string[]>(['1-1']);
-        const openKeys = ref<string[]>(['1']);
-        const preOpenKeys = ref<string[]>(['1']);
-        const menuList = APP.getRef('menus');
-        // const menuList = [
-        //     {
-        //       key: '1',
-        //       title: '市场',
-        //       code: 'market',
-        //       children: [
-        //         {
-        //           key: '1-1',
-        //           title: '现货贸易',
-        //           code: ''
-        //         },
-        //       ],
-        //     },
-        //     {
-        //       key: '2',
-        //       title: '查询',
-        //       code: 'search',
-        //       children: [
-        //         {
-        //           key: '2-1',
-        //           title: '单据记录',
-        //           code: ''
-        //         },
-        //         {
-        //           key: '2-2',
-        //           title: '资金流水',
-        //           code: ''
-        //         },
-        //         {
-        //           key: '2-3',
-        //           title: '出入库',
-        //           code: ''
-        //         },
-        //         {
-        //           key: '2-4',
-        //           title: '登录日志',
-        //           code: ''
-        //         },
-        //       ],
-        //     },
-        //     {
-        //       key: '3',
-        //       title: '报表',
-        //       code: 'report'
-        //     },
-        //   ];
-        const router = useRouter();
-        // 控制菜单是否隐藏
-        function collapse(collapsed: boolean) {
-            if (collapsed) {
-                preOpenKeys.value = openKeys.value;
-                openKeys.value = [];
-            } else {
-                openKeys.value = preOpenKeys.value;
-            }
-        }
-        // 配置是否显示下半部分
-        function setShowBottomPart(code: string): boolean {
-            // 显示下半部分 这里保存的是市场对应的 code
-            const show: string[] = [''];
-            return show.includes(code);
-        }
-        function menuClick(value: any) {
-            console.log('菜单： ', value);
-            const key = value.key;
-            setShowBottomPart(key);
-            router.push({ name: key });
-        }
-        // 一级菜单图标
-        function fontIcon(code: string): string {
-            let result = 'icon-jinrongfenxi';
-            switch (code) {
-                case 'market':
-                    result = 'icon-jinrongfenxi';
-                    break;
-                case 'info':
-                    result = 'icon-zhangdan';
-                    break;
-                case 'business':
-                    result = 'icon-renwu';
-                    break;
-                case 'manage':
-                    result = 'icon-quanxian';
-                    break;
-                case 'search':
-                    result = 'icon-chazhaojilu';
-                    break;
-                case 'report':
-                    result = 'icon-bingtu';
-                    break;
-            }
-            return '#' + result;
-        }
-        return { collapsed, selectedKeys, menuList, openKeys, collapse, menuClick, setShowBottomPart, fontIcon };
-    };
-
-    function testAction() {
-        const { openAction } = openModal('drawer');
-        return { openDrawer: openAction };
-    }
-
-    // 设置
-    const setFn = () => {
-        const visible = ref<boolean>(false);
-        const chooseSetupItem = ref<string>('');
-        provide('ControlModal', chooseSetupItem);
-        const setMenu = [
-            // { name: '修改密码', path: 'password' },
-            // { name: '收货地址', path: 'addresss' },
-            // // {name: '发票', path: 'setup-password'},
-            // { name: '手机号码绑定/解绑', path: 'phone' },
-            // { name: '关于我们', path: 'aboutUs' },
-            { name: '退出', path: 'logout' },
-        ];
-        const { openAction } = openModal('logout');
-        function chooseSetMenu(path: string) {
-            // chooseSetupItem.value = path;
-            openAction();
-            console.log(path);
-            visible.value = false;
-        }
-
-        return { visible, setMenu, chooseSetMenu };
-    };
-    // 搜索
-    const onSearch = () => {
-        function search(value: string) {
-            console.log(value);
-        }
-        return { search };
-    };
-
-    // 控制消息弹窗
-    function controlNotice() {
-        const { openAction } = openModal('notice');
-        return { openNotice: openAction };
-    }
-    export default defineComponent({
-        name: 'layout-top',
-        components: {
-            Setting,
-            UserOutlined,
-            CapitalInfo,
-            SecondMenu,
-            Drawer,
-        },
-        setup(props, context) {
-            const { collapsed, selectedKeys, openKeys, menuList, collapse, menuClick, setShowBottomPart, fontIcon } = handleMenu();
-            const router = useRouter();
-            // 控制消息弹窗
-            const { openNotice } = controlNotice();
-
-            initData(() => {
-                // 处理路由跳转到菜单栏里第一个对应的页面
-                const list = unref(menuList);
-                if (list.length && list[0].children && list[0].children.length) {
-                    // 处理修改具体某个菜单栏，主要处理页面刷新
-                    let firstIndex = 0,
-                        secondeIndex = 0;
-                    for (let i = 0; i < list.length; i++) {
-                        for (let j = 0; j < list[i].children.length; j++) {
-                            if (window.location.hash.includes(list[i].children[j].code)) {
-                                firstIndex = i;
-                                secondeIndex = j;
-                                break;
-                            }
-                        }
-                    }
-                    const code = list[firstIndex].children[secondeIndex].code;
-                    // selectedKeys.value.length = 0;
-                    // selectedKeys.value.push(code);
-                    // openKeys.value.length = 0;
-                    // openKeys.value.push(list[firstIndex].code);
-                    selectedKeys.value = [code];
-                    openKeys.value = [list[firstIndex].code];
-                    context.emit('chooseMenu', setShowBottomPart(code));
-                    // 处理页面刷新时候 引发路由乱跳的bug
-                    if (router.currentRoute.value.fullPath === '/home') {
-                        router.push(code);
-                    } else {
-                    }
-                }
-            });
-
-            const { openDrawer } = testAction();
-
-            const { visible, setMenu, chooseSetMenu } = setFn();
-            const username = APP.get('username');
-            const { search } = onSearch();
-            const searchName = ref<string[]>(['']);
-            return {
-                collapsed,
-                collapse,
-                selectedKeys,
-                openKeys,
-                menuClick,
-                username,
-                menuList,
-                visible,
-                setMenu,
-                chooseSetMenu,
-                fontIcon,
-
-                openNotice,
-
-                openDrawer,
-            };
-        },
-    });
-</script>
-<style lang="less">
-    .layout-top {
-        .flex;
-        width: 100%;
-        height: 100%;
-        flex-direction: column;
-        .m-layout-header {
-            width: 100%;
-            height: 40px;
-            line-height: 40px;
-            background: @m-grey0;
-            color: @m-grey1;
-            padding: 0 20px;
-            .flex();
-            justify-content: space-between;
-            img {
-                margin-right: 16px;
-                width: 20px;
-                height: 20px;
-            }
-            .searchInput.ant-input-affix-wrapper {
-                width: 240px;
-                height: 30px;
-                line-height: 30px;
-                font-size: 14px;
-                background: @m-grey9;
-                border: 0;
-                vertical-align: middle;
-                padding-left: 40px;
-                position: relative;
-                .rounded-corners(15px);
-                .ant-input {
-                    background: @m-grey9;
-                    color: @m-white0;
-                }
-                .ant-input-suffix {
-                    margin-left: -215px;
-                    .ant-input-search-icon {
-                        color: @m-grey10;
-                    }
-                }
-            }
-            // .relative {
-            //     position: relative;
-            //     .a-icon {
-            //         font-size: 14px;
-            //         .position(absolute, 50%, auto, auto, 10px);
-            //         margin-top: -7px;
-            //         color: @m-grey10;
-            //         z-index: 10;
-            //     }
-            // }
-            .m-layout-header-right {
-                .flex();
-                .news-container {
-                    padding-left: 10px;
-                    padding-right: 16px;
-                    .ant-badge {
-                        margin-top: 7px;
-                        cursor: pointer;
-                        > svg {
-                            font-size: 24px;
-                        }
-                        .ant-badge-dot {
-                            box-shadow: 0 0 0 1px @m-red0;
-                        }
-                    }
-                }
-
-                .ant-avatar-icon {
-                    margin-top: -3px;
-                }
-            }
-        }
-
-        .middleLayout {
-            flex: 1;
-            width: 100%;
-            .inlineflex;
-            border-bottom: 1px solid @m-black2;
-            .m-layout-left {
-                height: 100%;
-                background: @m-black4;
-                .ant-layout-sider-children {
-                    ul.ant-menu.ant-menu-inline {
-                        li.ant-menu-submenu {
-                            padding-bottom: 0;
-                            .ant-menu-submenu-title {
-                                color: @m-grey2;
-                                font-size: 16px;
-                                height: 60px;
-                                line-height: 60px;
-                                margin-top: 0;
-                                margin-bottom: 0;
-                                padding: 5px 0;
-                                .icon {
-                                    font-size: 20px;
-                                }
-                                .menu-item_title {
-                                    display: inline-block;
-                                    font-size: 16px;
-                                    margin-left: 15px;
-                                }
-                            }
-                            .ant-menu-sub {
-                                .ant-menu-item {
-                                    padding-left: 60px !important;
-                                    margin-top: 5px;
-                                    margin-bottom: 5px;
-                                }
-                            }
-                        }
-                        li.ant-menu-submenu-open {
-                            .ant-menu-submenu-title {
-                                color: @m-white0;
-                                .icon {
-                                    color: @m-white0;
-                                }
-                            }
-                            .ant-menu-sub {
-                                .ant-menu-item.ant-menu-item-selected {
-                                    background-color: @m-blue0;
-                                }
-                            }
-                        }
-                    }
-                }
-                .ant-layout-sider-trigger {
-                    width: 100%;
-                    height: 40px;
-                    line-height: 40px;
-                    background: @m-black0;
-                    position: absolute;
-                }
-            }
-            .ant-menu-vertical {
-                .ant-menu-submenu-vertical {
-                    height: 60px;
-                    line-height: 60px;
-                    padding: 5px 0;
-                    .ant-menu-submenu-title {
-                        height: 50px;
-                        line-height: 50px;
-                        .icon {
-                            font-size: 20px;
-                        }
-                    }
-                }
-                .ant-menu-submenu {
-                    .ant-menu-submenu-title {
-                        .menu-item_title {
-                            display: none;
-                        }
-                    }
-                }
-            }
-        }
-
-        .bottomLayout {
-            width: 100%;
-            flex: none;
-            height: @bottomHeight;
-            .inlineflex;
-        }
-    }
-</style>

src/router/index.ts

@@ -1,4 +1,5 @@
 import * as EnumType from '@/common/constants/routerName';
+import Main from '@/layout/components/main.vue';
 import Layout from '@/layout/index.vue';
 import { isLogin } from '@/services/bus/login';
 import { createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router';
@@ -44,7 +45,7 @@ const routes: Array<RouteRecordRaw> = [
             {
                 path: 'custom_info',
                 name: 'custom_info',
-                component: () => import('@/views/information/custom/index.vue'),
+                component: Main,
                 meta: {
                     requireAuth: true,
                 },
@@ -73,7 +74,7 @@ const routes: Array<RouteRecordRaw> = [
             {
                 path: 'goods_info',
                 name: 'goods_info',
-                component: () => import('@/views/information/goods/index.vue'),
+                component: Main,
                 meta: {
                     requireAuth: true,
                 },
@@ -100,25 +101,9 @@ const routes: Array<RouteRecordRaw> = [
                 ],
             },
             {
-                path: '/outaccount_status',
-                name: 'outaccount_status',
-                component: () => import('@/views/search/outaccount_status/index.vue'),
-                meta: {
-                    requireAuth: true,
-                },
-            },
-            {
-                path: '/inventory',
-                name: 'inventory',
-                component: () => import('@/views/search/inventory/index.vue'),
-                meta: {
-                    requireAuth: true,
-                },
-            },
-            {
                 path: '/spot_contract',
                 name: 'spot_contract',
-                component: () => import('@/views/information/spot-contract/index.vue'),
+                component: Main,
                 meta: {
                     requireAuth: true,
                 },
@@ -127,33 +112,33 @@ const routes: Array<RouteRecordRaw> = [
                 },
                 children: [
                     {
-                        path: '/spot_contract/not-commit',
+                        path: '/spot_contract/unsubmitted',
                         name: 'spot_contract_unsubmitted',
-                        component: () => import('@/views/information/spot-contract/list/not-commit/index.vue'),
+                        component: () => import('@/views/information/spot-contract/list/unsubmitted/index.vue'),
                         meta: {
                             requireAuth: true,
                         },
                     },
                     {
-                        path: '/spot_contract/done',
+                        path: '/spot_contract/checkpending',
                         name: 'spot_contract_checkpending',
-                        component: () => import('@/views/information/spot-contract/list/done/index.vue'),
+                        component: () => import('@/views/information/spot-contract/list/checkpending/index.vue'),
                         meta: {
                             requireAuth: true,
                         },
                     },
                     {
-                        path: '/spot_contract/peddding',
+                        path: '/spot_contract/performance',
                         name: 'spot_contract_performance',
-                        component: () => import('@/views/information/spot-contract/list/peddding/index.vue'),
+                        component: () => import('@/views/information/spot-contract/list/performance/index.vue'),
                         meta: {
                             requireAuth: true,
                         },
                     },
                     {
-                        path: '/spot_contract/performance',
+                        path: '/spot_contract/finished',
                         name: 'spot_contract_finished',
-                        component: () => import('@/views/information/spot-contract/list/performance/index.vue'),
+                        component: () => import('@/views/information/spot-contract/list/finished/index.vue'),
                         meta: {
                             requireAuth: true,
                         },
@@ -163,7 +148,7 @@ const routes: Array<RouteRecordRaw> = [
             {
                 path: '/warehouse_info',
                 name: 'warehouse_info',
-                component: () => import('@/views/information/warehouse-info/index.vue'),
+                component: Main,
                 meta: {
                     requireAuth: true,
                 },
@@ -189,6 +174,22 @@ const routes: Array<RouteRecordRaw> = [
                     },
                 ],
             },
+            {
+                path: '/outaccount_status',
+                name: 'outaccount_status',
+                component: () => import('@/views/search/outaccount_status/index.vue'),
+                meta: {
+                    requireAuth: true,
+                },
+            },
+            {
+                path: '/inventory',
+                name: 'inventory',
+                component: () => import('@/views/search/inventory/index.vue'),
+                meta: {
+                    requireAuth: true,
+                },
+            },
 
             {
                 path: '/purchase',

src/views/business/exposure/index.vue

@@ -1,23 +1,34 @@
 <template>
-  <!-- 敞口 -->
-  <div class="exposure">
-    敞口
-  </div>
+    <!-- 采购 -->
+    <div class="exposure">
+        <firstMenu :list="list" :value="'title'" @selectMenu="selectMenu" />
+        <router-view />
+    </div>
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+    import { defineComponent } from 'vue';
+    import firstMenu from '@/common/components/firstMenu/index.vue';
+    import { handleRouterMenu } from '@/common/setup/router/index';
+    import { initData } from '@/common/methods';
 
-export default defineComponent({
-    name: 'exposure',
-    components: {},
-    setup() {
-        return {};
-    },
-});
+    export default defineComponent({
+        name: 'exposure',
+        components: {
+            firstMenu,
+        },
+        setup() {
+            const { list, selectMenu, getMenuList } = handleRouterMenu();
+            initData(() => {
+                getMenuList();
+                console.log('list', list);
+            });
+            return { list, selectMenu };
+        },
+    });
 </script>
 
 <style lang="less">
-.exposure {
-}
-</style>;
+    .sexposure {
+    }</style
+>;

src/views/business/plan/index.vue

@@ -1,23 +1,34 @@
 <template>
-    <!-- 计划 -->
+    <!-- 采购 -->
     <div class="plan">
-        计划
+        <firstMenu :list="list" :value="'title'" @selectMenu="selectMenu" />
+        <router-view />
     </div>
 </template>
 
 <script lang="ts">
     import { defineComponent } from 'vue';
+    import firstMenu from '@/common/components/firstMenu/index.vue';
+    import { handleRouterMenu } from '@/common/setup/router/index';
+    import { initData } from '@/common/methods';
 
     export default defineComponent({
         name: 'plan',
-        components: {},
+        components: {
+            firstMenu,
+        },
         setup() {
-            return {};
+            const { list, selectMenu, getMenuList } = handleRouterMenu();
+            initData(() => {
+                getMenuList();
+                console.log('list', list);
+            });
+            return { list, selectMenu };
         },
     });
 </script>
 
 <style lang="less">
-    .plan {
+    .splan {
     }</style
 >;

src/views/business/purchase/list/pending/index.vue

@@ -1,78 +1,22 @@
 <template>
-    <!-- 采购: 现货头寸-->
-    <div class="spot-contract-peddding">
-        采购: 现货头寸
+    <!-- 采购: 待点价-->
+    <div class="purchase-peddding" :loading="loading">
+        <!-- <filterCustomTable @search="search">
+            <a-button class="operBtn" v-if="hasPermission('custom_info_btn_add')" @click="addAction">新增</a-button>
+        </filterCustomTable> -->
+        <contextMenu :contextMenuList="contextMenuList" :tableList="customList">
+            <a-table :columns="columns" class="topTable" :pagination="false" rowKey="key" :data-source="customList"></a-table>
+        </contextMenu>
     </div>
 </template>
 
 <script lang="ts">
     import { defineComponent, ref } from 'vue';
-    import { QueryCustomInfo } from '@/services/go/ermcp/customInfo/index';
-    import { QueryCustomInfoType } from '@/services/go/ermcp/customInfo/interface';
-    import { message } from 'ant-design-vue';
-    import { initData } from '@/common/methods';
-
-    // 查询客户资料列表
-    function getCustomList() {
-        // const filteredInfo = ref();
-        // const sortedInfo = ref();
-        // const columns = computed(() => {
-        //     const filtered = filteredInfo.value || {};
-        //     const sorted = sortedInfo.value || {};
-        //     return [
-        //         {
-        //             title: '序号',
-        //             dataIndex: 'index',
-        //             key: 'index',
-        //             align: 'center',
-        //             width: 50,
-        //             customRender: (param: any) => `${param.index + 1}`,
-        //         },
-        //         {
-        //             title: 'Age',
-        //             dataIndex: 'age',
-        //             key: 'age',
-        //             sorter: (a: DataItem, b: DataItem) => a.age - b.age,
-        //             sortOrder: sorted.columnKey === 'age' && sorted.order,
-        //         },
-        //         {
-        //             title: 'Address',
-        //             dataIndex: 'address',
-        //             key: 'address',
-        //             filters: [
-        //                 { text: 'London', value: 'London' },
-        //                 { text: 'New York', value: 'New York' },
-        //             ],
-        //             filteredValue: filtered.address || null,
-        //             onFilter: (value: string, record: DataItem) => record.address.includes(value),
-        //             sorter: (a: DataItem, b: DataItem) => a.address.length - b.address.length,
-        //             sortOrder: sorted.columnKey === 'address' && sorted.order,
-        //             ellipsis: true,
-        //         },
-        //     ];
-        // });
-        const customList = ref<QueryCustomInfoType[]>([]);
-        function actionQuery() {
-            QueryCustomInfo(4)
-                .then((res) => {
-                    console.log('L', res);
-                })
-                .catch((err) => message.error(err));
-        }
-
-        return { customList, actionQuery };
-    }
-
+    import { handlePurchase, btnAndComp } from '../../setup';
     export default defineComponent({
-        name: 'spot-contract-peddding',
-        components: {},
+        name: 'purchase-peddding',
         setup() {
-            const { customList, actionQuery } = getCustomList();
-            initData(() => {
-                actionQuery();
-                // 加载数据在这里
-            });
-            return { customList };
+            return { ...handlePurchase(), ...btnAndComp() };
         },
     });
 </script>

src/views/business/purchase/setup.ts

@@ -0,0 +1,75 @@
+import { QueryPurchase } from '@/services/go/ermcp/purchase';
+import { Ermcp3SellBuyContract, SellBuyContractReq } from '@/services/go/ermcp/purchase/interface';
+import { ref, Ref } from '@vue/reactivity';
+import APP from '@/services';
+import { getUserId } from '@/services/bus/account';
+import { initData } from '@/common/methods';
+import { ColumnType, getTableHead } from '@/common/methods/table';
+import { detailButton, permissionButton, handlePermission } from '@/common/setup/buttonPermission/index';
+import { MenuItem } from '@/common/components/contextMenu/interface';
+import { openModal } from '@/common/setup/modal/index';
+import { watchEffect } from 'vue';
+// 采购数据获取和表头数据整理
+export function handlePurchase() {
+    // ========================loading========================
+    const loading = ref<boolean>(false);
+    // ========================获取列表数据========================
+    let purchaseList = ref<Ermcp3SellBuyContract[] | []>([]);
+    function queryPurchase() {
+        const AreaUserID = APP.get('userAccount').memberuserid; // 所属机构id
+        const req: SellBuyContractReq = {
+            areauserid: AreaUserID, //  所属机构ID
+            contracttype: 1, // 合同类型 1-采购, -1-销售
+            querytype: 1, // 查询类型 1-全部 2-待点价 3-履约结算 4-已完成
+            userid: getUserId(), // 用户ID
+        };
+        QueryPurchase(req).then((res) => {
+            purchaseList.value = res;
+        });
+    }
+
+    // ========================获取表头========================
+    const columns = ref<ColumnType[]>([]);
+    function getColumns() {
+        const list = getTableHead('table_pcweb_purchase');
+        columns.value.length = 0;
+        list.forEach((e, i) => {
+            const { columnfield, columntitle, aligntype } = e;
+            const item: ColumnType = {
+                key: String(i),
+                dataIndex: columnfield,
+                title: columntitle,
+                align: aligntype === 1 ? 'center' : aligntype === 2 ? 'left' : 'right',
+                slots: { customRender: columnfield },
+            };
+            columns.value.push(item);
+        });
+    }
+
+    // ========================数据初始化========================
+    initData((): void => {
+        queryPurchase();
+        getColumns();
+    });
+    return { loading, purchaseList, columns };
+}
+
+// 按钮权限与功能组件
+export function btnAndComp() {
+    const { hasPermission } = handlePermission('custom_info_normal');
+    const contextMenuList = ref<MenuItem[]>([]);
+    const { openAction: addAction } = openModal('addCustomInfo');
+    detailButton('customDetail', contextMenuList);
+    const { action: deleteAction } = permissionButton('deleteCustomInfo', '删除', contextMenuList);
+    const { action: recoverAction } = permissionButton('recoverCustomInfo', '恢复', contextMenuList);
+    const stop = watchEffect(() => {
+        hasPermission('custom_info_btn_recover') && recoverAction();
+        hasPermission('custom_info_btn_delete') && deleteAction();
+    });
+    return {
+        stop,
+        addAction,
+        hasPermission,
+        contextMenuList,
+    };
+}

src/views/information/custom/index.vue

@@ -1,30 +0,0 @@
-<template>
-    <!-- 客户信息 -->
-    <div class="custom">
-        <firstMenu :list="list" :value="'title'" @selectMenu="selectMenu" />
-        <router-view />
-    </div>
-</template>
-
-<script lang="ts">
-    import { defineComponent } from 'vue';
-    import firstMenu from '@/common/components/firstMenu/index.vue';
-    import { initData } from '@/common/methods';
-    import { handleRouterMenu } from '@/common/setup/router/index';
-
-    export default defineComponent({
-        name: 'custom',
-        components: {
-            firstMenu,
-        },
-        setup() {
-            const { list, selectMenu, getMenuList } = handleRouterMenu();
-            initData(() => {
-                getMenuList();
-            });
-            return { list, selectMenu };
-        },
-    });
-</script>
-
-<style lang="less"></style>;

src/views/information/custom/list/normal-use/index.vue

@@ -1,89 +1,80 @@
 <template>
-  <!-- 客户信息: 正常 -->
-  <div class="custom-normal"
-       :loading="loading">
-    <filterCustomTable @search="search">
-      <a-button class="operBtn"
-                v-if="hasPermission('custom_info_btn_add')"
-                @click="addAction">新增</a-button>
-    </filterCustomTable>
-    <contextMenu :contextMenuList="contextMenuList"
-                 :tableList="customList">
-      <a-table :columns="columns"
-               class="topTable"
-               :pagination="false"
-               rowKey="key"
-               :data-source="customList">
-        <template #userinfotype="{ text }">
-          <a>{{ text === '2' ? '企业' : '个人' }}</a>
-        </template>
-      </a-table>
-    </contextMenu>
-    <!-- 新增 -->
-    <AddCustom />
-    <!-- 详情 -->
-    <CustomDetail />
-    <!-- 修改 -->
-    <ModifyCustom />
-    <!-- 停用 -->
-    <DisableCustom />
-  </div>
+    <!-- 客户信息: 正常 -->
+    <div class="custom-normal" :loading="loading">
+        <filterCustomTable @search="search">
+            <a-button class="operBtn" v-if="hasPermission('custom_info_btn_add')" @click="addAction">新增</a-button>
+        </filterCustomTable>
+        <contextMenu :contextMenuList="contextMenuList" :tableList="customList">
+            <a-table :columns="columns" class="topTable" :pagination="false" rowKey="key" :data-source="customList">
+                <template #userinfotype="{ text }">
+                    <a>{{ text === '2' ? '企业' : '个人' }}</a>
+                </template>
+            </a-table>
+        </contextMenu>
+        <!-- 新增 -->
+        <AddCustom />
+        <!-- 详情 -->
+        <CustomDetail />
+        <!-- 修改 -->
+        <ModifyCustom />
+        <!-- 停用 -->
+        <DisableCustom />
+    </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, onUnmounted, Ref, ref, watchEffect } from 'vue';
+    import { defineComponent, onUnmounted, Ref, ref, watchEffect } from 'vue';
 
-import { initData } from '@/common/methods/index';
-import filterCustomTable from '@/views/information/custom/compoments/filterTable/index.vue';
-import { MenuItem } from '@/common/components/contextMenu/interface';
-import contextMenu from '@/common/components/contextMenu/index.vue';
-import { getCustomList } from '../setup';
-import { openModal } from '@/common/setup/modal/index';
-import CustomDetail from '@/views/information/custom/compoments/detail/index.vue';
-import ModifyCustom from '@/views/information/custom/compoments/modify/index.vue';
-import DisableCustom from '@/views/information/custom/compoments/disable/index.vue';
-import AddCustom from '@/views/information/custom/compoments/add/index.vue';
-import { detailButton, permissionButton, handlePermission } from '@/common/setup/buttonPermission/index';
+    import { initData } from '@/common/methods/index';
+    import filterCustomTable from '@/views/information/custom/compoments/filterTable/index.vue';
+    import { MenuItem } from '@/common/components/contextMenu/interface';
+    import contextMenu from '@/common/components/contextMenu/index.vue';
+    import { getCustomList } from '../setup';
+    import { openModal } from '@/common/setup/modal/index';
+    import CustomDetail from '@/views/information/custom/compoments/detail/index.vue';
+    import ModifyCustom from '@/views/information/custom/compoments/modify/index.vue';
+    import DisableCustom from '@/views/information/custom/compoments/disable/index.vue';
+    import AddCustom from '@/views/information/custom/compoments/add/index.vue';
+    import { detailButton, permissionButton, handlePermission } from '@/common/setup/buttonPermission/index';
 
-export default defineComponent({
-    name: 'custom-normal',
-    components: {
-        filterCustomTable,
-        contextMenu,
-        CustomDetail,
-        ModifyCustom,
-        DisableCustom,
-        AddCustom,
-    },
-    setup() {
-        const { customList, actionQuery, columns, getColumns, search, loading } = getCustomList();
-        const { hasPermission } = handlePermission('custom_info_normal');
-        const contextMenuList = ref<MenuItem[]>([]);
+    export default defineComponent({
+        name: 'custom-normal',
+        components: {
+            filterCustomTable,
+            contextMenu,
+            CustomDetail,
+            ModifyCustom,
+            DisableCustom,
+            AddCustom,
+        },
+        setup() {
+            const { customList, actionQuery, columns, getColumns, search, loading } = getCustomList();
+            const { hasPermission } = handlePermission('custom_info_normal');
+            const contextMenuList = ref<MenuItem[]>([]);
 
-        const { openAction: addAction } = openModal('addCustomInfo');
+            const { openAction: addAction } = openModal('addCustomInfo');
 
-        detailButton('customDetail', contextMenuList);
-        const { action: modifyAction } = permissionButton('modifyCustomInfo', '修改', contextMenuList);
-        const { action: disableAction } = permissionButton('disableCustomInfo', '停用', contextMenuList);
+            detailButton('customDetail', contextMenuList);
+            const { action: modifyAction } = permissionButton('modifyCustomInfo', '修改', contextMenuList);
+            const { action: disableAction } = permissionButton('disableCustomInfo', '停用', contextMenuList);
 
-        const stop = watchEffect(() => {
-            hasPermission('custom_info_btn_modify') && modifyAction();
-            hasPermission('custom_info_btn_disable') && disableAction();
-        });
-        onUnmounted(() => {
-            stop();
-        });
-        initData(() => {
-            actionQuery(3);
-            getColumns();
-        });
-        return { customList, columns, search, loading, contextMenuList, hasPermission, addAction };
-    },
-});
+            const stop = watchEffect(() => {
+                hasPermission('custom_info_btn_modify') && modifyAction();
+                hasPermission('custom_info_btn_disable') && disableAction();
+            });
+            onUnmounted(() => {
+                stop();
+            });
+            initData(() => {
+                actionQuery(3);
+                getColumns();
+            });
+            return { customList, columns, search, loading, contextMenuList, hasPermission, addAction };
+        },
+    });
 </script>
 
 <style lang="less">
-.custom-normal {
-}
-</style
+    .custom-normal {
+    }</style
 >;

src/views/information/custom/list/stop-use/index.vue

@@ -1,89 +1,80 @@
 <template>
-  <!-- 客户信息: 停用 -->
-  <div class="custom-normal"
-       :loading="loading">
-    <filterCustomTable @search="search">
-      <a-button class="operBtn"
-                v-if="hasPermission('custom_info_btn_add')"
-                @click="addAction">新增</a-button>
-    </filterCustomTable>
-    <contextMenu :contextMenuList="contextMenuList"
-                 :tableList="customList">
-      <a-table :columns="columns"
-               class="topTable"
-               :pagination="false"
-               rowKey="key"
-               :data-source="customList">
-        <template #userinfotype="{ text }">
-          <a>{{ text === '2' ? '企业' : '个人' }}</a>
-        </template>
-      </a-table>
-    </contextMenu>
-    <!-- 新增 -->
-    <AddCustom />
-    <!-- 详情 -->
-    <CustomDetail />
-    <!-- 删除 -->
-    <DeleteCustom />
-    <!-- 恢复客户资料 -->@/common/methods
-    <RecoverCustom />
-  </div>
+    <!-- 客户信息: 停用 -->
+    <div class="custom-normal" :loading="loading">
+        <filterCustomTable @search="search">
+            <a-button class="operBtn" v-if="hasPermission('custom_info_btn_add')" @click="addAction">新增</a-button>
+        </filterCustomTable>
+        <contextMenu :contextMenuList="contextMenuList" :tableList="customList">
+            <a-table :columns="columns" class="topTable" :pagination="false" rowKey="key" :data-source="customList">
+                <template #userinfotype="{ text }">
+                    <a>{{ text === '2' ? '企业' : '个人' }}</a>
+                </template>
+            </a-table>
+        </contextMenu>
+        <!-- 新增 -->
+        <AddCustom />
+        <!-- 详情 -->
+        <CustomDetail />
+        <!-- 删除 -->
+        <DeleteCustom />
+        <!-- 恢复客户资料 -->@/common/methods
+        <RecoverCustom />
+    </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, onUnmounted, Ref, ref, watchEffect } from 'vue';
+    import { defineComponent, onUnmounted, Ref, ref, watchEffect } from 'vue';
 
-import { initData } from '@/common/methods/index';
-import filterCustomTable from '@/views/information/custom/compoments/filterTable/index.vue';
-import { MenuItem } from '@/common/components/contextMenu/interface';
-import contextMenu from '@/common/components/contextMenu/index.vue';
-import { getCustomList } from '../setup';
-import { openModal } from '@/common/setup/modal/index';
-import CustomDetail from '@/views/information/custom/compoments/detail/index.vue';
-import DeleteCustom from '@/views/information/custom/compoments/delete/index.vue';
-import RecoverCustom from '@/views/information/custom/compoments/recover/index.vue';
-import AddCustom from '@/views/information/custom/compoments/add/index.vue';
-import { detailButton, permissionButton, handlePermission } from '@/common/setup/buttonPermission/index';
+    import { initData } from '@/common/methods/index';
+    import filterCustomTable from '@/views/information/custom/compoments/filterTable/index.vue';
+    import { MenuItem } from '@/common/components/contextMenu/interface';
+    import contextMenu from '@/common/components/contextMenu/index.vue';
+    import { getCustomList } from '../setup';
+    import { openModal } from '@/common/setup/modal/index';
+    import CustomDetail from '@/views/information/custom/compoments/detail/index.vue';
+    import DeleteCustom from '@/views/information/custom/compoments/delete/index.vue';
+    import RecoverCustom from '@/views/information/custom/compoments/recover/index.vue';
+    import AddCustom from '@/views/information/custom/compoments/add/index.vue';
+    import { detailButton, permissionButton, handlePermission } from '@/common/setup/buttonPermission/index';
 
-export default defineComponent({
-    name: 'custom-normal',
-    components: {
-        filterCustomTable,
-        contextMenu,
-        CustomDetail,
-        DeleteCustom,
-        RecoverCustom,
-        AddCustom,
-    },
-    setup() {
-        const { customList, actionQuery, columns, getColumns, search, loading } = getCustomList();
-        const { hasPermission } = handlePermission('custom_info_normal');
-        const contextMenuList = ref<MenuItem[]>([]);
+    export default defineComponent({
+        name: 'custom-normal',
+        components: {
+            filterCustomTable,
+            contextMenu,
+            CustomDetail,
+            DeleteCustom,
+            RecoverCustom,
+            AddCustom,
+        },
+        setup() {
+            const { customList, actionQuery, columns, getColumns, search, loading } = getCustomList();
+            const { hasPermission } = handlePermission('custom_info_normal');
+            const contextMenuList = ref<MenuItem[]>([]);
 
-        const { openAction: addAction } = openModal('addCustomInfo');
+            const { openAction: addAction } = openModal('addCustomInfo');
 
-        detailButton('customDetail', contextMenuList);
-        const { action: deleteAction } = permissionButton('deleteCustomInfo', '删除', contextMenuList);
-        const { action: recoverAction } = permissionButton('recoverCustomInfo', '恢复', contextMenuList);
+            detailButton('customDetail', contextMenuList);
+            const { action: deleteAction } = permissionButton('deleteCustomInfo', '删除', contextMenuList);
+            const { action: recoverAction } = permissionButton('recoverCustomInfo', '恢复', contextMenuList);
 
-        const stop = watchEffect(() => {
-            hasPermission('custom_info_btn_recover') && recoverAction();
-            hasPermission('custom_info_btn_delete') && deleteAction();
-        });
-        onUnmounted(() => {
-            stop();
-        });
-        initData(() => {
-            actionQuery(4);
-            getColumns();
-        });
-        return { customList, columns, search, loading, contextMenuList, hasPermission, addAction };
-    },
-});
+            const stop = watchEffect(() => {
+                hasPermission('custom_info_btn_recover') && recoverAction();
+                hasPermission('custom_info_btn_delete') && deleteAction();
+            });
+            onUnmounted(() => {
+                stop();
+            });
+            initData(() => {
+                actionQuery(4);
+                getColumns();
+            });
+            return { customList, columns, search, loading, contextMenuList, hasPermission, addAction };
+        },
+    });
 </script>
 
 <style lang="less">
-.custom-normal {
-}
-</style
+    .custom-normal {
+    }</style
 >;

src/views/information/goods/components/leftMenu/index.vue

@@ -1,6 +1,6 @@
 <template>
-  <div class="leftMenu">
-        <a-menu theme="dark" mode="inline" class="left-menu"  @click="menuClick">
+    <div class="leftMenu">
+        <a-menu theme="dark" mode="inline" class="left-menu" @click="menuClick">
             <a-sub-menu v-for="item in menuList" :key="item.key">
                 <template #title>
                     <span>
@@ -12,177 +12,176 @@
                 </a-menu-item>
             </a-sub-menu>
         </a-menu>
-  </div>
+    </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, PropType } from 'vue';
-import APP from '@/services';
+    import { defineComponent, ref, PropType } from 'vue';
+    import APP from '@/services';
 
-interface Key {
-    [propName: string]: string;
-}
-// 菜单栏
-const handleMenu = () => {
-    const collapsed = ref<boolean>(false);
-    const selectedKeys = ref<string[]>(['1-1']);
-    const openKeys = ref<string[]>(['1']);
-    const preOpenKeys = ref<string[]>(['1']);
-    // const menuList = APP.getRef('menus');
-    const menuList = [
-        {
-          key: '1',
-          title: '正常',
-          children: [
-            {
-              key: '1-1',
-              title: '铜杆(吨)',
-            },
+    interface Key {
+        [propName: string]: string;
+    }
+    // 菜单栏
+    const handleMenu = () => {
+        const collapsed = ref<boolean>(false);
+        const selectedKeys = ref<string[]>(['1-1']);
+        const openKeys = ref<string[]>(['1']);
+        const preOpenKeys = ref<string[]>(['1']);
+        // const menuList = APP.getRef('menus');
+        const menuList = [
             {
-              key: '1-2',
-              title: '铜板(吨)',
+                key: '1',
+                title: '正常',
+                children: [
+                    {
+                        key: '1-1',
+                        title: '铜杆(吨)',
+                    },
+                    {
+                        key: '1-2',
+                        title: '铜板(吨)',
+                    },
+                ],
             },
-          ],
-        },
-        {
-          key: '2',
-          title: '停用',
-          children: [
             {
-              key: '2-1',
-              title: 'SHFE-银锭(千克)',
+                key: '2',
+                title: '停用',
+                children: [
+                    {
+                        key: '2-1',
+                        title: 'SHFE-银锭(千克)',
+                    },
+                ],
             },
-          ],
-        },
-      ];
+        ];
 
-    // 控制菜单是否隐藏
-    function collapse(collapsed: boolean) {
-        if (collapsed) {
-            preOpenKeys.value = openKeys.value;
-            openKeys.value = [];
-        } else {
-            openKeys.value = preOpenKeys.value;
+        // 控制菜单是否隐藏
+        function collapse(collapsed: boolean) {
+            if (collapsed) {
+                preOpenKeys.value = openKeys.value;
+                openKeys.value = [];
+            } else {
+                openKeys.value = preOpenKeys.value;
+            }
         }
-    }
 
-    function menuClick(value: any) {
-        console.log(value);
-    }
-    return { collapsed, selectedKeys, menuList, openKeys, collapse, menuClick };
-};
+        function menuClick(value: any) {
+            console.log(value);
+        }
+        return { collapsed, selectedKeys, menuList, openKeys, collapse, menuClick };
+    };
 
-export default defineComponent({
-    name: 'leftMenu',
-    props: {
-        list: {
-            default: [],
-            type: Object as PropType<Key[]>,
+    export default defineComponent({
+        name: 'leftMenu',
+        props: {
+            list: {
+                default: [],
+                type: Object as PropType<Key[]>,
+            },
+            value: {
+                // 需要绑定的值得 key
+                default: '',
+                type: String,
+            },
         },
-        value: {
-            // 需要绑定的值得 key
-            default: '',
-            type: String,
+        components: {},
+        setup(props, context) {
+            const { collapsed, selectedKeys, openKeys, menuList, collapse, menuClick } = handleMenu();
+            const current = ref<string[]>(['0']);
+
+            return {
+                current,
+                menuClick,
+                collapsed,
+                collapse,
+                selectedKeys,
+                openKeys,
+                menuList,
+            };
         },
-    },
-    components: {},
-    setup(props, context) {
-        const { collapsed, selectedKeys, openKeys, menuList, collapse, menuClick } = handleMenu();
-        const current = ref<string[]>(['0']);
-        
-        return {
-            current,
-            menuClick,
-            collapsed,
-            collapse,
-            selectedKeys,
-            openKeys,
-            menuList,
-        };
-    },
-});
+    });
 </script>
 
 <style lang="less">
-.leftMenu {
-    height: 100%;
-    ul.ant-menu.ant-menu-inline {
-        background-color: transparent;
-        li.ant-menu-submenu {
-            padding-bottom: 0;
-            .ant-menu-submenu-title {
-                color: @m-grey2;
-                font-size: 16px;
-                height: 45px;
-                line-height: 45px;
-                margin-top: 0;
-                margin-bottom: 0;
-                padding: 0;
-                padding-left: 32px !important;
-                .icon {
-                    font-size: 20px;
-                }
-                .menu-item_title {
-                    display: inline-block;
-                    font-size: 16px;
+    .leftMenu {
+        height: 100%;
+        ul.ant-menu.ant-menu-inline {
+            background-color: transparent;
+            li.ant-menu-submenu {
+                padding-bottom: 0;
+                .ant-menu-submenu-title {
                     color: @m-grey2;
-                }
-                .ant-menu-submenu-arrow {
-                    left: 12px;
-                    color: @m-white0;
-                }
-            }
-            .ant-menu-inline.ant-menu-sub {
-                background-color: transparent;
-                box-shadow: none;
-                .ant-menu-item {
-                    padding-left: 64px !important;
-                    height: 30px;
-                    line-height: 30px;
-                    color: @m-grey2;
-                    font-size: 14px;
+                    font-size: 16px;
+                    height: 45px;
+                    line-height: 45px;
                     margin-top: 0;
                     margin-bottom: 0;
-                    padding-right: 0;
+                    padding: 0;
+                    padding-left: 32px !important;
+                    .icon {
+                        font-size: 20px;
+                    }
+                    .menu-item_title {
+                        display: inline-block;
+                        font-size: 16px;
+                        color: @m-grey2;
+                    }
+                    .ant-menu-submenu-arrow {
+                        left: 12px;
+                        color: @m-white0;
+                    }
+                }
+                .ant-menu-inline.ant-menu-sub {
+                    background-color: transparent;
+                    box-shadow: none;
+                    .ant-menu-item {
+                        padding-left: 64px !important;
+                        height: 30px;
+                        line-height: 30px;
+                        color: @m-grey2;
+                        font-size: 14px;
+                        margin-top: 0;
+                        margin-bottom: 0;
+                        padding-right: 0;
+                    }
                 }
             }
-        }
-        li.ant-menu-submenu-open {
-            .ant-menu-submenu-title {
-                color: @m-white0;
-                .icon {
+            li.ant-menu-submenu-open {
+                .ant-menu-submenu-title {
                     color: @m-white0;
+                    .icon {
+                        color: @m-white0;
+                    }
                 }
-            }
-            .ant-menu-sub {
-                .ant-menu-item.ant-menu-item-selected {
-                    color: @m-blue0;
-                    background-color: transparent;
+                .ant-menu-sub {
+                    .ant-menu-item.ant-menu-item-selected {
+                        color: @m-blue0;
+                        background-color: transparent;
+                    }
                 }
             }
         }
     }
-}       
-.ant-menu-vertical {
-    .ant-menu-submenu-vertical {
-        height: 60px;
-        line-height: 60px;
-        padding: 5px 0;
-        .ant-menu-submenu-title {
-            height: 50px;
-            line-height: 50px;
-            .icon {
-                font-size: 20px;
+    .ant-menu-vertical {
+        .ant-menu-submenu-vertical {
+            height: 60px;
+            line-height: 60px;
+            padding: 5px 0;
+            .ant-menu-submenu-title {
+                height: 50px;
+                line-height: 50px;
+                .icon {
+                    font-size: 20px;
+                }
             }
         }
-    }
-    .ant-menu-submenu {
-        .ant-menu-submenu-title {
-            .menu-item_title {
-                display: none;
+        .ant-menu-submenu {
+            .ant-menu-submenu-title {
+                .menu-item_title {
+                    display: none;
+                }
             }
         }
-    }
-}
-
-</style>;
+    }</style
+>;

src/views/information/goods/components/rightSpot/index.vue

@@ -1,299 +1,301 @@
 <template>
-  <div class="rightSpot">
-    <div class="title">
-        <!-- <a-icon type="gold"/> -->
-        <div class="tltLeft">
-            <span class="blue">铜杆（吨）</span>
-            <span class="green ml10">正常</span>
+    <div class="rightSpot">
+        <div class="title">
+            <!-- <a-icon type="gold"/> -->
+            <div class="tltLeft">
+                <span class="blue">铜杆（吨）</span>
+                <span class="green ml10">正常</span>
+            </div>
+            <div class="tltBtns">
+                <a-button class="blueBtn">修改</a-button>
+                <a-button class="redBtn">停用</a-button>
+            </div>
         </div>
-        <div class="tltBtns">
-            <a-button class="blueBtn">修改</a-button>
-            <a-button class="redBtn">停用</a-button>
-        </div>
-    </div>
-    <div class="spotCont">
-        <a-collapse class="spotCollapse" :bordered="false">
-            <template #expandIcon="props">
-                <svg class="icon svg-icon" aria-hidden="true" v-if="props.isActive == 0">
-                    <use xlink:href="#icon-shouqi1"></use>
-                </svg> 
-                <svg class="icon svg-icon" aria-hidden="true" v-else>
-                    <use xlink:href="#icon-shouqi2"></use>
-                </svg> 
-            </template>
-            <a-collapse-panel key="1">
-                <template #header>
+        <div class="spotCont">
+            <a-collapse class="spotCollapse" :bordered="false">
+                <template #expandIcon="props">
+                    <svg class="icon svg-icon" aria-hidden="true" v-if="props.isActive == 0">
+                        <use xlink:href="#icon-shouqi1"></use>
+                    </svg>
+                    <svg class="icon svg-icon" aria-hidden="true" v-else>
+                        <use xlink:href="#icon-shouqi2"></use>
+                    </svg>
+                </template>
+                <a-collapse-panel key="1">
+                    <template #header>
                         <a-row class="headRow">
                             <a-col :span="8">品类（3）</a-col>
                             <a-col :span="8">单位</a-col>
                             <a-col :span="8">标仓系数</a-col>
                         </a-row>
-                </template>
-                <a-row class="contRow">
-                    <a-col :span="8">10mm</a-col>
-                    <a-col :span="8">吨</a-col>
-                    <a-col :span="8">1.0</a-col>
-                </a-row>
-                <a-row class="contRow">
-                    <a-col :span="8">12mm</a-col>
-                    <a-col :span="8">吨</a-col>
-                    <a-col :span="8">1.1</a-col>
-                </a-row>
-                <a-row class="contRow">
-                    <a-col :span="8">15mm</a-col>
-                    <a-col :span="8">吨</a-col>
-                    <a-col :span="8">1.2</a-col>
-                </a-row>
-            </a-collapse-panel>
-            <a-collapse-panel key="2">
-                <template #header>
-                    <a-row class="headRow">
-                        <a-col :span="24">品牌（2）</a-col>
+                    </template>
+                    <a-row class="contRow">
+                        <a-col :span="8">10mm</a-col>
+                        <a-col :span="8">吨</a-col>
+                        <a-col :span="8">1.0</a-col>
                     </a-row>
-                </template>
-                <a-row class="contRow">
-                    <a-col :span="24">江铜</a-col>
-                </a-row>
-                <a-row class="contRow">
-                    <a-col :span="24">云铜</a-col>
-                </a-row>
-            </a-collapse-panel>
-            <a-collapse-panel key="3">
-                <template #header>
-                    <a-row class="headRow">
-                        <a-col :span="8">套保品种（2）</a-col>
-                        <a-col :span="8">单位</a-col>
-                        <a-col :span="8">套保系数</a-col>
+                    <a-row class="contRow">
+                        <a-col :span="8">12mm</a-col>
+                        <a-col :span="8">吨</a-col>
+                        <a-col :span="8">1.1</a-col>
                     </a-row>
-                </template>
-                <a-row class="contRow">
-                    <a-col :span="8">江铜</a-col>
-                    <a-col :span="8">江铜</a-col>
-                    <a-col :span="8">江铜</a-col>
-                </a-row>
-                <a-collapse default-active-key="4">
-                    <template #expandIcon="props">
-                        <svg class="icon svg-icon" aria-hidden="true" v-if="props.isActive == 0">
-                            <use xlink:href="#icon-shouqi1"></use>
-                        </svg> 
-                        <svg class="icon svg-icon" aria-hidden="true" v-else>
-                            <use xlink:href="#icon-shouqi2"></use>
-                        </svg> 
+                    <a-row class="contRow">
+                        <a-col :span="8">15mm</a-col>
+                        <a-col :span="8">吨</a-col>
+                        <a-col :span="8">1.2</a-col>
+                    </a-row>
+                </a-collapse-panel>
+                <a-collapse-panel key="2">
+                    <template #header>
+                        <a-row class="headRow">
+                            <a-col :span="24">品牌（2）</a-col>
+                        </a-row>
                     </template>
-                    <a-collapse-panel key="4">
-                        <template #header>
-                            <a-row class="headRow">
-                                <a-col :span="8">期货品种（2）</a-col>
-                                <a-col :span="8">单位</a-col>
-                                <a-col :span="8">品种系数</a-col>
-                            </a-row>
-                        </template>
-                        <a-row class="contRow">
-                            <a-col :span="8">江铜</a-col>
-                            <a-col :span="8">江铜</a-col>
-                            <a-col :span="8">江铜</a-col>
+                    <a-row class="contRow">
+                        <a-col :span="24">江铜</a-col>
+                    </a-row>
+                    <a-row class="contRow">
+                        <a-col :span="24">云铜</a-col>
+                    </a-row>
+                </a-collapse-panel>
+                <a-collapse-panel key="3">
+                    <template #header>
+                        <a-row class="headRow">
+                            <a-col :span="8">套保品种（2）</a-col>
+                            <a-col :span="8">单位</a-col>
+                            <a-col :span="8">套保系数</a-col>
                         </a-row>
-                    </a-collapse-panel>
-                </a-collapse>
-                <a-row class="contRow">
-                    <a-col :span="8">江铜</a-col>
-                    <a-col :span="8">江铜</a-col>
-                    <a-col :span="8">江铜</a-col>
-                </a-row>
-                <a-collapse default-active-key="4">
-                    <template #expandIcon="props">
-                        <svg class="icon svg-icon" aria-hidden="true" v-if="props.isActive == 0">
-                            <use xlink:href="#icon-shouqi1"></use>
-                        </svg> 
-                        <svg class="icon svg-icon" aria-hidden="true" v-else>
-                            <use xlink:href="#icon-shouqi2"></use>
-                        </svg> 
                     </template>
-                    <a-collapse-panel key="4">
-                        <template #header>
-                            <a-row class="headRow">
-                                <a-col :span="8">期货品种（2）</a-col>
-                                <a-col :span="8">单位</a-col>
-                                <a-col :span="8">品种系数</a-col>
+                    <a-row class="contRow">
+                        <a-col :span="8">江铜</a-col>
+                        <a-col :span="8">江铜</a-col>
+                        <a-col :span="8">江铜</a-col>
+                    </a-row>
+                    <a-collapse default-active-key="4">
+                        <template #expandIcon="props">
+                            <svg class="icon svg-icon" aria-hidden="true" v-if="props.isActive == 0">
+                                <use xlink:href="#icon-shouqi1"></use>
+                            </svg>
+                            <svg class="icon svg-icon" aria-hidden="true" v-else>
+                                <use xlink:href="#icon-shouqi2"></use>
+                            </svg>
+                        </template>
+                        <a-collapse-panel key="4">
+                            <template #header>
+                                <a-row class="headRow">
+                                    <a-col :span="8">期货品种（2）</a-col>
+                                    <a-col :span="8">单位</a-col>
+                                    <a-col :span="8">品种系数</a-col>
+                                </a-row>
+                            </template>
+                            <a-row class="contRow">
+                                <a-col :span="8">江铜</a-col>
+                                <a-col :span="8">江铜</a-col>
+                                <a-col :span="8">江铜</a-col>
                             </a-row>
+                        </a-collapse-panel>
+                    </a-collapse>
+                    <a-row class="contRow">
+                        <a-col :span="8">江铜</a-col>
+                        <a-col :span="8">江铜</a-col>
+                        <a-col :span="8">江铜</a-col>
+                    </a-row>
+                    <a-collapse default-active-key="4">
+                        <template #expandIcon="props">
+                            <svg class="icon svg-icon" aria-hidden="true" v-if="props.isActive == 0">
+                                <use xlink:href="#icon-shouqi1"></use>
+                            </svg>
+                            <svg class="icon svg-icon" aria-hidden="true" v-else>
+                                <use xlink:href="#icon-shouqi2"></use>
+                            </svg>
                         </template>
-                        <a-row class="contRow">
-                            <a-col :span="8">江铜</a-col>
-                            <a-col :span="8">江铜</a-col>
-                            <a-col :span="8">江铜</a-col>
-                        </a-row>
-                        <a-row class="contRow">
-                            <a-col :span="8">江铜</a-col>
-                            <a-col :span="8">江铜</a-col>
-                            <a-col :span="8">江铜</a-col>
-                        </a-row>
-                    </a-collapse-panel>
-                </a-collapse>
-            </a-collapse-panel>
-        </a-collapse>
+                        <a-collapse-panel key="4">
+                            <template #header>
+                                <a-row class="headRow">
+                                    <a-col :span="8">期货品种（2）</a-col>
+                                    <a-col :span="8">单位</a-col>
+                                    <a-col :span="8">品种系数</a-col>
+                                </a-row>
+                            </template>
+                            <a-row class="contRow">
+                                <a-col :span="8">江铜</a-col>
+                                <a-col :span="8">江铜</a-col>
+                                <a-col :span="8">江铜</a-col>
+                            </a-row>
+                            <a-row class="contRow">
+                                <a-col :span="8">江铜</a-col>
+                                <a-col :span="8">江铜</a-col>
+                                <a-col :span="8">江铜</a-col>
+                            </a-row>
+                        </a-collapse-panel>
+                    </a-collapse>
+                </a-collapse-panel>
+            </a-collapse>
+        </div>
     </div>
-  </div>
 </template>
 
 <script lang="ts">
-import { defineComponent, ref, PropType } from 'vue';
-import APP from '@/services';
-export default defineComponent({
-    name: 'rightSpot',
-    props: {
-
-    },
-    components: {},
-    setup(props, context) {
-        
-        return {
-            
-        };
-    },
-});
+    import { defineComponent, ref, PropType } from 'vue';
+    import APP from '@/services';
+    import { initData } from '@/common/methods';
+    import { queryDeliveryGoods } from './setup';
+    export default defineComponent({
+        name: 'rightSpot',
+        props: {},
+        components: {},
+        setup(props, context) {
+            const { goodsList } = queryDeliveryGoods({});
+            initData(() => {});
+            return {
+                goodsList,
+            };
+        },
+    });
 </script>
 
 <style lang="less">
-.rightSpot {
-    width: 100%;
-    height: 100%;
-    padding: 10px 12px;
-    .flex;
-    flex-direction: column;
-    .title {
+    .rightSpot {
         width: 100%;
-        height: 35px;
+        height: 100%;
+        padding: 10px 12px;
         .flex;
-        justify-content: space-between;
-        div {
-            align-self: center;
-            align-items: center;
-        }
-        .tltLeft {
-            font-size: 16px;
-        }
-        .tltBtns {
-            .ant-btn+.ant-btn {
-                margin-left: 10px;
+        flex-direction: column;
+        .title {
+            width: 100%;
+            height: 35px;
+            .flex;
+            justify-content: space-between;
+            div {
+                align-self: center;
+                align-items: center;
+            }
+            .tltLeft {
+                font-size: 16px;
+            }
+            .tltBtns {
+                .ant-btn + .ant-btn {
+                    margin-left: 10px;
+                }
             }
         }
-
+        .spotCont {
+            width: 100%;
+            padding: 0 30px;
+        }
     }
-    .spotCont {
-        width: 100%;
-        padding: 0 30px;
+    .blue {
+        color: @m-blue0;
     }
-}
-.blue {
-    color: @m-blue0;
-}
-.green {
-    color: @m-green0;
-}
-.ml10 {
-    margin-left: 10px;
-}
-.blueBtn {
-    width: 80px;
-    height: 26px;
-    text-align: center;
-    background: linear-gradient(0deg, @m-blue2, @m-blue0);
-    box-shadow: -1px 0px 0px 0px #121618;
-    .rounded-corners(3px);
-    border: 0;
-    color: @m-white0;
-    font-size: 14px;
-    &:hover,&:focus {
-         background: linear-gradient(0deg, @m-blue2-hover, @m-blue0-hover);
-         color: @m-white0-hover;
+    .green {
+        color: @m-green0;
     }
-}
-.redBtn {
-    width: 80px;
-    height: 26px;
-    background: linear-gradient(0deg, @m-red0, @m-red1);
-    .rounded-corners(3px);
-    border: 0;
-    color: @m-white0;
-    font-size: 14px;
-    &:hover,&:focus {
-         background: linear-gradient(0deg, @m-red0-hover, @m-red1-hover);
-         color: @m-white0-hover;
+    .ml10 {
+        margin-left: 10px;
     }
-}
-.ant-collapse {
-    background-color: transparent;
-    border: 0;
-    .ant-collapse-item {
+    .blueBtn {
+        width: 80px;
+        height: 26px;
+        text-align: center;
+        background: linear-gradient(0deg, @m-blue2, @m-blue0);
+        box-shadow: -1px 0px 0px 0px #121618;
+        .rounded-corners(3px);
         border: 0;
-        .ant-collapse-header {
-            background-color: transparent;
-            border-bottom: 0;
+        color: @m-white0;
+        font-size: 14px;
+        &:hover,
+        &:focus {
+            background: linear-gradient(0deg, @m-blue2-hover, @m-blue0-hover);
+            color: @m-white0-hover;
         }
-        .ant-collapse-content {
-            background-color: transparent;
-            border-top: 0;
+    }
+    .redBtn {
+        width: 80px;
+        height: 26px;
+        background: linear-gradient(0deg, @m-red0, @m-red1);
+        .rounded-corners(3px);
+        border: 0;
+        color: @m-white0;
+        font-size: 14px;
+        &:hover,
+        &:focus {
+            background: linear-gradient(0deg, @m-red0-hover, @m-red1-hover);
+            color: @m-white0-hover;
         }
     }
-}
-.ant-collapse.spotCollapse.ant-collapse-borderless {
-    margin-top: 10px;
-    background-color: transparent;
-    .ant-collapse-item {
-        border-bottom: 0;
-        .ant-collapse-header {
-            color: @m-grey17;
-            font-size: 14px;
-            border-bottom: 1px solid @m-grey18;
-            padding: 10px 8px 10px 44px;
-            height: 43px;
-            .ant-collapse-arrow {
-                fill: @m-grey17;
-                width: 16px;
-                height: 16px;
-                font-size: 16px;
-                left: 0;
+    .ant-collapse {
+        background-color: transparent;
+        border: 0;
+        .ant-collapse-item {
+            border: 0;
+            .ant-collapse-header {
+                background-color: transparent;
+                border-bottom: 0;
             }
-        }
-        .ant-collapse-content {
-            .ant-collapse-content-box {
-                padding: 0 0 0 30px;
+            .ant-collapse-content {
                 background-color: transparent;
-                .ant-row.contRow {
-                    width: 100%;
-                    height: 40px;
-                    line-height: 40px;
+                border-top: 0;
+            }
+        }
+    }
+    .ant-collapse.spotCollapse.ant-collapse-borderless {
+        margin-top: 10px;
+        background-color: transparent;
+        .ant-collapse-item {
+            border-bottom: 0;
+            .ant-collapse-header {
+                color: @m-grey17;
+                font-size: 14px;
+                border-bottom: 1px solid @m-grey18;
+                padding: 10px 8px 10px 44px;
+                height: 43px;
+                .ant-collapse-arrow {
+                    fill: @m-grey17;
+                    width: 16px;
+                    height: 16px;
                     font-size: 16px;
-                    color: @m-white1;
-                    margin-bottom: 10px;
-                    background: #0F161C;
-                    border: 1px solid #172B56;
-                    border-radius: 3px;
-                    padding-left: 14px;
-                    padding-right: 12px;
-                    .ant-col:last-child {
-                        text-align: right;
+                    left: 0;
+                }
+            }
+            .ant-collapse-content {
+                .ant-collapse-content-box {
+                    padding: 0 0 0 30px;
+                    background-color: transparent;
+                    .ant-row.contRow {
+                        width: 100%;
+                        height: 40px;
+                        line-height: 40px;
+                        font-size: 16px;
+                        color: @m-white1;
+                        margin-bottom: 10px;
+                        background: #0f161c;
+                        border: 1px solid #172b56;
+                        border-radius: 3px;
+                        padding-left: 14px;
+                        padding-right: 12px;
+                        .ant-col:last-child {
+                            text-align: right;
+                        }
+                        .ant-col:first-child {
+                            text-align: left;
+                        }
                     }
-                    .ant-col:first-child {
-                        text-align: left;
+                    .contRow:first-child {
+                        margin-top: 9px;
+                    }
+                    .contRow:last-child {
+                        margin-bottom: 20px;
                     }
-                }
-                .contRow:first-child {
-                    margin-top: 9px;
-                }
-                .contRow:last-child {
-                    margin-bottom: 20px;
                 }
             }
         }
     }
-}
-.ant-row.headRow {
-    .ant-col:first-child {
-        text-align: left;
-    }
-    .ant-col:nth-child(3) {
-        text-align: right;
-    }
-}
-</style>;
+    .ant-row.headRow {
+        .ant-col:first-child {
+            text-align: left;
+        }
+        .ant-col:nth-child(3) {
+            text-align: right;
+        }
+    }</style
+>;

src/views/information/goods/components/rightSpot/setup.ts

@@ -0,0 +1,13 @@
+import { QueryDeliveryGoods } from '@/services/go/ermcp/goodsInfo';
+import { ErmcpDeliveryGoodsReq, ErmcpDeliveryGoodsRsp } from '@/services/go/ermcp/goodsInfo/interface';
+import { reactive, ref } from '@vue/reactivity';
+
+export function queryDeliveryGoods(req: ErmcpDeliveryGoodsReq) {
+    let goodsList = ref<ErmcpDeliveryGoodsRsp[] | []>([]);
+    QueryDeliveryGoods(req).then((res) => {
+        goodsList.value = res;
+    });
+    return {
+        goodsList,
+    };
+}

src/views/information/goods/list/spot-variety/index.vue

@@ -1,72 +1,71 @@
 <template>
-  <!-- 现货品种 -->
-  <div class="spot-variety">
-    <filterCustomTable @search="search">
-      <a-button class="operBtn"
-                @click="addAction">新增</a-button>
-    </filterCustomTable>
-    <div class="spotTableCont">
-      <div class="leftSpot">
-        <leftMenu></leftMenu>
-      </div>
-      <div class="rightCont">
-        <rightSpot></rightSpot>
-      </div>
+    <!-- 现货品种 -->
+    <div class="spot-variety">
+        <filterCustomTable @search="search">
+            <a-button class="operBtn" @click="addAction">新增</a-button>
+        </filterCustomTable>
+        <div class="spotTableCont">
+            <div class="leftSpot">
+                <leftMenu></leftMenu>
+            </div>
+            <div class="rightCont">
+                <rightSpot></rightSpot>
+            </div>
+        </div>
+        <!-- 新增商品 -->
+        <AddGoods />
     </div>
-    <!-- 新增商品 -->
-    <AddGoods />
-  </div>
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+    import { defineComponent } from 'vue';
 
-import filterCustomTable from '@/views/information/goods/components/filterTable/index.vue';
-import leftMenu from '@/views/information/goods/components/leftMenu/index.vue';
-import rightSpot from '@/views/information/goods/components/rightSpot/index.vue';
-import { openModal } from '@/common/setup/modal/index';
-import { initData } from '@/common/methods/index';
-import AddGoods from '@/views/information/goods/components/add/index.vue';
+    import filterCustomTable from '@/views/information/goods/components/filterTable/index.vue';
+    import leftMenu from '@/views/information/goods/components/leftMenu/index.vue';
+    import rightSpot from '@/views/information/goods/components/rightSpot/index.vue';
+    import { openModal } from '@/common/setup/modal/index';
+    import { initData } from '@/common/methods/index';
+    import AddGoods from '@/views/information/goods/components/add/index.vue';
 
-export default defineComponent({
-    name: 'spot-variety',
-    components: {
-        filterCustomTable,
-        leftMenu,
-        rightSpot,
-        AddGoods,
-    },
-    setup() {
-        const { openAction: addAction } = openModal('addGoods');
-        initData(() => {
-            // 加载数据在这里
-        });
-        return { addAction };
-    },
-});
+    export default defineComponent({
+        name: 'spot-variety',
+        components: {
+            filterCustomTable,
+            leftMenu,
+            rightSpot,
+            AddGoods,
+        },
+        setup() {
+            const { openAction: addAction } = openModal('addGoods');
+            initData(() => {
+                // 加载数据在这里
+            });
+            return { addAction };
+        },
+    });
 </script>
 
 <style lang="less">
-.spot-variety {
-    width: 100%;
-    height: 100%;
-    .flex;
-    flex-direction: column;
-    .spotTableCont {
+    .spot-variety {
         width: 100%;
-        height: calc(100% - 45px);
-        overflow-y: auto;
-        .inlineflex;
-        .leftSpot {
-            width: 180px;
-            height: 100%;
-            background: @m-black4;
+        height: 100%;
+        .flex;
+        flex-direction: column;
+        .spotTableCont {
+            width: 100%;
+            height: calc(100% - 45px);
+            overflow-y: auto;
+            .inlineflex;
+            .leftSpot {
+                width: 180px;
+                height: 100%;
+                background: @m-black4;
+            }
+            .rightCont {
+                flex: 1;
+                height: 100%;
+                background: @m-black2;
+            }
         }
-        .rightCont {
-            flex: 1;
-            height: 100%;
-            background: @m-black2;
-        }
-    }
-}
-</style>;
+    }</style
+>;

src/views/information/spot-contract/components/add/index.vue

@@ -1,42 +1,49 @@
 <template>
-    <!-- 新增客户资料 -->
-    <a-modal class="add-spot-contract" title="新增现货合同" v-model:visible="visible" @cancel="cancel" width="890px">
-        <template #footer>
-            <a-button key="submit" type="primary" :loading="loading" @click="submit">完成</a-button>
-        </template>
-    </a-modal>
+  <!-- 新增客户资料 -->
+  <a-modal class="add-spot-contract"
+           title="新增现货合同"
+           v-model:visible="visible"
+           @cancel="cancel"
+           width="890px">
+    <template #footer>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="submit">完成</a-button>
+    </template>
+  </a-modal>
 </template>
 
 <script lang="ts">
-    import { defineComponent, ref } from 'vue';
-    import { closeModal } from '@/common/setup/modal/index';
-    import { initData } from '@/common/methods';
+import { defineComponent, ref } from 'vue';
+import { closeModal } from '@/common/setup/modal/index';
+import { initData } from '@/common/methods';
 
-    export default defineComponent({
-        name: 'add-spot-contract',
-        components: {},
-        setup() {
-            const { visible, cancel } = closeModal('addSpotContract');
-            const loading = ref<boolean>(false);
-            function submit() {
-                loading.value = true;
-                setTimeout(() => {
-                    loading.value = false;
-                    cancel();
-                }, 2000);
-            }
-            initData(() => {});
-            return {
-                visible,
-                cancel,
-                submit,
-                loading,
-            };
-        },
-    });
+export default defineComponent({
+    name: 'add-spot-contract',
+    components: {},
+    setup() {
+        const { visible, cancel } = closeModal('addSpotContract');
+        const loading = ref<boolean>(false);
+        function submit() {
+            loading.value = true;
+            setTimeout(() => {
+                loading.value = false;
+                cancel();
+            }, 2000);
+        }
+        initData(() => {});
+        return {
+            visible,
+            cancel,
+            submit,
+            loading,
+        };
+    },
+});
 </script>
 
 <style lang="less">
-    .add-spot-contract {
-    }</style
->;
+.add-spot-contract {
+}
+</style>;

src/views/information/spot-contract/components/cancel/index.vue

@@ -0,0 +1,46 @@
+<template>
+  <!-- 现货合同撤销-->
+  <a-modal class="add-custom custom-detail"
+           title="现货合同撤销"
+           v-model:visible="visible"
+           @cancel="cancel"
+           width="890px">
+    <template #footer>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="submit">关闭</a-button>
+    </template>
+    现货合同撤销
+  </a-modal>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref } from 'vue';
+import { closeModal } from '@/common/setup/modal/index';
+
+export default defineComponent({
+    name: 'spot-contract-detail',
+    components: {},
+    setup() {
+        const { visible, cancel } = closeModal('spotContractCancel');
+        const loading = ref<boolean>(false);
+        function submit() {
+            loading.value = true;
+            setTimeout(() => {
+                loading.value = false;
+                cancel();
+            }, 2000);
+        }
+        return {
+            visible,
+            cancel,
+            submit,
+            loading,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/information/spot-contract/components/check/index.vue

@@ -0,0 +1,46 @@
+<template>
+  <!-- 现货合同审核-->
+  <a-modal class="add-custom custom-detail"
+           title="现货合同审核"
+           v-model:visible="visible"
+           @cancel="cancel"
+           width="890px">
+    <template #footer>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="submit">关闭</a-button>
+    </template>
+    现货合同审核
+  </a-modal>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref } from 'vue';
+import { closeModal } from '@/common/setup/modal/index';
+
+export default defineComponent({
+    name: 'spot-contract-detail',
+    components: {},
+    setup() {
+        const { visible, cancel } = closeModal('spotContractCheck');
+        const loading = ref<boolean>(false);
+        function submit() {
+            loading.value = true;
+            setTimeout(() => {
+                loading.value = false;
+                cancel();
+            }, 2000);
+        }
+        return {
+            visible,
+            cancel,
+            submit,
+            loading,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/information/spot-contract/components/finish/index.vue

@@ -0,0 +1,46 @@
+<template>
+  <!-- 现货合同正常完结-->
+  <a-modal class="custom-detail"
+           title="现货合同正常完结"
+           v-model:visible="visible"
+           @cancel="cancel"
+           width="890px">
+    <template #footer>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="submit">关闭</a-button>
+    </template>
+    现货合同正常完结
+  </a-modal>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref } from 'vue';
+import { closeModal } from '@/common/setup/modal/index';
+
+export default defineComponent({
+    name: 'spot-contract-detail',
+    components: {},
+    setup() {
+        const { visible, cancel } = closeModal('spotContractFinish');
+        const loading = ref<boolean>(false);
+        function submit() {
+            loading.value = true;
+            setTimeout(() => {
+                loading.value = false;
+                cancel();
+            }, 2000);
+        }
+        return {
+            visible,
+            cancel,
+            submit,
+            loading,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/information/spot-contract/index.vue

@@ -1,33 +0,0 @@
-<template>
-    <!-- 现货合同 -->
-    <div class="spot-contract">
-        <firstMenu :list="list" :value="'title'" @selectMenu="selectMenu" />
-        <router-view />
-    </div>
-</template>
-
-<script lang="ts">
-    import { defineComponent } from 'vue';
-    import firstMenu from '@/common/components/firstMenu/index.vue';
-    import { handleRouterMenu } from '@/common/setup/router/index';
-    import { initData } from '@/common/methods';
-
-    export default defineComponent({
-        name: 'spot-contract',
-        components: {
-            firstMenu,
-        },
-        setup() {
-            const { list, selectMenu, getMenuList } = handleRouterMenu();
-            initData(() => {
-                getMenuList();
-            });
-            return { list, selectMenu };
-        },
-    });
-</script>
-
-<style lang="less">
-    .spot-contract {
-    }</style
->;

src/views/information/spot-contract/list/done/index.vue → src/views/information/spot-contract/list/checkpending/index.vue

@@ -1,6 +1,7 @@
 <template>
-  <!-- 现货合同: 已完成-->
-  <div class="spot-contract-done">
+  <!-- 现货合同: 待审核-->
+  <div class="spot-contract-peddding"
+       :loading="loading">
     <filterCustomTable @search="search">
       <a-button class="operBtn"
                 v-if="hasPermission('spot_contract_btn_add')"
@@ -18,16 +19,12 @@
         </template> -->
       </a-table>
     </contextMenu>
-    <!-- 新增现货合同 -->
-    <AddSpotContract />
     <!-- 现货合同: 详情 -->
     <SpotContractDeatil />
-    <!-- 现货合同: 修改 -->
-    <ModifySpotContract />
-    <!-- 现货合同: 删除 -->
-    <DeleteSpotContract />
-    <!-- 现货合同: 重新提交 -->
-    <ResubmitSpotContract />
+    <!-- 现货合同: 审核 -->
+    <Check />
+    <!-- 现货合同: 撤销 -->
+    <Cancel />
   </div>
 </template>
 
@@ -42,35 +39,32 @@ import { MenuItem } from '@/common/components/contextMenu/interface';
 import AddSpotContract from '@/views/information/spot-contract/components/add/index.vue';
 import { detailButton, permissionButton, handlePermission } from '@/common/setup/buttonPermission/index';
 import SpotContractDeatil from '@/views/information/spot-contract/components/detail/index.vue';
-import ModifySpotContract from '@/views/information/spot-contract/components/modify/index.vue';
-import DeleteSpotContract from '@/views/information/spot-contract/components/delete/index.vue';
-import ResubmitSpotContract from '@/views/information/spot-contract/components/resubmit/index.vue';
+import Check from '@/views/information/spot-contract/components/check/index.vue';
+import Cancel from '@/views/information/spot-contract/components/cancel/index.vue';
 
 export default defineComponent({
-    name: 'spot-contract-done',
+    name: 'spot-contract-peddding',
     components: {
         filterCustomTable,
         contextMenu,
         AddSpotContract,
         SpotContractDeatil,
-        ModifySpotContract,
-        DeleteSpotContract,
-        ResubmitSpotContract,
+        Check,
+        Cancel,
     },
     setup() {
         const contextMenuList = ref<MenuItem[]>([]);
         const { spotContractList, actionQuery, columns, getColumns, search, loading } = getCustomList();
-        const { hasPermission } = handlePermission('spot_contract_unsubmitted');
+        const { hasPermission } = handlePermission('spot_contract_checkpending');
         const { openAction: addAction } = openModal('addSpotContract');
 
         detailButton('spotContractDetail', contextMenuList);
-        const { action: modifyAction } = permissionButton('modifySpotContract', '修改', contextMenuList);
-        const { action: deleteAction } = permissionButton('deleteSpotContract', '删除', contextMenuList);
-        const { action: resubmitAction } = permissionButton('resubmitSpotContract', '重新提交', contextMenuList);
+        const { action: checkAction } = permissionButton('spotContractCheck', '审核', contextMenuList);
+        const { action: cancelAction } = permissionButton('spotContractCancel', '撤销', contextMenuList);
+
         const stop = watchEffect(() => {
-            hasPermission('spot_contract_btn_modify') && modifyAction();
-            hasPermission('spot_contract_btn_delete') && deleteAction();
-            hasPermission('spot_contract_btn_resubmit') && resubmitAction();
+            hasPermission('spot_contract_btn_check') && checkAction();
+            hasPermission('spot_contract_btn_cancel') && cancelAction();
         });
         onUnmounted(() => {
             stop();
@@ -85,6 +79,7 @@ export default defineComponent({
 </script>
 
 <style lang="less">
-.spot-contract-done {
+.spot-contract-peddding {
 }
-</style>;
+</style
+>;

src/views/information/spot-contract/list/finished/index.vue

@@ -0,0 +1,70 @@
+<template>
+  <!-- 现货合同: 已完成-->
+  <div class="spot-contract-done">
+    <filterCustomTable @search="search"
+                       :loading="loading">
+      <a-button class="operBtn"
+                v-if="hasPermission('spot_contract_btn_add')"
+                @click="addAction">新增</a-button>
+    </filterCustomTable>
+    <contextMenu :contextMenuList="contextMenuList"
+                 :tableList="spotContractList">
+      <a-table :columns="columns"
+               class="topTable"
+               :pagination="false"
+               rowKey="key"
+               :data-source="spotContractList">
+        <!-- <template #userinfotype="{ text }">
+          <a>{{ text === '2' ? '企业' : '个人'}}</a>
+        </template> -->
+      </a-table>
+    </contextMenu>
+    <!-- 新增现货合同 -->
+    <AddSpotContract />
+    <!-- 现货合同: 详情 -->
+    <SpotContractDeatil />
+
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref } from 'vue';
+import { initData } from '@/common/methods';
+import filterCustomTable from '@/views/information/spot-contract/components/filterTable/index.vue';
+import { getCustomList } from '../setup';
+import { openModal } from '@/common/setup/modal/index';
+import contextMenu from '@/common/components/contextMenu/index.vue';
+import { MenuItem } from '@/common/components/contextMenu/interface';
+import AddSpotContract from '@/views/information/spot-contract/components/add/index.vue';
+import { detailButton, handlePermission } from '@/common/setup/buttonPermission/index';
+import SpotContractDeatil from '@/views/information/spot-contract/components/detail/index.vue';
+
+export default defineComponent({
+    name: 'spot-contract-done',
+    components: {
+        filterCustomTable,
+        contextMenu,
+        AddSpotContract,
+        SpotContractDeatil,
+    },
+    setup() {
+        const contextMenuList = ref<MenuItem[]>([]);
+        const { spotContractList, actionQuery, columns, getColumns, search, loading } = getCustomList();
+        const { hasPermission } = handlePermission('spot_contract_finished');
+        const { openAction: addAction } = openModal('addSpotContract');
+
+        detailButton('spotContractDetail', contextMenuList);
+
+        initData(() => {
+            actionQuery(4);
+            getColumns();
+        });
+        return { spotContractList, columns, search, contextMenuList, addAction, loading, hasPermission };
+    },
+});
+</script>
+
+<style lang="less">
+.spot-contract-done {
+}
+</style>;

src/views/information/spot-contract/list/peddding/index.vue

@@ -1,83 +0,0 @@
-<template>
-    <!-- 现货合同: 待审核-->
-    <div class="spot-contract-peddding">
-        现货合同: 待审核
-    </div>
-</template>
-
-<script lang="ts">
-    import { defineComponent, ref } from 'vue';
-    import { QueryCustomInfo } from '@/services/go/ermcp/customInfo/index';
-    import { QueryCustomInfoType } from '@/services/go/ermcp/customInfo/interface';
-    import { message } from 'ant-design-vue';
-    import { initData } from '@/common/methods';
-
-    // 查询客户资料列表
-    function getCustomList() {
-        // const filteredInfo = ref();
-        // const sortedInfo = ref();
-        // const columns = computed(() => {
-        //     const filtered = filteredInfo.value || {};
-        //     const sorted = sortedInfo.value || {};
-        //     return [
-        //         {
-        //             title: '序号',
-        //             dataIndex: 'index',
-        //             key: 'index',
-        //             align: 'center',
-        //             width: 50,
-        //             customRender: (param: any) => `${param.index + 1}`,
-        //         },
-        //         {
-        //             title: 'Age',
-        //             dataIndex: 'age',
-        //             key: 'age',
-        //             sorter: (a: DataItem, b: DataItem) => a.age - b.age,
-        //             sortOrder: sorted.columnKey === 'age' && sorted.order,
-        //         },
-        //         {
-        //             title: 'Address',
-        //             dataIndex: 'address',
-        //             key: 'address',
-        //             filters: [
-        //                 { text: 'London', value: 'London' },
-        //                 { text: 'New York', value: 'New York' },
-        //             ],
-        //             filteredValue: filtered.address || null,
-        //             onFilter: (value: string, record: DataItem) => record.address.includes(value),
-        //             sorter: (a: DataItem, b: DataItem) => a.address.length - b.address.length,
-        //             sortOrder: sorted.columnKey === 'address' && sorted.order,
-        //             ellipsis: true,
-        //         },
-        //     ];
-        // });
-        const customList = ref<QueryCustomInfoType[]>([]);
-        function actionQuery() {
-            QueryCustomInfo(4)
-                .then((res) => {
-                    console.log('L', res);
-                })
-                .catch((err) => message.error(err));
-        }
-
-        return { customList, actionQuery };
-    }
-
-    export default defineComponent({
-        name: 'spot-contract-peddding',
-        components: {},
-        setup() {
-            const { customList, actionQuery } = getCustomList();
-            initData(() => {
-                actionQuery();
-                // 加载数据在这里
-            });
-            return { customList };
-        },
-    });
-</script>
-
-<style lang="less">
-    .spot-contract-peddding {
-    }</style
->;

src/views/information/spot-contract/list/performance/index.vue

@@ -1,83 +1,78 @@
 <template>
-    <!-- 现货合同: 履约中-->
-    <div class="spot-contract-performance">
-        客户信息: 履约中
-    </div>
+  <!-- 现货合同: 履约中-->
+  <div class="spot-contract-performance">
+    <filterCustomTable @search="search"
+                       :loading="loading">
+      <a-button class="operBtn"
+                v-if="hasPermission('spot_contract_btn_add')"
+                @click="addAction">新增</a-button>
+    </filterCustomTable>
+    <contextMenu :contextMenuList="contextMenuList"
+                 :tableList="spotContractList">
+      <a-table :columns="columns"
+               class="topTable"
+               :pagination="false"
+               rowKey="key"
+               :data-source="spotContractList">
+        <!-- <template #userinfotype="{ text }">
+          <a>{{ text === '2' ? '企业' : '个人'}}</a>
+        </template> -->
+      </a-table>
+    </contextMenu>
+    <!-- 现货合同: 详情 -->
+    <SpotContractDeatil />
+    <!-- 现货合同: 正常完结 -->
+    <Finish />
+  </div>
 </template>
 
 <script lang="ts">
-    import { defineComponent, ref } from 'vue';
-    import { QueryCustomInfo } from '@/services/go/ermcp/customInfo/index';
-    import { QueryCustomInfoType } from '@/services/go/ermcp/customInfo/interface';
-    import { message } from 'ant-design-vue';
-    import { initData } from '@/common/methods';
+import { defineComponent, onUnmounted, ref, watchEffect } from 'vue';
+import { initData } from '@/common/methods';
+import filterCustomTable from '@/views/information/spot-contract/components/filterTable/index.vue';
+import { getCustomList } from '../setup';
+import { openModal } from '@/common/setup/modal/index';
+import contextMenu from '@/common/components/contextMenu/index.vue';
+import { MenuItem } from '@/common/components/contextMenu/interface';
+import AddSpotContract from '@/views/information/spot-contract/components/add/index.vue';
+import { detailButton, permissionButton, handlePermission } from '@/common/setup/buttonPermission/index';
+import SpotContractDeatil from '@/views/information/spot-contract/components/detail/index.vue';
+import Finish from '@/views/information/spot-contract/components/finish/index.vue';
 
-    // 查询客户资料列表
-    function getCustomList() {
-        // const filteredInfo = ref();
-        // const sortedInfo = ref();
-        // const columns = computed(() => {
-        //     const filtered = filteredInfo.value || {};
-        //     const sorted = sortedInfo.value || {};
-        //     return [
-        //         {
-        //             title: '序号',
-        //             dataIndex: 'index',
-        //             key: 'index',
-        //             align: 'center',
-        //             width: 50,
-        //             customRender: (param: any) => `${param.index + 1}`,
-        //         },
-        //         {
-        //             title: 'Age',
-        //             dataIndex: 'age',
-        //             key: 'age',
-        //             sorter: (a: DataItem, b: DataItem) => a.age - b.age,
-        //             sortOrder: sorted.columnKey === 'age' && sorted.order,
-        //         },
-        //         {
-        //             title: 'Address',
-        //             dataIndex: 'address',
-        //             key: 'address',
-        //             filters: [
-        //                 { text: 'London', value: 'London' },
-        //                 { text: 'New York', value: 'New York' },
-        //             ],
-        //             filteredValue: filtered.address || null,
-        //             onFilter: (value: string, record: DataItem) => record.address.includes(value),
-        //             sorter: (a: DataItem, b: DataItem) => a.address.length - b.address.length,
-        //             sortOrder: sorted.columnKey === 'address' && sorted.order,
-        //             ellipsis: true,
-        //         },
-        //     ];
-        // });
-        const customList = ref<QueryCustomInfoType[]>([]);
-        function actionQuery() {
-            QueryCustomInfo(4)
-                .then((res) => {
-                    console.log('L', res);
-                })
-                .catch((err) => message.error(err));
-        }
+export default defineComponent({
+    name: 'spot-contract-performance',
+    components: {
+        filterCustomTable,
+        contextMenu,
+        AddSpotContract,
+        SpotContractDeatil,
+        Finish,
+    },
+    setup() {
+        const contextMenuList = ref<MenuItem[]>([]);
+        const { spotContractList, actionQuery, columns, getColumns, search, loading } = getCustomList();
+        const { hasPermission } = handlePermission('spot_contract_performance');
+        const { openAction: addAction } = openModal('addSpotContract');
 
-        return { customList, actionQuery };
-    }
+        detailButton('spotContractDetail', contextMenuList);
+        const { action: checkAction } = permissionButton('spotContractFinish', '正常完结', contextMenuList);
 
-    export default defineComponent({
-        name: 'spot-contract-performance',
-        components: {},
-        setup() {
-            const { customList, actionQuery } = getCustomList();
-            initData(() => {
-                actionQuery();
-                // 加载数据在这里
-            });
-            return { customList };
-        },
-    });
+        const stop = watchEffect(() => {
+            hasPermission('spot_contract_btn_finish') && checkAction();
+        });
+        onUnmounted(() => {
+            stop();
+        });
+        initData(() => {
+            actionQuery(3);
+            getColumns();
+        });
+        return { spotContractList, columns, search, contextMenuList, addAction, loading, hasPermission };
+    },
+});
 </script>
 
 <style lang="less">
-    .spot-contract-performance {
-    }</style
->;
+.spot-contract-performance {
+}
+</style>;

src/views/information/spot-contract/list/not-commit/index.vue → src/views/information/spot-contract/list/unsubmitted/index.vue

@@ -1,6 +1,7 @@
 <template>
   <!-- 现货合同: 未提交-->
-  <div class="spot-contract-not-commit">
+  <div class="spot-contract-not-commit"
+       :loading="loading">
     <filterCustomTable @search="search">
       <a-button class="operBtn"
                 v-if="hasPermission('spot_contract_btn_add')"
@@ -76,7 +77,7 @@ export default defineComponent({
             stop();
         });
         initData(() => {
-            actionQuery(2);
+            actionQuery(1);
             getColumns();
         });
         return { spotContractList, columns, search, contextMenuList, addAction, loading, hasPermission };