@bsgoal/common 2.16.4 → 2.17.0

package/src/components/bsgoal-base-search-table/index.vue

@@ -1,291 +0,0 @@
-<!--
- * @Author: canlong.shen
- * @Date: 2023-04-18 17:04:47
- * @LastEditors: canlong.shen
- * @LastEditTime: 2023-07-11 11:04:07
- * @FilePath: \common\src\components\bsgoal-base-search-table\index.vue
- * @Description: 查询+表格 基础组件
- * 
--->
-
-<script setup>
-/* setup模板
----------------------------------------------------------------- */
-import { ref, computed, unref, provide, useSlots } from 'vue'
-import BsgoalBaseSearch from '../bsgoal-base-search/index.vue'
-import BsgoalBaseTable from '../bsgoal-base-table/index.vue'
-
-defineOptions({
-  name: 'BsgoalBaseSearchTable'
-})
-
-const props = defineProps({
-  /**
-   * >----------props----------<
-   * {
-   *
-   *  label: '' // 列名
-   *  prop : '' // 绑定字段
-   *
-   *
-   *  value: '' // 初始值 (查询)
-   *  type : '' // 查询组件的类型 (查询)
-   *  item : false // 只为查询项
-   *  single : false // 机构选择器配置为单个值输出
-   *
-   *
-   *  width: 0  // 列宽度 (表格)
-   *
-   * }
-   *
-   * >----------slots----------<
-   *
-   *  menu: 顶部操作区域
-   *  operation: 列表右侧操作区域
-   *
-   */
-  configOptions: {
-    type: [Array],
-    default: () => []
-  },
-
-  /**
-   * 表格数据
-   */
-  tableData: {
-    type: [Array],
-    default: () => []
-  },
-  /**
-   * 是否多选
-   */
-  selection: {
-    type: [Boolean],
-    default: false
-  },
-  /**
-   * 是否配置操作列
-   */
-  operation: {
-    type: [Boolean],
-    default: false
-  },
-  /**
-   * 操作列宽度
-   */
-  operationWidth: {
-    type: [String, Number],
-    default: 100
-  },
-  /**
-   * 请求的 promise
-   */
-  fetch: {
-    type: [Object, Function],
-    default: null
-  },
-  /**
-   * 响应的 call
-   */
-  call: {
-    type: [Object, Function],
-    default: null
-  },
-  /**
-   * 表格高度 下边距值
-   */
-  expression: {
-    type: [Number],
-    default: 75
-  },
-  /**
-   * 映射字段
-   */
-  mapProps: {
-    type: [Object],
-    default: () => ({
-      currentPage: 'currentPage',
-      pageSize: 'pageSize',
-      rows: 'rows',
-      total: 'total'
-    })
-  },
-  /**
-   * 是否显示分页
-   */
-  hasPage: {
-    type: Boolean,
-    default: true
-  },
-  /**
-   * 是否显示查询
-   */
-  hasSearch: {
-    type: Boolean,
-    default: true
-  },
-  /**
-   * pageSize
-   */
-  pageSize: {
-    type: [Number],
-    default: 20
-  },
-  /**
-   * 是否显示合计
-   */
-  showSummary: {
-    type: [Boolean],
-    default: false
-  },
-  /**
-   *  合计的列
-   */
-   summaryProps: {
-    type: [Array],
-    default: () => []
-  },
-   /**
-   * 序号 列
-   */
-   serial: {
-    type: [Boolean],
-    default: false
-  }
-})
-
-const emits = defineEmits(['select', 'select-all', 'selection-change', 'on-total-change'])
-
-const transferFoldStatus = ref(false)
-provide('transferFoldStatus', transferFoldStatus)
-
-const options = unref(props.configOptions)
-
-// 查询 配置项
-const searchOptions = computed(() => {
-  return options.filter((fi) => {
-    const { type = '' } = fi
-    return !!type
-  })
-})
-
-// 表格 配置项
-const tableOptions = computed(() => {
-  return options.filter((fi) => {
-    const { item = false } = fi
-    return !item
-  })
-})
-
-// 注入插槽列表
-const slots = useSlots()
-const slotNames = ref(Object.keys(slots))
-
-// 触发查询
-const BSGOAL_BASE_TABLE_REF = ref(null)
-const triggerSearch = (searchParams) => {
-  BSGOAL_BASE_TABLE_REF.value.refreshList(searchParams)
-}
-
-// ---> S 计算expression <---
-const expresionGet = computed(() => {
-  const { expression, hasPage } = props
-  if (hasPage === false) {
-    return 25
-  }
-  return expression
-})
-// ---> E 计算expression <---
-
-// ---> S 刷新 <---
-const BSGOAL_BASE_SEARCH_REF = ref(null)
-const refresh = () => {
-  const { hasSearch } = props
-  if (unref(hasSearch)) {
-    BSGOAL_BASE_SEARCH_REF.value.triggerOperationSearch()
-  }
-}
-// ---> E 刷新 <---
-
-// ---> S 触发事件 <---
-const triggerSelect = (selection, row) => {
-  emits('select', selection, row)
-}
-const triggerSelectAll = (selection) => {
-  emits('select-all', selection)
-}
-const triggerSelectionChange = (selection) => {
-  emits('selection-change', selection)
-}
-
-const triggerTotalChange = (total = 0) => {
-  emits('on-total-change', total)
-}
-
-// ---> E 触发事件 <---
-
-// ---> S 暴露事件 <---
-
-const clearSelection = () => {
-  BSGOAL_BASE_TABLE_REF.value.clearSelection()
-}
-
-// ---> E 暴露事件 <---
-
-// ---> S 暴露 <---
-
-defineExpose({
-  refresh,
-  clearSelection
-})
-// ---> E 暴露 <---
-</script>
-<template>
-  <div class="bsgoal-base-search-table">
-    <div class="base_search_table">
-      <!-- S 查询 -->
-      <BsgoalBaseSearch
-        ref="BSGOAL_BASE_SEARCH_REF"
-        v-show="hasSearch"
-        :config-options="searchOptions"
-        @on-search="triggerSearch"
-        @on-clear="triggerSearch"
-      />
-      <!-- E 查询 -->
-      <!-- S 表格 -->
-      <BsgoalBaseTable
-        ref="BSGOAL_BASE_TABLE_REF"
-        :show-summary="showSummary"
-        :page-size="pageSize"
-        :map-props="mapProps"
-        :operationWidth="operationWidth"
-        :config-options="tableOptions"
-        :data="tableData"
-        :selection="selection"
-        :operation="operation"
-        :expression="expresionGet"
-        :fetch="fetch"
-        :call="call"
-        :has-page="hasPage"
-        :summary-props="summaryProps"
-        :serial="serial"
-        @select="triggerSelect"
-        @select-all="triggerSelectAll"
-        @selection-change="triggerSelectionChange"
-        @on-total-change="triggerTotalChange"
-      >
-        <!-- S 顶部菜单 -->
-
-        <template v-for="slotName of slotNames" v-slot:[slotName]="{ row = {} , column = {} , index  = 0 }">
-          <slot :name="slotName" :row="row" :column="column" :index="index"></slot>
-        </template>
-        <!-- E 顶部菜单 -->
-      </BsgoalBaseTable>
-      <!-- E 表格 -->
-    </div>
-  </div>
-</template>
-<style lang="scss">
-/* 覆盖样式
----------------------------------------------------------------- */
-</style>

