lw-cdp-ui 1.0.19 → 1.0.21

package/dist/components/lwTable/useFullscreen.js

@@ -1,73 +1,73 @@
-// useFullscreen.js - 全屏功能实现
-import { ref, onMounted, onUnmounted } from 'vue'
-
-export function useFullscreen() {
-	const isFullscreen = ref(false)
-
-	// 进入全屏
-	const enterFullscreen = (element) => {
-		if (element.requestFullscreen) {
-			element.requestFullscreen()
-		} else if (element.mozRequestFullScreen) {
-			// Firefox
-			element.mozRequestFullScreen()
-		} else if (element.webkitRequestFullscreen) {
-			// Chrome, Safari and Opera
-			element.webkitRequestFullscreen()
-		} else if (element.msRequestFullscreen) {
-			// IE/Edge
-			element.msRequestFullscreen()
-		}
-	}
-
-	// 退出全屏
-	const exitFullscreen = () => {
-		if (document.exitFullscreen) {
-			document.exitFullscreen()
-		} else if (document.mozCancelFullScreen) {
-			// Firefox
-			document.mozCancelFullScreen()
-		} else if (document.webkitExitFullscreen) {
-			// Chrome, Safari and Opera
-			document.webkitExitFullscreen()
-		} else if (document.msExitFullscreen) {
-			// IE/Edge
-			document.msExitFullscreen()
-		}
-	}
-
-	// 全屏切换
-	const toggleFullScreen = () => {
-		if (isFullscreen.value) {
-			exitFullscreen()
-		} else {
-			enterFullscreen(document.documentElement)
-		}
-	}
-
-	// 检查全屏状态
-	const handleFullscreenChange = () => {
-		isFullscreen.value = Boolean(document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement || document.msFullscreenElement)
-	}
-
-	// 监听全屏状态变化
-	onMounted(() => {
-		document.addEventListener('fullscreenchange', handleFullscreenChange)
-		document.addEventListener('webkitfullscreenchange', handleFullscreenChange)
-		document.addEventListener('mozfullscreenchange', handleFullscreenChange)
-		document.addEventListener('MSFullscreenChange', handleFullscreenChange)
-	})
-
-	// 清理监听器
-	onUnmounted(() => {
-		document.removeEventListener('fullscreenchange', handleFullscreenChange)
-		document.removeEventListener('webkitfullscreenchange', handleFullscreenChange)
-		document.removeEventListener('mozfullscreenchange', handleFullscreenChange)
-		document.removeEventListener('MSFullscreenChange', handleFullscreenChange)
-	})
-
-	return {
-		isFullscreen,
-		toggle: toggleFullScreen
-	}
-}
+// useFullscreen.js - 全屏功能实现
+import { ref, onMounted, onUnmounted } from 'vue'
+
+export function useFullscreen() {
+	const isFullscreen = ref(false)
+
+	// 进入全屏
+	const enterFullscreen = (element) => {
+		if (element.requestFullscreen) {
+			element.requestFullscreen()
+		} else if (element.mozRequestFullScreen) {
+			// Firefox
+			element.mozRequestFullScreen()
+		} else if (element.webkitRequestFullscreen) {
+			// Chrome, Safari and Opera
+			element.webkitRequestFullscreen()
+		} else if (element.msRequestFullscreen) {
+			// IE/Edge
+			element.msRequestFullscreen()
+		}
+	}
+
+	// 退出全屏
+	const exitFullscreen = () => {
+		if (document.exitFullscreen) {
+			document.exitFullscreen()
+		} else if (document.mozCancelFullScreen) {
+			// Firefox
+			document.mozCancelFullScreen()
+		} else if (document.webkitExitFullscreen) {
+			// Chrome, Safari and Opera
+			document.webkitExitFullscreen()
+		} else if (document.msExitFullscreen) {
+			// IE/Edge
+			document.msExitFullscreen()
+		}
+	}
+
+	// 全屏切换
+	const toggleFullScreen = () => {
+		if (isFullscreen.value) {
+			exitFullscreen()
+		} else {
+			enterFullscreen(document.documentElement)
+		}
+	}
+
+	// 检查全屏状态
+	const handleFullscreenChange = () => {
+		isFullscreen.value = Boolean(document.fullscreenElement || document.mozFullScreenElement || document.webkitFullscreenElement || document.msFullscreenElement)
+	}
+
+	// 监听全屏状态变化
+	onMounted(() => {
+		document.addEventListener('fullscreenchange', handleFullscreenChange)
+		document.addEventListener('webkitfullscreenchange', handleFullscreenChange)
+		document.addEventListener('mozfullscreenchange', handleFullscreenChange)
+		document.addEventListener('MSFullscreenChange', handleFullscreenChange)
+	})
+
+	// 清理监听器
+	onUnmounted(() => {
+		document.removeEventListener('fullscreenchange', handleFullscreenChange)
+		document.removeEventListener('webkitfullscreenchange', handleFullscreenChange)
+		document.removeEventListener('mozfullscreenchange', handleFullscreenChange)
+		document.removeEventListener('MSFullscreenChange', handleFullscreenChange)
+	})
+
+	return {
+		isFullscreen,
+		toggle: toggleFullScreen
+	}
+}

