@kyfe/ks-query-table 0.0.9 → 0.0.10

package/src/common/utils/platform/subscribe/table-animation.js

@@ -1,75 +0,0 @@
-/**
- * [datasetValue animation]; [start timestamp];
- * @type {Map<string, number>}
- */
-const cellDomMap = new Map()
-let timer = null
-
-function timeAwait(ms) {
-  return new Promise((resolve) => {
-    setTimeout(() => {
-      resolve();
-    }, ms);
-  });
-}
-
-export function runTimeoutLoop() {
-
-  clearTimeout(timer)
-  timer = null
-
-  const cells = cellDomMap.keys()
-
-  for (const cell of cells) {
-    const timestamp = cellDomMap.get(cell) || 0
-    if (timestamp + 1000 < Date.now()) {
-      removeAnimation(cell)
-    }
-  }
-
-  if (cellDomMap.size) {
-    timer = setTimeout(runTimeoutLoop, 1000)
-  }
-}
-
-/**
- * @param {HTMLElement} cell
- * @param {'up' | 'down'} type
- */
-export async function addAnimation(cell, type) {
-  if (!cell) return
-  if (cell.dataset['stock']) {
-    // 取消上一次的动画
-    removeAnimation(cell)
-    await timeAwait(1)
-  }
-
-  // 没有动画或不一致
-  if (cell.dataset['stock'] !== type) {
-    cell.dataset['stock'] = type
-    cellDomMap.set(cell, Date.now())
-  }
-  runTimeoutLoop()
-}
-
-export function removeAnimation(cell) {
-  if (!cell) return
-  try {
-    cell.dataset['stock'] = ''
-    cellDomMap.delete(cell)
-  } catch (error) {
-    console.error('removeAnimation Error', error)
-  }
-}
-
-export function updateSingleCellAnimation(cell, oldValue, newValue) {
-
-  oldValue = +oldValue
-  newValue = +newValue
-  // 如果有上涨下跌，重新添加动画
-  if (newValue > oldValue) {
-    addAnimation(cell, 'up')
-  } else if (newValue < oldValue) {
-    addAnimation(cell, 'down')
-  }
-}

package/src/config/index.js

@@ -1,31 +0,0 @@
-function isProd() {
-  return window.location.origin.indexOf('www.ycfm-erp.com') >= 0 || window.navigator.userAgent.indexOf('prod') > 0
-}
-
-// 是否是生产环境
-export const IS_PROD = isProd()
-
-
-// 应用名称
-export const APP_TITLE = '股票'
-
-// cas用到，值固定，不要更改
-export const APP_ID = 'WYpeAOwQrfWnqzZZnAntSw=='
-
-// 预留字段，暂不用到
-export const MODULE_ID = 'moduleId'
-
-// 在 erp/菜单管理/iaa/ 配置的菜单id，h5请求接口时，请求头x-menu-id会用到这个id
-export const MENU = {
-  id: '156439900739872047',
-  title: '股票',
-}
-
-// keep-alive需要缓存的页面组件名称（name选项），逗号分隔,cahce_page = ['a', 'b']
-export const CACHE_PAGE = 'home'
-
-// 表格无限滚动 预加载的系数
-export const rowsPerViewportRatio = 5
-
-// 实时数据推送频率参数
-window.updateTableBufferTime = { wait: 100, size: -1 }

package/src/config.js

@@ -1 +0,0 @@
-export * from '@/config/index'

package/src/main.js

@@ -1,73 +0,0 @@
-const Vue = window.Vue
-window.ks = window.ks && window.ks.default
-// window.ksui = window.ksui && window.ksui.default
-import KSUI from '../kuasheng-ui/index.js'
-window.ksui = KSUI
-
-import initWeb from './web'
-import {
-  MENU
-} from './config'
-window.ksui.menu = MENU || {}
-
-import App from './App.vue'
-import router from './router'
-import("vconsole").then((module) => {
-  const VConsole = module.default
-  new VConsole({
-    defaultPlugins: [],
-    log: { maxLogNumber: 100, showTimestamps: true },
-  })
-})
-ks && ks.mock({
-  // getPushInfo: {
-  //   userInfo: { employeeNumber: '093263', id: '109978' }
-  // },
-  setFullScreen: {},
-  request: {}
-})
-
-Vue.config.productionTip = true
-
-// 初始化Vue
-new Vue({
-  router,
-  data: {
-    init: true
-  },
-  render: h => h(App)
-}).$mount('#app')
-
-// 浏览器环境
-if (navigator.userAgent.toLowerCase().indexOf('kuasheng-2.0') < 0) {
-  initWeb(function () {
-    // 初始化完成
-  })
-}
-
-let err = new ksui.errorPlugin({
-  type: '跨声H5'
-})
-err.vueErrorHandler(Vue)
-
-// 启动全屏会隐藏(安卓/ios)自带的导航条，右上角会出现圆型关闭按钮
-ks.setFullScreen({
-  isFullScreen: true
-})
-
-// 获取当前用户信息
-ks.getUserInfo().then(res => {
-  window.ksui.user = res.userInfo || {}
-  ksui.watermark(res.userInfo.employeeNumber)
-  window.kyApm && window.kyApm.init({
-    whiteList: [],
-    userId: window.ksui.user.employeeNumber,
-    userName: window.ksui.user.name,
-    app: 'apm-ks',
-    module: 'H5Demo', // 模块名称
-    performance: { // 性能相关参数
-      durationTime: 2000, // 性能采集的统计时长阀值
-    },
-  })
-})
-

