瀏覽代碼

feat: 优化数据模型

zhangyuhan 1 年之前
父節點
當前提交
df46bea8ed

+ 1 - 1
apps/bigmember_pc/src/views/search/bidding/components/search-bid-filter.vue

@@ -1,5 +1,5 @@
 <script setup>
-import SearchBidModel from '../model/index'
+import { SearchBidModel } from '../model/index'
 import SearchSchemaFilter from '@/views/search/components/search-schema-filter.vue'
 import {
   SearchBidBaseSchema,

+ 1 - 1
apps/bigmember_pc/src/views/search/bidding/components/search-bid-header.vue

@@ -2,7 +2,7 @@
 import SearchHeaderCard from '@/views/search/components/search-header-card.vue'
 import KeywordTagsPc from '@/views/search/components/keyword-tags.vue'
 import CommonSingleChoice from '@/components/filter-items/CommonSingleChoice.vue'
-import SearchBidModel from '../model/index'
+import { SearchBidModel } from '../model/index'
 
 const { inputKeywordsState, doQuery, searchModelOptions, SearchTabsModel } =
   SearchBidModel

+ 5 - 5
apps/bigmember_pc/src/views/search/bidding/index.vue

@@ -6,9 +6,12 @@ import SearchList from '@/views/search/layout/search-list.vue'
 import ArticleItem from '@/components/article-item/ArticleItem.vue'
 import Adsense from '@/views/order/components/adsense/index.vue'
 // 导入业务模型
-import SearchBidModel from './model/index'
+import { useSearchBidModel, SearchBidModel } from './model/index'
 
-// 解构业务所需 model \ fn
+// 初始化模型
+useSearchBidModel()
+
+// 初始化模型 解构业务所需 model \ fn
 const {
   filterState,
   inputKeywordsState,
@@ -22,9 +25,6 @@ const {
   doChangePageNum,
   doChangePageSize
 } = SearchBidModel
-
-// 查询数据
-// doQuery()
 </script>
 
 <template>

+ 229 - 0
apps/bigmember_pc/src/views/search/bidding/model/base.js

@@ -0,0 +1,229 @@
+import { computed, reactive } from 'vue'
+import { without } from 'lodash'
+// API 业务模型
+import useQuickSearchModel from '@jy/data-models/modules/quick-search/model'
+// 扩展业务模型
+import { useSearchFilterModel } from './modules/filter'
+import { useSearchInputKeywordsModel } from './modules/filter-keywords'
+import { useSearchListHeaderActionsModel } from './modules/list-header-actions'
+import { useSearchTabsModel } from './modules/tabs'
+import { useStore } from '@/store'
+
+export default function () {
+  // 解构基础业务
+  const APIModel = useQuickSearchModel({
+    type: 'search-bid'
+  })
+
+  const {
+    list,
+    total,
+    loading,
+    finished,
+    selectIds,
+    listIds,
+    searchResultCount,
+    isSelectSomeCheckbox,
+    selectCheckboxCount,
+    isSelectListAllCheckbox,
+    doToggleItemSelection,
+    doToggleListSelection,
+    doClearAllSelection,
+    doQuery: doRunQuery
+  } = APIModel
+
+  const {
+    inputKeywordsState,
+    searchModelOptions,
+    getFormatAPIParams: getFormatOfInputKeywords
+  } = useSearchInputKeywordsModel()
+  const { filterState, getFormatAPIParams: getFormatOfFilter } =
+    useSearchFilterModel()
+  const {
+    headerActions,
+    listItemStyleType,
+    activeItemStyleType,
+    activeHeaderActions
+  } = useSearchListHeaderActionsModel()
+  const SearchTabsModel = useSearchTabsModel()
+
+  // 列表状态
+  const listState = reactive({
+    finished,
+    loading,
+    pageNum: 1,
+    pageSize: 5,
+    total
+  })
+
+  // 当前展示的列表
+  const activeList = computed(() => {
+    return list.value.map((v) => {
+      v.id = v._id
+      v.checked = selectIds.value.includes(v.id)
+      return v
+    })
+  })
+
+  // search-list 组件所需参数
+  const searchListProps = computed(() => {
+    return {
+      isSelectAllCheckbox: isSelectListAllCheckbox.value,
+      isSelectSomeCheckbox: isSelectSomeCheckbox.value,
+      selectCheckboxCount: selectCheckboxCount.value,
+      searchResultCount: searchResultCount.value,
+      headerActions: headerActions.value,
+      list: activeList.value,
+      listState: listState
+    }
+  })
+
+  /**
+   * 切换列表展示风格
+   * @param type - 可选风格 ['refined-list', 'detailed-list', 'table']
+   */
+  function doChangeItemStyleType(type) {
+    const styleTypes = ['refined-list', 'detailed-list', 'table']
+    if (!styleTypes.includes(type)) {
+      return console.warn('Not find style type!')
+    }
+    listItemStyleType.value = type
+    activeHeaderActions.value = without(
+      activeHeaderActions.value,
+      ...styleTypes
+    )
+    activeHeaderActions.value.push(type)
+  }
+
+  /**
+   * 列表顶部按钮操作事件统一入口
+   * @param item - 按钮原型
+   * @param item.key - 按钮标识
+   */
+  function doListHeaderAction(item) {
+    const { key } = item
+    switch (key) {
+      case 'refined-list': {
+        doChangeItemStyleType(key)
+        break
+      }
+      case 'detailed-list': {
+        doChangeItemStyleType(key)
+        break
+      }
+      case 'table': {
+        doChangeItemStyleType(key)
+        break
+      }
+    }
+  }
+
+  // 全选复选框事件
+  function doChangeAllSelect(type) {
+    doToggleListSelection(type)
+  }
+
+  // 单个复选框事件
+  function doChangeSelect(item) {
+    doToggleItemSelection(item.id)
+  }
+
+  // 分页事件
+  function doChangePageNum(page) {
+    listState.pageNum = page
+    doQuery()
+  }
+
+  // 分页大小事件
+  function doChangePageSize(size) {
+    listState.pageSize = size
+    listState.pageNum = 1
+    doQuery()
+  }
+
+  // 获取 store getters
+  const userType = computed(() => {
+    return useStore().getters['user/userType']
+  })
+
+  /**
+   * 格式化请求参数
+   * @param [params] - 可选值,部分情况会提供,默认会和该函数返回值进行合并
+   */
+
+  function getParams(params = {}) {
+    // 完整参数参考
+    const fullParams = {
+      pageNum: 1,
+      pageSize: 50,
+      reqType: '',
+      keyWords: '',
+      province: '',
+      city: '',
+      district: '',
+      subtype: '',
+      publishTime: '1682319144-1713941544',
+      searchGroup: 0,
+      searchMode: 0,
+      wordsMode: 0,
+      selectType: 'title,content',
+      price: '',
+      industry: '',
+      buyerClass: '',
+      winnerTel: '',
+      buyerTel: '',
+      exclusionWords: '',
+      buyer: '',
+      winner: '',
+      agency: '',
+      fileExists: '0',
+      splitKeywords: ''
+    }
+    // 合并所有模型的搜索筛选项
+    const result = Object.assign(
+      {
+        reqType: 'lastNews',
+        pageNum: listState.pageNum,
+        pageSize: listState.pageSize,
+        // 该接口与用户身份有关
+        _expand: {
+          type: userType.value
+        }
+      },
+      getFormatOfInputKeywords(),
+      getFormatOfFilter(),
+      params
+    )
+    return result
+  }
+
+  /**
+   * 统一查询入口
+   * - 拦截 doQuery 进行一些返回值处理
+   * @param [params] - 可选值,默认会和 getParams(params) 返回值进行合并
+   */
+  function doQuery(params = {}) {
+    return doRunQuery(getParams(params)).then((res) => {
+      // 用于搜索关键词高亮
+      inputKeywordsState.value.matchKeys = res.origin?.heightWords?.split(
+        ' '
+      ) || [inputKeywordsState.value.input]
+    })
+  }
+
+  return {
+    searchModelOptions,
+    searchListProps,
+    SearchTabsModel,
+    inputKeywordsState,
+    filterState,
+    listState,
+    activeItemStyleType,
+    doQuery,
+    doListHeaderAction,
+    doChangeAllSelect,
+    doChangeSelect,
+    doChangePageNum,
+    doChangePageSize
+  }
+}

+ 6 - 221
apps/bigmember_pc/src/views/search/bidding/model/index.js

@@ -1,224 +1,9 @@
-import { computed, reactive } from 'vue'
-import { without } from 'lodash'
-// API 业务模型
-import useQuickSearchModel from '@jy/data-models/modules/quick-search/model'
-// 扩展业务模型
-import { useSearchFilterModel } from './modules/filter'
-import { useSearchInputKeywordsModel } from './modules/filter-keywords'
-import { useSearchListHeaderActionsModel } from './modules/list-header-actions'
-import { useSearchTabsModel } from './modules/tabs'
-import { useStore } from '@/store'
+import useModel from './base'
 
-// 解构基础业务
-const APIModel = useQuickSearchModel({
-  type: 'search-bid'
-})
-
-const {
-  list,
-  total,
-  loading,
-  finished,
-  selectIds,
-  listIds,
-  searchResultCount,
-  isSelectSomeCheckbox,
-  selectCheckboxCount,
-  isSelectListAllCheckbox,
-  doToggleItemSelection,
-  doToggleListSelection,
-  doClearAllSelection,
-  doQuery: doRunQuery
-} = APIModel
-
-const {
-  inputKeywordsState,
-  searchModelOptions,
-  getFormatAPIParams: getFormatOfInputKeywords
-} = useSearchInputKeywordsModel()
-const { filterState, getFormatAPIParams: getFormatOfFilter } =
-  useSearchFilterModel()
-const {
-  headerActions,
-  listItemStyleType,
-  activeItemStyleType,
-  activeHeaderActions
-} = useSearchListHeaderActionsModel()
-const SearchTabsModel = useSearchTabsModel()
-
-// 列表状态
-const listState = reactive({
-  finished,
-  loading,
-  pageNum: 1,
-  pageSize: 5,
-  total
-})
-
-// 当前展示的列表
-const activeList = computed(() => {
-  return list.value.map((v) => {
-    v.id = v._id
-    v.checked = selectIds.value.includes(v.id)
-    return v
-  })
-})
-
-// search-list 组件所需参数
-const searchListProps = computed(() => {
-  return {
-    isSelectAllCheckbox: isSelectListAllCheckbox.value,
-    isSelectSomeCheckbox: isSelectSomeCheckbox.value,
-    selectCheckboxCount: selectCheckboxCount.value,
-    searchResultCount: searchResultCount.value,
-    headerActions: headerActions.value,
-    list: activeList.value,
-    listState: listState
-  }
-})
-
-/**
- * 切换列表展示风格
- * @param type - 可选风格 ['refined-list', 'detailed-list', 'table']
- */
-function doChangeItemStyleType(type) {
-  const styleTypes = ['refined-list', 'detailed-list', 'table']
-  if (!styleTypes.includes(type)) {
-    return console.warn('Not find style type!')
-  }
-  listItemStyleType.value = type
-  activeHeaderActions.value = without(activeHeaderActions.value, ...styleTypes)
-  activeHeaderActions.value.push(type)
-}
-
-/**
- * 列表顶部按钮操作事件统一入口
- * @param item - 按钮原型
- * @param item.key - 按钮标识
- */
-function doListHeaderAction(item) {
-  const { key } = item
-  switch (key) {
-    case 'refined-list': {
-      doChangeItemStyleType(key)
-      break
-    }
-    case 'detailed-list': {
-      doChangeItemStyleType(key)
-      break
-    }
-    case 'table': {
-      doChangeItemStyleType(key)
-      break
-    }
-  }
-}
-
-// 全选复选框事件
-function doChangeAllSelect(type) {
-  doToggleListSelection(type)
-}
-
-// 单个复选框事件
-function doChangeSelect(item) {
-  doToggleItemSelection(item.id)
+let SearchBidModel = {}
+function useSearchBidModel() {
+  SearchBidModel = useModel()
+  return SearchBidModel
 }
 
-// 分页事件
-function doChangePageNum(page) {
-  listState.pageNum = page
-  doQuery()
-}
-
-// 分页大小事件
-function doChangePageSize(size) {
-  listState.pageSize = size
-  listState.pageNum = 1
-  doQuery()
-}
-
-// 获取 store getters
-const userType = computed(() => {
-  return useStore().getters['user/userType']
-})
-
-/**
- * 格式化请求参数
- * @param [params] - 可选值,部分情况会提供,默认会和该函数返回值进行合并
- */
-
-function getParams(params = {}) {
-  // 完整参数参考
-  const fullParams = {
-    pageNum: 1,
-    pageSize: 50,
-    reqType: '',
-    keyWords: '',
-    province: '',
-    city: '',
-    district: '',
-    subtype: '',
-    publishTime: '1682319144-1713941544',
-    searchGroup: 0,
-    searchMode: 0,
-    wordsMode: 0,
-    selectType: 'title,content',
-    price: '',
-    industry: '',
-    buyerClass: '',
-    winnerTel: '',
-    buyerTel: '',
-    exclusionWords: '',
-    buyer: '',
-    winner: '',
-    agency: '',
-    fileExists: '0',
-    splitKeywords: ''
-  }
-  // 合并所有模型的搜索筛选项
-  const result = Object.assign(
-    {
-      reqType: 'lastNews',
-      pageNum: listState.pageNum,
-      pageSize: listState.pageSize,
-      // 该接口与用户身份有关
-      _expand: {
-        type: userType.value
-      }
-    },
-    getFormatOfInputKeywords(),
-    getFormatOfFilter(),
-    params
-  )
-  return result
-}
-
-/**
- * 统一查询入口
- * - 拦截 doQuery 进行一些返回值处理
- * @param [params] - 可选值,默认会和 getParams(params) 返回值进行合并
- */
-function doQuery(params = {}) {
-  return doRunQuery(getParams(params)).then((res) => {
-    // 用于搜索关键词高亮
-    inputKeywordsState.value.matchKeys = res.origin?.heightWords?.split(
-      ' '
-    ) || [inputKeywordsState.value.input]
-  })
-}
-
-export default {
-  searchModelOptions,
-  searchListProps,
-  SearchTabsModel,
-  inputKeywordsState,
-  filterState,
-  listState,
-  activeItemStyleType,
-  doQuery,
-  doListHeaderAction,
-  doChangeAllSelect,
-  doChangeSelect,
-  doChangePageNum,
-  doChangePageSize
-}
+export { useSearchBidModel, SearchBidModel }

+ 2 - 2
apps/bigmember_pc/src/views/search/bidding/model/modules/filter.js

@@ -4,7 +4,7 @@ export function useSearchFilterModel() {
   // 筛选组件状态
   const filterState = ref({
     // 发布时间
-    publishtime: 'thisyear',
+    publishTime: 'thisyear',
     // 搜索范围
     selectType: ['content', 'title'],
     // 信息类型
@@ -33,7 +33,7 @@ export function useSearchFilterModel() {
 
   function getFormatAPIParams() {
     const params = {
-      publishTime: filterState.value.publishtime,
+      publishTime: filterState.value.publishTime,
       selectType: filterState.value.selectType.join(','),
       subtype: filterState.value.subtype.join(','),
       notkey: filterState.value.notkey.join(','),