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

src/views/information/account_info/compoments/add-child-futures/index.vue

@@ -1,62 +1,106 @@
 <template>
-    <!-- 新增期货子账户 -->
-    <a-modal class="commonModal add-futures-son" title="新增期货子账户" v-model:visible="visible" @cancel="cancel" centered :maskClosable="false" width="890px">
-        <template #footer>
-            <a-button key="submit" type="primary" :loading="loading" @click="cancel">取消 </a-button>
-            <a-button key="submit" type="primary" :loading="loading" @click="submit">新增 </a-button>
-        </template>
-        <a-form class="inlineForm" ref="formRef" :model="formState" :rules="rules">
-            <a-row :gutter="24">
-                <a-col :span="12">
-                    <a-form-item label="所属期货账户" name="userinfotype">
-                        <span class="white">{{ selectedData.mainAcc.accountname }}/{{ selectedData.mainAcc.hedgeaccountcode }}</span>
-                    </a-form-item>
-                </a-col>
-                <a-col :span="12">
-                    <a-form-item label="账户名称" name="accountname">
-                        <a-input class="dialogInput" v-model:value="formState.accountname" style="width: 200px" placeholder="请输入账户名称" />
-                    </a-form-item>
-                </a-col>
-                <a-col :span="12">
-                    <a-form-item label="期货保证金" name="trademargintmpid">
-                        <a-select class="inlineFormSelect" style="width: 200px" v-model:value="formState.trademargintmpid" placeholder="请选择保证金模板">
-                            <a-select-option v-for="item in marginList" :key="item.tradeconfigtmpid" :value="item.tradeconfigtmpid">
-                                {{ item.tradeconfigtmpname }}
-                            </a-select-option>
-                        </a-select>
-                    </a-form-item>
-                </a-col>
-                <a-col :span="12">
-                    <a-form-item label="期货手续费" name="tradefeetmpid">
-                        <a-select class="inlineFormSelect" style="width: 200px" v-model:value="formState.tradefeetmpid" placeholder="请选择期货手续费">
-                            <a-select-option v-for="item in feeList" :key="item.tradeconfigtmpid" :value="item.tradeconfigtmpid">
-                                {{ item.tradeconfigtmpname }}
-                            </a-select-option>
-                        </a-select>
-                    </a-form-item>
-                </a-col>
-                <!-- <a-col :span="12"
+  <!-- 新增期货子账户 -->
+  <a-modal class="commonModal add-futures-son"
+           title="新增期货子账户"
+           v-model:visible="visible"
+           @cancel="cancel"
+           centered
+           :maskClosable="false"
+           width="890px">
+    <template #footer>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="cancel">取消 </a-button>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="submit">新增 </a-button>
+    </template>
+    <a-form class="inlineForm"
+            ref="formRef"
+            :model="formState"
+            :rules="rules">
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <a-form-item label="所属期货账户"
+                       name="userinfotype">
+            <span
+                  class="white">{{ selectedData.mainAcc.accountname }}/{{ selectedData.mainAcc.hedgeaccountcode }}</span>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="账户名称"
+                       name="accountname">
+            <a-input class="dialogInput"
+                     v-model:value="formState.accountname"
+                     style="width: 200px"
+                     placeholder="请输入账户名称" />
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="期货保证金"
+                       name="trademargintmpid">
+            <a-select class="inlineFormSelect"
+                      style="width: 200px"
+                      v-model:value="formState.trademargintmpid"
+                      placeholder="请选择保证金模板">
+              <a-select-option v-for="item in marginList"
+                               :key="item.tradeconfigtmpid"
+                               :value="item.tradeconfigtmpid">
+                {{ item.tradeconfigtmpname }}
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="期货手续费"
+                       name="tradefeetmpid">
+            <a-select class="inlineFormSelect"
+                      style="width: 200px"
+                      v-model:value="formState.tradefeetmpid"
+                      placeholder="请选择期货手续费">
+              <a-select-option v-for="item in feeList"
+                               :key="item.tradeconfigtmpid"
+                               :value="item.tradeconfigtmpid">
+                {{ item.tradeconfigtmpname }}
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+        <!-- <a-col :span="12"
                v-if="!isPingAnOem()"> -->
-                <a-col :span="12">
-                    <a-form-item label="指定交易用户" name="traderUserId">
-                        <a-select class="inlineFormSelect" style="width: 200px" v-model:value="formState.traderUserId" placeholder="请选择交易用户">
-                            <a-select-option v-for="item in userList" :key="item.roleid" :value="item.roleid">
-                                {{ item.rolename }}
-                            </a-select-option>
-                        </a-select>
-                        <a-button @click="addTrader" class="operBtn" v-if="!isPingAnOem()">新增</a-button>
-                    </a-form-item>
-                </a-col>
-            </a-row>
-        </a-form>
-        <AddTrader @cancel="updateTrader" />
-    </a-modal>
+        <a-col :span="12">
+          <a-form-item label="指定交易用户"
+                       name="traderUserId">
+            <a-select class="inlineFormSelect"
+                      style="width: 200px"
+                      v-model:value="formState.traderUserId"
+                      placeholder="请选择交易用户">
+              <a-select-option v-for="item in userList"
+                               :key="item.roleid"
+                               :value="item.roleid">
+                {{ item.rolename }}
+              </a-select-option>
+            </a-select>
+            <a-button @click="openComponent({code: 'account_trade_add', lable: '新增', className: 'operBtn'}, selectedData)"
+                      class="operBtn"
+                      v-if="!isPingAnOem()">新增</a-button>
+          </a-form-item>
+        </a-col>
+      </a-row>
+    </a-form>
+    <component :is="componentId"
+               v-if="componentId"
+               @cancel="closeComponent"></component>
+    <!-- <AddTrader @cancel="updateTrader" /> -->
+  </a-modal>
 </template>
 
 <script lang="ts">
 import { openModal } from '@/common/setup/modal/index';
 import { _closeModal } from '@/common/setup/modal/modal';
-import { defineComponent, PropType, ref, watchEffect } from 'vue';
+import { defineAsyncComponent, defineComponent, PropType, Ref, ref, watchEffect } from 'vue';
 import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
 import { ErmcpBizGroupReq, HedgeOutMainConfigReq } from '@/services/proto/accountinfo/interface';
 import { validateAction } from '@/common/setup/form';
@@ -67,15 +111,15 @@ import { ErmcpLoginUserEx, ErmcpTaAccountEx } from '@/services/go/ermcp/account/
 import { handlerManagerList } from '@/common/setup/user';
 import { geLoginID_number } from '@/services/bus/login';
 import { getUserId } from '@/services/bus/user';
-import AddTrader from '../add-traders/index.vue';
 import { ErmcpTradeConfigTMP } from '@/services/go/ermcp/business-review/interface';
 import { isPingAnOem } from '@/common/config/projectName';