package/src/router.js

@@ -1,52 +0,0 @@
-// import { trackPageView } from '@/sentryApm'
-const VueRouter = window.VueRouter
-
-import Demo1 from '@/view/home/demo1.vue'
-import demo2 from '@/view/home/demo2.vue'
-import Demo3 from '@/view/home/demo3.vue'
-import demo4 from '@/view/home/demo4.vue'
-
-
-const router = new VueRouter({
-  routes: [
-    {
-      path: '11',
-      component: demo2,
-      meta: {
-        keepAlive: true
-      }
-    },
-    {
-      path: '/',
-      component: Demo1,
-      meta: {
-        keepAlive: true
-      }
-    },
-    {
-      path: '/456',
-      component: demo4,
-      meta: {
-        keepAlive: true
-      }
-    }
-  ],
-
-
-
-  scrollBehavior(to, from, scroll) {
-    if (scroll) return scroll
-    return { x: 0, y: 0 }
-  },
-})
-router.beforeEach((to, from, next) => {
-
-  next()
-
-})
-// 页面跳转后埋点上报
-router.afterEach((to, from) => {
-  console.log('router.afterEach', to, from)
-  // trackPageView(to, from)
-})
-export default router

package/src/view/home/config.js

@@ -1,101 +0,0 @@
-export const mockParams = {
-  page: 1,
-  pageSize: 200,
-  elasticsearchFlag: 'N',
-  ERPSearchCacheFlag: true,
-  forceCache: true,
-  menuId: '156439900739872047',
-  genericSearchCode: 'pe_stock_pool_resource_generic',
-  _querySearchCode: 'pe_stock_pool_objects_define',
-  _columnSearchCode: 'pe_stock_pool_objects_field_0116',
-  searchMode: 0,
-  generic: {
-    vos: [],
-  },
-  groupGeneric: {
-    calculateFields: {
-      vos: [
-        {
-          propertyName: 'isStFlag',
-          columnName: 'is_st_flag',
-          customMark: 8,
-          frontBrackets: '((',
-          postBrackets: ')',
-          conditionOperation: 'and',
-          operation: 'not_contain',
-          type: 'enum',
-          values: ['10'],
-        },
-        {
-          propertyName: 'suspendFlag',
-          columnName: 'suspend_flag',
-          customMark: 8,
-          frontBrackets: '(',
-          postBrackets: '))',
-          conditionOperation: 'and',
-          operation: 'not_contain',
-          type: 'enum',
-          values: ['1'],
-        },
-        {
-          propertyName: 'recFlag',
-          columnName: 'rec_flag',
-          frontBrackets: '(',
-          postBrackets: ')',
-          conditionOperation: '',
-          operation: 'equal',
-          type: 'enum',
-          values: ['10'],
-        },
-      ],
-    },
-  },
-  params: {
-    startDate: '2025-05-20 00:00:00',
-    endDate: '2025-05-20 23:59:59',
-    selectedGroupId: '',
-    strategyUserId: '150989883296096927',
-  },
-  orderByClauses: [
-    {
-      field: 'recDate',
-      orderByMode: 1,
-    },
-  ],
-  pe_timestamp: '1747409717210',
-}
-
-export const mockSorollParams = {
-  page: 1,
-  pageSize: 200,
-  elasticsearchFlag: 'N',
-  ERPSearchCacheFlag: true,
-  forceCache: true,
-  menuId: '156439900739872047',
-  genericSearchCode: 'pe_stock_pool_resource_generic',
-  _querySearchCode: 'pe_stock_pool_objects_define',
-  _columnSearchCode: 'pe_stock_pool_objects_field_0116',
-  searchMode: 0,
-  generic: {
-    vos: [],
-  },
-  groupGeneric: {
-    calculateFields: {
-      vos: [
-      ],
-    },
-  },
-  params: {
-    startDate: '2025-05-20 00:00:00',
-    endDate: '2025-05-20 23:59:59',
-    strategyUserId: '150989883296096927',
-    selectedGroupId: '',
-  },
-  orderByClauses: [
-    {
-      field: 'recDate',
-      orderByMode: 1,
-    },
-  ],
-  pe_timestamp: '1747709867406',
-}

