widget.qw 1.0.24 → 1.0.25

package/src/components/index.js

@@ -1,157 +1,157 @@
-// 引入封装好的组件
-import vm from "../vm";
-import AuditBar from "./AuditBar.vue";
-import Input from "./Input.vue";
-import SinglePicker from "./SinglePicker.vue";
-import MultiPicker from './MultiPicker.vue'
-import CheckGroup from "./CheckGroup.vue";
-import DatetimePicker from "./DatetimePicker/index.vue";
-import DataSelector from "./data_selector.vue";
-import MultListSelector from "./mult_list_selector.vue";
-import SubdepartmentSelector from "./subdepartment_selector.vue";
-import UserSelector from "./user_selector.vue";
-import ImagePicker from "./image_picker.vue";
-import ImagesPicker from "./images_picker.vue";
-import FilePicker from "./FilePicker.vue";
-import SingleUserSelector from "./SingleUserSelector.vue";
-import UsersPicker from "./UsersPicker.vue"
-import UserPicker from "./UserPicker.vue"
-import UserProfile from "./UserProfile.vue"
-import BillCard from './BillCard.vue'
-import YearDropdown from "./YearDropdown.vue";
-import MonthDropdown from "./MonthDropdown.vue";
-import DayDropdown from "./DayDropdown.vue";
-import Switch from './Switch.vue'
-import Sheet from './Sheet.vue'
-import TreePicker from './TreePicker.vue'
-import CascaderPop from './CascaderPop.vue'
-import CascaderPicker from './CascaderPicker.vue'
-import SingleApiPicker from "./SingleApiPicker.vue";
-
-const components = [
-  {
-    name: "WidgetQwAuditBar",
-    widget: AuditBar,
-  },
-  {
-    name: "WidgetQwInput",
-    widget: Input,
-  },
-  {
-    name: "WidgetQwSinglePicker",
-    widget: SinglePicker,
-  },
-  {
-    name: "WidgetQwMultiPicker",
-    widget: MultiPicker,
-  },
-  {
-    name: "WidgetQwCheckGroup",
-    widget: CheckGroup,
-  },
-  {
-    name: "WidgetQwDatetimePicker",
-    widget: DatetimePicker,
-  },
-  {
-    name: "WidgetQwDataSelector",
-    widget: DataSelector,
-  },
-  {
-    name: "WidgetQwMultListSelector",
-    widget: MultListSelector,
-  },
-  {
-    name: "WidgetQwSubdepartmentSelector",
-    widget: SubdepartmentSelector,
-  },
-  {
-    name: "WidgetQwSingleUserSelector",
-    widget: SingleUserSelector,
-  },
-  {
-    name: "WidgetQwImagePicker",
-    widget: ImagePicker,
-  },
-  {
-    name: "WidgetQwImagesPicker",
-    widget: ImagesPicker,
-  },
-  {
-    name: "WidgetQwFilePicker",
-    widget: FilePicker,
-  },
-  {
-    name: 'WidgetQwBillCard',
-    widget: BillCard
-  },
-  {
-    name: 'WidgetQwUserSelector',
-    widget: UserSelector
-  },
-  {
-    name: 'WidgetQwUsersPicker',
-    widget: UsersPicker
-  },
-  {
-    name: 'WidgetQwUserPicker',
-    widget: UserPicker
-  },
-  {
-    name: 'WidgetQwUserProfile',
-    widget: UserProfile
-  },
-  {
-    name: 'WidgetQwYearDropdown',
-    widget: YearDropdown
-  },
-  {
-    name: 'WidgetQwMonthDropdown',
-    widget: MonthDropdown
-  },
-  {
-    name: 'WidgetQwDayDropdown',
-    widget: DayDropdown
-  },
-  {
-    name: 'WidgetQwSwitch',
-    widget: Switch
-  },
-  {
-    name: 'WidgetQwSheet',
-    widget: Sheet
-  },
-  {
-    name: 'WidgetQwTreePicker',
-    widget: TreePicker
-  },
-  {
-    name: 'WidgetQwCascaderPop',
-    widget: CascaderPop
-  },
-  {
-    name: 'WidgetQwCascaderPicker',
-    widget: CascaderPicker
-  },
-  {
-    name: 'WidgetQwSingleApiPicker',
-    widget: SingleApiPicker
-  },
-];
-// 导出组件
-export const WidgetQw = {
-  install(app) {
-    components.forEach((component) => {
-      app.component(component.name, component.widget);
-    });
-  },
-};
-
-// 导出初始化方法
-export function setup(params) {
-  Object.keys(params).forEach(key=>{
-    vm[key] = params[key]
-  })
-}
-
-export * from "./SecretNotify";
+// 引入封装好的组件
+import vm from "../vm";
+import AuditBar from "./AuditBar.vue";
+import Input from "./Input.vue";
+import SinglePicker from "./SinglePicker.vue";
+import MultiPicker from './MultiPicker.vue'
+import CheckGroup from "./CheckGroup.vue";
+import DatetimePicker from "./DatetimePicker/index.vue";
+import DataSelector from "./data_selector.vue";
+import MultListSelector from "./mult_list_selector.vue";
+import SubdepartmentSelector from "./subdepartment_selector.vue";
+import UserSelector from "./user_selector.vue";
+import ImagePicker from "./image_picker.vue";
+import ImagesPicker from "./images_picker.vue";
+import FilePicker from "./FilePicker.vue";
+import SingleUserSelector from "./SingleUserSelector.vue";
+import UsersPicker from "./UsersPicker.vue"
+import UserPicker from "./UserPicker.vue"
+import UserProfile from "./UserProfile.vue"
+import BillCard from './BillCard.vue'
+import YearDropdown from "./YearDropdown.vue";
+import MonthDropdown from "./MonthDropdown.vue";
+import DayDropdown from "./DayDropdown.vue";
+import Switch from './Switch.vue'
+import Sheet from './Sheet.vue'
+import TreePicker from './TreePicker.vue'
+import CascaderPop from './CascaderPop.vue'
+import CascaderPicker from './CascaderPicker.vue'
+import SingleApiPicker from "./SingleApiPicker.vue";
+
+const components = [
+  {
+    name: "WidgetQwAuditBar",
+    widget: AuditBar,
+  },
+  {
+    name: "WidgetQwInput",
+    widget: Input,
+  },
+  {
+    name: "WidgetQwSinglePicker",
+    widget: SinglePicker,
+  },
+  {
+    name: "WidgetQwMultiPicker",
+    widget: MultiPicker,
+  },
+  {
+    name: "WidgetQwCheckGroup",
+    widget: CheckGroup,
+  },
+  {
+    name: "WidgetQwDatetimePicker",
+    widget: DatetimePicker,
+  },
+  {
+    name: "WidgetQwDataSelector",
+    widget: DataSelector,
+  },
+  {
+    name: "WidgetQwMultListSelector",
+    widget: MultListSelector,
+  },
+  {
+    name: "WidgetQwSubdepartmentSelector",
+    widget: SubdepartmentSelector,
+  },
+  {
+    name: "WidgetQwSingleUserSelector",
+    widget: SingleUserSelector,
+  },
+  {
+    name: "WidgetQwImagePicker",
+    widget: ImagePicker,
+  },
+  {
+    name: "WidgetQwImagesPicker",
+    widget: ImagesPicker,
+  },
+  {
+    name: "WidgetQwFilePicker",
+    widget: FilePicker,
+  },
+  {
+    name: 'WidgetQwBillCard',
+    widget: BillCard
+  },
+  {
+    name: 'WidgetQwUserSelector',
+    widget: UserSelector
+  },
+  {
+    name: 'WidgetQwUsersPicker',
+    widget: UsersPicker
+  },
+  {
+    name: 'WidgetQwUserPicker',
+    widget: UserPicker
+  },
+  {
+    name: 'WidgetQwUserProfile',
+    widget: UserProfile
+  },
+  {
+    name: 'WidgetQwYearDropdown',
+    widget: YearDropdown
+  },
+  {
+    name: 'WidgetQwMonthDropdown',
+    widget: MonthDropdown
+  },
+  {
+    name: 'WidgetQwDayDropdown',
+    widget: DayDropdown
+  },
+  {
+    name: 'WidgetQwSwitch',
+    widget: Switch
+  },
+  {
+    name: 'WidgetQwSheet',
+    widget: Sheet
+  },
+  {
+    name: 'WidgetQwTreePicker',
+    widget: TreePicker
+  },
+  {
+    name: 'WidgetQwCascaderPop',
+    widget: CascaderPop
+  },
+  {
+    name: 'WidgetQwCascaderPicker',
+    widget: CascaderPicker
+  },
+  {
+    name: 'WidgetQwSingleApiPicker',
+    widget: SingleApiPicker
+  },
+];
+// 导出组件
+export const WidgetQw = {
+  install(app) {
+    components.forEach((component) => {
+      app.component(component.name, component.widget);
+    });
+  },
+};
+
+// 导出初始化方法
+export function setup(params) {
+  Object.keys(params).forEach(key=>{
+    vm[key] = params[key]
+  })
+}
+
+export * from "./SecretNotify";

