@wetspace/pro-components
Version:
::: tip 基本介绍
198 lines (197 loc) • 8.61 kB
JavaScript
import { defineComponent as $, computed as p, ref as B, watch as I, shallowRef as j, useSlots as O, openBlock as a, createElementBlock as g, normalizeClass as w, unref as t, createBlock as r, mergeProps as n, withCtx as f, createElementVNode as P, createVNode as U, createTextVNode as D, toDisplayString as _, resolveDynamicComponent as z, Fragment as V, renderList as M, normalizeProps as R, createCommentVNode as L, renderSlot as G } from "vue";
import { useNamespace as H, ElFormItem as J, ElTooltip as K, ElText as Q, ElAutocomplete as W, ElCascader as X, ElColorPicker as Y, ElSelect as Z, ElOption as ee, ElTimeSelect as le, ElRate as ae, ElInputNumber as oe, ElTreeSelect as te, ElDatePicker as ue, ElTimePicker as re, ElSwitch as ne, ElInput as ie } from "element-plus";
import de from "../../../pro-table/src/components/enum.vue.mjs";
import me from "../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/get.mjs";
import se from "../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/isPlainObject.mjs";
import k from "../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/cloneDeep.mjs";
import b from "../../../node_modules/.pnpm/lodash-es@4.17.21/node_modules/lodash-es/set.mjs";
const ve = { key: 1 }, ke = /* @__PURE__ */ $({
__name: "columns-item",
props: {
controlCellMethod: Function,
row: {
type: Object,
required: !0
},
prop: {
type: [String, Array],
required: !0
},
index: Number,
itemConfig: {
type: Object,
default() {
return { dataIndex: "" };
}
},
changeValue: {
type: Function,
required: !0
},
emitControlChangeValue: {
type: Function
},
readonly: Boolean,
controlled: Boolean,
saveFlag: Boolean,
columns: Array
},
setup(A) {
const x = H("editable-table-column"), e = A, s = p(() => e.itemConfig.valueType || ""), u = B(), y = p(() => me(e.row, e.itemConfig.dataIndex, void 0)), F = p(() => {
const l = Array.isArray(e.prop) ? e.prop : e.prop ? [e.prop] : [], o = Array.isArray(e.itemConfig.dataIndex) ? e.itemConfig.dataIndex : e.itemConfig.dataIndex ? [e.itemConfig.dataIndex] : [];
return [...l, `${e.index}`, ...o];
}), S = p(() => {
var l;
return (l = e.itemConfig) != null && l.valueEnum ? e.itemConfig.valueEnum.map((o) => se(o) ? o : {
label: o,
value: o,
disabled: !1
}) : [];
}), v = p(() => {
var m;
const l = e.itemConfig.fieldProps, o = (m = e.columns) == null ? void 0 : m.findIndex((c) => Array.isArray(c) && Array.isArray(e.prop) ? c.join(".") === e.prop.join(".") : c === e.prop);
return e.controlCellMethod ? {
...l,
...e.controlCellMethod({
row: e.row,
prop: e.prop,
rowIndex: o,
columnIndex: e.index
})
} : l;
}), i = p(() => v.value.disabled !== void 0 ? { ...e.itemConfig.fieldProps, disabled: v.value.disabled } : e.itemConfig.fieldProps), h = p(() => v.value.editabled !== void 0 ? !v.value.editabled : e.readonly);
I(y, (l) => {
u.value = l;
}, {
immediate: !0,
deep: !0
});
const C = j(!1), q = p(() => {
var m, c, E;
if (h.value || e.index === -1) return [];
const l = v.value.rules !== void 0 ? v.value.rules : [...((m = e.itemConfig.formItemProps) == null ? void 0 : m.rules) || []];
return (v.value.required !== void 0 ? v.value.required : ((c = e.itemConfig.formItemProps) == null ? void 0 : c.required) || ((E = e.itemConfig.formItemProps) == null ? void 0 : E.required)) && l.unshift({
required: !0,
message: `${e.itemConfig.label || e.itemConfig.title || "该字段"}是必填项`
}), l;
});
I([() => e.readonly, () => e.saveFlag], ([l, o]) => {
l && o ? T() : l && (u.value = y.value);
}, {
immediate: !0
});
const d = (l) => {
if (u.value = l, e.controlled) {
C.value = !0;
const o = k(e.row);
b(o, e.itemConfig.dataIndex, l), e.emitControlChangeValue && e.emitControlChangeValue(o, e.index);
} else {
const o = k(e.row);
b(o, e.itemConfig.dataIndex, l), e.changeValue && e.changeValue(o, e.index);
}
}, T = () => {
if (!C.value) return;
const l = k(e.row);
b(l, e.itemConfig.dataIndex, u.value), e.changeValue && e.changeValue(l, e.index), C.value = !1;
}, N = O();
return (l, o) => (a(), g("div", {
class: w(t(x).b())
}, [
h.value ? (a(), g(V, { key: 1 }, [
t(N).default ? L("", !0) : (a(), g(V, { key: 0 }, [
e.itemConfig.valueEnum ? (a(), r(de, {
key: 0,
"value-enum": e.itemConfig.valueEnum,
value: y.value
}, null, 8, ["value-enum", "value"])) : (a(), g("span", ve, _(y.value), 1))
], 64)),
G(l.$slots, "default")
], 64)) : (a(), r(t(J), n({ key: 0 }, e.itemConfig.formItemProps, {
label: "",
style: { position: "relative" },
rules: q.value,
prop: F.value
}), {
error: f(({ error: m }) => [
P("div", {
class: w(t(x).e("error"))
}, [
U(t(K), {
visible: !!m,
effect: "light",
placement: "top-start"
}, {
content: f(() => [
U(t(Q), {
type: "danger",
size: "small"
}, {
default: f(() => [
D(_(m), 1)
]),
_: 2
}, 1024)
]),
default: f(() => [
o[0] || (o[0] = P("div", { style: { height: "100%", width: "100%" } }, null, -1))
]),
_: 2
}, 1032, ["visible"])
], 2)
]),
default: f(() => [
e.itemConfig.renderFormField ? (a(), r(z(e.itemConfig.renderFormField), n({ key: 0 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"])) : s.value === "autocomplete" ? (a(), r(t(W), n({ key: 1 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"])) : s.value === "cascader" ? (a(), r(t(X), n({ key: 2 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"])) : s.value === "color" ? (a(), r(t(Y), n({ key: 3 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"])) : s.value === "select" ? (a(), r(t(Z), n({ key: 4 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), {
default: f(() => [
(a(!0), g(V, null, M(S.value, (m) => (a(), r(t(ee), {
key: m.value.toString(),
label: m.label.toString(),
value: m.value
}, null, 8, ["label", "value"]))), 128))
]),
_: 1
}, 16, ["model-value"])) : s.value === "time-select" ? (a(), r(t(le), n({ key: 5 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"])) : s.value === "rate" ? (a(), r(t(ae), n({ key: 6 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"])) : s.value === "number" ? (a(), r(t(oe), n({ key: 7 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"])) : s.value === "tree-select" ? (a(), r(t(te), n({ key: 8 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"])) : s.value === "date" ? (a(), r(t(ue), n({ key: 9 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"])) : s.value === "time-picker" ? (a(), r(t(re), R(n({ key: 10 }, i.value)), null, 16)) : s.value === "switch" ? (a(), r(t(ne), n({ key: 11 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"])) : (a(), r(t(ie), n({ key: 12 }, i.value, {
"model-value": u.value,
"onUpdate:modelValue": d
}), null, 16, ["model-value"]))
]),
_: 1
}, 16, ["rules", "prop"]))
], 2));
}
});
export {
ke as default
};