jobsys-explore 4.6.21 → 4.7.0

package/components/form/PickerWrapper.jsx

@@ -1,120 +1,120 @@
-import { defineComponent, ref } from "vue"
-import { Popup } from "vant"
-import ExField from "./ExField.jsx"
-import { omit, pick } from "lodash-es"
-import { defaultFieldProps } from "../utils"
-
-export default defineComponent({
-	name: "PickerWrapper",
-
-	props: {
-		/**
-		 * Picker 标题
-		 */
-		title: { type: String, default: "" },
-
-		/**
-		 * 是否启用卡片模式
-		 */
-		inset: { type: Boolean, default: false },
-
-		/**
-		 * 是否会弹窗
-		 */
-		disabled: { type: Boolean, default: false },
-
-		/**
-		 * 是否显示关闭
-		 */
-		closeable: { type: Boolean, default: true },
-	},
-	emits: ["close", "open"],
-	setup: (props, { emit, slots, expose }) => {
-		const showPopup = ref(false)
-
-		const onClickWrapper = () => {
-			if (props.disabled) {
-				return
-			}
-			showPopup.value = true
-			emit("open")
-		}
-
-		const close = () => {
-			showPopup.value = false
-			emit("close")
-		}
-
-		expose({ close })
-
-		return () => {
-			// 为了让 ExField 的 onClickInput 事件才触发 Popup
-			// 所以会手动获取 trigger slot 的第一个组件来手动监听 onClick 事件
-			// 如果以后有需要多个组件的情况，再做调整
-
-			let TriggerElem = slots.trigger ? slots.trigger() : null
-
-			if (TriggerElem && TriggerElem.length) {
-				TriggerElem = TriggerElem[0]
-			}
-
-			return [
-				<span class={"ex-field-popup-wrapper"}>
-					<TriggerElem onClick={onClickWrapper}></TriggerElem>
-				</span>,
-
-				<Popup
-					v-model:show={showPopup.value}
-					closeable={props.closeable}
-					position={"bottom"}
-					round={true}
-					teleport={"body"}
-					closeOnPopstate={true}
-					class={`ex-field-popup ${props.inset ? "ex-field-popup-inset" : ""}`}
-					safeAreaInsetBottom={true}
-					safeAreaInsetTop={true}
-					onClickOverlay={close}
-					onClickCloseIcon={close}
-				>
-					{{
-						default: () => [
-							props.closeable ? (
-								<div class={"ex-field-popup__header"}>
-									<h2 class={"ex-field-popup__title"}>{props.title}</h2>
-								</div>
-							) : null,
-							slots.default?.(),
-						],
-					}}
-				</Popup>,
-			]
-		}
-	},
-})
-
-export const pickerProps = (props) => {
-	return {
-		title: props.title || `请选择${props.label}`,
-		disabled: props.readonly || props.disabled,
-	}
-}
-
-export const pickerSlots = (slots, props) => {
-	let triggerElem = slots.default ? slots.default() : null
-
-	if (!triggerElem) {
-		const fieldProps = pick(props, Object.keys(defaultFieldProps))
-		// default slot 是 trigger, 其它的 slots 全部传给 ExField
-		const fieldSlots = omit(slots, "default")
-
-		triggerElem = (
-			<ExField {...fieldProps} mask={true}>
-				{fieldSlots}
-			</ExField>
-		)
-	}
-
-	return {
-		trigger: () => triggerElem,
-	}
-}
+import { defineComponent, ref } from "vue"
+import { Popup } from "vant"
+import ExField from "./ExField.jsx"
+import { omit, pick } from "lodash-es"
+import { defaultFieldProps } from "../utils"
+
+export default defineComponent({
+	name: "PickerWrapper",
+
+	props: {
+		/**
+		 * Picker 标题
+		 */
+		title: { type: String, default: "" },
+
+		/**
+		 * 是否启用卡片模式
+		 */
+		inset: { type: Boolean, default: false },
+
+		/**
+		 * 是否会弹窗
+		 */
+		disabled: { type: Boolean, default: false },
+
+		/**
+		 * 是否显示关闭
+		 */
+		closeable: { type: Boolean, default: true },
+	},
+	emits: ["close", "open"],
+	setup: (props, { emit, slots, expose }) => {
+		const showPopup = ref(false)
+
+		const onClickWrapper = () => {
+			if (props.disabled) {
+				return
+			}
+			showPopup.value = true
+			emit("open")
+		}
+
+		const close = () => {
+			showPopup.value = false
+			emit("close")
+		}
+
+		expose({ close })
+
+		return () => {
+			// 为了让 ExField 的 onClickInput 事件才触发 Popup
+			// 所以会手动获取 trigger slot 的第一个组件来手动监听 onClick 事件
+			// 如果以后有需要多个组件的情况，再做调整
+
+			let TriggerElem = slots.trigger ? slots.trigger() : null
+
+			if (TriggerElem && TriggerElem.length) {
+				TriggerElem = TriggerElem[0]
+			}
+
+			return [
+				<span class={"ex-field-popup-wrapper"}>
+					<TriggerElem onClick={onClickWrapper}></TriggerElem>
+				</span>,
+
+				<Popup
+					v-model:show={showPopup.value}
+					closeable={props.closeable}
+					position={"bottom"}
+					round={true}
+					teleport={"body"}
+					closeOnPopstate={true}
+					class={`ex-field-popup ${props.inset ? "ex-field-popup-inset" : ""}`}
+					safeAreaInsetBottom={true}
+					safeAreaInsetTop={true}
+					onClickOverlay={close}
+					onClickCloseIcon={close}
+				>
+					{{
+						default: () => [
+							props.closeable ? (
+								<div class={"ex-field-popup__header"}>
+									<h2 class={"ex-field-popup__title"}>{props.title}</h2>
+								</div>
+							) : null,
+							slots.default?.(),
+						],
+					}}
+				</Popup>,
+			]
+		}
+	},
+})
+
+export const pickerProps = (props) => {
+	return {
+		title: props.title || `请选择${props.label}`,
+		disabled: props.readonly || props.disabled,
+	}
+}
+
+export const pickerSlots = (slots, props) => {
+	let triggerElem = slots.default ? slots.default() : null
+
+	if (!triggerElem) {
+		const fieldProps = pick(props, Object.keys(defaultFieldProps))
+		// default slot 是 trigger, 其它的 slots 全部传给 ExField
+		const fieldSlots = omit(slots, "default")
+
+		triggerElem = (
+			<ExField {...fieldProps} mask={true}>
+				{fieldSlots}
+			</ExField>
+		)
+	}
+
+	return {
+		trigger: () => triggerElem,
+	}
+}

