125 lines
3.4 KiB
JavaScript
125 lines
3.4 KiB
JavaScript
import { defineComponent as p, computed as d, ref as k, watch as V, openBlock as l, createElementBlock as n, Fragment as g, renderList as _, createElementVNode as y, mergeProps as s, toDisplayString as h, createBlock as U, resolveDynamicComponent as w, withCtx as P } from "vue";
|
||
import { useUi as N } from "@fast-crud/fast-crud";
|
||
import { _ as I } from "./index-50ffe046.mjs";
|
||
import "lodash-es";
|
||
const $ = p({
|
||
name: "FsFilesFormat",
|
||
props: {
|
||
/**
|
||
* 文件列表
|
||
* 支持格式： `url , {url} , [url1,url2] , [{url:url1},{url:url2}]`
|
||
*/
|
||
modelValue: {},
|
||
// tag颜色，`【primary, success, warning, danger ,info】`
|
||
color: {
|
||
default: ""
|
||
},
|
||
// 展示类型`【text, tag】`
|
||
type: {
|
||
default: "tag"
|
||
// `可选【text,tag】`
|
||
},
|
||
// 链接配置
|
||
a: {},
|
||
// tag配置
|
||
tag: {},
|
||
// 构建下载url方法，支持异步
|
||
buildUrl: {},
|
||
// 批量构建下载url方法，支持异步
|
||
buildUrls: {},
|
||
// 根据value构建文件名
|
||
getFileName: {}
|
||
},
|
||
setup(t, F) {
|
||
const { ui: i } = N(), f = d(() => (
|
||
// @ts-ignore
|
||
t.getFileName || function(e) {
|
||
return typeof e != "string" ? (console.warn("获取文件名失败，请配置getFileName"), e) : (e == null ? void 0 : e.lastIndexOf("/")) >= 0 ? e.substring(e.lastIndexOf("/") + 1) : e;
|
||
}
|
||
));
|
||
function u(e) {
|
||
return {
|
||
url: void 0,
|
||
value: e,
|
||
name: f.value(e),
|
||
// @ts-ignore
|
||
color: t.color
|
||
};
|
||
}
|
||
async function m(e) {
|
||
if (t.buildUrls) {
|
||
const r = e.map((a) => a.value), b = await t.buildUrls(r);
|
||
for (let a = 0; a < e.length; a++)
|
||
e[a].url = b[a];
|
||
} else if (t.buildUrl)
|
||
for (let r of e)
|
||
r.url = await t.buildUrl(r.value);
|
||
else
|
||
for (let r = 0; r < e.length; r++)
|
||
e[r].url = e[r].value;
|
||
}
|
||
async function o() {
|
||
if (t.modelValue == null || t.modelValue === "")
|
||
return [];
|
||
let e = [];
|
||
if (typeof t.modelValue == "string")
|
||
e = [u(t.modelValue)];
|
||
else if (t.modelValue instanceof Array) {
|
||
e = [];
|
||
for (const r of t.modelValue)
|
||
e.push(u(r));
|
||
}
|
||
return await m(e), e;
|
||
}
|
||
const c = k([]);
|
||
V(
|
||
() => t.modelValue,
|
||
async () => {
|
||
c.value = await o();
|
||
},
|
||
{
|
||
immediate: !0
|
||
}
|
||
);
|
||
const v = d(() => ({
|
||
...t
|
||
}));
|
||
return {
|
||
ui: i,
|
||
itemsRef: c,
|
||
computedProps: v
|
||
};
|
||
}
|
||
});
|
||
const B = { class: "fs-files-format" }, C = ["href"], R = ["href"];
|
||
function x(t, F, i, f, u, m) {
|
||
return l(), n("div", B, [
|
||
t.computedProps.type === "text" ? (l(!0), n(g, { key: 0 }, _(t.itemsRef, (o) => (l(), n("span", {
|
||
key: o.url,
|
||
class: "fs-files-item"
|
||
}, [
|
||
y("a", s({
|
||
href: o.url,
|
||
target: "_blank"
|
||
}, { ref_for: !0 }, t.computedProps.a), h(o.name), 17, C)
|
||
]))), 128)) : (l(!0), n(g, { key: 1 }, _(t.itemsRef, (o) => (l(), U(w(t.ui.tag.name), s({
|
||
key: o.url,
|
||
class: "fs-tag-item",
|
||
color: o.color
|
||
}, { ref_for: !0 }, t.computedProps.tag), {
|
||
default: P(() => [
|
||
y("a", s({
|
||
href: o.url,
|
||
target: "_blank"
|
||
}, { ref_for: !0 }, t.computedProps.a), h(o.name), 17, R)
|
||
]),
|
||
_: 2
|
||
}, 1040, ["color"]))), 128))
|
||
]);
|
||
}
|
||
const O = /* @__PURE__ */ I($, [["render", x]]);
|
||
export {
|
||
O as default
|
||
};
|
||
//# sourceMappingURL=fs-files-format-ff815381.mjs.map
|