package/src/components/bsgoal-base-select/demo.vue

@@ -1,71 +0,0 @@
-<!--
- * @Author: canlong.shen
- * @Date: 2023-05-24 11:10:09
- * @LastEditors: canlong.shen
- * @LastEditTime: 2023-05-24 14:07:27
- * @FilePath: \common\src\components\bsgoal-base-select\demo.vue
- * @Description: select  演示
- * 
--->
-
-<script setup>
-/* setup模板
----------------------------------------------------------------- */
-import { ref } from 'vue'
-import BsgoalBaseSelect from './index.vue'
-
-defineOptions({
-  name: 'BsgoalBaseSelectDemo'
-})
-
-const props = defineProps({})
-
-const selectValue = ref('11')
-const selectRange = ref([
-  {
-    label: '11',
-    value: '11',
-    data: { prop1: 'prop1', prop2: 'prop2' }
-  },
-  {
-    label: '22',
-    value: '22'
-  },
-  {
-    label: '33',
-    value: '33'
-  }
-])
-
-/**
- * @Author: canlong.shen
- * @description: 触发 值变动
- * @default:
- * @return {*}
- */
-const change = (value = '', data = {}) => {
-  console.log('value', value)
-  console.log('data', data)
-}
-
-const test = (params = '') => {
-   selectValue.value = ''
-}
-</script>
-<template>
-  <div class="bsgoal-base-select-demo">
-    <div class="base_select_demo">
-      {{ selectValue }}
-      <BsgoalBaseSelect :model-value="selectValue" :range="selectRange" @change="change" />
-      <el-button type="primary" @click="test">test</el-button>
-    </div>
-  </div>
-</template>
-<style lang="scss" scoped>
-/* 自定义样式
----------------------------------------------------------------- */
-</style>
-<style lang="scss">
-/* 覆盖样式
----------------------------------------------------------------- */
-</style>

package/src/components/bsgoal-base-select/index.vue