package/components/form/index.js

@@ -1,46 +1,46 @@
-import "./index.less"
-
-import withInstall from "../../utils/withInstall"
-
-import _ExField from "./ExField.jsx"
-import _ExAddress, {
-	addressData as _addressData,
-	useAddressFullCode as _useAddressFullCode,
-	useAddressNameFormCode as _useAddressNameFormCode,
-} from "./ExAddress.jsx"
-import _ExCascader from "./ExCascader.jsx"
-import _ExCheckbox from "./ExCheckbox.jsx"
-import _ExDate from "./ExDate.jsx"
-import _ExDatetime from "./ExDatetime.jsx"
-import _ExTime from "./ExTime.jsx"
-import _ExNumber from "./ExNumber.jsx"
-import _ExRadio from "./ExRadio.jsx"
-import _ExSelect from "./ExSelect.jsx"
-import _ExSwitch from "./ExSwitch.jsx"
-import _ExRate from "./ExRate.jsx"
-import _ExSlider from "./ExSlider.jsx"
-import _ExFieldUploader from "./ExFieldUploader.jsx"
-import _ExMatrixRadio from "./ExMatrixRadio.jsx"
-
-import _ExForm from "./ExForm.jsx"
-
-export const useAddressFullCode = _useAddressFullCode
-export const useAddressNameFormCode = _useAddressNameFormCode
-export const addressData = _addressData
-export const ExAddress = withInstall(_ExAddress)
-export const ExField = withInstall(_ExField)
-export const ExCascader = withInstall(_ExCascader)
-export const ExCheckbox = withInstall(_ExCheckbox)
-export const ExDate = withInstall(_ExDate)
-export const ExDatetime = withInstall(_ExDatetime)
-export const ExTime = withInstall(_ExTime)
-export const ExNumber = withInstall(_ExNumber)
-export const ExRadio = withInstall(_ExRadio)
-export const ExSelect = withInstall(_ExSelect)
-export const ExSwitch = withInstall(_ExSwitch)
-export const ExRate = withInstall(_ExRate)
-export const ExSlider = withInstall(_ExSlider)
-export const ExFieldUploader = withInstall(_ExFieldUploader)
-export const ExMatrixRadio = withInstall(_ExMatrixRadio)
-
-export const ExForm = withInstall(_ExForm)
+import "./index.less"
+
+import withInstall from "../../utils/withInstall"
+
+import _ExField from "./ExField.jsx"
+import _ExAddress, {
+	addressData as _addressData,
+	useAddressFullCode as _useAddressFullCode,
+	useAddressNameFormCode as _useAddressNameFormCode,
+} from "./ExAddress.jsx"
+import _ExCascader from "./ExCascader.jsx"
+import _ExCheckbox from "./ExCheckbox.jsx"
+import _ExDate from "./ExDate.jsx"
+import _ExDatetime from "./ExDatetime.jsx"
+import _ExTime from "./ExTime.jsx"
+import _ExNumber from "./ExNumber.jsx"
+import _ExRadio from "./ExRadio.jsx"
+import _ExSelect from "./ExSelect.jsx"
+import _ExSwitch from "./ExSwitch.jsx"
+import _ExRate from "./ExRate.jsx"
+import _ExSlider from "./ExSlider.jsx"
+import _ExFieldUploader from "./ExFieldUploader.jsx"
+import _ExMatrixRadio from "./ExMatrixRadio.jsx"
+
+import _ExForm from "./ExForm.jsx"
+
+export const useAddressFullCode = _useAddressFullCode
+export const useAddressNameFormCode = _useAddressNameFormCode
+export const addressData = _addressData
+export const ExAddress = withInstall(_ExAddress)
+export const ExField = withInstall(_ExField)
+export const ExCascader = withInstall(_ExCascader)
+export const ExCheckbox = withInstall(_ExCheckbox)
+export const ExDate = withInstall(_ExDate)
+export const ExDatetime = withInstall(_ExDatetime)
+export const ExTime = withInstall(_ExTime)
+export const ExNumber = withInstall(_ExNumber)
+export const ExRadio = withInstall(_ExRadio)
+export const ExSelect = withInstall(_ExSelect)
+export const ExSwitch = withInstall(_ExSwitch)
+export const ExRate = withInstall(_ExRate)
+export const ExSlider = withInstall(_ExSlider)
+export const ExFieldUploader = withInstall(_ExFieldUploader)
+export const ExMatrixRadio = withInstall(_ExMatrixRadio)
+
+export const ExForm = withInstall(_ExForm)

