update

src/components/base/modal/index.less

@@ -10,7 +10,7 @@
         left               : 0;
         width              : 100%;
         height             : 100%;
-        background-color   : rgba(0, 0, 0, .35);
+        background-color   : rgba(0, 0, 0, .45);
         transition-property: opacity;
 
         &:not(.is-show) {

src/components/base/table/index.ts

@@ -4,7 +4,7 @@ import { useDrag } from './drag'
 import './index.less'
 
 interface CatTableColumn {
-    key: string;
+    prop: string;
     label: string;
     width: number;
 }
@@ -63,7 +63,7 @@ export default defineComponent({
             }, [
                 renderColGroup(),
                 h('tbody', props.rows.map((row) => {
-                    return h('tr', headerColumns.value.map((column) => h('td', h('div', { class: 'cell' }, row[column.key]))))
+                    return h('tr', headerColumns.value.map((column) => h('td', h('div', { class: 'cell' }, row[column.prop]))))
                 }))
             ]),
             ...scrollbarWidth.value > 0 ? [renderScrollbar()] : [],

src/constants/enum/chart.ts

@@ -1,5 +1,3 @@
-import { EnumType } from './index'
-
 /**
  * 图表周期类型
  */
@@ -24,20 +22,32 @@ export enum ChartSeriesType {
     CCI,
 }
 
-export const chartCycleTypeList: EnumType[] = [
-    { label: '分时', value: ChartCycleType.time },
-    { label: '1分钟', value: ChartCycleType.minutes },
-    { label: '5分钟', value: ChartCycleType.minutes5 },
-    { label: '30分钟', value: ChartCycleType.minutes30 },
-    { label: '60分钟', value: ChartCycleType.minutes60 },
-    { label: '2小时', value: ChartCycleType.hours2 },
-    { label: '4小时', value: ChartCycleType.Hours4 },
-    { label: '日线', value: ChartCycleType.days },
-]
+/**
+ * 获取图表周期类型列表
+ * @returns 
+ */
+export function getChartCycleTypeList() {
+    return [
+        { label: '分时', value: ChartCycleType.time },
+        { label: '1分钟', value: ChartCycleType.minutes },
+        { label: '5分钟', value: ChartCycleType.minutes5 },
+        { label: '30分钟', value: ChartCycleType.minutes30 },
+        { label: '60分钟', value: ChartCycleType.minutes60 },
+        { label: '2小时', value: ChartCycleType.hours2 },
+        { label: '4小时', value: ChartCycleType.Hours4 },
+        { label: '日线', value: ChartCycleType.days },
+    ]
+}
 
-export const chartSeriesTypeList: EnumType[] = [
-    { label: 'MACD', value: ChartSeriesType.MACD },
-    { label: 'VOL', value: ChartSeriesType.VOL },
-    { label: 'KDJ', value: ChartSeriesType.KDJ },
-    { label: 'CCI', value: ChartSeriesType.CCI },
-]
+/**
+ * 获取图表指标类型列表
+ * @returns 
+ */
+export function getChartSeriesTypeList() {
+    return [
+        { label: 'MACD', value: ChartSeriesType.MACD },
+        { label: 'VOL', value: ChartSeriesType.VOL },
+        { label: 'KDJ', value: ChartSeriesType.KDJ },
+        { label: 'CCI', value: ChartSeriesType.CCI },
+    ]
+}

src/hooks/component/index.ts

@@ -14,8 +14,8 @@ export function useComponent<T>(callback?: () => void) {
      */
     const openComponent = (componentName: keyof T) => {
         if (componentName) {
+            console.log('打开组件：' + componentName.toString());
             componentId.value = componentName;
-            console.log('打开组件：' + componentName);
         } else {
             console.error('无效的组件名');
         }
@@ -26,6 +26,7 @@ export function useComponent<T>(callback?: () => void) {
      * @param isCallback 
      */
     const closeComponent = (isCallback?: boolean) => {
+        console.log('关闭组件：' + componentId.value?.toString());
         componentId.value = undefined;
         // 是否刷新数据
         if (isCallback && callback) {

src/packages/mobile/components/base/table/index.vue

@@ -20,7 +20,7 @@
                         </td>
                         <td class="app-table__cell" :class="column.className" v-for="(column, n) in columns"
                             :key="i + n.toString()">
-                            <slot :name="column.key" :value="row[column.key]" :row="row">{{ row[column.key] }}</slot>
+                            <slot :name="column.prop" :value="row[column.prop]" :row="row">{{ row[column.prop] }}</slot>
                         </td>
                     </tr>
                     <!-- expand -->

src/packages/mobile/components/base/table/interface.ts

@@ -1,5 +1,5 @@
 export interface TableColumn {
-    key: string;
+    prop: string;
     label: string;
     className?: string;
     align?: string;

src/packages/mobile/views/home/components/market/index.vue

@@ -47,12 +47,12 @@ const showAction = ref(false);
 const quoteList = globalState.getRef('quoteList');
 
 const columns = reactive<TableColumn[]>([
-  { key: 'goodscode', label: '合约' },
-  { key: 'last', label: '最新' },
-  { key: 'highest', label: '最高' },
-  { key: 'lowest', label: '最低' },
-  { key: 'bidvolume', label: '买量' },
-  { key: 'askvolume', label: '卖量' }
+  { prop: 'goodscode', label: '合约' },
+  { prop: 'last', label: '最新' },
+  { prop: 'highest', label: '最高' },
+  { prop: 'lowest', label: '最低' },
+  { prop: 'bidvolume', label: '买量' },
+  { prop: 'askvolume', label: '卖量' }
 ])
 
 const actions: ActionSheetAction[] = [

src/packages/mobile/views/order/detail/index.vue

@@ -18,7 +18,7 @@ import { defineAsyncComponent, ref } from 'vue'
 import { onBeforeRouteLeave } from 'vue-router'
 import { Button } from 'vant'
 import { useComponent } from '@/hooks/component'
-import { ChartCycleType, chartCycleTypeList } from '@/constants/enum/chart'
+import { ChartCycleType, getChartCycleTypeList } from '@/constants/enum/chart'
 import AppTab from '@/components/base/tab/index.vue'
 
 const components = {
@@ -30,6 +30,7 @@ const components = {
 const { componentId, openComponent, closeComponent } = useComponent<typeof components>();
 const childComponent = ref();
 const selectedCycleType = ref(ChartCycleType.minutes); // 当前选中的图表周期
+const chartCycleTypeList = getChartCycleTypeList();
 
 // 指标切换
 const tabChange = (index: number) => {

src/packages/pc/components/base/table/index.ts

@@ -17,7 +17,7 @@ export function useTable<T>(rowKey: keyof T, tableName?: string) {
     // 表格选中的行数据
     const selectedRow = ref<T>();
     // 表头
-    const columns = ref<TableColumn<T>[]>([]);
+    const columns = ref<TableColumn[]>([]);
     // 表格过滤项
     const filterOptions = shallowRef<FilterOption<T>[]>([]);
     // 表格数据

src/packages/pc/components/base/table/index.vue

@@ -10,7 +10,7 @@
         :filter-method="item.filterMethod" :class-name="item.className" :label="item.label"
         :align="item.align ?? 'center'" :width="item.width">
         <template #default="{ row }">
-          <slot :name="item.key" :row="row">{{ row[item.key] }}</slot>
+          <slot :name="item.prop" :row="row">{{ row[item.prop] }}</slot>
         </template>
       </el-table-column>
     </el-table>

src/packages/pc/components/base/table/interface.ts

@@ -1,8 +1,8 @@
 /** 
  * 表格列选项
  */
-export interface TableColumn<T = unknown> {
-    key: keyof T;
+export interface TableColumn {
+    prop: string;
     label: string;
     className?: string;
     align?: string;

src/packages/pc/components/layouts/sidebar/index.vue

@@ -13,7 +13,6 @@
 import { computed, ref } from 'vue'
 import { useRouter } from 'vue-router'
 import { useMenu } from '@/hooks/menu'
-import { globalState } from '@/store'
 import AppSubmenu from '../submenu/index.vue'
 
 const emit = defineEmits(["update:modelValue"]);

src/packages/pc/components/modules/echarts-kline/index.vue

@@ -63,7 +63,7 @@
 <script lang="ts" setup>
 import { ref, PropType, watch, onBeforeUnmount } from 'vue'
 import { echarts } from '@/components/base/echarts/core'
-import { ChartCycleType, ChartSeriesType, chartSeriesTypeList } from '@/constants/enum/chart'
+import { ChartCycleType, ChartSeriesType, getChartSeriesTypeList } from '@/constants/enum/chart'
 import { useCandlestickChart } from '@/hooks/echarts/candlestick'
 import AppEcharts from '@/components/base/echarts/index.vue'
 import AppTab from '@/components/base/tab/index.vue'
@@ -89,6 +89,7 @@ const props = defineProps({
 const { loading, dataIndex, isEmpty, options, selectedItem, initData, initOptions } = useCandlestickChart(props.goodscode);
 const activeSeriesType = ref(ChartSeriesType.MACD); // 当前选中的指标
 const chartGroup = new Map<string, echarts.ECharts>(); // 图表联动实例组
+const chartSeriesTypeList = getChartSeriesTypeList();
 
 // 指标切换
 const tabChange = (index: number) => {

src/packages/pc/views/market/goods/index.vue

@@ -17,7 +17,7 @@
 import { defineAsyncComponent, ref } from 'vue'
 import { timerInterceptor } from '@/utils/timer'
 import { globalState } from '@/store'
-import { ChartCycleType, chartCycleTypeList } from '@/constants/enum/chart'
+import { ChartCycleType, getChartCycleTypeList } from '@/constants/enum/chart'
 import AppTab from '@/components/base/tab/index.vue'
 
 const components = {
@@ -28,6 +28,7 @@ const components = {
 const scrollEl = ref<HTMLDivElement>();
 const selectedCycleType = ref(ChartCycleType.minutes); // 当前选中的图表周期
 const goodsList = globalState.getRef('goodsList');
+const chartCycleTypeList = getChartCycleTypeList();
 
 // 指标切换
 const tabChange = (index: number) => {

src/packages/pc/views/market/quote/index.vue

@@ -49,20 +49,20 @@ const { auth } = useMenu();
 
 columns.value = [
   {
-    key: 'id',
+    prop: 'id',
     label: '序号',
   },
   {
-    key: 'goodsCode',
+    prop: 'goodsCode',
     label: '合约',
   },
   {
-    key: 'goodsName',
+    prop: 'goodsName',
     label: '商品',
     width: 1200
   },
   {
-    key: 'lastPrice',
+    prop: 'lastPrice',
     label: '最新价',
   }
 ]