1889 lines
69 KiB
JavaScript
1889 lines
69 KiB
JavaScript
import { defineComponent, ref, resolveDirective, mergeProps, unref, reactive, withCtx, createVNode, watch, createBlock, createCommentVNode, withDirectives, openBlock, Fragment, renderList, vShow, toDisplayString, nextTick, shallowRef, computed, watchEffect, provide, toRef, inject, useSSRContext } from 'vue';
|
|
import { ssrRenderAttrs, ssrInterpolate, ssrGetDirectiveProps, ssrRenderComponent, ssrRenderAttr, ssrRenderClass, ssrRenderList, ssrRenderStyle } from 'vue/server-renderer';
|
|
import { u as useRouter, a as useConfigStore, b as useUserStore, x as getSupabaseStorageUrl, y as supabaseService, z as useElementSize, n as useIntersectionObserver, o as getToken, B as myAxios, e as api$1, t as reactiveProjectName, s as supabase, C as useConfigInject, D as genComponentStyleHook, E as omit, F as classNames, G as arrayType, P as PropTypes, H as flattenChildren, I as getOptionProps, J as initDefaultProps, K as objectType, L as anyType, M as tuple, N as resetComponent, O as textEllipsis, Q as KeyCode } from './server.mjs';
|
|
import { e as empty_user } from './empty_user-BaUNCdgf.mjs';
|
|
import { f as formatTime } from './useDateTime-D8RCoGwW.mjs';
|
|
import { Swiper, SwiperSlide } from 'swiper/vue';
|
|
import { Pagination } from 'swiper/modules';
|
|
import { i as img_gif } from './post_loading-BiySI7bp.mjs';
|
|
import { B as BasicIconOld } from './BasicIconOld-I4c2ShMu.mjs';
|
|
import { _ as _export_sfc } from './_plugin-vue_export-helper-1tPrXgE0.mjs';
|
|
import { _ as _sfc_main$7 } from './like-BhIOg3YL.mjs';
|
|
import { ContentLoader } from 'vue-content-loader';
|
|
import { B as BasicSheet } from './index-6lAQNCiO.mjs';
|
|
import { a as _sfc_main$2$1, b as _sfc_main$1$1 } from './moreOptionProduct-Wbm_Qic5.mjs';
|
|
import { U as UserProfilePic } from './UserProfilePic-DXA233hi.mjs';
|
|
import { _ as _sfc_main$8 } from './BasicButton-B-4QDu9v.mjs';
|
|
import _objectSpread from '@babel/runtime/helpers/esm/objectSpread2';
|
|
import _extends from '@babel/runtime/helpers/esm/extends';
|
|
import { T as Trigger } from './index-Dxyzjwb5.mjs';
|
|
import { u as useProvideOverride, M as Menu, _ as __nuxt_component_1 } from './index-BlNIpVst.mjs';
|
|
import { S as Spin } from './index-DqCYDGJX.mjs';
|
|
import { B as BaseInput } from './BaseInput-_gwhwanN.mjs';
|
|
import { u as useInjectFormItemContext, F as FormItemInputContext } from './FormItemContext-CDDW52IT.mjs';
|
|
import { g as getMergedStatus, a as getStatusClassNames } from './statusUtils-C3ZNzkeD.mjs';
|
|
import { i as initInputToken, g as genBasicInputStyle, a as genStatusStyle, b as genPlaceholderStyle, c as genActiveStyle, d as genDisabledStyle } from './index-C1mihc8c.mjs';
|
|
|
|
function getBeforeSelectionText(input) {
|
|
const {
|
|
selectionStart
|
|
} = input;
|
|
return input.value.slice(0, selectionStart);
|
|
}
|
|
function getLastMeasureIndex(text) {
|
|
let prefix = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "";
|
|
const prefixList = Array.isArray(prefix) ? prefix : [prefix];
|
|
return prefixList.reduce((lastMatch, prefixStr) => {
|
|
const lastIndex = text.lastIndexOf(prefixStr);
|
|
if (lastIndex > lastMatch.location) {
|
|
return {
|
|
location: lastIndex,
|
|
prefix: prefixStr
|
|
};
|
|
}
|
|
return lastMatch;
|
|
}, {
|
|
location: -1,
|
|
prefix: ""
|
|
});
|
|
}
|
|
function lower(char) {
|
|
return (char || "").toLowerCase();
|
|
}
|
|
function reduceText(text, targetText, split) {
|
|
const firstChar = text[0];
|
|
if (!firstChar || firstChar === split) {
|
|
return text;
|
|
}
|
|
let restText = text;
|
|
const targetTextLen = targetText.length;
|
|
for (let i = 0; i < targetTextLen; i += 1) {
|
|
if (lower(restText[i]) !== lower(targetText[i])) {
|
|
restText = restText.slice(i);
|
|
break;
|
|
} else if (i === targetTextLen - 1) {
|
|
restText = restText.slice(targetTextLen);
|
|
}
|
|
}
|
|
return restText;
|
|
}
|
|
function replaceWithMeasure(text, measureConfig) {
|
|
const {
|
|
measureLocation,
|
|
prefix,
|
|
targetText,
|
|
selectionStart,
|
|
split
|
|
} = measureConfig;
|
|
let beforeMeasureText = text.slice(0, measureLocation);
|
|
if (beforeMeasureText[beforeMeasureText.length - split.length] === split) {
|
|
beforeMeasureText = beforeMeasureText.slice(0, beforeMeasureText.length - split.length);
|
|
}
|
|
if (beforeMeasureText) {
|
|
beforeMeasureText = `${beforeMeasureText}${split}`;
|
|
}
|
|
let restText = reduceText(text.slice(selectionStart), targetText.slice(selectionStart - measureLocation - prefix.length), split);
|
|
if (restText.slice(0, split.length) === split) {
|
|
restText = restText.slice(split.length);
|
|
}
|
|
const connectedStartText = `${beforeMeasureText}${prefix}${targetText}${split}`;
|
|
return {
|
|
text: `${connectedStartText}${restText}`,
|
|
selectionLocation: connectedStartText.length
|
|
};
|
|
}
|
|
function setInputSelection(input, location) {
|
|
input.setSelectionRange(location, location);
|
|
input.blur();
|
|
input.focus();
|
|
}
|
|
function validateSearch(text, props) {
|
|
const {
|
|
split
|
|
} = props;
|
|
return !split || text.indexOf(split) === -1;
|
|
}
|
|
function filterOption(input, _ref) {
|
|
let {
|
|
value = ""
|
|
} = _ref;
|
|
const lowerCase = input.toLowerCase();
|
|
return value.toLowerCase().indexOf(lowerCase) !== -1;
|
|
}
|
|
const MentionsContextKey = Symbol("MentionsContextKey");
|
|
function noop$1() {
|
|
}
|
|
const DropdownMenu = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "DropdownMenu",
|
|
props: {
|
|
prefixCls: String,
|
|
options: {
|
|
type: Array,
|
|
default: () => []
|
|
}
|
|
},
|
|
setup(props, _ref) {
|
|
let {
|
|
slots
|
|
} = _ref;
|
|
const {
|
|
activeIndex,
|
|
setActiveIndex,
|
|
selectOption,
|
|
onFocus = noop$1,
|
|
loading
|
|
} = inject(MentionsContextKey, {
|
|
activeIndex: shallowRef(),
|
|
loading: shallowRef(false)
|
|
});
|
|
let timeoutId;
|
|
const onMousedown = (e) => {
|
|
clearTimeout(timeoutId);
|
|
timeoutId = setTimeout(() => {
|
|
onFocus(e);
|
|
});
|
|
};
|
|
return () => {
|
|
var _a;
|
|
const {
|
|
prefixCls,
|
|
options
|
|
} = props;
|
|
const activeOption = options[activeIndex.value] || {};
|
|
return createVNode(Menu, {
|
|
"prefixCls": `${prefixCls}-menu`,
|
|
"activeKey": activeOption.value,
|
|
"onSelect": (_ref2) => {
|
|
let {
|
|
key
|
|
} = _ref2;
|
|
const option = options.find((_ref3) => {
|
|
let {
|
|
value
|
|
} = _ref3;
|
|
return value === key;
|
|
});
|
|
selectOption(option);
|
|
},
|
|
"onMousedown": onMousedown
|
|
}, {
|
|
default: () => [!loading.value && options.map((option, index) => {
|
|
var _a2, _b;
|
|
const {
|
|
value,
|
|
disabled,
|
|
label = option.value,
|
|
class: className,
|
|
style
|
|
} = option;
|
|
return createVNode(__nuxt_component_1, {
|
|
"key": value,
|
|
"disabled": disabled,
|
|
"onMouseenter": () => {
|
|
setActiveIndex(index);
|
|
},
|
|
"class": className,
|
|
"style": style
|
|
}, {
|
|
default: () => [(_b = (_a2 = slots.option) === null || _a2 === void 0 ? void 0 : _a2.call(slots, option)) !== null && _b !== void 0 ? _b : typeof label === "function" ? label(option) : label]
|
|
});
|
|
}), !loading.value && options.length === 0 ? createVNode(__nuxt_component_1, {
|
|
"key": "notFoundContent",
|
|
"disabled": true
|
|
}, {
|
|
default: () => [(_a = slots.notFoundContent) === null || _a === void 0 ? void 0 : _a.call(slots)]
|
|
}) : null, loading.value && createVNode(__nuxt_component_1, {
|
|
"key": "loading",
|
|
"disabled": true
|
|
}, {
|
|
default: () => [createVNode(Spin, {
|
|
"size": "small"
|
|
}, null)]
|
|
})]
|
|
});
|
|
};
|
|
}
|
|
});
|
|
const BUILT_IN_PLACEMENTS = {
|
|
bottomRight: {
|
|
points: ["tl", "br"],
|
|
offset: [0, 4],
|
|
overflow: {
|
|
adjustX: 0,
|
|
adjustY: 1
|
|
}
|
|
},
|
|
bottomLeft: {
|
|
points: ["tr", "bl"],
|
|
offset: [0, 4],
|
|
overflow: {
|
|
adjustX: 0,
|
|
adjustY: 1
|
|
}
|
|
},
|
|
topRight: {
|
|
points: ["bl", "tr"],
|
|
offset: [0, -4],
|
|
overflow: {
|
|
adjustX: 0,
|
|
adjustY: 1
|
|
}
|
|
},
|
|
topLeft: {
|
|
points: ["br", "tl"],
|
|
offset: [0, -4],
|
|
overflow: {
|
|
adjustX: 0,
|
|
adjustY: 1
|
|
}
|
|
}
|
|
};
|
|
const KeywordTrigger = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "KeywordTrigger",
|
|
props: {
|
|
loading: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
options: {
|
|
type: Array,
|
|
default: () => []
|
|
},
|
|
prefixCls: String,
|
|
placement: String,
|
|
visible: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
transitionName: String,
|
|
getPopupContainer: Function,
|
|
direction: String,
|
|
dropdownClassName: String
|
|
},
|
|
setup(props, _ref) {
|
|
let {
|
|
slots
|
|
} = _ref;
|
|
const getDropdownPrefix = () => {
|
|
return `${props.prefixCls}-dropdown`;
|
|
};
|
|
const getDropdownElement = () => {
|
|
const {
|
|
options
|
|
} = props;
|
|
return createVNode(DropdownMenu, {
|
|
"prefixCls": getDropdownPrefix(),
|
|
"options": options
|
|
}, {
|
|
notFoundContent: slots.notFoundContent,
|
|
option: slots.option
|
|
});
|
|
};
|
|
const popupPlacement = computed(() => {
|
|
const {
|
|
placement,
|
|
direction
|
|
} = props;
|
|
let popupPlacement2 = "topRight";
|
|
if (direction === "rtl") {
|
|
popupPlacement2 = placement === "top" ? "topLeft" : "bottomLeft";
|
|
} else {
|
|
popupPlacement2 = placement === "top" ? "topRight" : "bottomRight";
|
|
}
|
|
return popupPlacement2;
|
|
});
|
|
return () => {
|
|
const {
|
|
visible,
|
|
transitionName,
|
|
getPopupContainer
|
|
} = props;
|
|
return createVNode(Trigger, {
|
|
"prefixCls": getDropdownPrefix(),
|
|
"popupVisible": visible,
|
|
"popup": getDropdownElement(),
|
|
"popupClassName": props.dropdownClassName,
|
|
"popupPlacement": popupPlacement.value,
|
|
"popupTransitionName": transitionName,
|
|
"builtinPlacements": BUILT_IN_PLACEMENTS,
|
|
"getPopupContainer": getPopupContainer
|
|
}, {
|
|
default: slots.default
|
|
});
|
|
};
|
|
}
|
|
});
|
|
const PlaceMent = tuple("top", "bottom");
|
|
const mentionsProps$1 = {
|
|
autofocus: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
prefix: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]),
|
|
prefixCls: String,
|
|
value: String,
|
|
disabled: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
split: String,
|
|
transitionName: String,
|
|
placement: PropTypes.oneOf(PlaceMent),
|
|
character: PropTypes.any,
|
|
characterRender: Function,
|
|
filterOption: {
|
|
type: [Boolean, Function]
|
|
},
|
|
validateSearch: Function,
|
|
getPopupContainer: {
|
|
type: Function
|
|
},
|
|
options: arrayType(),
|
|
loading: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
rows: [Number, String],
|
|
direction: {
|
|
type: String
|
|
}
|
|
};
|
|
const vcMentionsProps = _extends(_extends({}, mentionsProps$1), {
|
|
dropdownClassName: String
|
|
});
|
|
const defaultProps = {
|
|
prefix: "@",
|
|
split: " ",
|
|
rows: 1,
|
|
validateSearch,
|
|
filterOption: () => filterOption
|
|
};
|
|
initDefaultProps(vcMentionsProps, defaultProps);
|
|
var __rest$1 = function(s, e) {
|
|
var t = {};
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
}
|
|
return t;
|
|
};
|
|
function noop() {
|
|
}
|
|
const Mentions$1 = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "Mentions",
|
|
inheritAttrs: false,
|
|
props: initDefaultProps(vcMentionsProps, defaultProps),
|
|
emits: ["change", "select", "search", "focus", "blur", "pressenter"],
|
|
setup(props, _ref) {
|
|
let {
|
|
emit,
|
|
attrs,
|
|
expose,
|
|
slots
|
|
} = _ref;
|
|
const measure = ref(null);
|
|
const textarea = ref(null);
|
|
const focusId = ref();
|
|
const state = reactive({
|
|
value: props.value || "",
|
|
measuring: false,
|
|
measureLocation: 0,
|
|
measureText: null,
|
|
measurePrefix: "",
|
|
activeIndex: 0,
|
|
isFocus: false
|
|
});
|
|
watchEffect(() => {
|
|
state.value = props.value;
|
|
});
|
|
const triggerChange = (val) => {
|
|
emit("change", val);
|
|
};
|
|
const onChange = (_ref2) => {
|
|
let {
|
|
target: {
|
|
value
|
|
}
|
|
} = _ref2;
|
|
triggerChange(value);
|
|
};
|
|
const startMeasure = (measureText, measurePrefix, measureLocation) => {
|
|
_extends(state, {
|
|
measuring: true,
|
|
measureText,
|
|
measurePrefix,
|
|
measureLocation,
|
|
activeIndex: 0
|
|
});
|
|
};
|
|
const stopMeasure = (callback) => {
|
|
_extends(state, {
|
|
measuring: false,
|
|
measureLocation: 0,
|
|
measureText: null
|
|
});
|
|
callback === null || callback === void 0 ? void 0 : callback();
|
|
};
|
|
const onKeyDown = (event) => {
|
|
const {
|
|
which
|
|
} = event;
|
|
if (!state.measuring) {
|
|
return;
|
|
}
|
|
if (which === KeyCode.UP || which === KeyCode.DOWN) {
|
|
const optionLen = options.value.length;
|
|
const offset = which === KeyCode.UP ? -1 : 1;
|
|
const newActiveIndex = (state.activeIndex + offset + optionLen) % optionLen;
|
|
state.activeIndex = newActiveIndex;
|
|
event.preventDefault();
|
|
} else if (which === KeyCode.ESC) {
|
|
stopMeasure();
|
|
} else if (which === KeyCode.ENTER) {
|
|
event.preventDefault();
|
|
if (!options.value.length) {
|
|
stopMeasure();
|
|
return;
|
|
}
|
|
const option = options.value[state.activeIndex];
|
|
selectOption(option);
|
|
}
|
|
};
|
|
const onKeyUp = (event) => {
|
|
const {
|
|
key,
|
|
which
|
|
} = event;
|
|
const {
|
|
measureText: prevMeasureText,
|
|
measuring
|
|
} = state;
|
|
const {
|
|
prefix,
|
|
validateSearch: validateSearch2
|
|
} = props;
|
|
const target = event.target;
|
|
if (target.composing) {
|
|
return;
|
|
}
|
|
const selectionStartText = getBeforeSelectionText(target);
|
|
const {
|
|
location: measureIndex,
|
|
prefix: measurePrefix
|
|
} = getLastMeasureIndex(selectionStartText, prefix);
|
|
if ([KeyCode.ESC, KeyCode.UP, KeyCode.DOWN, KeyCode.ENTER].indexOf(which) !== -1) {
|
|
return;
|
|
}
|
|
if (measureIndex !== -1) {
|
|
const measureText = selectionStartText.slice(measureIndex + measurePrefix.length);
|
|
const validateMeasure = validateSearch2(measureText, props);
|
|
const matchOption = !!getOptions(measureText).length;
|
|
if (validateMeasure) {
|
|
if (key === measurePrefix || key === "Shift" || measuring || measureText !== prevMeasureText && matchOption) {
|
|
startMeasure(measureText, measurePrefix, measureIndex);
|
|
}
|
|
} else if (measuring) {
|
|
stopMeasure();
|
|
}
|
|
if (validateMeasure) {
|
|
emit("search", measureText, measurePrefix);
|
|
}
|
|
} else if (measuring) {
|
|
stopMeasure();
|
|
}
|
|
};
|
|
const onPressEnter = (event) => {
|
|
if (!state.measuring) {
|
|
emit("pressenter", event);
|
|
}
|
|
};
|
|
const onInputFocus = (event) => {
|
|
onFocus(event);
|
|
};
|
|
const onInputBlur = (event) => {
|
|
onBlur(event);
|
|
};
|
|
const onFocus = (event) => {
|
|
clearTimeout(focusId.value);
|
|
const {
|
|
isFocus
|
|
} = state;
|
|
if (!isFocus && event) {
|
|
emit("focus", event);
|
|
}
|
|
state.isFocus = true;
|
|
};
|
|
const onBlur = (event) => {
|
|
focusId.value = setTimeout(() => {
|
|
state.isFocus = false;
|
|
stopMeasure();
|
|
emit("blur", event);
|
|
}, 100);
|
|
};
|
|
const selectOption = (option) => {
|
|
const {
|
|
split
|
|
} = props;
|
|
const {
|
|
value: mentionValue = ""
|
|
} = option;
|
|
const {
|
|
text,
|
|
selectionLocation
|
|
} = replaceWithMeasure(state.value, {
|
|
measureLocation: state.measureLocation,
|
|
targetText: mentionValue,
|
|
prefix: state.measurePrefix,
|
|
selectionStart: textarea.value.getSelectionStart(),
|
|
split
|
|
});
|
|
triggerChange(text);
|
|
stopMeasure(() => {
|
|
setInputSelection(textarea.value.input, selectionLocation);
|
|
});
|
|
emit("select", option, state.measurePrefix);
|
|
};
|
|
const setActiveIndex = (activeIndex) => {
|
|
state.activeIndex = activeIndex;
|
|
};
|
|
const getOptions = (measureText) => {
|
|
const targetMeasureText = measureText || state.measureText || "";
|
|
const {
|
|
filterOption: filterOption2
|
|
} = props;
|
|
const list = props.options.filter((option) => {
|
|
if (!!filterOption2 === false) {
|
|
return true;
|
|
}
|
|
return filterOption2(targetMeasureText, option);
|
|
});
|
|
return list;
|
|
};
|
|
const options = computed(() => {
|
|
return getOptions();
|
|
});
|
|
const focus = () => {
|
|
textarea.value.focus();
|
|
};
|
|
const blur = () => {
|
|
textarea.value.blur();
|
|
};
|
|
expose({
|
|
blur,
|
|
focus
|
|
});
|
|
provide(MentionsContextKey, {
|
|
activeIndex: toRef(state, "activeIndex"),
|
|
setActiveIndex,
|
|
selectOption,
|
|
onFocus,
|
|
onBlur,
|
|
loading: toRef(props, "loading")
|
|
});
|
|
return () => {
|
|
const {
|
|
measureLocation,
|
|
measurePrefix,
|
|
measuring
|
|
} = state;
|
|
const {
|
|
prefixCls,
|
|
placement,
|
|
transitionName,
|
|
getPopupContainer,
|
|
direction
|
|
} = props, restProps = __rest$1(props, ["prefixCls", "placement", "transitionName", "getPopupContainer", "direction"]);
|
|
const {
|
|
class: className,
|
|
style
|
|
} = attrs, otherAttrs = __rest$1(attrs, ["class", "style"]);
|
|
const inputProps = omit(restProps, ["value", "prefix", "split", "validateSearch", "filterOption", "options", "loading"]);
|
|
const textareaProps = _extends(_extends(_extends({}, inputProps), otherAttrs), {
|
|
onChange: noop,
|
|
onSelect: noop,
|
|
value: state.value,
|
|
onInput: onChange,
|
|
onBlur: onInputBlur,
|
|
onKeydown: onKeyDown,
|
|
onKeyup: onKeyUp,
|
|
onFocus: onInputFocus,
|
|
onPressenter: onPressEnter
|
|
});
|
|
return createVNode("div", {
|
|
"class": classNames(prefixCls, className),
|
|
"style": style
|
|
}, [createVNode(BaseInput, _objectSpread(_objectSpread({}, textareaProps), {}, {
|
|
"ref": textarea,
|
|
"tag": "textarea"
|
|
}), null), measuring && createVNode("div", {
|
|
"ref": measure,
|
|
"class": `${prefixCls}-measure`
|
|
}, [state.value.slice(0, measureLocation), createVNode(KeywordTrigger, {
|
|
"prefixCls": prefixCls,
|
|
"transitionName": transitionName,
|
|
"dropdownClassName": props.dropdownClassName,
|
|
"placement": placement,
|
|
"options": measuring ? options.value : [],
|
|
"visible": true,
|
|
"direction": direction,
|
|
"getPopupContainer": getPopupContainer
|
|
}, {
|
|
default: () => [createVNode("span", null, [measurePrefix])],
|
|
notFoundContent: slots.notFoundContent,
|
|
option: slots.option
|
|
}), state.value.slice(measureLocation + measurePrefix.length)])]);
|
|
};
|
|
}
|
|
});
|
|
const baseOptionsProps = {
|
|
value: String,
|
|
disabled: Boolean,
|
|
payload: objectType()
|
|
};
|
|
const optionProps = _extends(_extends({}, baseOptionsProps), {
|
|
label: anyType([])
|
|
});
|
|
const optionOptions = {
|
|
name: "Option",
|
|
props: optionProps,
|
|
render(_props, _ref) {
|
|
let {
|
|
slots
|
|
} = _ref;
|
|
var _a;
|
|
return (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots);
|
|
}
|
|
};
|
|
defineComponent(_extends({
|
|
compatConfig: {
|
|
MODE: 3
|
|
}
|
|
}, optionOptions));
|
|
const genMentionsStyle = (token) => {
|
|
const {
|
|
componentCls,
|
|
colorTextDisabled,
|
|
controlItemBgHover,
|
|
controlPaddingHorizontal,
|
|
colorText,
|
|
motionDurationSlow,
|
|
lineHeight,
|
|
controlHeight,
|
|
inputPaddingHorizontal,
|
|
inputPaddingVertical,
|
|
fontSize,
|
|
colorBgElevated,
|
|
borderRadiusLG,
|
|
boxShadowSecondary
|
|
} = token;
|
|
const itemPaddingVertical = Math.round((token.controlHeight - token.fontSize * token.lineHeight) / 2);
|
|
return {
|
|
[componentCls]: _extends(_extends(_extends(_extends(_extends({}, resetComponent(token)), genBasicInputStyle(token)), {
|
|
position: "relative",
|
|
display: "inline-block",
|
|
height: "auto",
|
|
padding: 0,
|
|
overflow: "hidden",
|
|
lineHeight,
|
|
whiteSpace: "pre-wrap",
|
|
verticalAlign: "bottom"
|
|
}), genStatusStyle(token, componentCls)), {
|
|
"&-disabled": {
|
|
"> textarea": _extends({}, genDisabledStyle(token))
|
|
},
|
|
"&-focused": _extends({}, genActiveStyle(token)),
|
|
[`&-affix-wrapper ${componentCls}-suffix`]: {
|
|
position: "absolute",
|
|
top: 0,
|
|
insetInlineEnd: inputPaddingHorizontal,
|
|
bottom: 0,
|
|
zIndex: 1,
|
|
display: "inline-flex",
|
|
alignItems: "center",
|
|
margin: "auto"
|
|
},
|
|
// ================= Input Area =================
|
|
[`> textarea, ${componentCls}-measure`]: {
|
|
color: colorText,
|
|
boxSizing: "border-box",
|
|
minHeight: controlHeight - 2,
|
|
margin: 0,
|
|
padding: `${inputPaddingVertical}px ${inputPaddingHorizontal}px`,
|
|
overflow: "inherit",
|
|
overflowX: "hidden",
|
|
overflowY: "auto",
|
|
fontWeight: "inherit",
|
|
fontSize: "inherit",
|
|
fontFamily: "inherit",
|
|
fontStyle: "inherit",
|
|
fontVariant: "inherit",
|
|
fontSizeAdjust: "inherit",
|
|
fontStretch: "inherit",
|
|
lineHeight: "inherit",
|
|
direction: "inherit",
|
|
letterSpacing: "inherit",
|
|
whiteSpace: "inherit",
|
|
textAlign: "inherit",
|
|
verticalAlign: "top",
|
|
wordWrap: "break-word",
|
|
wordBreak: "inherit",
|
|
tabSize: "inherit"
|
|
},
|
|
"> textarea": _extends({
|
|
width: "100%",
|
|
border: "none",
|
|
outline: "none",
|
|
resize: "none",
|
|
backgroundColor: "inherit"
|
|
}, genPlaceholderStyle(token.colorTextPlaceholder)),
|
|
[`${componentCls}-measure`]: {
|
|
position: "absolute",
|
|
top: 0,
|
|
insetInlineEnd: 0,
|
|
bottom: 0,
|
|
insetInlineStart: 0,
|
|
zIndex: -1,
|
|
color: "transparent",
|
|
pointerEvents: "none",
|
|
"> span": {
|
|
display: "inline-block",
|
|
minHeight: "1em"
|
|
}
|
|
},
|
|
// ================== Dropdown ==================
|
|
"&-dropdown": _extends(_extends({}, resetComponent(token)), {
|
|
position: "absolute",
|
|
top: -9999,
|
|
insetInlineStart: -9999,
|
|
zIndex: token.zIndexPopup,
|
|
boxSizing: "border-box",
|
|
fontSize,
|
|
fontVariant: "initial",
|
|
backgroundColor: colorBgElevated,
|
|
borderRadius: borderRadiusLG,
|
|
outline: "none",
|
|
boxShadow: boxShadowSecondary,
|
|
"&-hidden": {
|
|
display: "none"
|
|
},
|
|
[`${componentCls}-dropdown-menu`]: {
|
|
maxHeight: token.dropdownHeight,
|
|
marginBottom: 0,
|
|
paddingInlineStart: 0,
|
|
overflow: "auto",
|
|
listStyle: "none",
|
|
outline: "none",
|
|
"&-item": _extends(_extends({}, textEllipsis), {
|
|
position: "relative",
|
|
display: "block",
|
|
minWidth: token.controlItemWidth,
|
|
padding: `${itemPaddingVertical}px ${controlPaddingHorizontal}px`,
|
|
color: colorText,
|
|
fontWeight: "normal",
|
|
lineHeight,
|
|
cursor: "pointer",
|
|
transition: `background ${motionDurationSlow} ease`,
|
|
"&:hover": {
|
|
backgroundColor: controlItemBgHover
|
|
},
|
|
"&:first-child": {
|
|
borderStartStartRadius: borderRadiusLG,
|
|
borderStartEndRadius: borderRadiusLG,
|
|
borderEndStartRadius: 0,
|
|
borderEndEndRadius: 0
|
|
},
|
|
"&:last-child": {
|
|
borderStartStartRadius: 0,
|
|
borderStartEndRadius: 0,
|
|
borderEndStartRadius: borderRadiusLG,
|
|
borderEndEndRadius: borderRadiusLG
|
|
},
|
|
"&-disabled": {
|
|
color: colorTextDisabled,
|
|
cursor: "not-allowed",
|
|
"&:hover": {
|
|
color: colorTextDisabled,
|
|
backgroundColor: controlItemBgHover,
|
|
cursor: "not-allowed"
|
|
}
|
|
},
|
|
"&-selected": {
|
|
color: colorText,
|
|
fontWeight: token.fontWeightStrong,
|
|
backgroundColor: controlItemBgHover
|
|
},
|
|
"&-active": {
|
|
backgroundColor: controlItemBgHover
|
|
}
|
|
})
|
|
}
|
|
})
|
|
})
|
|
};
|
|
};
|
|
const useStyle = genComponentStyleHook("Mentions", (token) => {
|
|
const mentionsToken = initInputToken(token);
|
|
return [genMentionsStyle(mentionsToken)];
|
|
}, (token) => ({
|
|
dropdownHeight: 250,
|
|
controlItemWidth: 100,
|
|
zIndexPopup: token.zIndexPopupBase + 50
|
|
}));
|
|
var __rest = function(s, e) {
|
|
var t = {};
|
|
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
|
|
if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
|
|
if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
|
|
}
|
|
return t;
|
|
};
|
|
function loadingFilterOption() {
|
|
return true;
|
|
}
|
|
const getMentions = function() {
|
|
let value = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "";
|
|
let config = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : {};
|
|
const {
|
|
prefix = "@",
|
|
split = " "
|
|
} = config;
|
|
const prefixList = Array.isArray(prefix) ? prefix : [prefix];
|
|
return value.split(split).map(function() {
|
|
let str = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : "";
|
|
let hitPrefix = null;
|
|
prefixList.some((prefixStr) => {
|
|
const startStr = str.slice(0, prefixStr.length);
|
|
if (startStr === prefixStr) {
|
|
hitPrefix = prefixStr;
|
|
return true;
|
|
}
|
|
return false;
|
|
});
|
|
if (hitPrefix !== null) {
|
|
return {
|
|
prefix: hitPrefix,
|
|
value: str.slice(hitPrefix.length)
|
|
};
|
|
}
|
|
return null;
|
|
}).filter((entity) => !!entity && !!entity.value);
|
|
};
|
|
const mentionsProps = () => _extends(_extends({}, mentionsProps$1), {
|
|
loading: {
|
|
type: Boolean,
|
|
default: void 0
|
|
},
|
|
onFocus: {
|
|
type: Function
|
|
},
|
|
onBlur: {
|
|
type: Function
|
|
},
|
|
onSelect: {
|
|
type: Function
|
|
},
|
|
onChange: {
|
|
type: Function
|
|
},
|
|
onPressenter: {
|
|
type: Function
|
|
},
|
|
"onUpdate:value": {
|
|
type: Function
|
|
},
|
|
notFoundContent: PropTypes.any,
|
|
defaultValue: String,
|
|
id: String,
|
|
status: String
|
|
});
|
|
const Mentions = defineComponent({
|
|
compatConfig: {
|
|
MODE: 3
|
|
},
|
|
name: "AMentions",
|
|
inheritAttrs: false,
|
|
props: mentionsProps(),
|
|
slots: Object,
|
|
setup(props, _ref) {
|
|
let {
|
|
slots,
|
|
emit,
|
|
attrs,
|
|
expose
|
|
} = _ref;
|
|
var _b, _c;
|
|
const {
|
|
prefixCls,
|
|
renderEmpty,
|
|
direction
|
|
} = useConfigInject("mentions", props);
|
|
const [wrapSSR, hashId] = useStyle(prefixCls);
|
|
const focused = shallowRef(false);
|
|
const vcMentions = shallowRef(null);
|
|
const value = shallowRef((_c = (_b = props.value) !== null && _b !== void 0 ? _b : props.defaultValue) !== null && _c !== void 0 ? _c : "");
|
|
const formItemContext = useInjectFormItemContext();
|
|
const formItemInputContext = FormItemInputContext.useInject();
|
|
const mergedStatus = computed(() => getMergedStatus(formItemInputContext.status, props.status));
|
|
useProvideOverride({
|
|
prefixCls: computed(() => `${prefixCls.value}-menu`),
|
|
mode: computed(() => "vertical"),
|
|
selectable: computed(() => false),
|
|
onClick: () => {
|
|
},
|
|
validator: (_ref2) => {
|
|
let {
|
|
mode
|
|
} = _ref2;
|
|
}
|
|
});
|
|
watch(() => props.value, (val) => {
|
|
value.value = val;
|
|
});
|
|
const handleFocus = (e) => {
|
|
focused.value = true;
|
|
emit("focus", e);
|
|
};
|
|
const handleBlur = (e) => {
|
|
focused.value = false;
|
|
emit("blur", e);
|
|
formItemContext.onFieldBlur();
|
|
};
|
|
const handleSelect = function() {
|
|
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
args[_key] = arguments[_key];
|
|
}
|
|
emit("select", ...args);
|
|
focused.value = true;
|
|
};
|
|
const handleChange = (val) => {
|
|
if (props.value === void 0) {
|
|
value.value = val;
|
|
}
|
|
emit("update:value", val);
|
|
emit("change", val);
|
|
formItemContext.onFieldChange();
|
|
};
|
|
const getNotFoundContent = () => {
|
|
const notFoundContent = props.notFoundContent;
|
|
if (notFoundContent !== void 0) {
|
|
return notFoundContent;
|
|
}
|
|
if (slots.notFoundContent) {
|
|
return slots.notFoundContent();
|
|
}
|
|
return renderEmpty("Select");
|
|
};
|
|
const getOptions = () => {
|
|
var _a2;
|
|
return flattenChildren(((_a2 = slots.default) === null || _a2 === void 0 ? void 0 : _a2.call(slots)) || []).map((item) => {
|
|
var _a3, _b2;
|
|
return _extends(_extends({}, getOptionProps(item)), {
|
|
label: (_b2 = (_a3 = item.children) === null || _a3 === void 0 ? void 0 : _a3.default) === null || _b2 === void 0 ? void 0 : _b2.call(_a3)
|
|
});
|
|
});
|
|
};
|
|
const focus = () => {
|
|
vcMentions.value.focus();
|
|
};
|
|
const blur = () => {
|
|
vcMentions.value.blur();
|
|
};
|
|
expose({
|
|
focus,
|
|
blur
|
|
});
|
|
const mentionsfilterOption = computed(() => props.loading ? loadingFilterOption : props.filterOption);
|
|
return () => {
|
|
const {
|
|
disabled,
|
|
getPopupContainer,
|
|
rows = 1,
|
|
id = formItemContext.id.value
|
|
} = props, restProps = __rest(props, ["disabled", "getPopupContainer", "rows", "id"]);
|
|
const {
|
|
hasFeedback,
|
|
feedbackIcon
|
|
} = formItemInputContext;
|
|
const {
|
|
class: className
|
|
} = attrs, otherAttrs = __rest(attrs, ["class"]);
|
|
const otherProps = omit(restProps, ["defaultValue", "onUpdate:value", "prefixCls"]);
|
|
const mergedClassName = classNames({
|
|
[`${prefixCls.value}-disabled`]: disabled,
|
|
[`${prefixCls.value}-focused`]: focused.value,
|
|
[`${prefixCls.value}-rtl`]: direction.value === "rtl"
|
|
}, getStatusClassNames(prefixCls.value, mergedStatus.value), !hasFeedback && className, hashId.value);
|
|
const mentionsProps2 = _extends(_extends(_extends(_extends({
|
|
prefixCls: prefixCls.value
|
|
}, otherProps), {
|
|
disabled,
|
|
direction: direction.value,
|
|
filterOption: mentionsfilterOption.value,
|
|
getPopupContainer,
|
|
options: props.loading ? [{
|
|
value: "ANTDV_SEARCHING",
|
|
disabled: true,
|
|
label: createVNode(Spin, {
|
|
"size": "small"
|
|
}, null)
|
|
}] : props.options || getOptions(),
|
|
class: mergedClassName
|
|
}), otherAttrs), {
|
|
rows,
|
|
onChange: handleChange,
|
|
onSelect: handleSelect,
|
|
onFocus: handleFocus,
|
|
onBlur: handleBlur,
|
|
ref: vcMentions,
|
|
value: value.value,
|
|
id
|
|
});
|
|
const mentions = createVNode(Mentions$1, _objectSpread(_objectSpread({}, mentionsProps2), {}, {
|
|
"dropdownClassName": hashId.value
|
|
}), {
|
|
notFoundContent: getNotFoundContent,
|
|
option: slots.option
|
|
});
|
|
if (hasFeedback) {
|
|
return wrapSSR(createVNode("div", {
|
|
"class": classNames(`${prefixCls.value}-affix-wrapper`, getStatusClassNames(`${prefixCls.value}-affix-wrapper`, mergedStatus.value, hasFeedback), className, hashId.value)
|
|
}, [mentions, createVNode("span", {
|
|
"class": `${prefixCls.value}-suffix`
|
|
}, [feedbackIcon])]));
|
|
}
|
|
return wrapSSR(mentions);
|
|
};
|
|
}
|
|
});
|
|
const MentionsOption = defineComponent(_extends(_extends({
|
|
compatConfig: {
|
|
MODE: 3
|
|
}
|
|
}, optionOptions), {
|
|
name: "AMentionsOption",
|
|
props: optionProps
|
|
}));
|
|
const __nuxt_component_0 = _extends(Mentions, {
|
|
Option: MentionsOption,
|
|
getMentions,
|
|
install: (app) => {
|
|
app.component(Mentions.name, Mentions);
|
|
app.component(MentionsOption.name, MentionsOption);
|
|
return app;
|
|
}
|
|
});
|
|
const _sfc_main$6 = /* @__PURE__ */ defineComponent({
|
|
__name: "Content",
|
|
__ssrInlineRender: true,
|
|
props: {
|
|
media: {},
|
|
name: {},
|
|
id: {},
|
|
scrollSave: {}
|
|
},
|
|
setup(__props) {
|
|
useRouter();
|
|
const config = useConfigStore();
|
|
const videos = ref([]);
|
|
const modules = [Pagination];
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
const _directive_lazy = resolveDirective("lazy");
|
|
let _temp0;
|
|
_push(`<div${ssrRenderAttrs(mergeProps({ class: "mt-.5rem" }, _attrs))} data-v-8c70fb9e>`);
|
|
_push(ssrRenderComponent(unref(Swiper), {
|
|
pagination: true,
|
|
modules,
|
|
class: "postConfig !h-unset !aspect-square !m-unset"
|
|
}, {
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(`<!--[-->`);
|
|
ssrRenderList(_ctx.media, (slide) => {
|
|
_push2(ssrRenderComponent(unref(SwiperSlide), { class: "!w-full !h-unset !aspect-square" }, {
|
|
default: withCtx((_2, _push3, _parent3, _scopeId2) => {
|
|
var _a;
|
|
if (_push3) {
|
|
if (slide.type === "video") {
|
|
_push3(`<div class="video-container" data-v-8c70fb9e${_scopeId2}><video${ssrRenderAttr("src", unref(getSupabaseStorageUrl)(slide.url))} playsinline muted loop class="video" data-v-8c70fb9e${_scopeId2}></video></div>`);
|
|
} else {
|
|
_push3(`<div class="w-full aspect-square flex items-center" data-v-8c70fb9e${_scopeId2}><img${ssrRenderAttrs(_temp0 = mergeProps({
|
|
alt: unref(reactiveProjectName),
|
|
class: "w-full"
|
|
}, ssrGetDirectiveProps(_ctx, _directive_lazy, { src: unref(getSupabaseStorageUrl)(slide.url), loading: unref(img_gif), error: unref(img_gif) })))} data-v-8c70fb9e${_scopeId2}>${"textContent" in _temp0 ? ssrInterpolate(_temp0.textContent) : (_a = _temp0.innerHTML) != null ? _a : ""}</div>`);
|
|
}
|
|
} else {
|
|
return [
|
|
slide.type === "video" ? (openBlock(), createBlock("div", {
|
|
key: 0,
|
|
class: "video-container"
|
|
}, [
|
|
createVNode("video", {
|
|
ref_for: true,
|
|
ref_key: "videos",
|
|
ref: videos,
|
|
src: unref(getSupabaseStorageUrl)(slide.url),
|
|
playsinline: "",
|
|
muted: "",
|
|
loop: "",
|
|
class: "video"
|
|
}, null, 8, ["src"])
|
|
])) : (openBlock(), createBlock("div", {
|
|
key: 1,
|
|
class: "w-full aspect-square flex items-center"
|
|
}, [
|
|
withDirectives(createVNode("img", {
|
|
alt: unref(reactiveProjectName),
|
|
class: "w-full"
|
|
}, null, 8, ["alt"]), [
|
|
[_directive_lazy, { src: unref(getSupabaseStorageUrl)(slide.url), loading: unref(img_gif), error: unref(img_gif) }]
|
|
])
|
|
]))
|
|
];
|
|
}
|
|
}),
|
|
_: 2
|
|
}, _parent2, _scopeId));
|
|
});
|
|
_push2(`<!--]-->`);
|
|
} else {
|
|
return [
|
|
(openBlock(true), createBlock(Fragment, null, renderList(_ctx.media, (slide) => {
|
|
return openBlock(), createBlock(unref(SwiperSlide), { class: "!w-full !h-unset !aspect-square" }, {
|
|
default: withCtx(() => [
|
|
slide.type === "video" ? (openBlock(), createBlock("div", {
|
|
key: 0,
|
|
class: "video-container"
|
|
}, [
|
|
createVNode("video", {
|
|
ref_for: true,
|
|
ref_key: "videos",
|
|
ref: videos,
|
|
src: unref(getSupabaseStorageUrl)(slide.url),
|
|
playsinline: "",
|
|
muted: "",
|
|
loop: "",
|
|
class: "video"
|
|
}, null, 8, ["src"])
|
|
])) : (openBlock(), createBlock("div", {
|
|
key: 1,
|
|
class: "w-full aspect-square flex items-center"
|
|
}, [
|
|
withDirectives(createVNode("img", {
|
|
alt: unref(reactiveProjectName),
|
|
class: "w-full"
|
|
}, null, 8, ["alt"]), [
|
|
[_directive_lazy, { src: unref(getSupabaseStorageUrl)(slide.url), loading: unref(img_gif), error: unref(img_gif) }]
|
|
])
|
|
]))
|
|
]),
|
|
_: 2
|
|
}, 1024);
|
|
}), 256))
|
|
];
|
|
}
|
|
}),
|
|
_: 1
|
|
}, _parent));
|
|
_push(`<div class="flex bg-[#0195f7] text-white px-3 py-3 items-center justify-between" data-v-8c70fb9e><div class="font-semibold font-azar text-xs" data-v-8c70fb9e>${ssrInterpolate(_ctx.name)}</div><div class="flex items-center" data-v-8c70fb9e><div class="text-xs" data-v-8c70fb9e>${ssrInterpolate(unref(config).useString("viewProduct"))}</div>`);
|
|
_push(ssrRenderComponent(BasicIconOld, {
|
|
icon: unref(config).isRTL ? "vuesax-linear:arrow-left-1" : "vuesax-linear:arrow-right-1",
|
|
size: "16"
|
|
}, null, _parent));
|
|
_push(`</div></div></div>`);
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$6 = _sfc_main$6.setup;
|
|
_sfc_main$6.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("views/base/pages/home/components/Content.vue");
|
|
return _sfc_setup$6 ? _sfc_setup$6(props, ctx) : void 0;
|
|
};
|
|
const Content = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-8c70fb9e"]]);
|
|
const _imports_0$2 = "data:image/svg+xml,%3csvg%20width='21'%20height='21'%20viewBox='0%200%2021%2021'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M18.7431%2015.215C19.5381%2013.825%2020.0031%2012.22%2020.0031%2010.5C20.0031%205.255%2015.7481%201%2010.5031%201C5.25811%201%201.00311%205.255%201.00311%2010.5C1.00311%2015.745%205.25811%2020%2010.5031%2020C12.2581%2020%2013.8931%2019.515%2015.3031%2018.69L19.3581%2019.775C19.6481%2019.855%2019.9181%2019.585%2019.8381%2019.295L18.7431%2015.215Z'%20stroke='white'%20stroke-width='2'%20stroke-linejoin='round'/%3e%3c/svg%3e";
|
|
const _imports_1$2 = "data:image/svg+xml,%3csvg%20width='21'%20height='21'%20viewBox='0%200%2021%2021'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M18.7431%2015.215C19.5381%2013.825%2020.0031%2012.22%2020.0031%2010.5C20.0031%205.255%2015.7481%201%2010.5031%201C5.25811%201%201.00311%205.255%201.00311%2010.5C1.00311%2015.745%205.25811%2020%2010.5031%2020C12.2581%2020%2013.8931%2019.515%2015.3031%2018.69L19.3581%2019.775C19.6481%2019.855%2019.9181%2019.585%2019.8381%2019.295L18.7431%2015.215Z'%20stroke='black'%20stroke-width='2'%20stroke-linejoin='round'/%3e%3c/svg%3e";
|
|
const _sfc_main$5 = /* @__PURE__ */ defineComponent({
|
|
__name: "comment",
|
|
__ssrInlineRender: true,
|
|
setup(__props) {
|
|
const config = useConfigStore();
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
if (unref(config).isNightStore) {
|
|
_push(`<img${ssrRenderAttrs(mergeProps({
|
|
src: _imports_0$2,
|
|
alt: "comment",
|
|
"cursor-pointer": ""
|
|
}, _attrs))}>`);
|
|
} else {
|
|
_push(`<img${ssrRenderAttrs(mergeProps({
|
|
src: _imports_1$2,
|
|
alt: "comment",
|
|
"cursor-pointer": ""
|
|
}, _attrs))}>`);
|
|
}
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$5 = _sfc_main$5.setup;
|
|
_sfc_main$5.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("assets/img/icons/comment.vue");
|
|
return _sfc_setup$5 ? _sfc_setup$5(props, ctx) : void 0;
|
|
};
|
|
const _imports_0$1 = "data:image/svg+xml,%3csvg%20width='18'%20height='20'%20viewBox='0%200%2018%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M9%2011.5L16.94%2019H17V1H1V19H1.06L9%2011.5Z'%20stroke='white'%20stroke-width='2'%20stroke-linejoin='round'/%3e%3c/svg%3e";
|
|
const _imports_1$1 = "data:image/svg+xml,%3csvg%20width='18'%20height='20'%20viewBox='0%200%2018%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M9%2011.5L16.94%2019H17V1H1V19H1.06L9%2011.5Z'%20stroke='black'%20stroke-width='2'%20stroke-linejoin='round'/%3e%3c/svg%3e";
|
|
const _imports_2 = "data:image/svg+xml,%3csvg%20width='18'%20height='20'%20viewBox='0%200%2018%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M9%2011.5L16.94%2019H17V1H1V19H1.06L9%2011.5Z'%20fill='white'%20stroke='white'%20stroke-width='2'%20stroke-linejoin='round'/%3e%3c/svg%3e";
|
|
const _imports_3 = "data:image/svg+xml,%3csvg%20width='18'%20height='20'%20viewBox='0%200%2018%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M9%2011.5L16.94%2019H17V1H1V19H1.06L9%2011.5Z'%20fill='black'%20stroke='black'%20stroke-width='2'%20stroke-linejoin='round'/%3e%3c/svg%3e";
|
|
const _sfc_main$4 = /* @__PURE__ */ defineComponent({
|
|
__name: "save",
|
|
__ssrInlineRender: true,
|
|
props: {
|
|
isSaved: { type: Boolean }
|
|
},
|
|
setup(__props) {
|
|
const config = useConfigStore();
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
if (!_ctx.isSaved) {
|
|
if (unref(config).isNightStore) {
|
|
_push(`<img${ssrRenderAttr("src", _imports_0$1)} alt="comment" cursor-pointer>`);
|
|
} else {
|
|
_push(`<img${ssrRenderAttr("src", _imports_1$1)} alt="comment" cursor-pointer>`);
|
|
}
|
|
} else {
|
|
if (unref(config).isNightStore) {
|
|
_push(`<img${ssrRenderAttr("src", _imports_2)} alt="comment" cursor-pointer>`);
|
|
} else {
|
|
_push(`<img${ssrRenderAttr("src", _imports_3)} alt="comment" cursor-pointer>`);
|
|
}
|
|
}
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$4 = _sfc_main$4.setup;
|
|
_sfc_main$4.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("assets/img/icons/save.vue");
|
|
return _sfc_setup$4 ? _sfc_setup$4(props, ctx) : void 0;
|
|
};
|
|
const _imports_0 = "data:image/svg+xml,%3csvg%20width='22'%20height='20'%20viewBox='0%200%2022%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M21.0031%201H1.00311L8.50311%208.5M21.0031%201L10.5031%2018.5L8.50311%208.5M21.0031%201L8.50311%208.5'%20stroke='white'%20stroke-width='2'%20stroke-linejoin='round'/%3e%3c/svg%3e";
|
|
const _imports_1 = "data:image/svg+xml,%3csvg%20width='22'%20height='20'%20viewBox='0%200%2022%2020'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3cpath%20d='M21.0031%201H1.00311L8.50311%208.5M21.0031%201L10.5031%2018.5L8.50311%208.5M21.0031%201L8.50311%208.5'%20stroke='black'%20stroke-width='2'%20stroke-linejoin='round'/%3e%3c/svg%3e";
|
|
const _sfc_main$3 = /* @__PURE__ */ defineComponent({
|
|
__name: "share",
|
|
__ssrInlineRender: true,
|
|
setup(__props) {
|
|
const config = useConfigStore();
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
if (unref(config).isNightStore) {
|
|
_push(`<img${ssrRenderAttrs(mergeProps({
|
|
src: _imports_0,
|
|
alt: "comment",
|
|
"cursor-pointer": ""
|
|
}, _attrs))}>`);
|
|
} else {
|
|
_push(`<img${ssrRenderAttrs(mergeProps({
|
|
class: "rtl:-scale-x-100",
|
|
src: _imports_1,
|
|
alt: "comment",
|
|
"cursor-pointer": ""
|
|
}, _attrs))}>`);
|
|
}
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$3 = _sfc_main$3.setup;
|
|
_sfc_main$3.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("assets/img/icons/share.vue");
|
|
return _sfc_setup$3 ? _sfc_setup$3(props, ctx) : void 0;
|
|
};
|
|
const maxLength = 100;
|
|
const _sfc_main$2 = /* @__PURE__ */ defineComponent({
|
|
__name: "Post",
|
|
__ssrInlineRender: true,
|
|
props: {
|
|
post: {},
|
|
index: {},
|
|
scrollSave: {},
|
|
addLikeLoading: { type: Boolean }
|
|
},
|
|
emits: ["openOption", "openComment", "handleLike", "handleSave"],
|
|
setup(__props, { emit: __emit }) {
|
|
useRouter();
|
|
const emits = __emit;
|
|
const config = useConfigStore();
|
|
const expandedPosts = ref({});
|
|
const user = useUserStore();
|
|
const shouldShowMore = (caption) => (caption == null ? void 0 : caption.length) > maxLength;
|
|
function openOption(id) {
|
|
emits("openOption", id);
|
|
}
|
|
const truncatedCaption = (caption) => {
|
|
return shouldShowMore(caption) ? (caption == null ? void 0 : caption.slice(0, maxLength)) + "..." : caption;
|
|
};
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
var _a2, _b2, _c2;
|
|
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t;
|
|
const _directive_lazy = resolveDirective("lazy");
|
|
let _temp0;
|
|
_push(`<div${ssrRenderAttrs(mergeProps({
|
|
class: "w-full mb-2",
|
|
id: "post-" + _ctx.post.id
|
|
}, _attrs))}><div class="flex px-3 items-center justify-between"><div class="flex items-center"><img${ssrRenderAttrs(_temp0 = mergeProps({
|
|
alt: "instagram",
|
|
class: "w-2rem h-2rem rounded-full"
|
|
}, ssrGetDirectiveProps(_ctx, _directive_lazy, { src: unref(getSupabaseStorageUrl)((_b = (_a = _ctx.post) == null ? void 0 : _a.users) == null ? void 0 : _b.avatar), loading: unref(empty_user), error: unref(empty_user) })))}>${"textContent" in _temp0 ? ssrInterpolate(_temp0.textContent) : (_a2 = _temp0.innerHTML) != null ? _a2 : ""}<div class="ms-2"><div class="text-sm font-semibold">${ssrInterpolate((_d = (_c = _ctx.post) == null ? void 0 : _c.users) == null ? void 0 : _d.username)}</div></div></div>`);
|
|
if (((_f = (_e = _ctx.post) == null ? void 0 : _e.users) == null ? void 0 : _f.id) === ((_g = unref(user).user) == null ? void 0 : _g.id)) {
|
|
_push(`<div>`);
|
|
_push(ssrRenderComponent(BasicIconOld, {
|
|
icon: "vuesax-linear:more",
|
|
class: "rotate-90",
|
|
size: "18",
|
|
onClick: ($event) => openOption(_ctx.post.id)
|
|
}, null, _parent));
|
|
_push(`</div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`</div>`);
|
|
_push(ssrRenderComponent(Content, {
|
|
media: (_h = _ctx.post) == null ? void 0 : _h.files,
|
|
name: _ctx.post.title_fa,
|
|
id: _ctx.post.id,
|
|
scrollSave: _ctx.scrollSave
|
|
}, null, _parent));
|
|
_push(`<div class="p-4"><div class="flex gap-4 items-center justify-between"><div class="flex items-center gap-4"><div class="flex items-center gap-1"${ssrRenderAttr("aria-disabled", _ctx.addLikeLoading)}>`);
|
|
_push(ssrRenderComponent(_sfc_main$7, {
|
|
"is-liked": (_i = _ctx.post.likes) == null ? void 0 : _i.some((x) => {
|
|
var _a22;
|
|
return x.user_id === ((_a22 = unref(user).user) == null ? void 0 : _a22.id);
|
|
})
|
|
}, null, _parent));
|
|
_push(` ${ssrInterpolate((_b2 = (_k = (_j = _ctx.post) == null ? void 0 : _j.likes) == null ? void 0 : _k.length) != null ? _b2 : 0)}</div><div class="flex items-center gap-1">`);
|
|
_push(ssrRenderComponent(_sfc_main$5, null, null, _parent));
|
|
_push(` ${ssrInterpolate((_c2 = (_m = (_l = _ctx.post) == null ? void 0 : _l.comments) == null ? void 0 : _m.length) != null ? _c2 : 0)}</div><div class="flex items-center gap-1">`);
|
|
_push(ssrRenderComponent(_sfc_main$3, null, null, _parent));
|
|
_push(`</div></div><div>`);
|
|
_push(ssrRenderComponent(_sfc_main$4, {
|
|
"is-saved": (_n = _ctx.post.saved) == null ? void 0 : _n.some((x) => {
|
|
var _a22;
|
|
return x.user_id === ((_a22 = unref(user).user) == null ? void 0 : _a22.id);
|
|
})
|
|
}, null, _parent));
|
|
_push(`</div></div><div class="mt-2 text-sm"><span class="font-semibold ms1">${ssrInterpolate((_p = (_o = _ctx.post) == null ? void 0 : _o.users) == null ? void 0 : _p.name)}</span><span class="ms-2 font-azar text-xs">${ssrInterpolate(expandedPosts.value[_ctx.index] ? (_q = _ctx.post) == null ? void 0 : _q.description : truncatedCaption((_r = _ctx.post) == null ? void 0 : _r.description))}</span>`);
|
|
if (shouldShowMore((_s = _ctx.post) == null ? void 0 : _s.description)) {
|
|
_push(`<span class="text-gray cursor-pointer ms-1">${ssrInterpolate(expandedPosts.value[_ctx.index] ? unref(config).useString("less") : unref(config).useString("more"))}</span>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
_push(`<div class="text-xs mt-1 text-gray-500">${ssrInterpolate(unref(formatTime)((_t = _ctx.post) == null ? void 0 : _t.created_at))}</div></div></div></div>`);
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$2 = _sfc_main$2.setup;
|
|
_sfc_main$2.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/Post.vue");
|
|
return _sfc_setup$2 ? _sfc_setup$2(props, ctx) : void 0;
|
|
};
|
|
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
__name: "PostCardSkeleton",
|
|
__ssrInlineRender: true,
|
|
setup(__props) {
|
|
const isLoaded = ref(false);
|
|
const skeletonRatio = ref(null);
|
|
const skeletonSize = reactive(
|
|
useElementSize(skeletonRatio, { width: 0, height: 0 }, { box: "border-box" })
|
|
);
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
if (isLoaded.value) {
|
|
_push(`<div${ssrRenderAttrs(mergeProps({
|
|
ref_key: "skeletonRatio",
|
|
ref: skeletonRatio,
|
|
class: "h-fit"
|
|
}, _attrs))}>`);
|
|
_push(ssrRenderComponent(unref(ContentLoader), {
|
|
width: skeletonSize.width,
|
|
height: "800"
|
|
}, {
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(`<circle${ssrRenderAttr("cx", 30)} cy="30" r="20"${_scopeId}></circle><rect x="60" y="25" rx="3" ry="3" width="100" height="10"${_scopeId}></rect><rect x="0" y="60" rx="0" ry="0"${ssrRenderAttr("width", Math.max(100, skeletonSize.width))}${ssrRenderAttr("height", Math.max(0, skeletonSize.width - 100))}${_scopeId}></rect><rect x="20"${ssrRenderAttr("y", Math.max(0, skeletonSize.width - 10))} rx="0" ry="0"${ssrRenderAttr("width", 300)}${ssrRenderAttr("height", 10)}${_scopeId}></rect><rect x="20"${ssrRenderAttr("y", Math.max(0, skeletonSize.width + 10))} rx="0" ry="0"${ssrRenderAttr("width", 300)}${ssrRenderAttr("height", 8)}${_scopeId}></rect>`);
|
|
} else {
|
|
return [
|
|
createVNode("circle", {
|
|
cx: 30,
|
|
cy: "30",
|
|
r: "20"
|
|
}),
|
|
createVNode("rect", {
|
|
x: "60",
|
|
y: "25",
|
|
rx: "3",
|
|
ry: "3",
|
|
width: "100",
|
|
height: "10"
|
|
}),
|
|
createVNode("rect", {
|
|
x: "0",
|
|
y: "60",
|
|
rx: "0",
|
|
ry: "0",
|
|
width: Math.max(100, skeletonSize.width),
|
|
height: Math.max(0, skeletonSize.width - 100)
|
|
}, null, 8, ["width", "height"]),
|
|
createVNode("rect", {
|
|
x: "20",
|
|
y: Math.max(0, skeletonSize.width - 10),
|
|
rx: "0",
|
|
ry: "0",
|
|
width: 300,
|
|
height: 10
|
|
}, null, 8, ["y"]),
|
|
createVNode("rect", {
|
|
x: "20",
|
|
y: Math.max(0, skeletonSize.width + 10),
|
|
rx: "0",
|
|
ry: "0",
|
|
width: 300,
|
|
height: 8
|
|
}, null, 8, ["y"])
|
|
];
|
|
}
|
|
}),
|
|
_: 1
|
|
}, _parent));
|
|
_push(`</div>`);
|
|
} else {
|
|
_push(`<!---->`);
|
|
}
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup$1 = _sfc_main$1.setup;
|
|
_sfc_main$1.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("views/base/pages/home/components/PostCardSkeleton.vue");
|
|
return _sfc_setup$1 ? _sfc_setup$1(props, ctx) : void 0;
|
|
};
|
|
const createPostLike = async (product_id) => {
|
|
return await myAxios.post("/media/create-like", { product_id });
|
|
};
|
|
const deletePostLike = async (product_id) => supabaseService.fetch("likes", "delete", {
|
|
field: ["user_id", "product_id"],
|
|
value: [useUserStore().user.id, product_id]
|
|
});
|
|
const createCommentLike = async (comment_id) => {
|
|
return await myAxios.post("/media/create-comment-like", { comment_id });
|
|
};
|
|
const deleteCommentLike = async (comment_id) => supabaseService.fetch("likes", "delete", {
|
|
field: ["user_id", "comment_id"],
|
|
value: [useUserStore().user.id, comment_id]
|
|
});
|
|
const getComments = async (product_id, page = 1, limit = 10) => {
|
|
var _a;
|
|
const start = (page - 1) * limit;
|
|
const end = start + limit - 1;
|
|
return (_a = await supabase.from("comments").select(`*,
|
|
user:users(name, avatar),
|
|
like:likes(user_id),
|
|
replies:comments(*,
|
|
user:users(name, avatar),
|
|
like:likes(user_id)
|
|
)`).eq("product_id", product_id).is("parent_id", null).range(start, end).order("created_at", { ascending: false })) == null ? void 0 : _a.data;
|
|
};
|
|
const addNewComment = async (message, product_id, parent_id = void 0) => {
|
|
return await myAxios.post(`/media/add-comment`, { message, product_id, parent_id });
|
|
};
|
|
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
__name: "CommentAddEdit",
|
|
__ssrInlineRender: true,
|
|
props: {
|
|
open: { type: Boolean },
|
|
id: {}
|
|
},
|
|
emits: ["update:open"],
|
|
setup(__props, { emit: __emit }) {
|
|
const router = useRouter();
|
|
const config = useConfigStore();
|
|
const userStore = useUserStore();
|
|
const sheetRef = ref(null);
|
|
const isAtTop = ref(true);
|
|
const scrollArea = ref(null);
|
|
const focusInput = ref(false);
|
|
const addMessageLoading = ref(false);
|
|
const addLikeLoading = ref(false);
|
|
useUserStore();
|
|
const userReply = ref(void 0);
|
|
const handleScroll = () => {
|
|
isAtTop.value = scrollArea.value.scrollTop <= 5;
|
|
};
|
|
function resetReply() {
|
|
userReply.value = void 0;
|
|
}
|
|
function scrollInputIntoView() {
|
|
setTimeout(() => {
|
|
var _a;
|
|
(_a = (void 0).activeElement) == null ? void 0 : _a.scrollIntoView({ behavior: "smooth", block: "center" });
|
|
focusInput.value = true;
|
|
}, 300);
|
|
}
|
|
const props = __props;
|
|
const emits = __emit;
|
|
const loading = ref(false);
|
|
const comments = ref([]);
|
|
const messageText = ref("");
|
|
const inputRef = ref(null);
|
|
const endPage = ref(false);
|
|
const currentPage = ref(0);
|
|
const limit = ref(20);
|
|
const request = async () => {
|
|
try {
|
|
if (!endPage.value) {
|
|
loading.value = true;
|
|
const res = await getComments(props.id, ++currentPage.value, limit.value);
|
|
if ((res == null ? void 0 : res.length) < limit.value)
|
|
endPage.value = true;
|
|
comments.value.push(...res);
|
|
}
|
|
} catch (e) {
|
|
console.log("e ===>", e);
|
|
} finally {
|
|
loading.value = false;
|
|
}
|
|
};
|
|
async function openSheet() {
|
|
var _a, _b;
|
|
await request();
|
|
await nextTick();
|
|
await ((_a = sheetRef.value) == null ? void 0 : _a.setOpen());
|
|
await ((_b = inputRef.value) == null ? void 0 : _b.focus());
|
|
}
|
|
async function closeSheet() {
|
|
var _a;
|
|
await nextTick();
|
|
await ((_a = sheetRef.value) == null ? void 0 : _a.setClose());
|
|
resetList();
|
|
resetReply();
|
|
}
|
|
function resetList() {
|
|
comments.value = [];
|
|
currentPage.value = 0;
|
|
endPage.value = false;
|
|
}
|
|
const addMessage = async () => {
|
|
var _a, _b, _c, _d;
|
|
try {
|
|
if (((_a = messageText.value) == null ? void 0 : _a.length) > 0) {
|
|
addMessageLoading.value = true;
|
|
if (userReply.value) {
|
|
const inf = await addNewComment(messageText.value, props.id, userReply.value.id);
|
|
if (!((_b = userReply.value) == null ? void 0 : _b.replies)) userReply.value.replies = [];
|
|
(_c = userReply.value) == null ? void 0 : _c.replies.push({
|
|
message: messageText.value,
|
|
user: { name: userStore.user.name, avatar: userStore.user.avatar },
|
|
like: [],
|
|
...inf
|
|
});
|
|
} else {
|
|
const inf = await addNewComment(messageText.value, props.id);
|
|
(_d = comments.value) == null ? void 0 : _d.unshift({
|
|
message: messageText.value,
|
|
user: { name: userStore.user.name, avatar: userStore.user.avatar },
|
|
like: [],
|
|
replies: [],
|
|
...inf
|
|
});
|
|
}
|
|
await nextTick(() => {
|
|
messageText.value = "";
|
|
userReply.value = void 0;
|
|
});
|
|
}
|
|
} catch (e) {
|
|
console.log(e);
|
|
} finally {
|
|
addMessageLoading.value = false;
|
|
}
|
|
};
|
|
function handleLike(isLiked, id, isSub, searchId) {
|
|
var _a, _b, _c;
|
|
try {
|
|
addLikeLoading.value = true;
|
|
if (getToken()) {
|
|
if (isLiked) {
|
|
deleteCommentLike(id);
|
|
if (isSub) {
|
|
const item = comments.value.find((x) => x.id === searchId);
|
|
const subIndex = item == null ? void 0 : item.replies.find((x) => x.id === id);
|
|
subIndex == null ? void 0 : subIndex.like.splice((_a = subIndex.like) == null ? void 0 : _a.findIndex((y) => {
|
|
var _a2;
|
|
return y.user_id === ((_a2 = userStore.user) == null ? void 0 : _a2.id);
|
|
}));
|
|
} else {
|
|
const item = comments.value.find((x) => x.id === searchId);
|
|
item == null ? void 0 : item.like.splice((_b = item == null ? void 0 : item.like) == null ? void 0 : _b.findIndex((y) => {
|
|
var _a2;
|
|
return y.user_id === ((_a2 = userStore.user) == null ? void 0 : _a2.id);
|
|
}));
|
|
}
|
|
} else {
|
|
createCommentLike(id);
|
|
if (isSub) {
|
|
const item = comments.value.find((x) => x.id === searchId);
|
|
const subIndex = item == null ? void 0 : item.replies.find((x) => x.id === id);
|
|
subIndex == null ? void 0 : subIndex.like.push({
|
|
product_id: id,
|
|
user_id: userStore.user.id
|
|
});
|
|
} else {
|
|
const item = comments.value.find((x) => x.id === searchId);
|
|
(_c = item == null ? void 0 : item.like) == null ? void 0 : _c.push({
|
|
product_id: id,
|
|
user_id: userStore.user.id
|
|
});
|
|
}
|
|
}
|
|
} else {
|
|
router.push({ name: "auth-login" });
|
|
api$1.warn(config.useString("pleaseLoginOrRegister"));
|
|
}
|
|
} catch (e) {
|
|
console.log(e);
|
|
} finally {
|
|
addLikeLoading.value = false;
|
|
}
|
|
}
|
|
const observer = ref();
|
|
useIntersectionObserver(observer, ([{ isIntersecting }]) => {
|
|
if (isIntersecting && props.open) {
|
|
setTimeout(() => {
|
|
request();
|
|
}, 100);
|
|
}
|
|
});
|
|
watch(props, (value) => {
|
|
if (value.open) {
|
|
openSheet();
|
|
} else {
|
|
closeSheet();
|
|
}
|
|
});
|
|
return (_ctx, _push, _parent, _attrs) => {
|
|
const _component_a_mentions = __nuxt_component_0;
|
|
_push(ssrRenderComponent(BasicSheet, mergeProps({
|
|
title: "",
|
|
ref_key: "sheetRef",
|
|
ref: sheetRef,
|
|
headerCls: "",
|
|
allowCloseScrollup: isAtTop.value,
|
|
closeOnClickOutside: "",
|
|
onOnClickOutside: ($event) => emits("update:open", false),
|
|
onOnClose: ($event) => emits("update:open", false)
|
|
}, _attrs), {
|
|
header: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
if (_push2) {
|
|
_push2(`<div flex justify-center items-center flex-col p-2${_scopeId}><div bg-gray-500 h-2px w-2.5rem${_scopeId}></div><div mt-1 font-semibold${_scopeId}>${ssrInterpolate(unref(config).useString("comments"))}</div></div>`);
|
|
} else {
|
|
return [
|
|
createVNode("div", {
|
|
flex: "",
|
|
"justify-center": "",
|
|
"items-center": "",
|
|
"flex-col": "",
|
|
"p-2": ""
|
|
}, [
|
|
createVNode("div", {
|
|
"bg-gray-500": "",
|
|
"h-2px": "",
|
|
"w-2.5rem": ""
|
|
}),
|
|
createVNode("div", {
|
|
"mt-1": "",
|
|
"font-semibold": ""
|
|
}, toDisplayString(unref(config).useString("comments")), 1)
|
|
])
|
|
];
|
|
}
|
|
}),
|
|
default: withCtx((_, _push2, _parent2, _scopeId) => {
|
|
var _a, _b, _c, _d, _e, _f;
|
|
if (_push2) {
|
|
_push2(`<div class="${ssrRenderClass([unref(getToken)() ? "pb-4rem" : "", "h-70vh w-full relative relative"])}"${_scopeId}><div class="h-full px-4 overflow-auto"${_scopeId}><!--[-->`);
|
|
ssrRenderList(comments.value, (comment) => {
|
|
_push2(ssrRenderComponent(_sfc_main$2$1, {
|
|
item: comment,
|
|
onLikeComment: handleLike,
|
|
onReply: ($event) => userReply.value = comment,
|
|
addLikeLoading: addLikeLoading.value
|
|
}, null, _parent2, _scopeId));
|
|
});
|
|
_push2(`<!--]-->`);
|
|
if (loading.value) {
|
|
_push2(`<!--[-->`);
|
|
ssrRenderList(5, (item) => {
|
|
_push2(ssrRenderComponent(_sfc_main$1$1, null, null, _parent2, _scopeId));
|
|
});
|
|
_push2(`<!--]-->`);
|
|
} else {
|
|
_push2(`<!---->`);
|
|
}
|
|
_push2(`<div style="${ssrRenderStyle(!loading.value ? null : { display: "none" })}" class="w-full opacity-0 relative"${_scopeId}> load </div></div>`);
|
|
if (unref(getToken)()) {
|
|
_push2(`<div class="flex w-inherit fixed gap-2 items-end my-2 px4 py-1 bottom-1"${_scopeId}>`);
|
|
_push2(ssrRenderComponent(UserProfilePic, {
|
|
width: "40",
|
|
src: (_a = unref(userStore).user) == null ? void 0 : _a.avatar,
|
|
"just-show-profile": ""
|
|
}, null, _parent2, _scopeId));
|
|
_push2(`<div class="${ssrRenderClass([userReply.value ? "rounded-3xl" : "rounded-full", "border-solid w-full border-1 comment_input"])}"${_scopeId}>`);
|
|
if (userReply.value) {
|
|
_push2(`<div class="${ssrRenderClass([unref(config).isNightStore ? "bg-zinc-7 text-gray-2" : "bg-gray-50 text-gray-4", "rounded-t-3xl text-xs p3 mb1 flex justify-between"])}"${_scopeId}><div class="flex items-center"${_scopeId}><span${_scopeId}><span class="me-1"${_scopeId}>${ssrInterpolate(unref(config).useString("replyingTo"))}</span><span${_scopeId}>${ssrInterpolate((_c = (_b = userReply.value) == null ? void 0 : _b.user) == null ? void 0 : _c.name)}</span></span></div>`);
|
|
_push2(ssrRenderComponent(BasicIconOld, {
|
|
icon: "vuesax-linear:add",
|
|
class: "rotate-45",
|
|
color: unref(config).isNightStore ? "bg-zinc-7" : "text-gray-4",
|
|
onClick: ($event) => userReply.value = void 0
|
|
}, null, _parent2, _scopeId));
|
|
_push2(`</div>`);
|
|
} else {
|
|
_push2(`<!---->`);
|
|
}
|
|
_push2(`<div class="flex items-center p1"${_scopeId}>`);
|
|
_push2(ssrRenderComponent(_component_a_mentions, {
|
|
value: messageText.value,
|
|
"onUpdate:value": ($event) => messageText.value = $event,
|
|
placeholder: unref(config).useString("yourComment"),
|
|
class: "comment_input"
|
|
}, null, _parent2, _scopeId));
|
|
_push2(ssrRenderComponent(_sfc_main$8, {
|
|
onClick: addMessage,
|
|
class: "rounded-full w-3.5rem",
|
|
type: "primary",
|
|
loading: addMessageLoading.value
|
|
}, {
|
|
default: withCtx((_2, _push3, _parent3, _scopeId2) => {
|
|
if (_push3) {
|
|
_push3(ssrRenderComponent(BasicIconOld, { icon: "vuesax-linear:arrow-up" }, null, _parent3, _scopeId2));
|
|
} else {
|
|
return [
|
|
createVNode(BasicIconOld, { icon: "vuesax-linear:arrow-up" })
|
|
];
|
|
}
|
|
}),
|
|
_: 1
|
|
}, _parent2, _scopeId));
|
|
_push2(`</div></div></div>`);
|
|
} else {
|
|
_push2(`<!---->`);
|
|
}
|
|
_push2(`</div>`);
|
|
} else {
|
|
return [
|
|
createVNode("div", {
|
|
class: ["h-70vh w-full relative relative", unref(getToken)() ? "pb-4rem" : ""]
|
|
}, [
|
|
createVNode("div", {
|
|
class: "h-full px-4 overflow-auto",
|
|
ref_key: "scrollArea",
|
|
ref: scrollArea,
|
|
onScroll: handleScroll
|
|
}, [
|
|
(openBlock(true), createBlock(Fragment, null, renderList(comments.value, (comment) => {
|
|
return openBlock(), createBlock(_sfc_main$2$1, {
|
|
item: comment,
|
|
onLikeComment: handleLike,
|
|
onReply: ($event) => userReply.value = comment,
|
|
addLikeLoading: addLikeLoading.value
|
|
}, null, 8, ["item", "onReply", "addLikeLoading"]);
|
|
}), 256)),
|
|
loading.value ? (openBlock(), createBlock(Fragment, { key: 0 }, renderList(5, (item) => {
|
|
return createVNode(_sfc_main$1$1);
|
|
}), 64)) : createCommentVNode("", true),
|
|
withDirectives(createVNode("div", {
|
|
ref_key: "observer",
|
|
ref: observer,
|
|
class: "w-full opacity-0 relative"
|
|
}, " load ", 512), [
|
|
[vShow, !loading.value]
|
|
])
|
|
], 544),
|
|
unref(getToken)() ? (openBlock(), createBlock("div", {
|
|
key: 0,
|
|
class: "flex w-inherit fixed gap-2 items-end my-2 px4 py-1 bottom-1",
|
|
onFocusin: scrollInputIntoView,
|
|
onFocusout: ($event) => focusInput.value = false
|
|
}, [
|
|
createVNode(UserProfilePic, {
|
|
width: "40",
|
|
src: (_d = unref(userStore).user) == null ? void 0 : _d.avatar,
|
|
"just-show-profile": ""
|
|
}, null, 8, ["src"]),
|
|
createVNode("div", {
|
|
class: ["border-solid w-full border-1 comment_input", userReply.value ? "rounded-3xl" : "rounded-full"]
|
|
}, [
|
|
userReply.value ? (openBlock(), createBlock("div", {
|
|
key: 0,
|
|
class: ["rounded-t-3xl text-xs p3 mb1 flex justify-between", unref(config).isNightStore ? "bg-zinc-7 text-gray-2" : "bg-gray-50 text-gray-4"]
|
|
}, [
|
|
createVNode("div", { class: "flex items-center" }, [
|
|
createVNode("span", null, [
|
|
createVNode("span", { class: "me-1" }, toDisplayString(unref(config).useString("replyingTo")), 1),
|
|
createVNode("span", null, toDisplayString((_f = (_e = userReply.value) == null ? void 0 : _e.user) == null ? void 0 : _f.name), 1)
|
|
])
|
|
]),
|
|
createVNode(BasicIconOld, {
|
|
icon: "vuesax-linear:add",
|
|
class: "rotate-45",
|
|
color: unref(config).isNightStore ? "bg-zinc-7" : "text-gray-4",
|
|
onClick: ($event) => userReply.value = void 0
|
|
}, null, 8, ["color", "onClick"])
|
|
], 2)) : createCommentVNode("", true),
|
|
createVNode("div", { class: "flex items-center p1" }, [
|
|
createVNode(_component_a_mentions, {
|
|
value: messageText.value,
|
|
"onUpdate:value": ($event) => messageText.value = $event,
|
|
placeholder: unref(config).useString("yourComment"),
|
|
class: "comment_input"
|
|
}, null, 8, ["value", "onUpdate:value", "placeholder"]),
|
|
createVNode(_sfc_main$8, {
|
|
onClick: addMessage,
|
|
class: "rounded-full w-3.5rem",
|
|
type: "primary",
|
|
loading: addMessageLoading.value
|
|
}, {
|
|
default: withCtx(() => [
|
|
createVNode(BasicIconOld, { icon: "vuesax-linear:arrow-up" })
|
|
]),
|
|
_: 1
|
|
}, 8, ["loading"])
|
|
])
|
|
], 2)
|
|
], 40, ["onFocusout"])) : createCommentVNode("", true)
|
|
], 2)
|
|
];
|
|
}
|
|
}),
|
|
_: 1
|
|
}, _parent));
|
|
};
|
|
}
|
|
});
|
|
const _sfc_setup = _sfc_main.setup;
|
|
_sfc_main.setup = (props, ctx) => {
|
|
const ssrContext = useSSRContext();
|
|
(ssrContext.modules || (ssrContext.modules = /* @__PURE__ */ new Set())).add("components/CommentAddEdit.vue");
|
|
return _sfc_setup ? _sfc_setup(props, ctx) : void 0;
|
|
};
|
|
|
|
export { _sfc_main$2 as _, _sfc_main$1 as a, _sfc_main as b, createPostLike as c, deletePostLike as d, _sfc_main$3 as e };
|
|
//# sourceMappingURL=CommentAddEdit-C_HQr-mD.mjs.map
|