update

src/assets/styles/mixin.less

@@ -2425,7 +2425,7 @@ input:-internal-autofill-selected {
 
 .ant-spin-container::after,
 .ant-drawer-content {
-    background-color: transparent;
+    background-color: var(--m-black31) !important;
 }
 
 .ant-layout-sider-has-trigger {

src/common/components/echarts/echart-base/index.ts

@@ -0,0 +1,14 @@
+// 创建 iframe 对象
+const createIframe = (parent: HTMLElement): HTMLIFrameElement => {
+    const iframe = document.createElement('iframe');
+    // 设置 iframe 样式
+    iframe.style.cssText = 'position: absolute; z-index: -1000; left: 0; top: 0; width: 100%; height: 100%; border: 0; visibility: hidden; pointer-events: none;';
+    // 添加 iframe 节点
+    parent.appendChild(iframe);
+
+    return iframe;
+}
+
+export function useEcharts(el: HTMLElement) {
+
+}

src/common/components/echarts/echart-base/index.vue

@@ -0,0 +1,55 @@
+<template>
+  <div ref="chartElement" class="mtp-echarts" :style="{ width: width, height: height }">
+    <template v-if="empty">
+      <div class="mtp-echarts__empty">暂无数据</div>
+    </template>
+    <template v-else>
+      <div class="mtp-echarts__container" v-for="i in options.length" :key="i"></div>
+    </template>
+  </div>
+</template>
+
+<script lang="ts">
+import { defineComponent, ref, onMounted, PropType, watch, watchEffect } from 'vue';
+import { EChartsOption } from 'echarts';
+
+export default defineComponent({
+  props: {
+    // 图表宽度
+    width: {
+      type: String,
+      default: '100%',
+    },
+    // 图表高度
+    height: {
+      type: String,
+      default: '100%',
+    },
+    // 图表配置项，支持多图表(待完善...)
+    options: {
+      type: Array as PropType<EChartsOption[]>,
+      default: [],
+    },
+    loading: {
+      type: Boolean,
+      default: true,
+    },
+    empty: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  setup(props) {
+    // 图表容器元素
+    const chartElement = ref<HTMLElement>();
+
+    return {
+      chartElement,
+    }
+  }
+})
+</script>
+
+<style lang="less">
+@import './index.less';
+</style>

src/common/components/uploadImg/index.vue

@@ -1,13 +1,13 @@
 <template>
-    <div class="upload">
-        <a-upload :action="uploadUrl" v-model:file-list="uploadImgList" :before-upload="beforeUpload" @change="uploadAction">
-            <a-button class="uploadBtn">上传</a-button>
-        </a-upload>
-        <div class="look" v-if="uploadImgList.length" @click="previewImg(uploadImgList[0])">查看附件</div>
-        <a-modal :visible="previewVisible" :footer="null" @cancel="cancelImg">
-            <img alt="预览附件" style="width: 100%" :src="previewImage" />
-        </a-modal>
-    </div>
+  <div class="upload">
+    <a-upload :action="uploadUrl" v-model:file-list="uploadImgList" :before-upload="beforeUpload" @change="uploadAction">
+      <a-button class="uploadBtn">上传</a-button>
+    </a-upload>
+    <div class="look" v-if="uploadImgList.length" @click="previewImg(uploadImgList[0])">查看附件</div>
+    <a-modal :visible="previewVisible" :footer="null" @cancel="cancelImg">
+      <img alt="预览附件" style="width: 100%" :src="previewImage" />
+    </a-modal>
+  </div>
 </template>
 
 <script lang="ts">
@@ -18,56 +18,56 @@ import { PropType, watchEffect } from '@vue/runtime-core';
 import { message } from 'ant-design-vue';
 
 export default defineComponent({
-    name: 'upload-img',
-    emits: ['upload'],
-    props: {
-        visible: {
-            type: Boolean,
-            default: false,
-        },
-        imgList: {
-            type: Array as PropType<FileItem[]>,
-            default: [],
-        },
+  name: 'upload-img',
+  emits: ['upload'],
+  props: {
+    visible: {
+      type: Boolean,
+      default: false,
     },
-    setup(props, context) {
-        // 上传附件
-        const { uploadUrl, uploadImgList, uploadChange, getUploadUrl, getUploadResultUrl } = handleUplodImg();
-        // 预览附件
-        const { previewVisible, previewImage, cancelImg, previewImg } = handlePreviewImg();
-        function uploadAction(obj: FileInfo) {
-            uploadChange(obj).then(() => {
-                const arr = getUploadResultUrl();
-                context.emit('upload', arr);
-            });
-        }
-        watchEffect(() => {
-            if (props.visible) {
-                getUploadUrl();
-                uploadImgList.value = props.imgList;
-            }
-        });
-        // 文件上传校验
-        const beforeUpload = (file: any) => {
-            const isLt2M = file.size / 1024 / 1024 <= 1;
-            if (!isLt2M) {
-                message.error(file.name + '图片大小超出1M限制，请修改后重新上传', 0.8);
-                return isLt2M;
-            }
-            return isLt2M;
-        };
-        return {
-            beforeUpload,
-            uploadUrl,
-            uploadAction,
-            uploadChange,
-            uploadImgList,
-            previewVisible,
-            previewImage,
-            cancelImg,
-            previewImg,
-        };
+    imgList: {
+      type: Array as PropType<FileItem[]>,
+      default: [],
     },
+  },
+  setup(props, context) {
+    // 上传附件
+    const { uploadUrl, uploadImgList, uploadChange, getUploadUrl, getUploadResultUrl } = handleUplodImg();
+    // 预览附件
+    const { previewVisible, previewImage, cancelImg, previewImg } = handlePreviewImg();
+    function uploadAction(obj: FileInfo) {
+      uploadChange(obj).then(() => {
+        const arr = getUploadResultUrl();
+        context.emit('upload', arr);
+      });
+    }
+    watchEffect(() => {
+      if (props.visible) {
+        getUploadUrl();
+        uploadImgList.value = props.imgList;
+      }
+    });
+    // 文件上传校验
+    const beforeUpload = (file: any) => {
+      const isLt2M = file.size / 1024 / 1024 <= 1;
+      if (!isLt2M) {
+        message.error(file.name + '图片大小超出1M限制，请修改后重新上传', 0.8);
+        return isLt2M;
+      }
+      return isLt2M;
+    };
+    return {
+      beforeUpload,
+      uploadUrl,
+      uploadAction,
+      uploadChange,
+      uploadImgList,
+      previewVisible,
+      previewImage,
+      cancelImg,
+      previewImg,
+    };
+  },
 });
 </script>
 <style lang="less">

src/common/setup/upload/index.ts

@@ -66,7 +66,7 @@ export function handleUplodImg(limitSize = 1) {
             if (file.response) {
                 message.error(`服务器返回状态: ${file.response.code},${file.response.message}`)
             } else {
-                message.error(`服务器无响应}`)
+                message.error(`服务器无响应`)
             }
         }
         if (file.status === 'done') {
@@ -162,7 +162,6 @@ export function getUploadImg() {
                 url: getImg(str),
             };
         });
-
     }
     // 获取上传的第一张图片
     function getFirstImg() {

src/views/account/login.vue

@@ -1,37 +1,37 @@
 <template>
-    <div class="login">
-        <a-row type="flex" justify="center" align="middle">
-            <a-col>
-                <div class="login-background" id="img">
-                    <!-- <div id="img"> -->
-                    <!-- <img src="./logo.png"
+  <div class="login">
+    <a-row type="flex" justify="center" align="middle">
+      <a-col>
+        <div class="login-background" id="img">
+          <!-- <div id="img"> -->
+          <!-- <img src="./logo.png"
                         alt="" />-->
-                    <!-- </div> -->
-                </div>
-                <div class="login-content">
-                    <p>账号登录</p>
-                    <a-form ref="formDom" :model="form" :rules="rules">
-                        <a-form-item name="account">
-                            <a-input placeholder="用户名/账号/手机号" v-model:value="form.account">
-                                <template #prefix>
-                                    <img src="@/assets/images/user.png" alt />
-                                </template>
-                            </a-input>
-                        </a-form-item>
-                        <a-form-item name="password" class="mb20">
-                            <a-input @keyup.enter="loginAction" placeholder="请输入您的登录密码" type="password" v-model:value="form.password" autocomplete>
-                                <template #prefix>
-                                    <img src="@/assets/images/password.png" alt />
-                                </template>
-                            </a-input>
-                        </a-form-item>
-                        <a-form-item>
-                            <div class="login-remember-password">
-                                <a-checkbox v-model:checked="form.isRemember">记住账号</a-checkbox>
-                                <!-- <router-link to="/resetPassword">忘记密码?</router-link> -->
-                            </div>
-                        </a-form-item>
-                        <!-- <a-form-item>
+          <!-- </div> -->
+        </div>
+        <div class="login-content">
+          <p>账号登录</p>
+          <a-form ref="formDom" :model="form" :rules="rules">
+            <a-form-item name="account">
+              <a-input placeholder="用户名/账号/手机号" v-model:value="form.account">
+                <template #prefix>
+                  <img src="@/assets/images/user.png" alt />
+                </template>
+              </a-input>
+            </a-form-item>
+            <a-form-item name="password" class="mb20">
+              <a-input @keyup.enter="loginAction" placeholder="请输入您的登录密码" type="password" v-model:value="form.password" autocomplete>
+                <template #prefix>
+                  <img src="@/assets/images/password.png" alt />
+                </template>
+              </a-input>
+            </a-form-item>
+            <a-form-item>
+              <div class="login-remember-password">
+                <a-checkbox v-model:checked="form.isRemember">记住账号</a-checkbox>
+                <!-- <router-link to="/resetPassword">忘记密码?</router-link> -->
+              </div>
+            </a-form-item>
+            <!-- <a-form-item>
               <div style="text-align:left">
                 <a-checkbox v-model:checked="form.isRead">
                   我已阅读并同意
@@ -39,14 +39,14 @@
                 <router-link to="/resetPassword">《用户协议》</router-link>
               </div>
                         </a-form-item>-->
-                        <a-form-item class="mt20">
-                            <a-button @click="loginAction" :loading="loading" :disabled="goHomeloading">登录</a-button>
-                        </a-form-item>
-                    </a-form>
-                </div>
-            </a-col>
-        </a-row>
-    </div>
+            <a-form-item class="mt20">
+              <a-button @click="loginAction" :loading="loading" :disabled="goHomeloading">登录</a-button>
+            </a-form-item>
+          </a-form>
+        </div>
+      </a-col>
+    </a-row>
+  </div>
 </template>
 
 <script lang="ts">
@@ -63,24 +63,24 @@ import { qtAction } from './qt';
 import { serviceURL } from '@/services/request/serviceURL';
 
 interface Form {
-    account: string;
-    password: string;
-    isRemember: boolean;
-    isRead: boolean;
+  account: string;
+  password: string;
+  isRemember: boolean;
+  isRead: boolean;
 }
 
 const initForm: Form = {
-    account: '',
-    password: '',
-    isRemember: false,
-    isRead: false,
+  account: '',
+  password: '',
+  isRemember: false,
+  isRead: false,
 };
 
 function setRememberAccount(): void {
-    const account: string = localStorageUtil.getItem('loginAccount');
-    if (account) {
-        Object.assign(initForm, { account, isRemember: true });
-    }
+  const account: string = localStorageUtil.getItem('loginAccount');
+  if (account) {
+    Object.assign(initForm, { account, isRemember: true });
+  }
 }
 
 // declare global {
@@ -133,77 +133,77 @@ function setRememberAccount(): void {
 // }
 
 export default defineComponent({
-    name: 'login',
-    components: {},
-    setup() {
-        function setLogo() {
-            const img = document.querySelector('#logo_img') || document.createElement('img');
-            const obj = {
-                id: 'logo_img',
-                src: './logo.png',
-                style: 'margin-bottom: 180px',
-            };
-            Object.assign(img, obj);
-            document.querySelector('#img')?.appendChild(img);
-        }
-        onMounted(() => {
-            setLogo();
-        });
+  name: 'login',
+  components: {},
+  setup() {
+    function setLogo() {
+      const img = document.querySelector('#logo_img') || document.createElement('img');
+      const obj = {
+        id: 'logo_img',
+        src: './logo.png',
+        style: 'margin-bottom: 180px',
+      };
+      Object.assign(img, obj);
+      document.querySelector('#img')?.appendChild(img);
+    }
+    onMounted(() => {
+      setLogo();
+    });
 
-        const loading = ref<boolean>(false);
-        const form = reactive(initForm);
-        const rules = {
-            account: [{ required: true, message: '请输入手机号!', trigger: 'change', type: 'string' }],
-            password: [{ required: true, message: '请输入密码！', trigger: 'change', type: 'string' }],
-        };
-        const formDom: any = ref(null);
-        const router = useRouter();
-        form.password = '';
-        // setRememberAccount();
-        // qt
-        const { getQtInfo } = qtAction();
-        function loginAction() {
-            formDom.value.validate().then(() => {
-                loading.value = true;
-                const { account, password } = toRaw(form);
-                setLoadComplete(false);
-                getQtInfo().then((arr) => {
-                    login(account, password, arr)
-                        .then((value: any) => {
-                            setLoadComplete(true);
-                            const { account, isRemember } = toRaw(form);
-                            if (isRemember) {
-                                localStorageUtil.setItem('loginAccount', account); // 缓存登录账号
-                            }
-                            eventBus.$emit('loginSuccess', true);
-                            router.push({ name: 'home' });
-                            loading.value = false;
-                        })
-                        .catch((err: any) => {
-                            loading.value = false;
-                            err && message.error(err);
-                        });
-                });
+    const loading = ref<boolean>(false);
+    const form = reactive(initForm);
+    const rules = {
+      account: [{ required: true, message: '请输入手机号!', trigger: 'change', type: 'string' }],
+      password: [{ required: true, message: '请输入密码！', trigger: 'change', type: 'string' }],
+    };
+    const formDom: any = ref(null);
+    const router = useRouter();
+    form.password = '';
+    // setRememberAccount();
+    // qt
+    const { getQtInfo } = qtAction();
+    function loginAction() {
+      formDom.value.validate().then(() => {
+        loading.value = true;
+        const { account, password } = toRaw(form);
+        setLoadComplete(false);
+        getQtInfo().then((arr) => {
+          login(account, password, arr)
+            .then((value: any) => {
+              setLoadComplete(true);
+              const { account, isRemember } = toRaw(form);
+              if (isRemember) {
+                localStorageUtil.setItem('loginAccount', account); // 缓存登录账号
+              }
+              eventBus.$emit('loginSuccess', true);
+              router.push({ name: 'home' });
+              loading.value = false;
+            })
+            .catch((err: any) => {
+              loading.value = false;
+              err && message.error(err);
             });
-        }
-        // 直接前往首页
-        const goHomeloading = ref<boolean>(false);
-        const goHome = () => {
-            goHomeloading.value = true;
-            setLoadComplete(false);
-            globalDataRefresh()
-                .then((res) => {
-                    setLoadComplete(true);
-                    goHomeloading.value = false;
-                    router.push({ name: 'home' });
-                })
-                .catch((err) => {
-                    console.error(err);
-                    goHomeloading.value = false;
-                });
-        };
-        return { form, loginAction, rules, formDom, loading, goHomeloading, goHome };
-    },
+        });
+      });
+    }
+    // 直接前往首页
+    const goHomeloading = ref<boolean>(false);
+    const goHome = () => {
+      goHomeloading.value = true;
+      setLoadComplete(false);
+      globalDataRefresh()
+        .then((res) => {
+          setLoadComplete(true);
+          goHomeloading.value = false;
+          router.push({ name: 'home' });
+        })
+        .catch((err) => {
+          console.error(err);
+          goHomeloading.value = false;
+        });
+    };
+    return { form, loginAction, rules, formDom, loading, goHomeloading, goHome };
+  },
 });
 </script>
 
@@ -288,10 +288,15 @@ export default defineComponent({
         .ant-input {
             border: 0;
             border-radius: 0;
-            width: 154px;
+            width: 100%;
             height: 40px;
             font-size: 16px;
             font-family: Adobe Heiti Std;
+
+            &:-webkit-autofill {
+                box-shadow: 0 0 0 1000px #fff inset;
+                -webkit-text-fill-color: @m-black;
+            }
         }
         .ant-input-affix-wrapper {
             box-shadow: none;

src/views/business/exposure/list/spot/index.vue

@@ -1,21 +1,17 @@
 <template>
-    <!-- 敞口: 现货头寸-->
-    <div class="exposure-spot table-height" :loading="loading">
-        <filterCustomTable @search="updateColumn"> </filterCustomTable>
-        <a-table :columns="columns" class="srcollYTable" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :pagination="false" rowKey="key" :data-source="tableList">
-            <template #decreaseqty="{ record }">
-                <span>{{ record.decreaseqty.toFixed(2) + ' ' + record.enumdicname }}</span>
-            </template>
-        </a-table>
-        <!-- 明细 -->
-        <Description v-if="visible" @close="closeDrawer" @changeTab="changeTab" :tabList="tabList">
-            <a-table :columns="columnsDetail" class="topTable" :pagination="false" rowKey="key" :data-source="detailTableList" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }"> </a-table>
-            <!-- 类型 -->
-            <template #logtype="{ record }">
-                <span>{{ getLogType(record.logtype) }}</span>
-            </template>
-        </Description>
-    </div>
+  <!-- 敞口: 现货头寸-->
+  <div class="exposure-spot table-height" :loading="loading">
+    <filterCustomTable @search="updateColumn"> </filterCustomTable>
+    <a-table :columns="columns" class="srcollYTable" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }" :expandedRowKeys="expandedRowKeys" :customRow="Rowclick" :pagination="false" rowKey="key" :data-source="tableList"></a-table>
+    <!-- 明细 -->
+    <Description v-if="visible" @close="closeDrawer" @changeTab="changeTab" :tabList="tabList">
+      <a-table :columns="columnsDetail" class="topTable" :pagination="false" rowKey="key" :data-source="detailTableList" :scroll="{ x: '100%', y: 'calc(100vh - 163px)' }"> </a-table>
+      <!-- 类型 -->
+      <template #logtype="{ record }">
+        <span>{{ getLogType(record.logtype) }}</span>
+      </template>
+    </Description>
+  </div>
 </template>
 
 <script lang="ts">
@@ -34,78 +30,78 @@ import { getTableButton } from '@/common/setup/table/button';
 import { columns, columnsDetail } from './setup';
 
 export default defineComponent({
-    name: EnumRouterName.exposure_spot,
-    components: {
-        Description,
-        filterCustomTable,
-    },
-    setup() {
-        // 表格列表数据
-        const { loading, tableList, queryTable } = queryTableList<Ermcp3AreaSpot>();
-        // 获取列表数据
-        const queryTableAction = () => queryTable(QuerySpotPosition);
-        const param: ComposeTableDetailParam = {
-            queryFn: queryTableAction, // 查询表格数据
-            tableName: 'table_pcweb_exposure_spotposition', // 表头key
-            tableFilterKey: ['MiddleGoodsName'], // 表格过滤字段
-            menuType: EnumRouterName.exposure_spot, // 当前tab页对应的code
-        };
-        const {
-            visible,
-            closeDrawer, // 控制 drawer 组件是否显示
-            updateColumn, //  表头数据
-            registerColumnDetail,
-            detailTableList, // 明细表头数据
-            expandedRowKeys,
-            selectedRow,
-            Rowclick, // 表格事件
-        } = handleComposeTable_detail<Ermcp3AreaSpot>(param);
+  name: EnumRouterName.exposure_spot,
+  components: {
+    Description,
+    filterCustomTable,
+  },
+  setup() {
+    // 表格列表数据
+    const { loading, tableList, queryTable } = queryTableList<Ermcp3AreaSpot>(true, 2);
+    // 获取列表数据
+    const queryTableAction = () => queryTable(QuerySpotPosition);
+    const param: ComposeTableDetailParam = {
+      queryFn: queryTableAction, // 查询表格数据
+      tableName: 'table_pcweb_exposure_spotposition', // 表头key
+      tableFilterKey: ['MiddleGoodsName'], // 表格过滤字段
+      menuType: EnumRouterName.exposure_spot, // 当前tab页对应的code
+    };
+    const {
+      visible,
+      closeDrawer, // 控制 drawer 组件是否显示
+      updateColumn, //  表头数据
+      registerColumnDetail,
+      detailTableList, // 明细表头数据
+      expandedRowKeys,
+      selectedRow,
+      Rowclick, // 表格事件
+    } = handleComposeTable_detail<Ermcp3AreaSpot>(param);
 
-        // 底部明细标签
-        const tabList = getTableButton();
+    // 底部明细标签
+    const tabList = getTableButton();
 
-        // 切换明细
-        function changeTab(index: number, current: TabList) {
-            const { code, lable } = current;
-            if (code === 'position_spot_details') {
-                // 现货明细
-                // 注册表头
-                registerColumnDetail('table_pcweb_exposure_spotposition_detail', []);
-            } else {
-                console.error(`${lable}没有配置对应的code: ${code},`);
-                return;
-            }
-            const wrstandardid = selectedRow.value?.wrstandardid;
-            if (wrstandardid) {
-                queryResultLoadingAndInfo(QuerySpotPositionDetail, loading, { wrstandardid }).then((res) => {
-                    detailTableList.value = res;
-                });
-            }
-        }
-        watchEffect(() => {
-            if (visible.value) {
-                if (tabList.length) {
-                    changeTab(0, tabList[0]);
-                }
-            }
+    // 切换明细
+    function changeTab(index: number, current: TabList) {
+      const { code, lable } = current;
+      if (code === 'position_spot_details') {
+        // 现货明细
+        // 注册表头
+        registerColumnDetail('table_pcweb_exposure_spotposition_detail', []);
+      } else {
+        console.error(`${lable}没有配置对应的code: ${code},`);
+        return;
+      }
+      const wrstandardid = selectedRow.value?.wrstandardid;
+      if (wrstandardid) {
+        queryResultLoadingAndInfo(QuerySpotPositionDetail, loading, { wrstandardid }).then((res) => {
+          detailTableList.value = res;
         });
-        return {
-            loading,
-            tableList,
-            visible,
-            closeDrawer,
-            changeTab,
-            updateColumn,
-            columnsDetail,
-            detailTableList,
-            expandedRowKeys,
-            selectedRow,
-            Rowclick,
-            tabList,
-            getLogType,
-            columns,
-        };
-    },
+      }
+    }
+    watchEffect(() => {
+      if (visible.value) {
+        if (tabList.length) {
+          changeTab(0, tabList[0]);
+        }
+      }
+    });
+    return {
+      loading,
+      tableList,
+      visible,
+      closeDrawer,
+      changeTab,
+      updateColumn,
+      columnsDetail,
+      detailTableList,
+      expandedRowKeys,
+      selectedRow,
+      Rowclick,
+      tabList,
+      getLogType,
+      columns,
+    };
+  },
 });
 </script>
 

src/views/business/exposure/list/spot/setup.ts

@@ -1,5 +1,6 @@
-import { Ermcp3AreaSpot } from '@/services/go/ermcp/exposure/interface';
+import { Ermcp3AreaSpot, Ermcp3AreaSpotDetail } from '@/services/go/ermcp/exposure/interface';
 import { ColumnType } from '@/common/methods/table';
+import { getContractTypeName } from '@/common/constants/enumsName';
 
 /**
  * 表头对应字段
@@ -19,40 +20,40 @@ export const columns: ColumnType[] = [
         "dataIndex": "oritoalspotqty",
         "title": "昨日数量",
         "align": "center",
-        "slots": {
-            "customRender": "oritoalspotqty"
-        },
-        "width": 120
+        "width": 120,
+        customRender: ({ record }: { record: Ermcp3AreaSpot }) => {
+            return record.oritoalspotqty + record.enumdicname;
+        }
     },
     {
         "key": "3th",
         "dataIndex": "increaseqty",
         "title": "增加数量",
         "align": "center",
-        "slots": {
-            "customRender": "increaseqty"
-        },
-        "width": 120
+        "width": 120,
+        customRender: ({ record }: { record: Ermcp3AreaSpot }) => {
+            return record.increaseqty + record.enumdicname;
+        }
     },
     {
         "key": "4th",
         "dataIndex": "decreaseqty",
         "title": "减少数量",
         "align": "center",
-        "slots": {
-            "customRender": "decreaseqty"
-        },
-        "width": 120
+        "width": 120,
+        customRender: ({ record }: { record: Ermcp3AreaSpot }) => {
+            return record.decreaseqty + record.enumdicname;
+        }
     },
     {
         "key": "5th",
         "dataIndex": "totalspotqty",
         "title": "当前数量",
         "align": "center",
-        "slots": {
-            "customRender": "totalspotqty"
-        },
-        "width": 120
+        "width": 120,
+        customRender: ({ record }: { record: Ermcp3AreaSpot }) => {
+            return record.totalspotqty + record.enumdicname;
+        }
     }
 ];
 
@@ -65,9 +66,6 @@ export const columnsDetail: ColumnType[] = [
         "dataIndex": "createtime",
         "title": "时间",
         "align": "center",
-        "slots": {
-            "customRender": "createtime"
-        },
         "width": 200
     },
     {
@@ -75,29 +73,23 @@ export const columnsDetail: ColumnType[] = [
         "dataIndex": "relatedno",
         "title": "编号 ",
         "align": "center",
-        "slots": {
-            "customRender": "relatedno"
-        },
         "width": 200
     },
     {
         "key": "2th",
-        "dataIndex": "logtype",
+        "dataIndex": "contracttype",
         "title": "类型",
         "align": "center",
-        "slots": {
-            "customRender": "logtype"
-        },
-        "width": 120
+        "width": 120,
+        customRender: ({ record }: { record: Ermcp3AreaSpotDetail }) => {
+            return getContractTypeName(record.contracttype);
+        }
     },
     {
         "key": "3th",
         "dataIndex": "wrstandardname",
         "title": "现货商品",
         "align": "center",
-        "slots": {
-            "customRender": "wrstandardname"
-        },
         "width": 120
     },
     {
@@ -105,9 +97,9 @@ export const columnsDetail: ColumnType[] = [
         "dataIndex": "qty",
         "title": "现货商品数量",
         "align": "center",
-        "slots": {
-            "customRender": "qty"
-        },
-        "width": 120
+        "width": 120,
+        customRender: ({ record }: { record: Ermcp3AreaSpotDetail }) => {
+            return record.qty + record.enumdicname;
+        }
     }
 ];

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

@@ -239,9 +239,6 @@
         </a-row>
       </fieldset>
     </a-form>
-    <a-modal :visible="previewVisible" :footer="null" @cancel="cancelImg">
-      <img alt="预览附件" style="width: 100%" :src="previewImage" />
-    </a-modal>
   </a-modal>
 </template>
 
@@ -265,163 +262,170 @@ import UploadImg from '@/common/components/uploadImg/index.vue';
 import { _closeModal } from '@/common/setup/modal/modal';
 
 export default defineComponent({
-    name: 'spot_contract_btn_modify',
-    emits: ['cancel', 'update'],
-    props: {
-        selectedRow: {
-            type: Object as PropType<Ermcp3ContractRsp>,
-            default: {},
-        },
-        contractType: {
-            type: Number,
-            required: true,
-        },
+  name: 'spot_contract_btn_modify',
+  emits: ['cancel', 'update'],
+  props: {
+    selectedRow: {
+      type: Object as PropType<Ermcp3ContractRsp>,
+      default: {},
     },
-    components: { UploadImg },
-    setup(props, context) {
-        const { visible, cancel } = _closeModal(context);
-        const loading = ref<boolean>(false);
-        const { sendReq } = addContractReq();
-        const { formState, businessType } = handleFromState(props.contractType);
-        // 表单
-        const formRef = ref();
+    contractType: {
+      type: Number,
+      required: true,
+    },
+  },
+  components: { UploadImg },
+  setup(props, context) {
+    const { visible, cancel } = _closeModal(context);
+    const loading = ref<boolean>(false);
+    const { sendReq } = addContractReq();
+    const { formState, businessType } = handleFromState(props.contractType);
+    // 表单
+    const formRef = ref();
 
-        const { rules } = handleFormRule(formState);
-        // 合同类型
-        const { contractType, isSell, contractChange, customList, queryCustomList } = handleContract(formState);
+    const { rules } = handleFormRule(formState);
+    // 合同类型
+    const { contractType, isSell, contractChange, customList, queryCustomList } = handleContract(formState);
 
-        //  处理现货商品
-        const { deliveryGoodsList, barandList, wrstandardList, goodsList, numberUnit, WrStandardChange, deliveryGoodsChange } = handleDeliveryGoods(formState);
-        // 价格信息
-        const { priceType, payCurrency, payCurrencyUnit, parCurrencyChange } = handlePrice(formState);
-        // 日期
-        const { deliveryDate, priceDate, disabledDate } = handleDate();
-        // 处理金额
-        const { getAmout } = handleAmout(formState);
-        // 获取 业务账户
-        const { queryTable: queryBusinessManager, getBusinesserOrMerchandiser } = handlerManagerList(loading, 1);
-        const { tableList: traderList, queryTable: queryTradeManager } = handlerManagerList(loading, 2, true);
+    //  处理现货商品
+    const { deliveryGoodsList, barandList, wrstandardList, goodsList, numberUnit, WrStandardChange, deliveryGoodsChange } = handleDeliveryGoods(formState);
+    // 价格信息
+    const { priceType, payCurrency, payCurrencyUnit, parCurrencyChange } = handlePrice(formState);
+    // 日期
+    const { deliveryDate, priceDate, disabledDate } = handleDate();
+    // 处理金额
+    const { getAmout } = handleAmout(formState);
+    // 获取 业务账户
+    const { queryTable: queryBusinessManager, getBusinesserOrMerchandiser } = handlerManagerList(loading, 1);
+    const { tableList: traderList, queryTable: queryTradeManager } = handlerManagerList(loading, 2, true);
 
-        // 业务员
-        const businesserList = ref<ErmcpLoginUser[]>([]);
-        // 跟单员
-        const merchandiserList = ref<ErmcpLoginUser[]>([]);
-        queryBusinessManager().then(() => {
-            businesserList.value = getBusinesserOrMerchandiser('22');
-            merchandiserList.value = getBusinesserOrMerchandiser('23');
-        });
+    // 业务员
+    const businesserList = ref<ErmcpLoginUser[]>([]);
+    // 跟单员
+    const merchandiserList = ref<ErmcpLoginUser[]>([]);
+    queryBusinessManager().then(() => {
+      businesserList.value = getBusinesserOrMerchandiser('22');
+      merchandiserList.value = getBusinesserOrMerchandiser('23');
+    });
 
-        // 交易主体列表
-        const subjectList = ref<Ermcp3SubjectRsp[]>([]);
-        QueryPaAreaSubject().then((res) => {
-            subjectList.value = res;
-        });
+    // 交易主体列表
+    const subjectList = ref<Ermcp3SubjectRsp[]>([]);
+    QueryPaAreaSubject().then((res) => {
+      subjectList.value = res;
+    });
 
-        const { uploadImgAction, uploadImgList, handleImg } = getUploadImg();
-        queryCustomList();
-        queryTradeManager();
-        mergeTwoObj(formState, props.selectedRow);
-        isSell.value = formState.ContractType === 1 ? false : true;
+    const { imgs, uploadImgAction, uploadImgList, handleImg } = getUploadImg();
+    queryCustomList();
+    queryTradeManager();
+    mergeTwoObj(formState, props.selectedRow);
+    isSell.value = formState.ContractType === 1 ? false : true;
 
-        const { deliverygoodsid, qty, price, wrstandardid, spotcontractid, spotgoodsbrandid, currencyid, attachment, deliverystartdate, deliveryenddate, startdate, enddate, meruserid, tradeuserid } = props.selectedRow;
-        if (deliverygoodsid) {
-            deliveryGoodsChange(deliverygoodsid);
-            if (wrstandardid) {
-                WrStandardChange(wrstandardid);
-                formState.WrStandardID = wrstandardid;
-                formState.SpotGoodsBrandID = spotgoodsbrandid;
-            }
-        }
-        formState.Qty = qty.toString();
-        formState.Price = price.toString();
-        formState.CurrencyID = currencyid;
-        formState.ContractAttachment = attachment;
-        formState.MerUserID = meruserid;
-        formState.TradeUserID = tradeuserid;
-        formState.SpotContractID = spotcontractid;
-        if (deliverystartdate && deliverystartdate !== '--') {
-            deliveryDate.value.push(moment(deliverystartdate));
-        }
-        if (deliveryenddate && deliveryenddate !== '--') {
-            deliveryDate.value.push(moment(deliveryenddate));
-        }
-        if (startdate && startdate !== '--') {
-            priceDate.value.push(moment(startdate));
-        }
-        if (enddate && enddate !== '--') {
-            priceDate.value.push(moment(enddate));
-        }
-        if (attachment) {
-            uploadImgList.value = handleImg(attachment);
+    const { deliverygoodsid, qty, price, wrstandardid, spotcontractid, spotgoodsbrandid, currencyid, attachment, deliverystartdate, deliveryenddate, startdate, enddate, meruserid, tradeuserid } = props.selectedRow;
+    if (deliverygoodsid) {
+      deliveryGoodsChange(deliverygoodsid);
+      if (wrstandardid) {
+        WrStandardChange(wrstandardid);
+        formState.WrStandardID = wrstandardid;
+        formState.SpotGoodsBrandID = spotgoodsbrandid;
+      }
+    }
+    formState.Qty = qty.toString();
+    formState.Price = price.toString();
+    formState.CurrencyID = currencyid;
+    formState.ContractAttachment = attachment;
+    formState.MerUserID = meruserid;
+    formState.TradeUserID = tradeuserid;
+    formState.SpotContractID = spotcontractid;
+    if (deliverystartdate && deliverystartdate !== '--') {
+      deliveryDate.value.push(moment(deliverystartdate));
+    }
+    if (deliveryenddate && deliveryenddate !== '--') {
+      deliveryDate.value.push(moment(deliveryenddate));
+    }
+    if (startdate && startdate !== '--') {
+      priceDate.value.push(moment(startdate));
+    }
+    if (enddate && enddate !== '--') {
+      priceDate.value.push(moment(enddate));
+    }
+    if (attachment) {
+      uploadImgList.value = handleImg(attachment);
+    }
+    function submit() {
+      validateAction<FormState>(formRef, formState).then((param) => {
+        const id = getUserId();
+        isSell.value ? (param.SellUserID = id) : (param.BuyUserID = id);
+        const fn = (value: Moment) => {
+          return formatTime(value, 'd') + ' ' + '00:00:00';
+        };
+        // 交收期
+        const dDate = deliveryDate.value;
+        if (dDate.length) {
+          const DeliveryStartDate = fn(dDate[0]);
+          const DeliveryEndDate = fn(dDate[1]);
+          Object.assign(param, { DeliveryStartDate, DeliveryEndDate });
         }
-        function submit() {
-            validateAction<FormState>(formRef, formState).then((param) => {
-                const id = getUserId();
-                isSell.value ? (param.SellUserID = id) : (param.BuyUserID = id);
-                const fn = (value: Moment) => {
-                    return formatTime(value, 'd') + ' ' + '00:00:00';
-                };
-                // 交收期
-                const dDate = deliveryDate.value;
-                if (dDate.length) {
-                    const DeliveryStartDate = fn(dDate[0]);
-                    const DeliveryEndDate = fn(dDate[1]);
-                    Object.assign(param, { DeliveryStartDate, DeliveryEndDate });
-                }
 
-                // 点价期
-                const pDate = priceDate.value;
-                if (pDate.length && param.PriceType !== 1) {
-                    // 点价日期[2:点价3:暂定价]
-                    const StartDate = fn(pDate[0]);
-                    const EndDate = fn(pDate[1]);
-                    Object.assign(param, { StartDate, EndDate });
-                }
+        // 点价期
+        const pDate = priceDate.value;
+        if (pDate.length && param.PriceType !== 1) {
+          // 点价日期[2:点价3:暂定价]
+          const StartDate = fn(pDate[0]);
+          const EndDate = fn(pDate[1]);
+          Object.assign(param, { StartDate, EndDate });
+        }
 
-                sendReq(param, loading, 2)
-                    .then((res) => {
-                        cancel(true);
-                    })
-                    .catch((err) => {});
-            });
+        // 处理上传图片
+        if (imgs.value.length) {
+          param.ContractAttachment = imgs.value[0].replace('./', '/');
+        } else {
+          param.ContractAttachment = JSON.parse(param.ContractAttachment)
         }
-        return {
-            visible,
-            cancel,
-            submit,
-            formRef,
-            loading,
-            maskClosableFlag: false,
-            formState,
-            rules,
-            businessType,
-            contractType,
-            isSell,
-            contractChange,
-            customList,
-            deliveryGoodsList,
-            barandList,
-            wrstandardList,
-            goodsList,
-            deliveryGoodsChange,
-            WrStandardChange,
-            priceType,
-            payCurrency,
-            payCurrencyUnit,
-            parCurrencyChange,
-            numberUnit,
-            getUserName,
-            deliveryDate,
-            priceDate,
-            disabledDate,
-            getAmout,
-            traderList,
-            businesserList,
-            merchandiserList,
-            uploadImgAction,
-            uploadImgList,
-            subjectList,
-        };
-    },
+
+        sendReq(param, loading, 2)
+          .then((res) => {
+            cancel(true);
+          })
+          .catch((err) => { });
+      });
+    }
+    return {
+      visible,
+      cancel,
+      submit,
+      formRef,
+      loading,
+      maskClosableFlag: false,
+      formState,
+      rules,
+      businessType,
+      contractType,
+      isSell,
+      contractChange,
+      customList,
+      deliveryGoodsList,
+      barandList,
+      wrstandardList,
+      goodsList,
+      deliveryGoodsChange,
+      WrStandardChange,
+      priceType,
+      payCurrency,
+      payCurrencyUnit,
+      parCurrencyChange,
+      numberUnit,
+      getUserName,
+      deliveryDate,
+      priceDate,
+      disabledDate,
+      getAmout,
+      traderList,
+      businesserList,
+      merchandiserList,
+      uploadImgAction,
+      uploadImgList,
+      subjectList,
+    };
+  },
 });
 </script>

src/views/report/finance-report/components/filterTable/index.vue

@@ -1,87 +1,34 @@
 <template>
-    <!-- 过滤客户资料表格 -->
-    <Filter @update="update">
-        <!-- <FilterOption :selectList="selectList"
-                    :inputList="[]"
-                    :fixedBtnList="fixedBtnList" /> -->
-    </Filter>
+  <!-- 过滤客户资料表格 -->
+  <Filter @update="update" v-slot="{search,reset}">
+    <a-button class="selectBtn">查询</a-button>
+    <a-button class="selectBtn" @click="resetAction(search,reset)">重置</a-button>
+  </Filter>
 </template>
 
 <script lang="ts">
 import FilterOption from '@/common/components/filter/index.vue';
 import { defineComponent } from 'vue';
-import { ref } from 'vue';
-import { handleFilter, SelectList } from '@/common/setup/filter';
-import { handlerManagerList } from '@/common/setup/user';
-import { QueryMiddleGoodsDetail } from '@/services/go/ermcp/goodsInfo';
-import { SelectOption } from '@/common/setup/filter/interface';
 import Filter from '../../../components/filter/index.vue';
 import { TypeAndTime } from '@/views/report/interface';
 
 export default defineComponent({
-    name: 'exposure-filter-table',
-    components: { FilterOption, Filter },
-    setup(props, context) {
-        function update(value: TypeAndTime) {
-            context.emit('update', value);
-        }
-        const select: SelectList[] = [
-            {
-                value: undefined,
-                key: 'userId',
-                placeholder: '全部交易用户',
-                list: [],
-            },
-            {
-                value: undefined,
-                key: 'warehousetype',
-                placeholder: '全部套保品种',
-                list: [],
-            },
-        ];
-        const loading = ref<boolean>(false);
-        // 交易用户
-        const { tableList: userList, queryTable } = handlerManagerList(loading, 2);
-        const { selectList, inputList, fixedBtnList, updateSelected } = handleFilter(select, [], context);
-        // 获取交易用户
-        function getUserList() {
-            return queryTable().then(() => {
-                const result: SelectOption[] = [];
-                userList.value.forEach((e) => {
-                    e.userlist.forEach((el) => {
-                        result.push({ value: el.loginid, lable: `${el.loginname}-${el.logincode}` });
-                    });
-                });
-                return result;
-            });
-        }
-        // 获取套保品种
-        function getTBList() {
-            return QueryMiddleGoodsDetail().then((res) => {
-                const result: SelectOption[] = [];
-                res.forEach((e) => {
-                    const { isvalid, middlegoodsname, middlegoodsid } = e.mg;
-                    if (isvalid) {
-                        result.push({ value: middlegoodsid, lable: middlegoodsname });
-                    }
-                });
-                return result;
-            });
-        }
-        // initData(() => {
-        //     Promise.all([getUserList(), getTBList()]).then((res) => {
-        //         select[0].list = res[0]; // 交易用户
-        //         select[1].list = res[1]; // 套保品种
-        //         updateSelected(select);
-        //     });
-        // });
-        return {
-            selectList,
-            inputList,
-            fixedBtnList,
-            update,
-        };
-    },
+  name: 'exposure-filter-table',
+  components: { FilterOption, Filter },
+  setup(props, context) {
+    function update(value: TypeAndTime) {
+      context.emit('update', value);
+    }
+
+    function resetAction(search: Function, Nreset: Function) {
+      Nreset()
+    }
+
+    return {
+      resetAction,
+      update,
+    };
+  },
 });
 </script>
 

src/views/report/future_report/components/filterTable/index.vue

@@ -1,87 +1,34 @@
 <template>
-    <!-- 过滤客户资料表格 -->
-    <Filter @update="update">
-        <!-- <FilterOption :selectList="selectList"
-                    :inputList="[]"
-                    :fixedBtnList="fixedBtnList" /> -->
-    </Filter>
+  <!-- 过滤客户资料表格 -->
+  <Filter @update="update" v-slot="{search,reset}">
+    <a-button class="selectBtn">查询</a-button>
+    <a-button class="selectBtn" @click="resetAction(search,reset)">重置</a-button>
+  </Filter>
 </template>
 
 <script lang="ts">
 import FilterOption from '@/common/components/filter/index.vue';
 import { defineComponent } from 'vue';
-import { ref } from 'vue';
-import { handleFilter, SelectList } from '@/common/setup/filter';
-import { handlerManagerList } from '@/common/setup/user';
-import { QueryMiddleGoodsDetail } from '@/services/go/ermcp/goodsInfo';
-import { SelectOption } from '@/common/setup/filter/interface';
 import Filter from '../../../components/filter/index.vue';
 import { TypeAndTime } from '@/views/report/interface';
 
 export default defineComponent({
-    name: 'inventory-filter-table',
-    components: { FilterOption, Filter },
-    setup(props, context) {
-        function update(value: TypeAndTime) {
-            context.emit('update', value);
-        }
-        const select: SelectList[] = [
-            {
-                value: undefined,
-                key: 'userId',
-                placeholder: '全部交易用户',
-                list: [],
-            },
-            {
-                value: undefined,
-                key: 'warehousetype',
-                placeholder: '全部套保品种',
-                list: [],
-            },
-        ];
-        const loading = ref<boolean>(false);
-        // 交易用户
-        const { tableList: userList, queryTable } = handlerManagerList(loading, 2);
-        const { selectList, inputList, fixedBtnList, updateSelected } = handleFilter(select, [], context);
-        // 获取交易用户
-        function getUserList() {
-            return queryTable().then(() => {
-                const result: SelectOption[] = [];
-                userList.value.forEach((e) => {
-                    e.userlist.forEach((el) => {
-                        result.push({ value: el.loginid, lable: `${el.loginname}-${el.logincode}` });
-                    });
-                });
-                return result;
-            });
-        }
-        // 获取套保品种
-        function getTBList() {
-            return QueryMiddleGoodsDetail().then((res) => {
-                const result: SelectOption[] = [];
-                res.forEach((e) => {
-                    const { isvalid, middlegoodsname, middlegoodsid } = e.mg;
-                    if (isvalid) {
-                        result.push({ value: middlegoodsid, lable: middlegoodsname });
-                    }
-                });
-                return result;
-            });
-        }
-        // initData(() => {
-        //     Promise.all([getUserList(), getTBList()]).then((res) => {
-        //         select[0].list = res[0]; // 交易用户
-        //         select[1].list = res[1]; // 套保品种
-        //         updateSelected(select);
-        //     });
-        // });
-        return {
-            selectList,
-            inputList,
-            fixedBtnList,
-            update,
-        };
-    },
+  name: 'inventory-filter-table',
+  components: { FilterOption, Filter },
+  setup(props, context) {
+    function update(value: TypeAndTime) {
+      context.emit('update', value);
+    }
+
+    function resetAction(search: Function, Nreset: Function) {
+      Nreset()
+    }
+
+    return {
+      resetAction,
+      update,
+    };
+  },
 });
 </script>
 

src/views/report/sum_pl_report/components/filterTable/index.vue

@@ -1,87 +1,34 @@
 <template>
-    <!-- 过滤客户资料表格 -->
-    <Filter @update="update">
-        <!-- <FilterOption :selectList="selectList"
-                    :inputList="[]"
-                    :fixedBtnList="fixedBtnList" /> -->
-    </Filter>
+  <!-- 过滤客户资料表格 -->
+  <Filter @update="update">
+    <a-button class="selectBtn">查询</a-button>
+    <a-button class="selectBtn" @click="resetAction(search,reset)">重置</a-button>
+  </Filter>
 </template>
 
 <script lang="ts">
 import FilterOption from '@/common/components/filter/index.vue';
 import { defineComponent } from 'vue';
-import { ref } from 'vue';
-import { handleFilter, SelectList } from '@/common/setup/filter';
-import { handlerManagerList } from '@/common/setup/user';
-import { QueryMiddleGoodsDetail } from '@/services/go/ermcp/goodsInfo';
-import { SelectOption } from '@/common/setup/filter/interface';
 import Filter from '../../../components/filter/index.vue';
 import { TypeAndTime } from '@/views/report/interface';
 
 export default defineComponent({
-    name: 'exposure-filter-table',
-    components: { FilterOption, Filter },
-    setup(props, context) {
-        function update(value: TypeAndTime) {
-            context.emit('update', value);
-        }
-        const select: SelectList[] = [
-            {
-                value: undefined,
-                key: 'userId',
-                placeholder: '全部交易用户',
-                list: [],
-            },
-            {
-                value: undefined,
-                key: 'warehousetype',
-                placeholder: '全部套保品种',
-                list: [],
-            },
-        ];
-        const loading = ref<boolean>(false);
-        // 交易用户
-        const { tableList: userList, queryTable } = handlerManagerList(loading, 2);
-        const { selectList, inputList, fixedBtnList, updateSelected } = handleFilter(select, [], context);
-        // 获取交易用户
-        function getUserList() {
-            return queryTable().then(() => {
-                const result: SelectOption[] = [];
-                userList.value.forEach((e) => {
-                    e.userlist.forEach((el) => {
-                        result.push({ value: el.loginid, lable: `${el.loginname}-${el.logincode}` });
-                    });
-                });
-                return result;
-            });
-        }
-        // 获取套保品种
-        function getTBList() {
-            return QueryMiddleGoodsDetail().then((res) => {
-                const result: SelectOption[] = [];
-                res.forEach((e) => {
-                    const { isvalid, middlegoodsname, middlegoodsid } = e.mg;
-                    if (isvalid) {
-                        result.push({ value: middlegoodsid, lable: middlegoodsname });
-                    }
-                });
-                return result;
-            });
-        }
-        // initData(() => {
-        //     Promise.all([getUserList(), getTBList()]).then((res) => {
-        //         select[0].list = res[0]; // 交易用户
-        //         select[1].list = res[1]; // 套保品种
-        //         updateSelected(select);
-        //     });
-        // });
-        return {
-            selectList,
-            inputList,
-            fixedBtnList,
-            update,
-        };
-    },
+  name: 'exposure-filter-table',
+  components: { FilterOption, Filter },
+  setup(props, context) {
+    function update(value: TypeAndTime) {
+      context.emit('update', value);
+    }
+
+    function resetAction(search: Function, Nreset: Function) {
+      Nreset()
+    }
+
+    return {
+      resetAction,
+      update,
+    };
+  },
 });
 </script>