优化 crud 模块

This commit is contained in:
icssoa 2021-04-05 17:00:08 +08:00
parent dd4d25e215
commit 8e1a4a4705
10 changed files with 56 additions and 52 deletions

View File

@ -39,12 +39,7 @@
<!-- MP3 -->
<div class="mp3">
<audio
:ref="setRefs('sound')"
style="display: none"
src="../static/notify.mp3"
controls
></audio>
<audio :ref="setRefs('sound')" :src="NotifyMp3" controls style="display: none"></audio>
</div>
</div>
</template>
@ -61,6 +56,7 @@ import Message from "./message.vue";
import Input from "./input.vue";
import { parseContent } from "../utils";
import { useRefs } from "/@/core";
import NotifyMp3 from "../static/notify.mp3";
export default defineComponent({
name: "cl-chat",
@ -255,6 +251,7 @@ export default defineComponent({
});
return {
NotifyMp3,
refs,
session,
sessionVisible,

View File

@ -14,7 +14,7 @@ export default defineComponent({
const { refs, setRefs }: any = useRefs();
// 菜单是否可见
const visible = ref<boolean>(props.visible);
const visible2 = ref<boolean>(props.visible);
// 按钮列表
const list = ref<Array<ContextMenuItem>>([]);
@ -58,7 +58,7 @@ export default defineComponent({
// 关闭菜单
function close() {
visible.value = false;
visible2.value = false;
ids.value = "";
}
@ -95,7 +95,7 @@ export default defineComponent({
stopDefault(event);
// 显示菜单
visible.value = true;
visible2.value = true;
return {
close
@ -124,7 +124,7 @@ export default defineComponent({
}
onMounted(function () {
if (visible.value) {
if (visible2.value) {
// 添加到 body 下
document.body.appendChild(refs.value["context-menu"]);
// 关闭事件
@ -139,7 +139,7 @@ export default defineComponent({
return {
refs,
visible,
visible2,
ids,
style,
list,
@ -193,7 +193,7 @@ export default defineComponent({
}
return (
ctx.visible && (
ctx.visible2 && (
<div
class="cl-context-menu"
ref={ctx.setRefs("context-menu")}

View File

@ -62,7 +62,7 @@ export default defineComponent({
const browser = inject("browser") as Browser;
// 是否全屏
const fullscreen = ref<boolean>(false);
const fullscreen = ref<boolean>(props.props.fullscreen);
// 是否可见
const visible = ref<boolean>(props.modelValue);
@ -114,6 +114,10 @@ export default defineComponent({
}
function onOpen() {
// 初始值
fullscreen.value = props.props.fullscreen;
// 是否缓存
if (!props.keepAlive) {
cacheKey.value += 1;
}

View File

@ -105,6 +105,10 @@ export default defineComponent({
done();
}
function onClosed() {
tabActive.value = null;
}
// 表单关闭前事件
function beforeClose() {
if (conf.on?.close) {
@ -167,7 +171,7 @@ export default defineComponent({
for (const i in conf) {
switch (i) {
case "items":
conf.items = options.items || [];
conf.items = cloneDeep(options.items || []);
break;
case "title":
case "width":
@ -240,6 +244,7 @@ export default defineComponent({
open,
beforeClose,
close,
onClosed,
done,
clear,
submit,
@ -470,7 +475,8 @@ export default defineComponent({
props: {
...dialog.props,
"before-close": ctx.beforeClose
}
},
onClosed: ctx.onClosed
},
{
default() {

View File

@ -24,7 +24,7 @@ export default defineComponent({
setup(props, { emit }) {
const crud = inject("crud") as Crud;
const list = ref<Array<any>>([]);
const list2 = ref<Array<any>>([]);
// 更新数据列表
const update = () => {
@ -41,7 +41,7 @@ export default defineComponent({
}
// 默认选择
list.value = (props.list || []).map((e: any) => {
list2.value = (props.list || []).map((e: any) => {
e.active = arr.some((v) => v === e.value);
return e;
});
@ -57,14 +57,14 @@ export default defineComponent({
if (props.multiple) {
item.active = true;
} else {
list.value.map((e: any) => {
list2.value.map((e: any) => {
e.active = e.value == item.value;
});
}
}
// 过滤未选中的
const selection = list.value.filter((e: any) => e.active).map((e: any) => e.value);
const selection = list2.value.filter((e: any) => e.active).map((e: any) => e.value);
// 处理多选情况
const value = props.multiple ? selection : selection[0];
@ -92,7 +92,7 @@ export default defineComponent({
);
return {
list,
list2,
selectItem
};
},
@ -100,7 +100,7 @@ export default defineComponent({
render(ctx: any) {
return (
<div class="cl-query">
{ctx.list.map((item: any, index: number) => {
{ctx.list2.map((item: any, index: number) => {
return (
<button
class={{ "is-active": item.active }}

View File

@ -37,8 +37,8 @@ export interface Form {
op?: any;
dialog?: {
props?: any;
hiddenControls: boolean;
controls: Array<"fullscreen" | "close">;
hiddenControls?: boolean;
controls?: Array<"fullscreen" | "close">;
};
_data?: any;
}

View File

@ -1,4 +1,4 @@
import { ComponentOptions } from "vue-demi";
import { ComponentOptions } from "vue";
export interface Options extends ComponentOptions {
name: string;

View File

@ -1,4 +1,4 @@
import { isFunction, isString, isObject } from "./index";
import { isFunction, isString, isObject, isEmpty } from "./index";
import { h, resolveComponent, toRaw } from "vue";
/**
@ -20,19 +20,6 @@ const parseNode = (vnode: any, options: any) => {
}
}
if (scope) {
// 添加双向绑定
vnode.modelValue = scope[prop];
vnode["onUpdate:modelValue"] = function (val: any) {
scope[prop] = val;
};
}
// 组件实例渲染,转普通对象
if (vnode.render) {
return h(toRaw(vnode));
}
// 组件参数
const props = {
...vnode,
@ -40,8 +27,22 @@ const parseNode = (vnode: any, options: any) => {
...vnode.props
};
// 删除多余数据
delete props._children;
if (props && scope) {
// 添加双向绑定
props.modelValue = scope[prop];
props["onUpdate:modelValue"] = function (val: any) {
scope[prop] = val;
};
}
// 组件实例渲染,转普通对象
if (props.render) {
return h(toRaw(props));
}
// @ts-ignore
return h(resolveComponent(vnode.name), props, {
default: () => {

View File

@ -21,7 +21,14 @@ export default defineComponent({
{
label: "姓名",
prop: "name",
minWidth: 120
minWidth: 120,
component: {
name: "el-input",
props: {
size: "mini",
clearable: true
}
}
},
{
label: "存款",
@ -57,17 +64,7 @@ export default defineComponent({
}
]);
onMounted(function () {
setTimeout(() => {
console.log("隐藏昵称");
refs.value.table.hiddenColumn("name");
setTimeout(() => {
console.log("显示昵称");
refs.value.table.showColumn("name");
}, 1000);
}, 1000);
});
onMounted(function () {});
return {
refs,

View File

@ -26,8 +26,7 @@ export default function () {
)
) {
d.meta.iframeUrl = url;
d.component = () =>
import(`/$/base/pages/iframe/index.vue`);
d.component = () => import(`/$/base/pages/iframe/index.vue`);
} else {
d.component = () => import(/* @vite-ignore */ `/@/${url}`);
}