update

src/layout/components/bottom.vue

@@ -1,17 +1,19 @@
 <template>
-    <section
-        :class="['layout-bottom', isShowBottom ? 'layout-bottom-all' : 'layout-bottom-hidden']"
-    >
-        <CapitalInfo class="capital-info-container"></CapitalInfo>
-        <main>
-            <firstMenu :list="orderList" :value="'title'" @selectMenu="selectMenu">
-                <div class="conditionIcon icon iconfont icon-shouqi" @click="handleShowBottom"></div>
-            </firstMenu>
-            <div v-show="isShowBottom">
-                <component :is="componentId" v-if="componentId"></component>
-            </div>
-        </main>
-    </section>
+  <section :class="['layout-bottom', isShowBottom ? 'layout-bottom-all' : 'layout-bottom-hidden']">
+    <CapitalInfo class="capital-info-container"></CapitalInfo>
+    <main>
+      <firstMenu :list="orderList"
+                 :value="'title'"
+                 @selectMenu="selectMenu">
+        <div class="conditionIcon icon iconfont icon-shouqi"
+             @click="handleShowBottom"></div>
+      </firstMenu>
+      <div v-show="isShowBottom">
+        <component :is="componentId"
+                   v-if="componentId"></component>
+      </div>
+    </main>
+  </section>
 </template>
 <script lang="ts">
 import { defineAsyncComponent, defineComponent, ref } from 'vue';