package/src/view/home/demo1.vue

@@ -1,223 +0,0 @@
-<template>
-  <!-- 无限滚动 -->
-  <div class="container">
-    <div class="tab">
-      顶部固定区域
-    </div>
-    <div class="table">
-      <QueryTable ref="table"
-                  :isLoading="false"
-                  :showIndex="true"
-                  :isLoadFinished="true"
-                  :enableLoadMore="true"
-                  :rowCellRenderOptions="rowCellRenderOptions"
-                  searchCode="pe_im_stocks-selection_index_field"
-                  :config="configs">
-        <template slot="topUnfixed">
-          <div class="top-Unfixed">
-            可滚动区域
-          </div>
-        </template>
-        <template slot="topFixed">
-          <div class="top-Fixed">
-            <div>吸顶区域</div>
-            <div class="btn-bar">
-              <div @click="$refs.table.openSetting()">打开个性设置</div>
-              <div @click="$refs.table.loadData()">刷新</div>
-              <div @click="$refs.table.openHorizontal()">横屏</div>
-            </div>
-          </div>
-        </template>
-      </QueryTable>
-    </div>
-  </div>
-</template>
-
-<script>
-import QueryTable from './query-table/index.js'
-import { mockParams, mockSorollParams } from './config.js'
-
-export default {
-  mixins: [],
-  components: {
-    QueryTable,
-  },
-  data() {
-    return {
-      rowCellRenderOptions: {
-        name: (h, { rowData, column }) => {
-          if (!rowData.name) {
-            return '-'
-          }
-          return <span key={rowData.id} style="color:red;">{rowData.name}</span>
-        },
-        currPrice: (h, { rowData, column }) => {
-          if (!rowData.currPrice) {
-            return '-'
-          }
-          return <span key={rowData.id}>{rowData.currPrice}</span>
-        },
-         pctChg: (h, { rowData, column }) => {
-          if (!rowData.pctChg) {
-            return '-'
-          }
-          return <span key={rowData.id}>{rowData.pctChg}</span>
-        },
-         tradeAmount: (h, { rowData, column }) => {
-          if (!rowData.tradeAmount) {
-            return '-'
-          }
-          return <span key={rowData.id}>{rowData.tradeAmount}</span>
-        },
-      },
-      configs: {
-        // apiCode
-        url: 'pe.stock.app.resource.search.v1',
-        // appkey
-        appkey: '61189',
-        // 请求前，可用于处理入参
-        beforeHttp({ params, appkey }) {
-          params.pageSize = 200
-          params.vos = []
-          params = { ...mockParams }
-           params.groupGeneric = {}
-          return { params, appkey }
-        },
-        // 请求后，可用于处理出参
-        afterHttp(res) {
-          res.rows.forEach((v, i) => {
-            v.name = '名称' + i
-            v.pctChgMask = 'd31b6ca48a214457d6d438e0cee3cbf9'
-            v.pctChg = '***'
-          })
-          console.log(res)
-          res.rows[0].tradeAmount = '很长很长很长很长很长很长很长很长很长'
-          return res
-        },
-        // 无限滚动配置
-        scrollLoad: {
-          // 获取全量id调用的接口，用于生成全量表格
-          getIdsUrl: 'pe.stock.app.resource.getCodes.v1',
-          // 获取全量id对应的key
-          idsKey: 'code',
-          // 全量id请求前，可用于处理入参
-          idsBeforeHttp({ params, appkey }) {
-            // 增加header
-            params.pageSize = 10000
-            params = { ...mockParams }
-            params.groupGeneric = {}
-
-            return { params, appkey }
-          },
-          // 全量id请求后，可用于处理出参
-          idsAfterHttp(res) {
-            return res.codes
-          },
-          // 滚动过程中加载数据请求前，可用于处理入参，保证滚动过程中请求数据准确，请求完成后会将数据补充到表格
-          scrollBeforeHttp({ params, appkey }, scrollOptions) {
-            params = { ...mockSorollParams }
-            params.groupGeneric = {
-              calculateFields: {
-                vos: [
-                  {
-                    propertyName: 'code',
-                    columnName: 'code',
-                    customMark: 8,
-                    frontBrackets: '(',
-                    postBrackets: ')',
-                    conditionOperation: '',
-                    operation: 'contain',
-                    type: 'enum',
-                    values: scrollOptions.code,
-                  },
-                ],
-              },
-            }
-            params.pageSize = scrollOptions.code.length
-            return { params, appkey }
-          },
-          // 滚动过程中加载数据请求后，可用于处理出参
-          scrollAfterHttp(res) {
-            res.rows.forEach((v, i) => {
-              v.name = '名称' + i
-              v.pctChgMask = 'd31b6ca48a214457d6d438e0cee3cbf9'
-              v.pctChg = '***'
-            })
-            return res
-          },
-        },
-      },
-    }
-  },
-  methods: {},
-  mounted() {
-    setTimeout(() => {
-      // alert(document.body.clientHeight)
-      // alert(document.body.clientWidth)
-      // alert(window.innerHeight)
-      // alert(this.$el.querySelector('.tab').clientHeight)
-    }, 3000);
-  }
-}
-</script>
-
-<style lang="less" scoped>
-.container {
-  height: calc(100vh);
-  width: 100vw;
-  .tab {
-    height: 100px;
-    width: 100vw;
-    background: rgba(121, 114, 254, 0.5);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 20px;
-    color: #666;
-  }
-  .table {
-    height: calc(100vh - 100px);
-    width: 100vw;
-    .top-Unfixed {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      font-size: 20px;
-      height: 100px;
-      background: rgba(0, 197, 141, 0.2);
-      color: #666;
-    }
-    .top-Fixed {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      font-size: 20px;
-      height: 100px;
-      background: rgba(255, 112, 108, 0.3);
-      color: #666;
-      .btn-bar {
-        width: 90%;
-        color: #666;
-        display: flex;
-        justify-content: flex-end;
-        padding-right: 30px;
-        margin-top: 20px;
-        > div {
-          font-size: 14px;
-          border: 1px solid #666;
-          margin-left: 20px;
-        }
-      }
-    }
-    // /deep/.pe-table-wrap {
-    //   .pe-table-container {
-    //   overflow-y: hidden;
-
-    //   }
-    //   overflow-y: hidden;
-    // }
-  }
-}
-</style>
-