@@ -1,111 +0,0 @@
-<!--
- * @Author: canlong.shen
- * @Date: 2023-05-24 11:09:59
- * @LastEditors: canlong.shen
- * @LastEditTime: 2023-05-30 17:58:18
- * @FilePath: \common\src\components\bsgoal-base-select\index.vue
- * @Description: Select 公共组件
- * 
--->
-
-<script setup>
-/* setup模板
----------------------------------------------------------------- */
-import { ref, watchEffect } from 'vue'
-
-defineOptions({
-  name: 'BsgoalBaseSelect'
-})
-
-const props = defineProps({
-  /**
-   * 占位提示符
-   */
-  placeholder: {
-    type: [String],
-    default: '请选择'
-  },
-  /**
-   * 可选范围 { label : '' , value : ''}
-   */
-  range: {
-    type: [Array],
-    default: () => []
-  },
-  /**
-   * value
-   */
-  modelValue: {
-    type: [],
-    default: ''
-  },
-  /**
-   * 无数据提示
-   */
-  none: {
-    type: [String],
-    default: '暂无数据'
-  },
-  /**
-   * 是否可清空
-   */
-  clearable: {
-    type: [Boolean],
-    default: false
-  }
-})
-
-const emits = defineEmits(['update:modelValue', 'change'])
-
-// ---> S 值绑定 <---
-
-const selectValue = ref('')
-watchEffect(() => {
-  selectValue.value = props.modelValue
-})
-
-// ---> E 值绑定 <---
-
-// ---> S 触发 方法 <---
-
-/**
- * @Author: canlong.shen
- * @description: 触发 change
- * @default:
- * @return {*}
- */
-const triggerChange = (value = '') => {
-  const { range = [] } = props
-  const finder = range.find((fi) => fi.value === value)
-  const data = finder ? finder.data : null
-
-  emits('update:modelValue', value)
-  emits('change', value, data)
-}
-
-// ---> E 触发 方法 <---
-</script>
-<template>
-  <div class="bsgoal-base-select">
-    <el-select
-      class="base_select"
-      v-model="selectValue"
-      :clearable="clearable"
-      :no-data-text="none"
-      :placeholder="placeholder"
-      @change="triggerChange"
-    >
-      <template v-for="({ label = '', value = '' }, key) of range" :key="key">
-        <el-option :label="label" :value="value"></el-option>
-      </template>
-    </el-select>
-  </div>
-</template>
-<style lang="scss" scoped>
-/* 自定义样式
----------------------------------------------------------------- */
-</style>
-<style lang="scss">
-/* 覆盖样式
----------------------------------------------------------------- */
-</style>

package/src/components/bsgoal-base-sizes/demo.vue

@@ -1,34 +0,0 @@
-<!--
- * @Author: canlong.shen
- * @Date: 2023-06-27 17:10:41
- * @LastEditors: canlong.shen
- * @LastEditTime: 2023-06-28 09:12:38
- * @FilePath: \common\src\components\bsgoal-base-sizes\demo.vue
- * @Description: 页数切换
- * 
--->
-<script setup>
-/* setup模板
----------------------------------------------------------------- */
-import { ref } from 'vue'
-import BsgoalBaseSizes from './index.vue'
-defineOptions({
-  name: 'BsgoalBaseSizesDemo'
-})
-
-const props = defineProps({})
-
-const triggerSizeChange = (params = '') => {
-  console.log(params)
-}
-</script>
-<template>
-  <div class="bsgoal-base-sizes-demo">
-    <div style="height: 400px; background-color: red"></div>
-    <BsgoalBaseSizes :page-size="20" @on-size-change="triggerSizeChange" />
-  </div>
-</template>
-<style lang="scss">
-.bsgoal-base-sizes-demo {
-}
-</style>

package/src/components/bsgoal-base-sizes/index.vue