package/components/form/index.less

@@ -1,178 +1,178 @@
-.ex-form {
-    & > .van-cell-group {
-        margin-bottom: var(--van-padding-md);
-        background: transparent;
-    }
-
-    &.ex-form__fixed {
-        & > .van-cell-group {
-            margin-bottom: 100px;
-        }
-    }
-
-    .ex-form__footer {
-        margin: var(--van-padding-md);
-    }
-
-    .ex-form__btn-wrapper {
-        padding: var(--van-padding-md);
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-
-        .ex-form__cancel-btn {
-            margin-right: 4px;
-        }
-    }
-
-    .ex-form__btn-wrapper-fixed {
-        position: fixed;
-        bottom: 0;
-        left: 0;
-        right: 0;
-        background: var(--van-white);
-        padding: var(--van-padding-md);
-
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-
-        .ex-form__cancel-btn {
-            margin-right: 4px;
-        }
-    }
-}
-
-.ex-field {
-    border-bottom: 1px solid var(--van-gray-1);
-
-    .ex-field__label {
-        display: inline-block;
-
-        .ex-field__help-handler {
-            margin-left: 4px;
-        }
-    }
-
-    .van-checkbox-group .van-checkbox,
-    .van-radio-group .van-radio {
-        margin-bottom: 6px;
-    }
-
-    .van-checkbox-group .van-checkbox.van-checkbox--horizontal,
-    .van-radio-group .van-radio.van-raido--horizontal {
-        margin-bottom: 0;
-    }
-}
-
-.ex-field__help {
-    padding: 8px;
-    font-size: 13px;
-    max-width: calc(100vw * 0.5);
-}
-
-.ex-field__append {
-    padding: 5px var(--van-cell-horizontal-padding);
-    font-size: 13px;
-    background: var(--ex-white);
-}
-
-.ex-field-popup {
-    background: var(--van-gray-1) !important;
-
-    &.ex-field-popup-inset {
-        box-sizing: border-box;
-        padding: 0 var(--van-padding-md) 10px;
-    }
-
-    .ex-field-popup__header {
-        display: flex;
-        align-items: center;
-        justify-content: space-between;
-        height: 48px;
-        padding: 0 var(--van-padding-md);
-
-        .ex-field-popup__title {
-            font-weight: var(--vant-font-bold);
-            font-size: var(--van-font-size-lg);
-            line-height: 20px;
-        }
-    }
-
-    .van-collapse {
-        border-radius: var(--van-radius-lg);
-        overflow: hidden;
-
-        &.ex-datetime_collapse {
-            .van-collapse-item {
-                .van-cell {
-                    .van-cell__value {
-                        color: var(--van-primary-color);
-                    }
-                }
-            }
-        }
-    }
-
-    .van-cascader {
-        border-radius: var(--van-radius-lg);
-        overflow: hidden;
-        background: var(--van-white);
-    }
-
-    .ex-field-popup__clear-btn {
-        background: var(--ex-white);
-        margin: var(--van-padding-sm);
-    }
-}
-
-.ex-slider-button {
-    width: var(--van-slider-button-width);
-    height: var(--van-slider-button-height);
-    text-align: center;
-    color: #fff;
-    font-size: 12px;
-    line-height: var(--van-slider-button-height);
-    background: var(--van-primary-color);
-    border-radius: var(--van-slider-button-radius);
-    box-shadow: var(--van-slider-button-shadow);
-}
-
-.ex-cascader {
-    .van-cascader__header {
-        padding: 0;
-
-        .van-cascader__title {
-            width: 100%;
-        }
-    }
-}
-
-.ex-matrix {
-    .van-cell__value, .van-field__value {
-        overflow: auto;
-    }
-
-    .ex-matrix-container {
-        overflow-x: auto;
-        width: 100%;
-        margin-top: 10px;
-
-        table {
-            .ex-matrix-option {
-                min-width: 40px;
-                display: flex;
-                justify-content: center;
-                height: 30px;
-            }
-
-            .ex-matrix-row {
-                white-space: nowrap;
-                padding-right: 10px;
-                font-weight: bold;
-            }
-        }
-    }
-
-}
-
+.ex-form {
+    & > .van-cell-group {
+        margin-bottom: var(--van-padding-md);
+        background: transparent;
+    }
+
+    &.ex-form__fixed {
+        & > .van-cell-group {
+            margin-bottom: 100px;
+        }
+    }
+
+    .ex-form__footer {
+        margin: var(--van-padding-md);
+    }
+
+    .ex-form__btn-wrapper {
+        padding: var(--van-padding-md);
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+
+        .ex-form__cancel-btn {
+            margin-right: 4px;
+        }
+    }
+
+    .ex-form__btn-wrapper-fixed {
+        position: fixed;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        background: var(--van-white);
+        padding: var(--van-padding-md);
+
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+
+        .ex-form__cancel-btn {
+            margin-right: 4px;
+        }
+    }
+}
+
+.ex-field {
+    border-bottom: 1px solid var(--van-gray-1);
+
+    .ex-field__label {
+        display: inline-block;
+
+        .ex-field__help-handler {
+            margin-left: 4px;
+        }
+    }
+
+    .van-checkbox-group .van-checkbox,
+    .van-radio-group .van-radio {
+        margin-bottom: 6px;
+    }
+
+    .van-checkbox-group .van-checkbox.van-checkbox--horizontal,
+    .van-radio-group .van-radio.van-raido--horizontal {
+        margin-bottom: 0;
+    }
+}
+
+.ex-field__help {
+    padding: 8px;
+    font-size: 13px;
+    max-width: calc(100vw * 0.5);
+}
+
+.ex-field__append {
+    padding: 5px var(--van-cell-horizontal-padding);
+    font-size: 13px;
+    background: var(--ex-white);
+}
+
+.ex-field-popup {
+    background: var(--van-gray-1) !important;
+
+    &.ex-field-popup-inset {
+        box-sizing: border-box;
+        padding: 0 var(--van-padding-md) 10px;
+    }
+
+    .ex-field-popup__header {
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 48px;
+        padding: 0 var(--van-padding-md);
+
+        .ex-field-popup__title {
+            font-weight: var(--vant-font-bold);
+            font-size: var(--van-font-size-lg);
+            line-height: 20px;
+        }
+    }
+
+    .van-collapse {
+        border-radius: var(--van-radius-lg);
+        overflow: hidden;
+
+        &.ex-datetime_collapse {
+            .van-collapse-item {
+                .van-cell {
+                    .van-cell__value {
+                        color: var(--van-primary-color);
+                    }
+                }
+            }
+        }
+    }
+
+    .van-cascader {
+        border-radius: var(--van-radius-lg);
+        overflow: hidden;
+        background: var(--van-white);
+    }
+
+    .ex-field-popup__clear-btn {
+        background: var(--ex-white);
+        margin: var(--van-padding-sm);
+    }
+}
+
+.ex-slider-button {
+    width: var(--van-slider-button-width);
+    height: var(--van-slider-button-height);
+    text-align: center;
+    color: #fff;
+    font-size: 12px;
+    line-height: var(--van-slider-button-height);
+    background: var(--van-primary-color);
+    border-radius: var(--van-slider-button-radius);
+    box-shadow: var(--van-slider-button-shadow);
+}
+
+.ex-cascader {
+    .van-cascader__header {
+        padding: 0;
+
+        .van-cascader__title {
+            width: 100%;
+        }
+    }
+}
+
+.ex-matrix {
+    .van-cell__value, .van-field__value {
+        overflow: auto;
+    }
+
+    .ex-matrix-container {
+        overflow-x: auto;
+        width: 100%;
+        margin-top: 10px;
+
+        table {
+            .ex-matrix-option {
+                min-width: 40px;
+                display: flex;
+                justify-content: center;
+                height: 30px;
+            }
+
+            .ex-matrix-row {
+                white-space: nowrap;
+                padding-right: 10px;
+                font-weight: bold;
+            }
+        }
+    }
+
+}
+