+import { handleModalComponent } from '@/common/setup/asyncComponent';
 
 export default defineComponent({
     name: 'account_info_futures_btn_add',
     emits: ['cancel', 'update'],
     components: {
-        AddTrader,
+        account_trade_add: defineAsyncComponent(() => import('../add-traders/index.vue')),
     },
     props: {
         selectedData: {
@@ -99,7 +143,12 @@ export default defineComponent({
         // 控制关闭弹窗
         const { visible, cancel } = _closeModal(context);
         // 新增交易用户
+        // 弹窗选中的数据
+        const childSelectedData = ref<ErmcpTaAccountEx>();
+        // 控制异步组件
+        const { componentId, closeComponent, openComponent } = handleModalComponent<ErmcpTaAccountEx>(() => {}, childSelectedData as Ref<ErmcpTaAccountEx>);
         const { openAction: addTrader } = openModal('account_info_trade_btn_add');
+
         const loading = ref<boolean>(false);
         const { rules, formState, formRef } = handleBusinessForm();
         function updateTrader() {
@@ -143,6 +192,10 @@ export default defineComponent({
             updateTrader,
             loading,
             isPingAnOem,
+            componentId,
+            closeComponent,
+            openComponent,
+            childSelectedData,
         };
     },
 });

src/views/information/account_info/compoments/cancel-futures/index.vue

@@ -1,23 +1,37 @@
 <template>
-    <!-- 注销账户 -->
-    <a-modal class="add-custom" title="注销账户" v-model:visible="visible" @cancel="cancel" centered :maskClosable="false" width="890px">
-        <template #footer>
-            <a-button key="submit" type="primary" :loading="loading" @click="cancel">取消 </a-button>
-            <a-button key="submit" type="primary" :loading="loading" @click="submit">注销 </a-button>
-        </template>
-        <Detail :selectedData="selectedData" :userList="userList" :secondeData="secondeData" />
-    </a-modal>
+  <!-- 注销账户 -->
+  <a-modal class="add-custom"
+           title="注销账户"
+           v-model:visible="visible"
+           @cancel="cancel"
+           centered
+           :maskClosable="false"
+           width="890px">
+    <template #footer>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="cancel">取消 </a-button>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="submit">注销 </a-button>
+    </template>
+    <Detail :selectedData="selectedData"
+            :userList="userList"
+            :firstSelectedData="firstSelectedData" />
+  </a-modal>
 </template>
 
 <script lang="ts">
-import { _closeModal } from '@/common/setup/modal/modal';
-import { defineComponent, ref, PropType } from 'vue';
-import { Modal } from 'ant-design-vue';
-import { TaaccountOperateReq } from '@/services/proto/accountinfo/interface';
 import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
-import { taAccountOperateReq } from '@/services/proto/accountinfo';
-import { ErmcpLoginUserEx, ErmcpTaAccount, ErmcpTaAccountEx } from '@/services/go/ermcp/account/interface';
+import { _closeModal } from '@/common/setup/modal/modal';
 import { geLoginID_number } from '@/services/bus/login';
+import { ErmcpLoginUserEx, ErmcpTaAccount, ErmcpTaAccountEx } from '@/services/go/ermcp/account/interface';
+import { taAccountOperateReq } from '@/services/proto/accountinfo';
+import { TaaccountOperateReq } from '@/services/proto/accountinfo/interface';
+import { Modal } from 'ant-design-vue';
+import { defineComponent, PropType, ref } from 'vue';
 import Detail from '../detail-commom-futures/index.vue';
 export default defineComponent({
     name: 'account_info_futures_btn_child_cancel',
@@ -25,12 +39,12 @@ export default defineComponent({
     components: { Detail },
     props: {
         selectedData: {
-            type: Object as PropType<ErmcpTaAccountEx>,
+            type: Object as PropType<ErmcpTaAccount>,
             default: {},
         },
-        secondeData: {
+        firstSelectedData: {
             default: {},
-            type: Object as PropType<ErmcpTaAccount>,
+            type: Object as PropType<ErmcpTaAccountEx>,
         },
         userList: {
             type: Array as PropType<ErmcpLoginUserEx[]>,
@@ -49,10 +63,10 @@ export default defineComponent({
                 cancelText: '取消',
                 onOk() {
                     let reqParam: TaaccountOperateReq = {
-                        accountid: props.secondeData.accountid, // uint64 期货账户ID
+                        accountid: props.selectedData.accountid, // uint64 期货账户ID
                         tradestatus: 7, // uint32 7注销
                         modifierid: Number(geLoginID_number()), // uint64 修改人
-                        areauserid: Number(props.secondeData.relateduserid), // uint64 机构用户ID
+                        areauserid: Number(props.selectedData.relateduserid), // uint64 机构用户ID
                     };
                     requestResultLoadingAndInfo(taAccountOperateReq, reqParam, loading, ['账户注销成功', '账户注销失败:']).then(() => {
                         cancel(true);

src/views/information/account_info/compoments/credit-futures/index.vue

@@ -1,54 +1,75 @@
 <template>
-    <!-- 授信-->
-    <a-modal class="add-custom custom-detail" title="授信" v-model:visible="visible" centered :maskClosable="false" @cancel="cancel" width="890px">
-        <template #footer>
-            <a-button key="submit" type="primary" :loading="loading" @click="cancel">取消 </a-button>
-            <a-button key="submit" type="primary" :loading="loading" @click="submit">授信 </a-button>
-        </template>
-        <a-form class="inlineForm">
-            <a-row :gutter="24">
-                <a-col :span="12">
-                    <a-form-item label="账户名称" name="userid">
-                        <span class="white">{{ secondeData.accountname }}</span>
-                    </a-form-item>
-                </a-col>
-                <a-col :span="12">
-                    <a-form-item label="资金账号" name="">
-                        <span class="white">{{ secondeData.accountid }}</span>
-                    </a-form-item>
-                </a-col>
-                <a-col :span="12">
-                    <a-form-item label="授信总额" name="">
-                        <span class="white"> {{ mortgagecredit }}</span>
-                    </a-form-item>
-                </a-col>
-                <a-col :span="12">
-                    <a-form-item label="子账户当前余额" name="">
-                        <span class="white">{{ currentbalance }}</span>
-                    </a-form-item>
-                </a-col>
-                <a-col :span="12">
-                    <a-form-item label="授信金额" class="relative" name="">
-                        <a-input class="dialogInput" style="width: 200px" v-model:value="money" placeholder="请输入授信金额"></a-input>
-                        <div class="tip">正数为增加，负数为减少</div>
-                    </a-form-item>
-                </a-col>
-            </a-row>
-        </a-form>
-    </a-modal>
+  <!-- 授信-->
+  <a-modal class="add-custom custom-detail"
+           title="授信"
+           v-model:visible="visible"
+           centered
+           :maskClosable="false"
+           @cancel="cancel"
+           width="890px">
+    <template #footer>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="cancel">取消 </a-button>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="submit">授信 </a-button>
+    </template>
+    <a-form class="inlineForm">
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <a-form-item label="账户名称"
+                       name="userid">
+            <span class="white">{{ selectedData.accountname }}</span>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="资金账号"
+                       name="">
+            <span class="white">{{ selectedData.accountid }}</span>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="授信总额"
+                       name="">
+            <span class="white"> {{ mortgagecredit }}</span>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="子账户当前余额"
+                       name="">
+            <span class="white">{{ currentbalance }}</span>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="授信金额"
+                       class="relative"
+                       name="">
+            <a-input class="dialogInput"
+                     style="width: 200px"
+                     v-model:value="money"
+                     placeholder="请输入授信金额"></a-input>
+            <div class="tip">正数为增加，负数为减少</div>
+          </a-form-item>
+        </a-col>
+      </a-row>
+    </a-form>
+  </a-modal>
 </template>
 
 <script lang="ts">
-import { defineComponent, PropType, ref, toRaw, watchEffect } from 'vue';
-import { _closeModal } from '@/common/setup/modal/modal';
-import { ErmcpLoginUser, ErmcpTaAccount, ErmcpTaAccountEx } from '@/services/go/ermcp/account/interface';
-import { message, Modal } from 'ant-design-vue';
 import { requestResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
-import { LoginaccountOperateReq, TaaccountTransfersxmoneyReq } from '@/services/proto/accountinfo/interface';
-import { loginAccountOperate, taAccountTransfersXMoneyReq } from '@/services/proto/accountinfo';
+import { _closeModal } from '@/common/setup/modal/modal';
 import { geLoginID_number } from '@/services/bus/login';
-import { QueryAccMgrTaAccountInfo } from '@/services/go/ermcp/account';
 import { getUserId } from '@/services/bus/user';
+import { QueryAccMgrTaAccountInfo } from '@/services/go/ermcp/account';
+import { ErmcpTaAccount, ErmcpTaAccountEx } from '@/services/go/ermcp/account/interface';
+import { taAccountTransfersXMoneyReq } from '@/services/proto/accountinfo';
+import { TaaccountTransfersxmoneyReq } from '@/services/proto/accountinfo/interface';
+import { message, Modal } from 'ant-design-vue';
+import { defineComponent, PropType, ref, toRaw, watchEffect } from 'vue';
 
 export default defineComponent({
     name: 'account_info_futures_btn_child_credit',
@@ -59,9 +80,9 @@ export default defineComponent({
             type: Object as PropType<ErmcpTaAccount>,
             default: {},
         },
-        secondeData: {
+        firstSelectedData: {
             default: {},
-            type: Object as PropType<ErmcpTaAccount>,
+            type: Object as PropType<ErmcpTaAccountEx>,
         },
     },
     setup(props, context) {
@@ -73,10 +94,10 @@ export default defineComponent({
         const mortgagecredit = ref<number>(0);
         const money = ref<number | null>(null);
         watchEffect(() => {
-            if (visible.value && props.secondeData?.accountid) {
+            if (visible.value && props.selectedData?.accountid) {
                 const param = {
                     userid: getUserId(),
-                    accountid: props.secondeData.accountid,
+                    accountid: props.selectedData.accountid,
                 };
                 QueryAccMgrTaAccountInfo(param).then((res) => {
                     console.log(res);
@@ -97,10 +118,10 @@ export default defineComponent({
                     const param = toRaw(money);
                     if (param) {
                         let reqParam: TaaccountTransfersxmoneyReq = {
-                            accountid: props.secondeData.accountid, // uint64 期货账户ID
+                            accountid: props.selectedData.accountid, // uint64 期货账户ID
                             sxmoney: Number(param.value as number), // double 授信金额正为加负为减
                             modifierid: Number(geLoginID_number()), // uint64 修改人
-                            areauserid: Number(props.secondeData.relateduserid), // uint64 机构用户ID
+                            areauserid: Number(props.selectedData.relateduserid), // uint64 机构用户ID
                         };
                         requestResultLoadingAndInfo(taAccountTransfersXMoneyReq, reqParam, loading, ['账户授信成功', '账户授信失败:']).then(() => {
                             cancel(true);

src/views/information/account_info/compoments/detail-commom-futures/index.vue

@@ -16,12 +16,12 @@ export default defineComponent({
     },
     props: {
         selectedData: {
-            type: Object as PropType<ErmcpTaAccountEx>,
+            type: Object as PropType<ErmcpTaAccount>,
             default: {},
         },
-        secondeData: {
+        firstSelectedData: {
             default: {},
-            type: Object as PropType<ErmcpTaAccount>,
+            type: Object as PropType<ErmcpTaAccountEx>,
         },
         userList: {
             type: Array as PropType<ErmcpLoginUserEx[]>,
@@ -31,27 +31,27 @@ export default defineComponent({
     setup(props) {
         const { desList, getDesList } = handleDesList();
         function getRoleName() {
-            const item = props.userList.find((e) => e.roleid === props.secondeData?.relateduserid);
+            const item = props.userList.find((e) => e.roleid === props.selectedData?.relateduserid);
             return item ? item.rolename : '--';
         }
         watchEffect(() => {
             if (props.selectedData) {
-                const { secondeData, selectedData } = props;
+                const { firstSelectedData, selectedData } = props;
                 const data = props.selectedData;
                 let list = [];
                 if (isPingAnOem()) {
                     list = [
-                        { label: '所属期货账户', value: selectedData.mainAcc?.accountname },
-                        { label: '账户名称', value: secondeData.accountname },
-                        { label: '期货保证金', value: secondeData.trademargintmpname },
-                        { label: '期货手续费', value: secondeData.tradefeetmpname },
+                        { label: '所属期货账户', value: firstSelectedData.mainAcc?.accountname },
+                        { label: '账户名称', value: selectedData.accountname },
+                        { label: '期货保证金', value: selectedData.trademargintmpname },
+                        { label: '期货手续费', value: selectedData.tradefeetmpname },
                     ];
                 } else {
                     list = [
-                        { label: '所属期货账户', value: selectedData.mainAcc?.accountname },
-                        { label: '账户名称', value: secondeData.accountname },
-                        { label: '期货保证金', value: secondeData.trademargintmpname },
-                        { label: '期货手续费', value: secondeData.tradefeetmpname },
+                        { label: '所属期货账户', value: firstSelectedData.mainAcc?.accountname },
+                        { label: '账户名称', value: selectedData.accountname },
+                        { label: '期货保证金', value: selectedData.trademargintmpname },
+                        { label: '期货手续费', value: selectedData.tradefeetmpname },
                         { label: '指定交易用户', value: getRoleName() },
                     ];
                 }

src/views/information/account_info/compoments/detail-futures/index.vue

@@ -1,11 +1,20 @@
 <template>
-    <!-- 账号详情-->
-    <a-modal class="add-custom custom-detail" title="账号详情" v-model:visible="visible" centered @cancel="cancel" width="890px">
-        <template #footer>
-            <a-button key="submit" type="primary" @click="cancel">关闭</a-button>
-        </template>
-        <Detail :selectedData="selectedData" :userList="userList" :secondeData="secondeData" />
-    </a-modal>
+  <!-- 账号详情-->
+  <a-modal class="add-custom custom-detail"
+           title="账号详情"
+           v-model:visible="visible"
+           centered
+           @cancel="cancel"
+           width="890px">
+    <template #footer>
+      <a-button key="submit"
+                type="primary"
+                @click="cancel">关闭</a-button>
+    </template>
+    <Detail :selectedData="selectedData"
+            :userList="userList"
+            :firstSelectedData="firstSelectedData" />
+  </a-modal>
 </template>
 
 <script lang="ts">
@@ -20,12 +29,12 @@ export default defineComponent({
     components: { Detail },
     props: {
         selectedData: {
-            type: Object as PropType<ErmcpTaAccountEx>,
+            type: Object as PropType<ErmcpTaAccount>,
             default: {},
         },
-        secondeData: {
+        firstSelectedData: {
             default: {},
-            type: Object as PropType<ErmcpTaAccount>,
+            type: Object as PropType<ErmcpTaAccountEx >,
         },
         userList: {
             type: Array as PropType<ErmcpLoginUserEx[]>,

src/views/information/account_info/compoments/modify-futures-son/index.vue

@@ -1,48 +1,83 @@
 <template>
-    <!-- 修改期货子账户 -->
-    <a-modal class="commonModal add-futures-son" title="修改期货子账户" v-model:visible="visible" @cancel="cancel" centered :maskClosable="false" width="890px">
-        <template #footer>
-            <a-button key="cancel" type="primary" :loading="loading" @click="cancel">取消</a-button>
-            <a-button key="submit" type="primary" :loading="loading" @click="submit">修改</a-button>
-        </template>
-        <a-form class="inlineForm" ref="formRef" :model="formState" :rules="rules">
-            <a-row :gutter="24">
-                <a-col :span="12">
-                    <a-form-item label="所属期货账户" name="userinfotype">
-                        <span class="white">{{ selectedData.mainAcc.accountname }}/{{ selectedData.mainAcc.hedgeaccountcode }}</span>
-                    </a-form-item>
-                </a-col>
-                <a-col :span="12">
-                    <a-form-item label="账户名称" name="accountname">
-                        <a-input class="dialogInput" v-model:value="formState.accountname" style="width: 200px" placeholder="请输入账户名称" />
-                    </a-form-item>
-                </a-col>
-                <a-col :span="12">
-                    <a-form-item label="期货保证金" name="trademargintmpid">
-                        <a-select class="inlineFormSelect" style="width: 200px" v-model:value="formState.trademargintmpid" placeholder="请选择保证金模板">
-                            <a-select-option v-for="item in marginList" :key="item.tradeconfigtmpid" :value="item.tradeconfigtmpid">
-                                {{ item.tradeconfigtmpname }}
-                            </a-select-option>
-                        </a-select>
-                    </a-form-item>
-                </a-col>
-                <a-col :span="12">
-                    <a-form-item label="期货手续费" name="tradefeetmpid">
-                        <a-select class="inlineFormSelect" style="width: 200px" v-model:value="formState.tradefeetmpid" placeholder="请选择期货手续费">
-                            <a-select-option v-for="item in feeList" :key="item.tradeconfigtmpid" :value="item.tradeconfigtmpid">
-                                {{ item.tradeconfigtmpname }}
-                            </a-select-option>
-                        </a-select>
-                    </a-form-item>
-                </a-col>
-                <a-col :span="24" v-if="!isPingAnOem()">
-                    <a-form-item label="指定交易用户" name="traderUserId">
-                        <span class="white">{{ getRoleName() }}</span>
-                    </a-form-item>
-                </a-col>
-            </a-row>
-        </a-form>
-    </a-modal>
+  <!-- 修改期货子账户 -->
+  <a-modal class="commonModal add-futures-son"
+           title="修改期货子账户"
+           v-model:visible="visible"
+           @cancel="cancel"
+           centered
+           :maskClosable="false"
+           width="890px">
+    <template #footer>
+      <a-button key="cancel"
+                type="primary"
+                :loading="loading"
+                @click="cancel">取消</a-button>
+      <a-button key="submit"
+                type="primary"
+                :loading="loading"
+                @click="submit">修改</a-button>
+    </template>
+    <a-form class="inlineForm"
+            ref="formRef"
+            :model="formState"
+            :rules="rules">
+      <a-row :gutter="24">
+        <a-col :span="12">
+          <a-form-item label="所属期货账户"
+                       name="userinfotype">
+            <span
+                  class="white">{{ firstSelectedData.mainAcc.accountname }}/{{ firstSelectedData.mainAcc.hedgeaccountcode }}</span>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="账户名称"
+                       name="accountname">
+            <a-input class="dialogInput"
+                     v-model:value="formState.accountname"
+                     style="width: 200px"
+                     placeholder="请输入账户名称" />
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="期货保证金"
+                       name="trademargintmpid">
+            <a-select class="inlineFormSelect"
+                      style="width: 200px"
+                      v-model:value="formState.trademargintmpid"
+                      placeholder="请选择保证金模板">
+              <a-select-option v-for="item in marginList"
+                               :key="item.tradeconfigtmpid"
+                               :value="item.tradeconfigtmpid">
+                {{ item.tradeconfigtmpname }}
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+        <a-col :span="12">
+          <a-form-item label="期货手续费"
+                       name="tradefeetmpid">
+            <a-select class="inlineFormSelect"
+                      style="width: 200px"
+                      v-model:value="formState.tradefeetmpid"
+                      placeholder="请选择期货手续费">
+              <a-select-option v-for="item in feeList"
+                               :key="item.tradeconfigtmpid"
+                               :value="item.tradeconfigtmpid">
+                {{ item.tradeconfigtmpname }}
+              </a-select-option>
+            </a-select>
+          </a-form-item>
+        </a-col>
+        <a-col :span="24"
+               v-if="!isPingAnOem()">
+          <a-form-item label="指定交易用户"
+                       name="traderUserId">
+            <span class="white">{{ getRoleName() }}</span>
+          </a-form-item>
+        </a-col>
+      </a-row>
+    </a-form>
+  </a-modal>
 </template>
 
 <script lang="ts">
@@ -68,11 +103,11 @@ export default defineComponent({
     props: {
         selectedData: {
             default: {},
-            type: Object as PropType<ErmcpTaAccountEx>,
+            type: Object as PropType<ErmcpTaAccount>,
         },
-        secondeData: {
+        firstSelectedData: {
             default: {},
-            type: Object as PropType<ErmcpTaAccount>,
+            type: Object as PropType<ErmcpTaAccountEx>,
         },
         userList: {
             type: Array as PropType<ErmcpLoginUserEx[]>,
@@ -96,20 +131,19 @@ export default defineComponent({
         watchEffect(() => {
             if (visible.value) {
                 // 默认第一个 服务只放回一个，这里是个坑
-                const { secondeData } = props;
-                formState.traderUserId = secondeData.relateduserid;
-                mergeTwoObj(formState, secondeData);
+                formState.traderUserId = props.selectedData.relateduserid;
+                mergeTwoObj(formState, props.selectedData);
             }
         });
         function getRoleName() {
-            const item = props.userList.find((e) => e.roleid === props.secondeData.relateduserid);
+            const item = props.userList.find((e) => e.roleid === props.selectedData.relateduserid);
             return item ? item.rolename : '--';
         }
         // 增加accountid 就是修改
         function submit() {
             validateAction<FormState>(formRef, formState).then((res) => {
                 let reqParam: HedgeOutMainConfigReq = {
-                    accountid: props.secondeData.accountid,
+                    accountid: props.selectedData.accountid,
                     marketid: 15101, // uint64 内部市场ID（HedgeOutMainConfig）
                     limitnumber: 0, // uint64 挂单笔数限额默认0（HedgeOutMainConfig）
                     status: 1, // int32 渠道账号状态 1-可买入可卖出 2-可卖出不可买入默认1（HedgeOutMainConfig）
@@ -118,9 +152,9 @@ export default defineComponent({
                     currencyid: 1, // int32 货币ID默认为1（Taaccount）
                     outthreshold: 0, // double 出金阈值默认为0（Taaccount）
                     ismain: 0, // int32 是否母账号 0:不是母账户 1:是母账户（Taaccount）
-                    parentaccountid: props.selectedData.mainAcc.accountid, // uint64 所属根账号（Taaccount）
+                    parentaccountid: props.firstSelectedData.mainAcc.accountid, // uint64 所属根账号（Taaccount）
                     relateduserid: res.traderUserId, // uint64 关联用户（Taaccount）
-                    fromaccountid: props.selectedData.mainAcc.accountid, // uint64 所属上级账户（Taaccount）
+                    fromaccountid: props.firstSelectedData.mainAcc.accountid, // uint64 所属上级账户（Taaccount）
                     trademargintmpid: res.trademargintmpid, // uint64 保证金模板id（TAACCOUNTCONFIG）
                     tradefeetmpid: res.tradefeetmpid, // uint64 手续费模板ID（TAACCOUNTCONFIG）
                     maxsubaccouts: 0, // uint64 最大子账户数[最大99999][外部母账户用 默认0（TAACCOUNTCONFIG）

src/views/information/account_info/list/account_info_futures/index.vue

@@ -1,75 +1,95 @@
 <template>
-    <div style="background: red; color: #fff; padding: 5px 0">待修改</div>
-    <!-- 期货账户 -->
-    <div class="account_info_futures account_info_container" :loading="loading">
-        <filterCustomTable @search="search"></filterCustomTable>
-        <div class="tltLeft">
-            <span class="blue">
-                <svg class="icon svg-icon" aria-hidden="true">
-                    <use xlink:href="#icon-shuzhuangtu" />
-                </svg>
-                {{ getUserName() }}
-            </span>
-            <mtp-table-button :buttons="firstBtn" @click="openComponent" />
-        </div>
-        <div class="a-collapse-container">
-            <a-collapse class="spotCollapse" v-for="(item, i) in tableList" :key="i + '11'" :bordered="false">
-                <template #expandIcon="props">
-                    <svg class="icon svg-icon" aria-hidden="true" v-if="props.isActive == 0">
-                        <use xlink:href="#icon-shouqi1" />
-                    </svg>
-                    <svg class="icon svg-icon" aria-hidden="true" v-else>
-                        <use xlink:href="#icon-shouqi2" />
-                    </svg>
-                </template>
-                <a-collapse-panel>
-                    <template #header>
-                        <a-row class="headRow">
-                            <a-col :span="12"> {{ item.mainAcc.accountname }} {{ '-' + item.mainAcc.hedgeaccountcode }} ({{ item.subacclist.length }}）{{ item.mainAcc.fcname }} </a-col>
-                            <a-col :span="12">
-                                <!-- <BtnList :btnList="secondBtn" @onClick="secondeClick(item)" /> -->
-                                <mtp-table-button :buttons="secondBtn" :record="item" @click="openComponent" />
-                            </a-col>
-                        </a-row>
-                    </template>
-                    <a-collapse class="futureCollapse" accordion :bordered="false">
-                        <a-collapse-panel :show-arrow="false" v-for="(sub, i) in item.subacclist" :key="i + '11'">
-                            <template #header>
-                                <a-row class="contRow">
-                                    <a-col :span="12">{{ sub.accountname }}-{{ sub.accountid }}</a-col>
-                                    <a-col :span="12">{{ getTaAccountStatus(sub.tradestatus) }}</a-col>
-                                </a-row>
-                            </template>
-                            <!-- <BtnList :btnList="getBtnList(sub.tradestatus)" @onClick="thirdClick(item, sub)" /> -->
-                            <mtp-table-button :buttons="thirdBtn" :record="sub" @click="openComponent" />
-                        </a-collapse-panel>
-                    </a-collapse>
-                </a-collapse-panel>
-            </a-collapse>
-        </div>
-        <!-- <Add @refresh="queryTable" />
-        <AddChild :selectedData="firstData" :userList="userList" :marginList="marginList" :feeList="feeList" @updateTrader="queryUserList" @refresh="queryTable" />
-        <Modify :selectedData="firstData" @refresh="queryTable" />
-        <ModifyChild @refresh="queryTable" :userList="userList" :marginList="marginList" :feeList="feeList" :secondeData="secondeData" :selectedData="firstData" />
-        <Detail :selectedData="firstData" :secondeData="secondeData" :userList="userList" :marginList="marginList" :feeList="feeList" />
-        <Cancel @refresh="queryTable" :userList="userList" :marginList="marginList" :feeList="feeList" :secondeData="secondeData" :selectedData="firstData" />
-        <Credit @refresh="queryTable" :selectedData="firstData" :secondeData="secondeData" /> -->
-        <component :is="componentId" v-if="componentId" :selectedData="firstData" :secondeData="secondeData" :userList="userList" :marginList="marginList" :feeList="feeList" @update="queryUserList" @cancel="closeComponent"></component>
+  <div style="background: red; color: #fff; padding: 5px 0">待修改</div>
+  <!-- 期货账户 -->
+  <div class="account_info_futures account_info_container"
+       :loading="loading">
+    <filterCustomTable @search="search"></filterCustomTable>
+    <div class="tltLeft">
+      <span class="blue">
+        <svg class="icon svg-icon"
+             aria-hidden="true">
+          <use xlink:href="#icon-shuzhuangtu" />
+        </svg>
+        {{ getUserName() }}
+      </span>
+      <mtp-table-button :buttons="firstBtn"
+                        @click="openComponent" />
     </div>
+    <div class="a-collapse-container">
+      <a-collapse class="spotCollapse"
+                  v-for="(item, i) in tableList"
+                  :key="i + '11'"
+                  :bordered="false">
+        <template #expandIcon="props">
+          <svg class="icon svg-icon"
+               aria-hidden="true"
+               v-if="props.isActive == 0">
+            <use xlink:href="#icon-shouqi1" />
+          </svg>
+          <svg class="icon svg-icon"
+               aria-hidden="true"
+               v-else>
+            <use xlink:href="#icon-shouqi2" />
+          </svg>
+        </template>
+        <a-collapse-panel>
+          <template #header>
+            <a-row class="headRow">
+              <a-col :span="12"> {{ item.mainAcc.accountname }}
+                {{ '-' + item.mainAcc.hedgeaccountcode }}
+                ({{ item.subacclist.length }}）{{ item.mainAcc.fcname }} </a-col>
+              <a-col :span="12">
+                <mtp-table-button :buttons="secondBtn"
+                                  :record="item"
+                                  @click="openComponent" />
+              </a-col>
+            </a-row>
+          </template>
+          <a-collapse class="futureCollapse"
+                      accordion
+                      :bordered="false">
+            <a-collapse-panel :show-arrow="false"
+                              v-for="(sub, i) in item.subacclist"
+                              :key="i + '11'">
+              <template #header>
+                <a-row class="contRow">
+                  <a-col :span="12">{{ sub.accountname }}-{{ sub.accountid }}</a-col>
+                  <a-col :span="12">{{ getTaAccountStatus(sub.tradestatus) }}</a-col>
+                </a-row>
+              </template>
+              <mtp-table-button :buttons="thirdBtn"
+                                :record="sub"
+                                @click="openSecondBtnAction" />
+            </a-collapse-panel>
+          </a-collapse>
+        </a-collapse-panel>
+      </a-collapse>
+    </div>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedData="selectedData"
+               :firstSelectedData="firstSelectedData"
+               :userList="userList"
+               :marginList="marginList"
+               :feeList="feeList"
+               @update="queryUserList"
+               @cancel="closeComponent"></component>
+  </div>
 </template>
 
 <script lang="ts">
+import { BtnListType } from '@/common/components/btnList/interface';
 import { defineAsyncComponent, defineComponent, MtpTableButton } from '@/common/export/commonTable';
 import { initData } from '@/common/methods';
+import { handleModalComponent } from '@/common/setup/asyncComponent';
+import { getTableButton } from '@/common/setup/table/button';
+import { handlerManagerList } from '@/common/setup/user';
+import { getUserName } from '@/services/bus/user';
+import { ErmcpTaAccount, ErmcpTaAccountEx } from '@/services/go/ermcp/account/interface';
 import filterCustomTable from '@/views/information/goods/components/filterTable/index.vue';
+import { ref, Ref } from 'vue';
 import { getTaAccountStatus } from '../setup';
 import { handleTradeTemplate, queryTableList } from './setup';
-import { getUserName } from '@/services/bus/user';
-import { ErmcpTaAccountEx } from '@/services/go/ermcp/account/interface';
-import { ref, Ref } from 'vue';
-import { handlerManagerList } from '@/common/setup/user';
-import { handleModalComponent } from '@/common/setup/asyncComponent';
-import { getTableButton } from '@/common/setup/table/button';
 
 export default defineComponent({
     name: 'account_info_futures',
@@ -100,15 +120,7 @@ export default defineComponent({
             queryUserList();
             queryTemplate();
         });
-        const firstData = ref<ErmcpTaAccountEx | null>(null);
-        const secondeData = ref<ErmcpTaAccountEx | null>(null);
-        function secondeClick(item: ErmcpTaAccountEx) {
-            firstData.value = item;
-        }
-        function thirdClick(item: ErmcpTaAccountEx, sub: ErmcpTaAccountEx) {
-            firstData.value = item;
-            secondeData.value = sub;
-        }
+
         function getBtnList(type: number) {
             if (type === 1) {
                 // 1:正常
@@ -121,18 +133,28 @@ export default defineComponent({
         }
 
         // 弹窗选中的数据
-        const selectedData = ref<ErmcpTaAccountEx>();
+        const selectedData = ref<ErmcpTaAccount>();
         // 控制异步组件
-        const { componentId, closeComponent, openComponent } = handleModalComponent<ErmcpTaAccountEx>(() => {}, selectedData as Ref<ErmcpTaAccountEx>);
+        const { componentId, closeComponent, openComponent } = handleModalComponent<ErmcpTaAccount>(() => {}, selectedData as Ref<ErmcpTaAccount>);
+        // 处理点击 二级按钮时候 选中的数据
+        // 一级 对应的选中数据
+        const firstSelectedData = ref<ErmcpTaAccountEx>();
+        // 二级按钮 打开，处理选中上一层数据
+        function openSecondBtnAction(item: BtnListType, second: ErmcpTaAccount) {
+            tableList.value.forEach((el) => {
+                el.subacclist.forEach((sub) => {
+                    if (second.userid === sub.userid) {
+                        firstSelectedData.value = el;
+                    }
+                });
+            });
+            openComponent(item, second);
+        }
 
         // 查询
         function search(value: any) {}
 
         return {
-            firstData,
-            secondeData,
-            secondeClick,
-            thirdClick,
             loading,
             search,
             tableList,
@@ -150,6 +172,9 @@ export default defineComponent({
             componentId,
             closeComponent,
             openComponent,
+            selectedData,
+            firstSelectedData,
+            openSecondBtnAction,
         };
     },
 });

src/views/information/account_info/list/account_info_manager/index.vue

@@ -1,53 +1,70 @@
 <template>
-    <div style="background: red; color: #fff; padding: 5px 0">待修改</div>
-    <!-- 管理账户 -->
-    <div class="account_info_manager account_info_container" :loading="loading">
-        <filterCustomTable @search="search"></filterCustomTable>
-        <div class="tltLeft">
-            <span class="blue">
-                <svg class="icon svg-icon" aria-hidden="true">
-                    <use xlink:href="#icon-shuzhuangtu"></use>
-                </svg>
-                {{ getUserName() }}
-            </span>
-            <mtp-table-button :buttons="firstBtn" @click="openComponent" />
-        </div>
-        <div class="a-collapse-container">
-            <a-collapse class="spotCollapse" v-for="(item, i) in tableList" :key="i + '11'" :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>
-                    <template #header>
-                        <a-row class="headRow">
-                            <a-col :span="12">{{ item.rolename }}({{ item.userlist.length }}）</a-col>
-                            <a-col :span="12">
-                                <!-- <BtnList :selectedData="item" :btnList="secondBtn" @onClick="openAction" /> -->
-                                <mtp-table-button :buttons="secondBtn" :record="item" @click="openComponent" />
-                            </a-col>
-                        </a-row>
-                    </template>
-                    <a-collapse class="busyCollapse" v-for="(sub, i) in item.userlist" :key="i + '11'" :bordered="false">
-                        <a-collapse-panel :show-arrow="false">
-                            <template #header>
-                                <a-row class="contRow">
-                                    <a-col :span="12">{{ sub.loginname }}-{{ sub.logincode }}</a-col>
-                                    <a-col :span="12">{{ getLoginStatusEnumItemName(sub.loginstatus) }}</a-col>
-                                </a-row>
-                            </template>
-                            <!-- <BtnList :btnList="sub.btnList" :selectedData="sub" @onClick="moreOptenAction" /> -->
-                            <mtp-table-button :buttons="thirdBtn" :record="sub" @click="openComponent" />
-                        </a-collapse-panel>
-                    </a-collapse>
-                </a-collapse-panel>
-            </a-collapse>
-        </div>
-        <!-- <Add @refresh="handleBtnAction" :selectedData="addModelData" :tableList="tableList" />
+  <div style="background: red; color: #fff; padding: 5px 0">待修改</div>
+  <!-- 管理账户 -->
+  <div class="account_info_manager account_info_container"
+       :loading="loading">
+    <filterCustomTable @search="search"></filterCustomTable>
+    <div class="tltLeft">
+      <span class="blue">
+        <svg class="icon svg-icon"
+             aria-hidden="true">
+          <use xlink:href="#icon-shuzhuangtu"></use>
+        </svg>
+        {{ getUserName() }}
+      </span>
+      <mtp-table-button :buttons="firstBtn"
+                        @click="openComponent" />
+    </div>
+    <div class="a-collapse-container">
+      <a-collapse class="spotCollapse"
+                  v-for="(item, i) in tableList"
+                  :key="i + '11'"
+                  :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>
+          <template #header>
+            <a-row class="headRow">
+              <a-col :span="12">{{ item.rolename }}({{ item.userlist.length }}）</a-col>
+              <a-col :span="12">
+                <!-- <BtnList :selectedData="item" :btnList="secondBtn" @onClick="openAction" /> -->
+                <mtp-table-button :buttons="secondBtn"
+                                  :record="item"
+                                  @click="openComponent" />
+              </a-col>
+            </a-row>
+          </template>
+          <a-collapse class="busyCollapse"
+                      v-for="(sub, i) in item.userlist"
+                      :key="i + '11'"
+                      :bordered="false">
+            <a-collapse-panel :show-arrow="false">
+              <template #header>
+                <a-row class="contRow">
+                  <a-col :span="12">{{ sub.loginname }}-{{ sub.logincode }}</a-col>
+                  <a-col :span="12">{{ getLoginStatusEnumItemName(sub.loginstatus) }}</a-col>
+                </a-row>
+              </template>
+              <!-- <BtnList :btnList="sub.btnList" :selectedData="sub" @onClick="moreOptenAction" /> -->
+              <mtp-table-button :buttons="thirdBtn"
+                                :record="sub"
+                                @click="openSecondBtnAction" />
+            </a-collapse-panel>
+          </a-collapse>
+        </a-collapse-panel>
+      </a-collapse>
+    </div>
+    <!-- <Add @refresh="handleBtnAction" :selectedData="addModelData" :tableList="tableList" />
         <Modify :tableList="tableList" @refresh="handleBtnAction" :selectedData="moreModelData" />
         <Cancel @refresh="handleBtnAction" :selectedData="moreModelData" />
         <Locked @refresh="handleBtnAction" :selectedData="moreModelData" />
@@ -56,8 +73,12 @@
         <Detail :selectedData="moreModelData" />
         <AddPermission @refresh="handleBtnAction" />
         <Permission /> -->
-        <component :is="componentId" v-if="componentId" :tableList="tableList" :selectedData="selectedData" @cancel="closeComponent"></component>
-    </div>
+    <component :is="componentId"
+               v-if="componentId"
+               :tableList="tableList"
+               :selectedData="selectedData"
+               @cancel="closeComponent"></component>
+  </div>
 </template>
 
 <script lang="ts">
@@ -65,7 +86,7 @@ import { defineAsyncComponent, defineComponent, MtpTableButton } from '@/common/
 import { initData } from '@/common/methods';
 import filterCustomTable from '@/views/information/goods/components/filterTable/index.vue';
 import { getLoginStatusEnumItemName } from '@/common/constants/enumsName';
-import { getAccountStatus, handleModalData, handleTableList, useTaAccount } from '../setup';
+import { getAccountStatus, handleModalData, handleTableList, useSelectedData, useTaAccount } from '../setup';
 import { getUserName } from '@/services/bus/user';
 import { ErmcpLoginUser, ErmcpLoginUserEx } from '@/services/go/ermcp/account/interface';
 import { handlerManagerList } from '@/common/setup/user';
@@ -98,9 +119,9 @@ export default defineComponent({
         const thirdBtn = getTableButton(['account_manager_child_modify', 'account_manager_child_reset', 'account_manager_child_locked', 'account_manager_child_unlocked', 'account_trade_child_cancel', 'detail']);
 
         // 新增弹窗
-        const { selectedData: addModelData, openAction } = handleModalData<ErmcpLoginUserEx>();
+        // const { selectedData: addModelData, openAction } = handleModalData<ErmcpLoginUserEx>();
         // 修改 重置密码、详情等弹窗
-        const { selectedData: moreModelData, openAction: moreOptenAction } = handleModalData<ErmcpLoginUser>();
+        // const { selectedData: moreModelData, openAction: moreOptenAction } = handleModalData<ErmcpLoginUser>();
 
         // 处理根据状态显示对应按钮
         function handleBtnAction() {
@@ -112,6 +133,9 @@ export default defineComponent({
         // 控制异步组件
         const { componentId, closeComponent, openComponent } = handleModalComponent<ErmcpLoginUser>(handleBtnAction, selectedData as Ref<ErmcpLoginUser>);
 
+        // 处理点击 二级按钮时候 选中的数据
+        const { firstSelectedData, openSecondBtnAction } = useSelectedData(tableList, openComponent);
+
         // 期货账户
         const { updateTaAccount } = useTaAccount();
         initData(() => {
@@ -132,14 +156,17 @@ export default defineComponent({
             getAccountStatus,
             getUserName,
             getLoginStatusEnumItemName,
-            addModelData,
-            openAction,
-            moreModelData,
-            moreOptenAction,
+            // addModelData,
+            // openAction,
+            // moreModelData,
+            // moreOptenAction,
             handleBtnAction,
             componentId,
             closeComponent,
             openComponent,
+            firstSelectedData,
+            openSecondBtnAction,
+            selectedData,
         };
     },
 });

src/views/information/account_info/list/account_info_trade/index.vue

@@ -1,58 +1,81 @@
 <template>
-    <!-- 交易账户 -->
-    <div class="account_info_trade account_info_container" :loading="loading">
-        <filterCustomTable @search="search"></filterCustomTable>
-        <div class="tltLeft">
-            <span class="blue">
-                <svg class="icon svg-icon" aria-hidden="true">
-                    <use xlink:href="#icon-shuzhuangtu"></use>
-                </svg>
-                {{ getUserName() }}
-            </span>
-            <mtp-table-button :buttons="firstBtn" @click="openComponent" />
-        </div>
-        <div class="a-collapse-container">
-            <a-collapse class="spotCollapse" v-for="(item, i) in tableList" :key="i + '11'" :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>
-                    <template #header>
-                        <a-row class="headRow">
-                            <a-col :span="12"> {{ item.rolename }}({{ item.userlist.length }}) </a-col>
-                            <a-col :span="12">
-                                <mtp-table-button :buttons="secondBtn" :record="item" @click="openComponent" />
-                            </a-col>
-                        </a-row>
-                    </template>
-                    <a-collapse class="busyCollapse" v-for="(sub, i) in item.userlist" :key="i + '11'" :bordered="false">
-                        <a-collapse-panel :show-arrow="false">
-                            <template #header>
-                                <a-row class="contRow">
-                                    <a-col :span="12">{{ sub.loginname }}-{{ sub.logincode }}</a-col>
-                                    <a-col :span="12">{{ getRoleTypeName(sub.loginstatus) }}</a-col>
-                                </a-row>
-                            </template>
-                            <mtp-table-button :buttons="thirdBtn" :record="sub" @click="openSecondBtnAction" />
-                        </a-collapse-panel>
-                    </a-collapse>
-                </a-collapse-panel>
-            </a-collapse>
-        </div>
-        <component :is="componentId" v-if="componentId" :accountList="accountList" :tableList="tableList" :firstBtnData="firstSelectedData" :selectedData="selectedData" @cancel="closeComponent"></component>
+  <!-- 交易账户 -->
+  <div class="account_info_trade account_info_container"
+       :loading="loading">
+    <filterCustomTable @search="search"></filterCustomTable>
+    <div class="tltLeft">
+      <span class="blue">
+        <svg class="icon svg-icon"
+             aria-hidden="true">
+          <use xlink:href="#icon-shuzhuangtu"></use>
+        </svg>
+        {{ getUserName() }}
+      </span>
+      <mtp-table-button :buttons="firstBtn"
+                        @click="openComponent" />
     </div>
+    <div class="a-collapse-container">
+      <a-collapse class="spotCollapse"
+                  v-for="(item, i) in tableList"
+                  :key="i + '11'"
+                  :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>
+          <template #header>
+            <a-row class="headRow">
+              <a-col :span="12"> {{ item.rolename }}({{ item.userlist.length }}) </a-col>
+              <a-col :span="12">
+                <mtp-table-button :buttons="secondBtn"
+                                  :record="item"
+                                  @click="openComponent" />
+              </a-col>
+            </a-row>
+          </template>
+          <a-collapse class="busyCollapse"
+                      v-for="(sub, i) in item.userlist"
+                      :key="i + '11'"
+                      :bordered="false">
+            <a-collapse-panel :show-arrow="false">
+              <template #header>
+                <a-row class="contRow">
+                  <a-col :span="12">{{ sub.loginname }}-{{ sub.logincode }}</a-col>
+                  <a-col :span="12">{{ getRoleTypeName(sub.loginstatus) }}</a-col>
+                </a-row>
+              </template>
+              <mtp-table-button :buttons="thirdBtn"
+                                :record="sub"
+                                @click="openSecondBtnAction" />
+            </a-collapse-panel>
+          </a-collapse>
+        </a-collapse-panel>
+      </a-collapse>
+    </div>
+    <component :is="componentId"
+               v-if="componentId"
+               :accountList="accountList"
+               :tableList="tableList"
+               :firstBtnData="firstSelectedData"
+               :selectedData="selectedData"
+               @cancel="closeComponent"></component>
+  </div>
 </template>
 
 <script lang="ts">
 import { initData } from '@/common/methods';
 import { defineAsyncComponent, defineComponent, MtpTableButton } from '@/common/export/commonTable';
 import filterCustomTable from '@/views/information/goods/components/filterTable/index.vue';
-import { getRoleTypeName } from '../setup';
+import { getRoleTypeName, useSelectedData } from '../setup';
 import { getUserName } from '@/services/bus/user';
 import { handleTableList } from '../setup';
 import { ErmcpLoginUser, ErmcpLoginUserEx, ErmcpTaAccount, ErmcpTaAccountEx } from '@/services/go/ermcp/account/interface';
@@ -99,19 +122,9 @@ export default defineComponent({
         const selectedData = ref<ErmcpLoginUser>();
         // 控制异步组件
         const { componentId, closeComponent, openComponent } = handleModalComponent<ErmcpLoginUser>(handleBtnAction, selectedData as Ref<ErmcpLoginUser>);
-        // 一级 对应的选中数据
-        const firstSelectedData = ref<ErmcpLoginUserEx>();
-        // 二级按钮 打开，处理选中上一层数据
-        function openSecondBtnAction(item: BtnListType, second: ErmcpLoginUser) {
-            tableList.value.forEach((el) => {
-                el.userlist.forEach((sub) => {
-                    if (second.userid === sub.userid) {
-                        firstSelectedData.value = el;
-                    }
-                });
-            });
-            openComponent(item, second);
-        }
+
+        // 处理点击 二级按钮时候 选中的数据
+        const { firstSelectedData, openSecondBtnAction } = useSelectedData(tableList, openComponent);
 
         initData(() => {
             handleBtnAction();

src/views/information/account_info/list/setup.ts

@@ -2,7 +2,7 @@ import { BtnListType } from '@/common/components/btnList/interface';
 import { initData } from '@/common/methods';
 import { queryResultLoadingAndInfo } from '@/common/methods/request/resultInfo';
 import { QueryAccMgrTaaccount } from '@/services/go/ermcp/account';
-import { ErmcpLoginUserEx, ErmcpTaAccount, ErmcpTaAccountEx } from "@/services/go/ermcp/account/interface";
+import { ErmcpLoginUser, ErmcpLoginUserEx, ErmcpTaAccount, ErmcpTaAccountEx } from "@/services/go/ermcp/account/interface";
 import { reactive, ref, Ref } from "vue";
 
 /**
@@ -190,4 +190,23 @@ export function useTaAccount() {
         return accountList.value.filter((e) => e.relateduserid === id);
     }
     return { accountList, filerTaAccount, updateTaAccount }
+}
+
+
+// 处理 点击二级 按钮时候，一级 选中 的数据
+export function useSelectedData(tableList: Ref<ErmcpLoginUserEx[]>, openComponent: Function) {
+    // 一级 对应的选中数据
+    const firstSelectedData = ref<ErmcpLoginUserEx>();
+    // 二级按钮 打开，处理选中上一层数据
+    function openSecondBtnAction(item: BtnListType, second: ErmcpLoginUser) {
+        tableList.value.forEach((el) => {
+            el.userlist.forEach((sub) => {
+                if (second.userid === sub.userid) {
+                    firstSelectedData.value = el;
+                }
+            });
+        });
+        openComponent(item, second);
+    }
+    return { firstSelectedData, openSecondBtnAction }
 }