@@ -35,6 +37,8 @@ export default defineComponent({
         [enumOrderComponents.funding_information]: defineAsyncComponent(() => import('@/views/order/funding_information/index.vue')),
         [enumOrderComponents.performance_information]: defineAsyncComponent(() => import('@/views/order/performance_information/index.vue')),
         [enumOrderComponents.pre_sale_warehouse_receipt]: defineAsyncComponent(() => import('@/views/order/pre_sale_warehouse_receipt/index.vue')),
+        [enumOrderComponents.financing_manager]: defineAsyncComponent(() => import('@/views/order/financing_manager/index.vue')),
+        [enumOrderComponents.commodity_contract]: defineAsyncComponent(() => import('@/views/order/commodity_contract/index.vue')),
     },
     setup() {
         const { orderList, componentId } = handleOrderData();

src/views/order/commodity_contract/components/commodity_contract_commission/index.vue

@@ -0,0 +1,88 @@
+<template>
+  <!-- 委托 -->
+  <section>
+    <a-table :columns="columns"
+             class="srcollYTable expandLeftTable"
+             :scroll="{ x: '100%', y: '227px' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             :expandIcon="expandIcon"
+             :expandIconAsCell="false"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template v-if="btnList.length"
+                #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList"
+                 :record="record"
+                 class="btn-list-sticky"
+                 @click="openComponent" />
+      </template>
+      <template #createtime="{ record }">
+        <a>{{ formatTime(record.createtime) }}</a>
+      </template>
+    </a-table>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
+  </section>
+</template>
+
+<script lang="ts">
+import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import { queryTableList, BtnList, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
+import { QueryPerformancePlan, queryWrTradeDetail } from '@/services/go/wrtrade';
+import { QueryPerformancePlanReq, WrPerformancePlan } from '@/services/go/wrtrade/interface';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { queryAmountLog } from '@/services/go/TaAccount';
+import { QueryAmountLogReq } from '@/services/go/TaAccount/interface';
+import { getSelectedAccountId } from '@/services/bus/account';
+import { getOperateTypeEnumItemName, getOperateTypeName } from '@/common/constants/enumsName';
+import { formatTime } from '@/common/methods';
+import Bus from '@/utils/eventBus/index';
+import { expandIcon } from '@/common/setup/table/clolumn';
+
+export default defineComponent({
+    name: enumOrderComponents.commodity_contract_commission,
+    components: {
+        BtnList,
+    },
+    setup() {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<WrPerformancePlan>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryAmountLogReq = {
+                accountID: getSelectedAccountId().toString(),
+            };
+
+            queryTable(queryAmountLog, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: queryTableAction,
+            tableName: 'table_pcweb_spot_trade_bottom_funding_info_log',
+            recordList: getRecordItemTab(),
+        };
+        // 资金变化，重新加载数据
+        Bus.$on('moneyChangedNtf_UI', () => {
+            queryTableAction();
+        });
+        return {
+            ...handleComposeOrderTable<WrPerformancePlan>(param),
+            loading,
+            tableList,
+            formatTime,
+            expandIcon,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/order/commodity_contract/components/commodity_contract_make_deal/index.vue

@@ -0,0 +1,88 @@
+<template>
+  <!-- 成交 -->
+  <section>
+    <a-table :columns="columns"
+             class="srcollYTable expandLeftTable"
+             :scroll="{ x: '100%', y: '227px' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             :expandIcon="expandIcon"
+             :expandIconAsCell="false"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template v-if="btnList.length"
+                #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList"
+                 :record="record"
+                 class="btn-list-sticky"
+                 @click="openComponent" />
+      </template>
+      <template #createtime="{ record }">
+        <a>{{ formatTime(record.createtime) }}</a>
+      </template>
+    </a-table>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
+  </section>
+</template>
+
+<script lang="ts">
+import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import { queryTableList, BtnList, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
+import { QueryPerformancePlan, queryWrTradeDetail } from '@/services/go/wrtrade';
+import { QueryPerformancePlanReq, WrPerformancePlan } from '@/services/go/wrtrade/interface';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { queryAmountLog } from '@/services/go/TaAccount';
+import { QueryAmountLogReq } from '@/services/go/TaAccount/interface';
+import { getSelectedAccountId } from '@/services/bus/account';
+import { getOperateTypeEnumItemName, getOperateTypeName } from '@/common/constants/enumsName';
+import { formatTime } from '@/common/methods';
+import Bus from '@/utils/eventBus/index';
+import { expandIcon } from '@/common/setup/table/clolumn';
+
+export default defineComponent({
+    name: enumOrderComponents.commodity_contract_make_deal,
+    components: {
+        BtnList,
+    },
+    setup() {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<WrPerformancePlan>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryAmountLogReq = {
+                accountID: getSelectedAccountId().toString(),
+            };
+
+            queryTable(queryAmountLog, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: queryTableAction,
+            tableName: 'table_pcweb_spot_trade_bottom_funding_info_log',
+            recordList: getRecordItemTab(),
+        };
+        // 资金变化，重新加载数据
+        Bus.$on('moneyChangedNtf_UI', () => {
+            queryTableAction();
+        });
+        return {
+            ...handleComposeOrderTable<WrPerformancePlan>(param),
+            loading,
+            tableList,
+            formatTime,
+            expandIcon,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/order/commodity_contract/components/commodity_contract_settlement/index.vue

@@ -0,0 +1,88 @@
+<template>
+  <!-- 交收 -->
+  <section>
+    <a-table :columns="columns"
+             class="srcollYTable expandLeftTable"
+             :scroll="{ x: '100%', y: '227px' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             :expandIcon="expandIcon"
+             :expandIconAsCell="false"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template v-if="btnList.length"
+                #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList"
+                 :record="record"
+                 class="btn-list-sticky"
+                 @click="openComponent" />
+      </template>
+      <template #createtime="{ record }">
+        <a>{{ formatTime(record.createtime) }}</a>
+      </template>
+    </a-table>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
+  </section>
+</template>
+
+<script lang="ts">
+import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import { queryTableList, BtnList, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
+import { QueryPerformancePlan, queryWrTradeDetail } from '@/services/go/wrtrade';
+import { QueryPerformancePlanReq, WrPerformancePlan } from '@/services/go/wrtrade/interface';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { queryAmountLog } from '@/services/go/TaAccount';
+import { QueryAmountLogReq } from '@/services/go/TaAccount/interface';
+import { getSelectedAccountId } from '@/services/bus/account';
+import { getOperateTypeEnumItemName, getOperateTypeName } from '@/common/constants/enumsName';
+import { formatTime } from '@/common/methods';
+import Bus from '@/utils/eventBus/index';
+import { expandIcon } from '@/common/setup/table/clolumn';
+
+export default defineComponent({
+    name: enumOrderComponents.commodity_contract_settlement,
+    components: {
+        BtnList,
+    },
+    setup() {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<WrPerformancePlan>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryAmountLogReq = {
+                accountID: getSelectedAccountId().toString(),
+            };
+
+            queryTable(queryAmountLog, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: queryTableAction,
+            tableName: 'table_pcweb_spot_trade_bottom_funding_info_log',
+            recordList: getRecordItemTab(),
+        };
+        // 资金变化，重新加载数据
+        Bus.$on('moneyChangedNtf_UI', () => {
+            queryTableAction();
+        });
+        return {
+            ...handleComposeOrderTable<WrPerformancePlan>(param),
+            loading,
+            tableList,
+            formatTime,
+            expandIcon,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/order/commodity_contract/components/commodity_contract_summary/index.vue

@@ -0,0 +1,88 @@
+<template>
+  <!-- 合约汇总 -->
+  <section>
+    <a-table :columns="columns"
+             class="srcollYTable expandLeftTable"
+             :scroll="{ x: '100%', y: '227px' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             :expandIcon="expandIcon"
+             :expandIconAsCell="false"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template v-if="btnList.length"
+                #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList"
+                 :record="record"
+                 class="btn-list-sticky"
+                 @click="openComponent" />
+      </template>
+      <template #createtime="{ record }">
+        <a>{{ formatTime(record.createtime) }}</a>
+      </template>
+    </a-table>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
+  </section>
+</template>
+
+<script lang="ts">
+import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import { queryTableList, BtnList, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
+import { QueryPerformancePlan, queryWrTradeDetail } from '@/services/go/wrtrade';
+import { QueryPerformancePlanReq, WrPerformancePlan } from '@/services/go/wrtrade/interface';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { queryAmountLog } from '@/services/go/TaAccount';
+import { QueryAmountLogReq } from '@/services/go/TaAccount/interface';
+import { getSelectedAccountId } from '@/services/bus/account';
+import { getOperateTypeEnumItemName, getOperateTypeName } from '@/common/constants/enumsName';
+import { formatTime } from '@/common/methods';
+import Bus from '@/utils/eventBus/index';
+import { expandIcon } from '@/common/setup/table/clolumn';
+
+export default defineComponent({
+    name: enumOrderComponents.commodity_contract_summary,
+    components: {
+        BtnList,
+    },
+    setup() {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<WrPerformancePlan>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryAmountLogReq = {
+                accountID: getSelectedAccountId().toString(),
+            };
+
+            queryTable(queryAmountLog, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: queryTableAction,
+            tableName: 'table_pcweb_spot_trade_bottom_funding_info_log',
+            recordList: getRecordItemTab(),
+        };
+        // 资金变化，重新加载数据
+        Bus.$on('moneyChangedNtf_UI', () => {
+            queryTableAction();
+        });
+        return {
+            ...handleComposeOrderTable<WrPerformancePlan>(param),
+            loading,
+            tableList,
+            formatTime,
+            expandIcon,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/order/commodity_contract/index.vue

@@ -0,0 +1,35 @@
+<template>
+  <!-- 商品合约 -->
+  <section class="spot_warran">
+    <component :is="componentId"
+               v-if="componentId">
+    </component>
+    <thirdMenu :list="tabList"
+               @selectMenu="changeTab"
+               :value="'title'"></thirdMenu>
+  </section>
+</template>
+
+<script lang="ts">
+import { defineAsyncComponent, defineComponent } from 'vue';
+import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import thirdMenu from '@/common/components/thirdMenu/index.vue';
+import { handleOrderDetailList } from '@/common/setup/order/orderData';
+
+export default defineComponent({
+    name: enumOrderComponents.commodity_contract,
+    components: {
+        thirdMenu,
+        [enumOrderComponents.commodity_contract_summary]: defineAsyncComponent(() => import('./components/commodity_contract_summary/index.vue')),
+        [enumOrderComponents.commodity_contract_commission]: defineAsyncComponent(() => import('./components/commodity_contract_commission/index.vue')),
+        [enumOrderComponents.commodity_contract_make_deal]: defineAsyncComponent(() => import('./components/commodity_contract_make_deal/index.vue')),
+        [enumOrderComponents.commodity_contract_settlement]: defineAsyncComponent(() => import('./components/commodity_contract_settlement/index.vue')),
+    },
+    setup() {
+        return { ...handleOrderDetailList(enumOrderComponents.commodity_contract) };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/order/financing_manager/components/financing_manager_apply_order/index.vue

@@ -0,0 +1,88 @@
+<template>
+  <!-- 申请单 -->
+  <section>
+    <a-table :columns="columns"
+             class="srcollYTable expandLeftTable"
+             :scroll="{ x: '100%', y: '227px' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             :expandIcon="expandIcon"
+             :expandIconAsCell="false"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template v-if="btnList.length"
+                #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList"
+                 :record="record"
+                 class="btn-list-sticky"
+                 @click="openComponent" />
+      </template>
+      <template #createtime="{ record }">
+        <a>{{ formatTime(record.createtime) }}</a>
+      </template>
+    </a-table>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
+  </section>
+</template>
+
+<script lang="ts">
+import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import { queryTableList, BtnList, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
+import { QueryPerformancePlan, queryWrTradeDetail } from '@/services/go/wrtrade';
+import { QueryPerformancePlanReq, WrPerformancePlan } from '@/services/go/wrtrade/interface';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { queryAmountLog } from '@/services/go/TaAccount';
+import { QueryAmountLogReq } from '@/services/go/TaAccount/interface';
+import { getSelectedAccountId } from '@/services/bus/account';
+import { getOperateTypeEnumItemName, getOperateTypeName } from '@/common/constants/enumsName';
+import { formatTime } from '@/common/methods';
+import Bus from '@/utils/eventBus/index';
+import { expandIcon } from '@/common/setup/table/clolumn';
+
+export default defineComponent({
+    name: enumOrderComponents.financing_manager_apply_order,
+    components: {
+        BtnList,
+    },
+    setup() {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<WrPerformancePlan>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryAmountLogReq = {
+                accountID: getSelectedAccountId().toString(),
+            };
+
+            queryTable(queryAmountLog, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: queryTableAction,
+            tableName: 'table_pcweb_spot_trade_bottom_funding_info_log',
+            recordList: getRecordItemTab(),
+        };
+        // 资金变化，重新加载数据
+        Bus.$on('moneyChangedNtf_UI', () => {
+            queryTableAction();
+        });
+        return {
+            ...handleComposeOrderTable<WrPerformancePlan>(param),
+            loading,
+            tableList,
+            formatTime,
+            expandIcon,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/order/financing_manager/components/financing_manager_contract/index.vue

@@ -0,0 +1,88 @@
+<template>
+  <!-- 合同 -->
+  <section>
+    <a-table :columns="columns"
+             class="srcollYTable expandLeftTable"
+             :scroll="{ x: '100%', y: '227px' }"
+             :pagination="false"
+             :loading="loading"
+             :expandedRowKeys="expandedRowKeys"
+             :customRow="Rowclick"
+             :expandIcon="expandIcon"
+             :expandIconAsCell="false"
+             rowKey="key"
+             :data-source="tableList">
+      <!-- 额外的展开行 -->
+      <template v-if="btnList.length"
+                #expandedRowRender="{ record }">
+        <BtnList :btnList="btnList"
+                 :record="record"
+                 class="btn-list-sticky"
+                 @click="openComponent" />
+      </template>
+      <template #createtime="{ record }">
+        <a>{{ formatTime(record.createtime) }}</a>
+      </template>
+    </a-table>
+    <component :is="componentId"
+               v-if="componentId"
+               :selectedRow="selectedRow"
+               @cancel="closeComponent"></component>
+  </section>
+</template>
+
+<script lang="ts">
+import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import { queryTableList, BtnList, defineAsyncComponent, defineComponent } from '@/common/export/commonTable';
+import { QueryPerformancePlan, queryWrTradeDetail } from '@/services/go/wrtrade';
+import { QueryPerformancePlanReq, WrPerformancePlan } from '@/services/go/wrtrade/interface';
+import { getRecordItemTab } from '@/common/setup/order/orderData';
+import { handleComposeOrderTable } from '@/common/setup/table/compose';
+import { ComposeOrderTableParam } from '@/common/setup/table/interface';
+import { queryAmountLog } from '@/services/go/TaAccount';
+import { QueryAmountLogReq } from '@/services/go/TaAccount/interface';
+import { getSelectedAccountId } from '@/services/bus/account';
+import { getOperateTypeEnumItemName, getOperateTypeName } from '@/common/constants/enumsName';
+import { formatTime } from '@/common/methods';
+import Bus from '@/utils/eventBus/index';
+import { expandIcon } from '@/common/setup/table/clolumn';
+
+export default defineComponent({
+    name: enumOrderComponents.financing_manager_contract,
+    components: {
+        BtnList,
+    },
+    setup() {
+        // 表格列表数据
+        const { loading, tableList, queryTable } = queryTableList<WrPerformancePlan>();
+        // 获取列表数据
+        const queryTableAction = () => {
+            const param: QueryAmountLogReq = {
+                accountID: getSelectedAccountId().toString(),
+            };
+
+            queryTable(queryAmountLog, param);
+        };
+        // 表格通用逻辑
+        const param: ComposeOrderTableParam = {
+            queryFn: queryTableAction,
+            tableName: 'table_pcweb_spot_trade_bottom_funding_info_log',
+            recordList: getRecordItemTab(),
+        };
+        // 资金变化，重新加载数据
+        Bus.$on('moneyChangedNtf_UI', () => {
+            queryTableAction();
+        });
+        return {
+            ...handleComposeOrderTable<WrPerformancePlan>(param),
+            loading,
+            tableList,
+            formatTime,
+            expandIcon,
+        };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;

src/views/order/financing_manager/index.vue

@@ -0,0 +1,33 @@
+<template>
+  <!-- 融资管理 -->
+  <section class="spot_warran">
+    <component :is="componentId"
+               v-if="componentId">
+    </component>
+    <thirdMenu :list="tabList"
+               @selectMenu="changeTab"
+               :value="'title'"></thirdMenu>
+  </section>
+</template>
+
+<script lang="ts">
+import { defineAsyncComponent, defineComponent } from 'vue';
+import { enumOrderComponents } from '@/common/constants/enumOrderComponents';
+import thirdMenu from '@/common/components/thirdMenu/index.vue';
+import { handleOrderDetailList } from '@/common/setup/order/orderData';
+
+export default defineComponent({
+    name: enumOrderComponents.financing_manager,
+    components: {
+        thirdMenu,
+        [enumOrderComponents.financing_manager_apply_order]: defineAsyncComponent(() => import('./components/financing_manager_apply_order/index.vue')),
+        [enumOrderComponents.financing_manager_contract]: defineAsyncComponent(() => import('./components/financing_manager_contract/index.vue')),
+    },
+    setup() {
+        return { ...handleOrderDetailList(enumOrderComponents.financing_manager) };
+    },
+});
+</script>
+
+<style lang="less">
+</style>;