@@ -1,178 +0,0 @@
-<!--
- * @Author: canlong.shen
- * @Date: 2023-06-27 16:52:31
- * @LastEditors: canlong.shen
- * @LastEditTime: 2023-06-28 14:56:45
- * @FilePath: \common\src\components\bsgoal-base-sizes\index.vue
- * @Description: 页数切换 公共组件
- * 
--->
-<script setup>
-/* setup模板
----------------------------------------------------------------- */
-import { ref, watch, watchEffect } from 'vue'
-import { ArrowDown, ArrowUp } from '@element-plus/icons-vue'
-defineOptions({
-  name: 'BsgoalBaseSizes'
-})
-
-const props = defineProps({
-  /**
-   * 每页显示个数选择器的选项设置
-   */
-  pageSizes: {
-    type: [Array],
-    default: () => [10, 20, 30, 40, 50, 100]
-  },
-
-  /**
-   * 每页显示条目个数
-   */
-  pageSize: {
-    type: [Number],
-    default: 0
-  },
-  /**
-   * width 宽度
-   */
-  width: {
-    type: [String, Number],
-    default: 100
-  }
-})
-
-const emits = defineEmits(['on-size-change'])
-
-// ---> S popover <---
-const visible = ref(false)
-const suffixIcon = ref(ArrowDown)
-
-const showPopover = () => {
-  suffixIcon.value = ArrowUp
-}
-const hidePopover = () => {
-  suffixIcon.value = ArrowDown
-}
-
-const selectedIndex = ref(-1)
-const selectedSize = ref(10)
-
-watch(
-  () => props.pageSize,
-  () => {
-    const { pageSize = 0, pageSizes = [] } = props
-
-    const curIndex = pageSizes.findIndex((fi) => fi === pageSize)
-
-    if (curIndex !== -1) {
-      selectedIndex.value = curIndex
-      selectedSize.value = pageSize
-    }
-  },
-  {
-    immediate: true
-  }
-)
-
-/**
- * @Author: canlong.shen
- * @description: 单击单项
- * @param {*} size
- * @param {*} key
- * @default:
- * @return {*}
- */
-const handleSizeItem = (size = 0, index = 0) => {
-  selectedIndex.value = index
-  selectedSize.value = size
-  emits('on-size-change', size)
-  visible.value = false
-}
-// ---> E popover <---
-
-// ---> S input <---
-const content = ref('')
-
-watchEffect(() => {
-  const curPageSize = selectedSize.value
-  content.value = `${curPageSize}条/页`
-})
-
-const isMicroApp = window.__MICRO_APP_ENVIRONMENT__
-
-// ---> E input <---
-</script>
-<template>
-  <div class="bsgoal-base-sizes">
-    <el-popover
-      class="base_sizes"
-      placement="top"
-      trigger="click"
-      :width="`${width}px`"
-      v-model:visible="visible"
-      :teleported="false"
-      @show="showPopover"
-      @hide="hidePopover"
-    >
-      <template #reference>
-        <el-input
-          v-model="content"
-          readonly
-          class="base_sizes_input"
-          placeholder="Please input"
-          :class="{ bsgoal_micro_app: isMicroApp }"
-          :style="{ width: `${width}px` }"
-          :suffix-icon="suffixIcon"
-        >
-        </el-input>
-      </template>
-
-      <template #default>
-        <template v-for="(size, key) of pageSizes" :key="key">
-          <div
-            class="base_sizes_item"
-            :class="{ 'base_sizes_item--selected': selectedIndex === key }"
-            @click="handleSizeItem(size, key)"
-          >
-            {{ `${size}条/页` }}
-          </div>
-        </template>
-      </template>
-    </el-popover>
-  </div>
-</template>
-<style lang="scss">
-/* 覆盖样式
----------------------------------------------------------------- */
-.bsgoal-base-sizes {
-  display: inline-block;
-  .base_sizes_input {
-    cursor: pointer;
-    margin-left: 16px;
-  }
-  .base_sizes_item {
-    text-align: center;
-    font-size: 14px;
-    padding: 0 20px;
-    color: #606266;
-    height: 34px;
-    line-height: 34px;
-    cursor: pointer;
-  }
-
-  .base_sizes_item:hover {
-    background-color: #f5f7fa;
-  }
-
-  .base_sizes_item--selected {
-    color: #409eff;
-    font-weight: 700;
-  }
-
-  .bsgoal_micro_app {
-    .el-input__suffix {
-      margin-right: 8px !important;
-    }
-  }
-}
-</style>

package/src/components/bsgoal-base-switch/demo.vue

@@ -1,39 +0,0 @@
-<!--
- * @Author: canlong.shen
- * @Date: 2023-05-24 17:20:47
- * @LastEditors: canlong.shen
- * @LastEditTime: 2023-05-24 17:43:05
- * @FilePath: \common\src\components\bsgoal-base-switch\demo.vue
- * @Description: 开关 公共组件 演示
- * 
--->
-<script setup>
-/* setup模板
----------------------------------------------------------------- */
-import { ref } from 'vue'
-import BsgoalBaseSwitch from './index.vue'
-
-defineOptions({
-  name: 'BsgoalBaseSwitchDemo'
-})
-
-const props = defineProps({})
-
-const modelValue = ref('0')
-</script>
-<template>
-  <div class="bsgoal-base-switch-demo">
-    <div class="base_switch_demo">
-        {{ modelValue }}
-      <BsgoalBaseSwitch v-model="modelValue" />
-    </div>
-  </div>
-</template>
-<style lang="scss" scoped>
-/* 自定义样式
----------------------------------------------------------------- */
-</style>
-<style lang="scss">
-/* 覆盖样式
----------------------------------------------------------------- */
-</style>