package/dist/components/lwTableSelect/index.vue

@@ -1,254 +1,254 @@
-<template>
-  <el-select ref="select"
-             v-model="defaultValue"
-             :size="size"
-             :clearable="clearable"
-             :multiple="multiple"
-             :collapse-tags="collapseTags"
-             :collapse-tags-tooltip="collapseTagsTooltip"
-             :filterable="filterable"
-             :placeholder="placeholder"
-             :disabled="disabled"
-             :filter-method="filterMethod"
-             @remove-tag="removeTag"
-             @visible-change="visibleChange"
-             @clear="clear">
-    <template #empty>
-      <div class="lw-table-select__table"
-           style="width: 100%;"
-           v-loading="loading">
-        <div class="lw-table-select__header">
-          <slot name="header"
-                :form="formData"
-                :submit="formSubmit"></slot>
-        </div>
-        <el-table ref="table"
-                  :data="tableData"
-                  :max-height="245"
-                  :highlight-current-row="!multiple"
-                  @row-click="click"
-                  @select="select"
-                  @select-all="selectAll">
-          <el-table-column v-if="multiple"
-                           type="selection"
-                           width="45"></el-table-column>
-          <el-table-column v-else
-                           type="index"
-                           width="45">
-            <template
-                      #default="scope"><span>{{scope.$index+(currentPage - 1) * pageSize + 1}}</span></template>
-          </el-table-column>
-          <slot></slot>
-        </el-table>
-        <div class="lw-table-select__page">
-          <el-pagination small
-                         background
-                         layout="prev, pager, next"
-                         :total="total"
-                         :page-size="pageSize"
-                         v-model:currentPage="currentPage"
-                         @current-change="reload"></el-pagination>
-        </div>
-      </div>
-    </template>
-  </el-select>
-</template>
-
-<script>
-import config from "./tableSelect";
-
-export default {
-  props: {
-    modelValue: null,
-    apiObj: { type: Object, default: () => { } },
-    params: { type: Object, default: () => { } },
-    placeholder: { type: String, default: "请选择" },
-    size: { type: String, default: "default" },
-    clearable: { type: Boolean, default: false },
-    multiple: { type: Boolean, default: false },
-    filterable: { type: Boolean, default: false },
-    collapseTags: { type: Boolean, default: false },
-    collapseTagsTooltip: { type: Boolean, default: false },
-    disabled: { type: Boolean, default: false },
-    tableWidth: { type: Number, default: 400 },
-    mode: { type: String, default: "popover" },
-
-    // 定义什么参数就返回什么  value label 为 必须字段
-    props: { type: Object, default: () => { } }
-  },
-  data() {
-    return {
-      loading: false,
-      keyword: null,
-      defaultValue: [],
-      tableData: [],
-      pageSize: config.pageSize,
-      total: 0,
-      currentPage: 1,
-      defaultProps: {
-        label: config.props.label,
-        value: config.props.value,
-        page: config.request.page,
-        pageSize: config.request.pageSize,
-        keyword: config.request.keyword
-      },
-      formData: {}
-    }
-  },
-  computed: {
-
-  },
-  watch: {
-    modelValue: {
-      handler() {
-        this.defaultValue = this.modelValue
-      },
-      deep: true
-    }
-  },
-  mounted() {
-    this.defaultProps = Object.assign(this.defaultProps, this.props);
-    this.defaultValue = this.modelValue
-  },
-  methods: {
-    //表格显示隐藏回调
-    visibleChange(visible) {
-      if (visible) {
-        this.currentPage = 1
-        this.keyword = null
-        this.formData = {}
-        this.getData()
-      }
-    },
-    //获取表格数据
-    async getData() {
-      this.loading = true;
-      var reqData = {
-        [this.defaultProps.page]: this.currentPage - 1,
-        [this.defaultProps.pageSize]: this.pageSize,
-        [this.defaultProps.keyword]: this.keyword
-      }
-      Object.assign(reqData, this.params, this.formData)
-      var res = await this.apiObj(reqData);
-      var parseData = config.parseData(res)
-      this.tableData = parseData.rows;
-      this.total = parseData.total;
-      this.loading = false;
-      //表格默认赋值
-      this.$nextTick(() => {
-        if (this.multiple) {
-          this.defaultValue.forEach(row => {
-            var setrow = this.tableData.filter(item => item[this.defaultProps.value] === row['value'])
-            if (setrow.length > 0) {
-              this.$refs.table.toggleRowSelection(setrow[0], true);
-            }
-          })
-        } else {
-          var setrow = this.tableData.filter(item => item[this.defaultProps.value] === this.defaultValue['value'])
-          this.$refs.table.setCurrentRow(setrow[0]);
-        }
-        this.$refs.table.setScrollTop(0)
-      })
-    },
-    //插糟表单提交
-    formSubmit() {
-      this.currentPage = 1
-      this.keyword = null
-      this.getData()
-    },
-    //分页刷新表格
-    reload() {
-      this.getData()
-    },
-    // 处理选中值
-    getCurVlaue(row) {
-      const filteredRow = {};
-      // 遍历 this.defaultProps 中定义的字段并保留对应的值
-      Object.entries(this.defaultProps).forEach(([key, propKey]) => {
-
-        if (row[propKey]) {
-          filteredRow[key] = row[propKey]
-        }
-
-      });
-      return filteredRow
-    },
-    //表格勾选事件
-    select(rows, row) {
-      var isSelect = rows.length && rows.indexOf(row) !== -1
-      if (isSelect) {
-        this.defaultValue.push(this.getCurVlaue(row))
-      } else {
-        this.defaultValue.splice(this.defaultValue.findIndex(item => item['value'] == row[this.defaultProps.value]), 1)
-      }
-
-    },
-    //表格全选事件
-    selectAll(rows) {
-      var isAllSelect = rows.length > 0
-      if (isAllSelect) {
-        rows.forEach(row => {
-          var isHas = this.defaultValue.find(item => item['value'] == row[this.defaultProps.value])
-          if (!isHas) {
-            this.defaultValue.push(this.getCurVlaue(row))
-          }
-
-        })
-      } else {
-        this.defaultValue = []
-      }
-      this.$emit('update:modelValue', this.defaultValue);
-      this.$emit('change', this.defaultValue);
-    },
-    click(row) {
-      if (this.multiple) {
-        //处理多选点击行
-      } else {
-        this.defaultValue = this.getCurVlaue(row)
-        this.$refs.select.blur()
-        this.$emit('update:modelValue', this.defaultValue);
-        this.$emit('change', this.defaultValue);
-      }
-    },
-    //tags删除后回调
-    removeTag(tag) {
-      var row = this.findRowByKey(tag[this.defaultProps.value])
-      this.$refs.table.toggleRowSelection(row, false);
-      this.$emit('update:modelValue', this.defaultValue);
-    },
-    //清空后的回调
-    clear() {
-      this.$emit('update:modelValue', this.defaultValue);
-    },
-    // 关键值查询表格数据行
-    findRowByKey(value) {
-      return this.tableData.find(item => item[this.defaultProps.value] === value)
-    },
-    filterMethod(keyword) {
-      if (!keyword) {
-        this.keyword = null;
-        return false;
-      }
-      this.keyword = keyword;
-      this.getData()
-    },
-    // 触发select隐藏
-    blur() {
-      this.$refs.select.blur();
-    },
-    // 触发select显示
-    focus() {
-      this.$refs.select.focus();
-    }
-  }
-}
-</script>
-
-<style scoped>
-.lw-table-select__table {
-  padding: 12px;
-}
-.lw-table-select__page {
-  padding-top: 12px;
-}
-</style>
+<template>
+  <el-select ref="select"
+             v-model="defaultValue"
+             :size="size"
+             :clearable="clearable"
+             :multiple="multiple"
+             :collapse-tags="collapseTags"
+             :collapse-tags-tooltip="collapseTagsTooltip"
+             :filterable="filterable"
+             :placeholder="placeholder"
+             :disabled="disabled"
+             :filter-method="filterMethod"
+             @remove-tag="removeTag"
+             @visible-change="visibleChange"
+             @clear="clear">
+    <template #empty>
+      <div class="lw-table-select__table"
+           style="width: 100%;"
+           v-loading="loading">
+        <div class="lw-table-select__header">
+          <slot name="header"
+                :form="formData"
+                :submit="formSubmit"></slot>
+        </div>
+        <el-table ref="table"
+                  :data="tableData"
+                  :max-height="245"
+                  :highlight-current-row="!multiple"
+                  @row-click="click"
+                  @select="select"
+                  @select-all="selectAll">
+          <el-table-column v-if="multiple"
+                           type="selection"
+                           width="45"></el-table-column>
+          <el-table-column v-else
+                           type="index"
+                           width="45">
+            <template
+                      #default="scope"><span>{{scope.$index+(currentPage - 1) * pageSize + 1}}</span></template>
+          </el-table-column>
+          <slot></slot>
+        </el-table>
+        <div class="lw-table-select__page">
+          <el-pagination small
+                         background
+                         layout="prev, pager, next"
+                         :total="total"
+                         :page-size="pageSize"
+                         v-model:currentPage="currentPage"
+                         @current-change="reload"></el-pagination>
+        </div>
+      </div>
+    </template>
+  </el-select>
+</template>
+
+<script>
+import config from "./tableSelect";
+
+export default {
+  props: {
+    modelValue: null,
+    apiObj: { type: Object, default: () => { } },
+    params: { type: Object, default: () => { } },
+    placeholder: { type: String, default: "请选择" },
+    size: { type: String, default: "default" },
+    clearable: { type: Boolean, default: false },
+    multiple: { type: Boolean, default: false },
+    filterable: { type: Boolean, default: false },
+    collapseTags: { type: Boolean, default: false },
+    collapseTagsTooltip: { type: Boolean, default: false },
+    disabled: { type: Boolean, default: false },
+    tableWidth: { type: Number, default: 400 },
+    mode: { type: String, default: "popover" },
+
+    // 定义什么参数就返回什么  value label 为 必须字段
+    props: { type: Object, default: () => { } }
+  },
+  data() {
+    return {
+      loading: false,
+      keyword: null,
+      defaultValue: [],
+      tableData: [],
+      pageSize: config.pageSize,
+      total: 0,
+      currentPage: 1,
+      defaultProps: {
+        label: config.props.label,
+        value: config.props.value,
+        page: config.request.page,
+        pageSize: config.request.pageSize,
+        keyword: config.request.keyword
+      },
+      formData: {}
+    }
+  },
+  computed: {
+
+  },
+  watch: {
+    modelValue: {
+      handler() {
+        this.defaultValue = this.modelValue
+      },
+      deep: true
+    }
+  },
+  mounted() {
+    this.defaultProps = Object.assign(this.defaultProps, this.props);
+    this.defaultValue = this.modelValue
+  },
+  methods: {
+    //表格显示隐藏回调
+    visibleChange(visible) {
+      if (visible) {
+        this.currentPage = 1
+        this.keyword = null
+        this.formData = {}
+        this.getData()
+      }
+    },
+    //获取表格数据
+    async getData() {
+      this.loading = true;
+      var reqData = {
+        [this.defaultProps.page]: this.currentPage - 1,
+        [this.defaultProps.pageSize]: this.pageSize,
+        [this.defaultProps.keyword]: this.keyword
+      }
+      Object.assign(reqData, this.params, this.formData)
+      var res = await this.apiObj(reqData);
+      var parseData = config.parseData(res)
+      this.tableData = parseData.rows;
+      this.total = parseData.total;
+      this.loading = false;
+      //表格默认赋值
+      this.$nextTick(() => {
+        if (this.multiple) {
+          this.defaultValue.forEach(row => {
+            var setrow = this.tableData.filter(item => item[this.defaultProps.value] === row['value'])
+            if (setrow.length > 0) {
+              this.$refs.table.toggleRowSelection(setrow[0], true);
+            }
+          })
+        } else {
+          var setrow = this.tableData.filter(item => item[this.defaultProps.value] === this.defaultValue['value'])
+          this.$refs.table.setCurrentRow(setrow[0]);
+        }
+        this.$refs.table.setScrollTop(0)
+      })
+    },
+    //插糟表单提交
+    formSubmit() {
+      this.currentPage = 1
+      this.keyword = null
+      this.getData()
+    },
+    //分页刷新表格
+    reload() {
+      this.getData()
+    },
+    // 处理选中值
+    getCurVlaue(row) {
+      const filteredRow = {};
+      // 遍历 this.defaultProps 中定义的字段并保留对应的值
+      Object.entries(this.defaultProps).forEach(([key, propKey]) => {
+
+        if (row[propKey]) {
+          filteredRow[key] = row[propKey]
+        }
+
+      });
+      return filteredRow
+    },
+    //表格勾选事件
+    select(rows, row) {
+      var isSelect = rows.length && rows.indexOf(row) !== -1
+      if (isSelect) {
+        this.defaultValue.push(this.getCurVlaue(row))
+      } else {
+        this.defaultValue.splice(this.defaultValue.findIndex(item => item['value'] == row[this.defaultProps.value]), 1)
+      }
+
+    },
+    //表格全选事件
+    selectAll(rows) {
+      var isAllSelect = rows.length > 0
+      if (isAllSelect) {
+        rows.forEach(row => {
+          var isHas = this.defaultValue.find(item => item['value'] == row[this.defaultProps.value])
+          if (!isHas) {
+            this.defaultValue.push(this.getCurVlaue(row))
+          }
+
+        })
+      } else {
+        this.defaultValue = []
+      }
+      this.$emit('update:modelValue', this.defaultValue);
+      this.$emit('change', this.defaultValue);
+    },
+    click(row) {
+      if (this.multiple) {
+        //处理多选点击行
+      } else {
+        this.defaultValue = this.getCurVlaue(row)
+        this.$refs.select.blur()
+        this.$emit('update:modelValue', this.defaultValue);
+        this.$emit('change', this.defaultValue);
+      }
+    },
+    //tags删除后回调
+    removeTag(tag) {
+      var row = this.findRowByKey(tag[this.defaultProps.value])
+      this.$refs.table.toggleRowSelection(row, false);
+      this.$emit('update:modelValue', this.defaultValue);
+    },
+    //清空后的回调
+    clear() {
+      this.$emit('update:modelValue', this.defaultValue);
+    },
+    // 关键值查询表格数据行
+    findRowByKey(value) {
+      return this.tableData.find(item => item[this.defaultProps.value] === value)
+    },
+    filterMethod(keyword) {
+      if (!keyword) {
+        this.keyword = null;
+        return false;
+      }
+      this.keyword = keyword;
+      this.getData()
+    },
+    // 触发select隐藏
+    blur() {
+      this.$refs.select.blur();
+    },
+    // 触发select显示
+    focus() {
+      this.$refs.select.focus();
+    }
+  }
+}
+</script>
+
+<style scoped>
+.lw-table-select__table {
+  padding: 12px;
+}
+.lw-table-select__page {
+  padding-top: 12px;
+}
+</style>