package/src/components/mult_list_selector.vue

@@ -1,156 +1,156 @@
-<template>
-  <!-- Tips section with corrected syntax -->
-  <div class="confirmation-tips" v-if="tips && tips.length > 0">
-    <van-icon name="info" color="#1989fa" />
-    <span>{{ tips }}</span>
-  </div>
-
-  <van-checkbox-group 
-    :model-value="modelValue" 
-    @update:model-value="$emit('update:modelValue', $event)"
-    class="confirmation-group" 
-    :required="required"
-    :disabled="props.disabled"
-    :rules="rules"
-  >
-    <div class="confirmation-item" v-for="item in options" :key="item.value">
-      <van-checkbox 
-        :name="item.value" 
-        shape="square" 
-        icon-size="18px" 
-        class="custom-checkbox" 
-      >
-        <span class="option-text">{{ item.label }}</span>
-      </van-checkbox>
-    </div>
-  </van-checkbox-group>
-</template>
-
-<script setup>
-import { ref, watch, nextTick } from 'vue';
-const props = defineProps({
-  options: {
-    type: Array,
-    required: true
-  },
-  modelValue: {
-    type: Array,
-    default: () => []
-  },
-  disabled: {
-    type: Boolean,
-    default: false
-  },
-  required: {
-    type: Boolean,
-    default: true
-  },
-  tips: {
-    type: String,
-    default: ''
-  },
-  rules : {
-    type: Array,
-    default: () => []
-  }
-});
-
-defineEmits(['update:modelValue']);
-
-// watch(() => props.disabled, (newVal) => {
-//   console.log('disabled状态变化:', newVal);
-//   // 强制更新复选框状态
-//   nextTick(() => {
-//     const checkboxes = document.querySelectorAll('.van-checkbox');
-//     checkboxes.forEach(checkbox => {
-//       checkbox.style.pointerEvents = newVal ? 'none' : 'auto';
-//       checkbox.style.opacity = newVal ? '0.6' : '1';
-//     });
-//   });
-// });
-</script>
-
-<style scoped>
-/* // 修改 confirmation-group 和 confirmation-item 的样式 */
-.confirmation-group {
-  padding: 0 16px;
-  --van-checkbox-disabled-icon-color: black;
-}
-
-.confirmation-item {
-  padding: 12px 16px;
-  margin: 0 -16px;
-  border-bottom: 1px solid #f5f5f5;
-  /* 禁用状态样式 */
-  
-}
-
-/* // 在下方添加媒体查询适配小屏幕 */
-@media (max-width: 320px) {
-  .confirmation-item {
-    padding: 12px 8px;
-    margin: 0 -8px;
-  }
-}
-
-.confirmation-item:last-child {
-  border-bottom: none;
-}
-
-/* 新增样式 */
-.confirmation-tips {
-  padding: 12px 16px;
-  background: #f0faff;
-  border-radius: 8px;
-  margin: 10px 16px;
-  display: flex;
-  align-items: center;
-  color: #1989fa;
-  font-size: 13px;
-  border: 1px solid #d9efff;
-}
-
-.confirmation-tips .van-icon {
-  margin-right: 8px;
-}
-
-/* 新增字体继承样式 */
-.confirmation-group {
-  font-size: inherit;  /* 继承父级字体大小 */
-}
-
-.option-text {
-  font-size: 14px;  /* 明确指定字体大小 */
-  line-height: 1.5;  /* 保持行高一致 */
-  /* color:black; */
-}
-
-/* 适配移动端的字体调整 */
-@media (max-width: 375px) {
-  .option-text {
-    font-size: 13px;
-  }
-}
-
-/* 新增禁用状态样式 */
-.custom-checkbox:disabled :deep(.--van-checkbox__icon) {
-  background-color: #f5f5f5;
-  border-color: #ebedf0;
-  transition: all 0.3s;
-}
-
-.custom-checkbox:disabled :deep(.van-checkbox__icon--checked) {
-  background-color: #1989fa;
-  border-color: #1989fa;
-  opacity: 0.7;
-}
-
-.van-checkbox--disabled :deep(.option-text) {
-  color: #969799;
-}
-
-.van-checkbox--disabled.van-checkbox--checked :deep(.option-text) {
-  color: #1989fa;
-  opacity: 0.8;
-}
+<template>
+  <!-- Tips section with corrected syntax -->
+  <div class="confirmation-tips" v-if="tips && tips.length > 0">
+    <van-icon name="info" color="#1989fa" />
+    <span>{{ tips }}</span>
+  </div>
+
+  <van-checkbox-group 
+    :model-value="modelValue" 
+    @update:model-value="$emit('update:modelValue', $event)"
+    class="confirmation-group" 
+    :required="required"
+    :disabled="props.disabled"
+    :rules="rules"
+  >
+    <div class="confirmation-item" v-for="item in options" :key="item.value">
+      <van-checkbox 
+        :name="item.value" 
+        shape="square" 
+        icon-size="18px" 
+        class="custom-checkbox" 
+      >
+        <span class="option-text">{{ item.label }}</span>
+      </van-checkbox>
+    </div>
+  </van-checkbox-group>
+</template>
+
+<script setup>
+import { ref, watch, nextTick } from 'vue';
+const props = defineProps({
+  options: {
+    type: Array,
+    required: true
+  },
+  modelValue: {
+    type: Array,
+    default: () => []
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  },
+  required: {
+    type: Boolean,
+    default: true
+  },
+  tips: {
+    type: String,
+    default: ''
+  },
+  rules : {
+    type: Array,
+    default: () => []
+  }
+});
+
+defineEmits(['update:modelValue']);
+
+// watch(() => props.disabled, (newVal) => {
+//   console.log('disabled状态变化:', newVal);
+//   // 强制更新复选框状态
+//   nextTick(() => {
+//     const checkboxes = document.querySelectorAll('.van-checkbox');
+//     checkboxes.forEach(checkbox => {
+//       checkbox.style.pointerEvents = newVal ? 'none' : 'auto';
+//       checkbox.style.opacity = newVal ? '0.6' : '1';
+//     });
+//   });
+// });
+</script>
+
+<style scoped>
+/* // 修改 confirmation-group 和 confirmation-item 的样式 */
+.confirmation-group {
+  padding: 0 16px;
+  --van-checkbox-disabled-icon-color: black;
+}
+
+.confirmation-item {
+  padding: 12px 16px;
+  margin: 0 -16px;
+  border-bottom: 1px solid #f5f5f5;
+  /* 禁用状态样式 */
+  
+}
+
+/* // 在下方添加媒体查询适配小屏幕 */
+@media (max-width: 320px) {
+  .confirmation-item {
+    padding: 12px 8px;
+    margin: 0 -8px;
+  }
+}
+
+.confirmation-item:last-child {
+  border-bottom: none;
+}
+
+/* 新增样式 */
+.confirmation-tips {
+  padding: 12px 16px;
+  background: #f0faff;
+  border-radius: 8px;
+  margin: 10px 16px;
+  display: flex;
+  align-items: center;
+  color: #1989fa;
+  font-size: 13px;
+  border: 1px solid #d9efff;
+}
+
+.confirmation-tips .van-icon {
+  margin-right: 8px;
+}
+
+/* 新增字体继承样式 */
+.confirmation-group {
+  font-size: inherit;  /* 继承父级字体大小 */
+}
+
+.option-text {
+  font-size: 14px;  /* 明确指定字体大小 */
+  line-height: 1.5;  /* 保持行高一致 */
+  /* color:black; */
+}
+
+/* 适配移动端的字体调整 */
+@media (max-width: 375px) {
+  .option-text {
+    font-size: 13px;
+  }
+}
+
+/* 新增禁用状态样式 */
+.custom-checkbox:disabled :deep(.--van-checkbox__icon) {
+  background-color: #f5f5f5;
+  border-color: #ebedf0;
+  transition: all 0.3s;
+}
+
+.custom-checkbox:disabled :deep(.van-checkbox__icon--checked) {
+  background-color: #1989fa;
+  border-color: #1989fa;
+  opacity: 0.7;
+}
+
+.van-checkbox--disabled :deep(.option-text) {
+  color: #969799;
+}
+
+.van-checkbox--disabled.van-checkbox--checked :deep(.option-text) {
+  color: #1989fa;
+  opacity: 0.8;
+}
 </style>