@yqg/low-code-component-lib
Version:
fintopia web lowcode component library
115 lines (114 loc) • 4.31 kB
JavaScript
import { defineComponent as _, useAttrs as I, ref as p, createElementBlock as b, openBlock as i, createElementVNode as d, createVNode as s, createTextVNode as f, renderSlot as y, unref as l, withCtx as n, createBlock as r, createCommentVNode as a, toDisplayString as N, normalizeStyle as V } from "vue";
import { Spin as O, Tooltip as c, Input as L } from "ant-design-vue";
import P from "../../node_modules/.pnpm/@ant-design_icons-vue@7.0.1_vue@3.5.21_typescript@5.9.2_/node_modules/@ant-design/icons-vue/es/icons/EditOutlined.js";
import T from "../../node_modules/.pnpm/@ant-design_icons-vue@7.0.1_vue@3.5.21_typescript@5.9.2_/node_modules/@ant-design/icons-vue/es/icons/CheckOutlined.js";
import $ from "../../node_modules/.pnpm/@ant-design_icons-vue@7.0.1_vue@3.5.21_typescript@5.9.2_/node_modules/@ant-design/icons-vue/es/icons/CloseOutlined.js";
const z = { class: "demo-com" }, A = { class: "editable-column-title editable-column-ellipsis" }, D = { class: "editable-column-default" }, J = { class: "editable-column" }, R = {
key: 0,
class: "editable-column-value editable-column-ellipsis"
}, U = { class: "editable-column-tips editable-column-ellipsis" }, K = /* @__PURE__ */ _({
__name: "index",
props: {
value: {},
hasPermission: { type: Boolean },
isLcEditor: { type: Boolean },
editIconColor: {},
showEditIcon: { type: Boolean }
},
emits: ["refresh", "save"],
setup(k, { emit: h }) {
const m = k, C = h;
I();
const u = p(m.value), t = p(!1), v = p(!1), E = () => {
u.value = m.value, t.value = !0;
}, g = () => new Promise((e) => {
setTimeout(() => {
e();
}, 1e3);
}), w = async () => {
v.value = !0;
try {
await g();
const e = {
...m,
value: u.value
};
t.value = !1, console.log("触发父组件更新数据-----", JSON.stringify(e)), C("refresh", e);
} catch (e) {
console.log("保存失败-----", e);
} finally {
v.value = !1;
}
}, B = () => {
t.value = !1;
};
return (e, o) => (i(), b("div", z, [
d("div", A, [
o[1] || (o[1] = f(" 这里是title插槽 ", -1)),
y(e.$slots, "title")
]),
d("div", D, [
o[2] || (o[2] = f(" 这里是默认插槽 ", -1)),
y(e.$slots, "default")
]),
s(l(O), { spinning: v.value }, {
default: n(() => [
d("div", J, [
s(l(c), { title: e.value }, {
default: n(() => [
t.value ? a("", !0) : (i(), b("div", R, N(e.isLcEditor ? "编辑模式占位符" : e.value), 1))
]),
_: 1
}, 8, ["title"]),
t.value ? (i(), r(l(L), {
key: 0,
type: "text",
value: u.value,
"onUpdate:value": o[0] || (o[0] = (S) => u.value = S)
}, null, 8, ["value"])) : a("", !0),
s(l(c), { title: "编辑" }, {
default: n(() => [
!t.value && e.showEditIcon && e.hasPermission ? (i(), r(l(P), {
key: 0,
style: V({ color: e.editIconColor || "#1890ff" }),
class: "editable-column-icon editable-column-icon-edit",
onClick: E
}, null, 8, ["style"])) : a("", !0)
]),
_: 1
}),
s(l(c), { title: "保存" }, {
default: n(() => [
t.value ? (i(), r(l(T), {
key: 0,
class: "editable-column-icon editable-column-icon-save",
onClick: w
})) : a("", !0)
]),
_: 1
}),
s(l(c), { title: "取消" }, {
default: n(() => [
t.value ? (i(), r(l($), {
key: 0,
class: "editable-column-icon editable-column-icon-cancel",
onClick: B
})) : a("", !0)
]),
_: 1
})
])
]),
_: 1
}, 8, ["spinning"]),
d("div", U, [
o[3] || (o[3] = f(" 这里是tips插槽 ", -1)),
y(e.$slots, "tips")
])
]));
}
});
export {
K as default
};
//# sourceMappingURL=index.vue.js.map