package/src/view/home/demo2.vue

@@ -1,124 +0,0 @@
-<template>
-  <!-- 分页 -->
-  <div class="container2">
-    <div class="tab">
-      顶部固定区域
-    </div>
-    <div class="table">
-      <QueryTable ref="table"
-                  :showPage="true"
-                  :showIndex="true"
-                  :isScrollShowTotal="false"
-                  searchCode="pe_im_stocks-selection_index_field"
-                  :config="configs">
-        <template slot="topUnfixed">
-          <div class="top-Unfixed">
-            可滚动区域
-          </div>
-        </template>
-        <template slot="topFixed">
-          <div class="top-Fixed">
-            <div>吸顶区域</div>
-            <div class="btn-bar">
-              <div @click="$refs.table.openSetting()">打开个性设置</div>
-              <div @click="$refs.table.loadData()">刷新</div>
-              <div @click="$refs.table.openHorizontal()">横屏</div>
-            </div>
-          </div>
-        </template>
-      </QueryTable>
-    </div>
-  </div>
-</template>
-
-<script>
-import QueryTable from './query-table/index.js'
-import { mockParams, mockSorollParams } from './config.js'
-
-export default {
-  mixins: [],
-  components: {
-    QueryTable,
-  },
-  data() {
-    return {
-      configs: {
-        // apiCode
-        url: 'pe.stock.app.resource.search.v1',
-        // appkey
-        appkey: '61189',
-        // 请求前，可用于处理入参
-        beforeHttp({ params, appkey }) {
-          params.pageSize = 200
-          params.vos = []
-          params = { ...mockParams }
-          params.groupGeneric = {}
-          return { params, appkey }
-        },
-        // 请求后，可用于处理出参
-        afterHttp(res) {
-            res.rows.forEach((v, i) => {
-            v.name = '名称' + i
-            v.pctChgMask = 'd31b6ca48a214457d6d438e0cee3cbf9'
-            v.pctChg = '***'
-          })
-          return res
-        },
-      },
-    }
-  },
-  methods: {},
-}
-</script>
-
-<style lang="less" scoped>
-.container2 {
-  height: calc(100vh);
-  width: 100vw;
-  .tab {
-    height: 100px;
-    background: rgba(121, 114, 254, 0.5);
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 20px;
-    color: #666;
-  }
-  .table {
-    height: calc(100vh - 100px);
-    .top-Unfixed {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-      font-size: 20px;
-      height: 100px;
-      background: rgba(0, 197, 141, 0.2);
-      color: #666;
-    }
-    .top-Fixed {
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      font-size: 20px;
-      height: 100px;
-      background: rgba(255, 112, 108, 0.3);
-      color: #666;
-      .btn-bar {
-        width: 90%;
-        color: #666;
-        display: flex;
-        justify-content: flex-end;
-        padding-right: 30px;
-        margin-top: 20px;
-        > div {
-          font-size: 14px;
-          border: 1px solid #666;
-          margin-left: 20px;
-        }
-      }
-    }
-  }
-}
-</style>
-