Skip to content

A
ai_web_page_prod
Commit 40b1bb9d by haojie
Options

1

parent f6e48e78
Showing with 1752 additions and 57 deletions
src/assets/svg/form/ManualResponse.svg 0 → 100644
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M19.7257 10.3622C19.6409 5.7365 16.129 2 11.8167 2H11.1833C6.87097 2 3.35913 5.7365 3.27427 10.3615C2.5168 10.8097 2 11.6368 2 12.5932V13.8866C2 15.3131 3.1362 16.4733 4.53333 16.4733C5.93047 16.4733 7.06667 15.3131 7.06667 13.8866V12.5932C7.0657 11.912 6.8017 11.2586 6.33194 10.7748C5.86219 10.291 5.22456 10.0159 4.5574 10.0091C4.80503 6.2616 7.67847 3.29335 11.1833 3.29335H11.8167C15.3222 3.29335 18.195 6.2616 18.4426 10.0091C17.7754 10.0159 17.1378 10.291 16.6681 10.7748C16.1983 11.2586 15.9343 11.912 15.9333 12.5932V13.8866C15.9333 15.0545 16.6997 16.0322 17.7421 16.3523C16.8013 17.6168 15.4578 18.5065 13.9434 18.8679C13.8388 18.5477 13.6384 18.2692 13.3705 18.0716C13.1025 17.874 12.7805 17.7673 12.45 17.7666C12.0301 17.7666 11.6273 17.9369 11.3304 18.2401C11.0335 18.5433 10.8667 18.9545 10.8667 19.3833C10.8667 19.8121 11.0335 20.2233 11.3304 20.5265C11.6273 20.8297 12.0301 21 12.45 21C12.7197 20.9996 12.9848 20.9286 13.22 20.7938C13.4552 20.6589 13.6526 20.4648 13.7933 20.2298C14.9347 20.0259 16.0187 19.5702 16.9698 18.8945C17.9209 18.2188 18.7162 17.3393 19.3001 16.3174C20.2869 15.9643 21 15.0137 21 13.8866V12.5932C21 11.6368 20.4832 10.8097 19.7257 10.3622ZM5.8 12.5932V13.8866C5.8 14.5998 5.2319 15.1799 4.53333 15.1799C3.83477 15.1799 3.26667 14.5998 3.26667 13.8866V12.5932C3.26667 11.8799 3.83477 11.2999 4.53333 11.2999C5.2319 11.2999 5.8 11.8799 5.8 12.5932ZM19.7333 13.8866C19.7333 14.5798 19.195 15.1431 18.5237 15.1741L18.4743 15.1502C18.4698 15.1605 18.4629 15.1689 18.4584 15.1786C18.1241 15.1764 17.8043 15.0393 17.5685 14.7973C17.3328 14.5553 17.2003 14.2279 17.2 13.8866V12.5932C17.2 11.8799 17.7681 11.2999 18.4667 11.2999C19.1652 11.2999 19.7333 11.8799 19.7333 12.5932V13.8866Z" fill="white"/>
</svg>
src/assets/svg/form/close.svg 0 → 100644
<svg width="21" height="21" viewBox="0 0 21 21" fill="" xmlns="http://www.w3.org/2000/svg">
<path d="M10.5003 18.6431C6.01099 18.6431 2.35742 14.9896 2.35742 10.5003C2.35742 6.01099 6.01099 2.35742 10.5003 2.35742C14.9896 2.35742 18.6431 6.01099 18.6431 10.5003C18.6431 14.9896 14.9896 18.6431 10.5003 18.6431Z" fill=""/>
<path d="M7.44595 13.9612C7.33881 13.9612 7.24238 13.9184 7.15667 13.8434C6.99595 13.6826 6.99595 13.4255 7.15667 13.2648L13.2638 7.15765C13.4245 6.99693 13.6817 6.99693 13.8424 7.15765C14.0031 7.31836 14.0031 7.5755 13.8424 7.73622L7.73524 13.8434C7.64953 13.9184 7.5531 13.9612 7.44595 13.9612Z" fill="#FFEEF0"/>
<path d="M13.5531 13.9612C13.446 13.9612 13.3495 13.9184 13.2638 13.8434L7.15667 7.73622C6.99595 7.5755 6.99595 7.31836 7.15667 7.15765C7.31738 6.99693 7.57453 6.99693 7.73524 7.15765L13.8424 13.2648C14.0031 13.4255 14.0031 13.6826 13.8424 13.8434C13.7567 13.9184 13.6602 13.9612 13.5531 13.9612Z" fill="#FFEEF0"/>
</svg>
src/assets/svg/form/crossTalk.svg 0 → 100644
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.37227 15.4992C10.2965 15.4992 11.8715 13.9852 11.8715 12.1336V6.36563C11.8715 4.51406 10.2965 3 8.37227 3C6.44805 3 4.87305 4.51406 4.87305 6.36563V12.1359C4.87071 13.9852 6.44571 15.4992 8.37227 15.4992ZM6.37071 6.40078C6.37071 5.35547 7.27071 4.5 8.36992 4.5C9.46914 4.5 10.3691 5.35547 10.3691 6.40078V12.1008C10.3691 13.1461 9.46914 14.0016 8.36992 14.0016C7.27071 14.0016 6.37071 13.1461 6.37071 12.1008V6.40078Z" fill="white"/>
<path d="M10.1201 19.5008H9.1193V17.9562C12.1755 17.6305 14.6388 15.343 15.2295 12.3758C15.3209 11.9211 14.9529 11.5016 14.4888 11.5016C14.1326 11.5016 13.8302 11.7523 13.7576 12.1016C13.249 14.6117 11.0318 16.5008 8.37164 16.5008C5.71149 16.5008 3.49196 14.6117 2.98336 12.0992C2.91305 11.75 2.60836 11.4992 2.25211 11.4992C1.78805 11.4992 1.42242 11.9188 1.51149 12.3734C2.10211 15.3406 4.56539 17.6281 7.6193 17.9539V19.5008H6.61852C6.20602 19.5008 5.86852 19.8383 5.86852 20.2508C5.86852 20.6633 6.20602 21.0008 6.61852 21.0008H10.1177C10.5302 21.0008 10.8677 20.6633 10.8677 20.2508C10.8677 19.8383 10.5326 19.5008 10.1201 19.5008ZM19.249 8H14.749C14.3365 8 13.999 8.3375 13.999 8.75C13.999 9.1625 14.3365 9.5 14.749 9.5H19.249C19.6615 9.5 19.999 9.1625 19.999 8.75C19.999 8.3375 19.6615 8 19.249 8ZM19.249 15.5H14.749C14.3365 15.5 13.999 15.8375 13.999 16.25C13.999 16.6625 14.3365 17 14.749 17H19.249C19.6615 17 19.999 16.6625 19.999 16.25C19.999 15.8375 19.6615 15.5 19.249 15.5ZM19.249 12.0008H16.7505C16.338 12.0008 16.0005 12.3383 16.0005 12.7508C16.0005 13.1633 16.338 13.5008 16.7505 13.5008H19.2513C19.6638 13.5008 20.0013 13.1633 20.0013 12.7508C20.0013 12.3383 19.6615 12.0008 19.249 12.0008Z" fill="white"/>
<path d="M20.501 3.5H13.2494C12.8346 3.5 12.4994 3.83516 12.4994 4.25C12.4994 4.66484 12.8346 5 13.2494 5H19.9994C20.5525 5 21.0002 5.44766 21.0002 6.00078V18.0008C21.0002 18.5539 20.5525 19.0016 19.9994 19.0016H12.251C11.8361 19.0016 11.501 19.3367 11.501 19.7516C11.501 20.1664 11.8361 20.5016 12.251 20.5016H20.501C21.6049 20.5016 22.5002 19.6062 22.5002 18.5023V5.50156C22.5002 4.39531 21.6049 3.5 20.501 3.5Z" fill="white"/>
</svg>
src/assets/svg/form/disabled.svg 0 → 100644
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M10 28.1815L28.2545 9.89062L30.0727 11.7088L11.8182 29.9997L10 28.1815Z" fill="#888FA1"/>
<path d="M35.455 20.0014C35.455 23.058 34.5486 26.046 32.8504 28.5875C31.1523 31.129 28.7386 33.1098 25.9146 34.2796C23.0907 35.4493 19.9833 35.7553 16.9854 35.159C13.9875 34.5627 11.2338 33.0908 9.07244 30.9294C6.91108 28.7681 5.43918 26.0143 4.84286 23.0165C4.24654 20.0186 4.55259 16.9112 5.72231 14.0872C6.89203 11.2633 8.87288 8.8496 11.4144 7.15144C13.9559 5.45327 16.9438 4.54688 20.0005 4.54688C24.0993 4.54688 28.0302 6.17512 30.9285 9.07341C33.8268 11.9717 35.455 15.9026 35.455 20.0014ZM7.27318 20.0014C7.27318 22.5186 8.01962 24.9793 9.41811 27.0723C10.8166 29.1653 12.8043 30.7966 15.1299 31.7599C17.4555 32.7232 20.0146 32.9752 22.4834 32.4841C24.9523 31.9931 27.2201 30.7809 29 29.001C30.7799 27.221 31.9921 24.9532 32.4832 22.4844C32.9743 20.0155 32.7222 17.4565 31.7589 15.1309C30.7956 12.8053 29.1643 10.8176 27.0713 9.41908C24.9784 8.02059 22.5177 7.27415 20.0005 7.27415C16.625 7.27415 13.3877 8.61505 11.0009 11.0019C8.61408 13.3887 7.27318 16.6259 7.27318 20.0014Z" fill="#888FA1"/>
</svg>
src/assets/svg/form/discourseBind.svg 0 → 100644
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M8.37227 15.4992C10.2965 15.4992 11.8715 13.9852 11.8715 12.1336V6.36563C11.8715 4.51406 10.2965 3 8.37227 3C6.44805 3 4.87305 4.51406 4.87305 6.36563V12.1359C4.87071 13.9852 6.44571 15.4992 8.37227 15.4992ZM6.37071 6.40078C6.37071 5.35547 7.27071 4.5 8.36992 4.5C9.46914 4.5 10.3691 5.35547 10.3691 6.40078V12.1008C10.3691 13.1461 9.46914 14.0016 8.36992 14.0016C7.27071 14.0016 6.37071 13.1461 6.37071 12.1008V6.40078Z" fill="white"/>
<path d="M10.1201 19.5008H9.1193V17.9562C12.1755 17.6305 14.6388 15.343 15.2295 12.3758C15.3209 11.9211 14.9529 11.5016 14.4888 11.5016C14.1326 11.5016 13.8302 11.7523 13.7576 12.1016C13.249 14.6117 11.0318 16.5008 8.37164 16.5008C5.71149 16.5008 3.49196 14.6117 2.98336 12.0992C2.91305 11.75 2.60836 11.4992 2.25211 11.4992C1.78805 11.4992 1.42242 11.9188 1.51149 12.3734C2.10211 15.3406 4.56539 17.6281 7.6193 17.9539V19.5008H6.61852C6.20602 19.5008 5.86852 19.8383 5.86852 20.2508C5.86852 20.6633 6.20602 21.0008 6.61852 21.0008H10.1177C10.5302 21.0008 10.8677 20.6633 10.8677 20.2508C10.8677 19.8383 10.5326 19.5008 10.1201 19.5008ZM19.249 8H14.749C14.3365 8 13.999 8.3375 13.999 8.75C13.999 9.1625 14.3365 9.5 14.749 9.5H19.249C19.6615 9.5 19.999 9.1625 19.999 8.75C19.999 8.3375 19.6615 8 19.249 8ZM19.249 15.5H14.749C14.3365 15.5 13.999 15.8375 13.999 16.25C13.999 16.6625 14.3365 17 14.749 17H19.249C19.6615 17 19.999 16.6625 19.999 16.25C19.999 15.8375 19.6615 15.5 19.249 15.5ZM19.249 12.0008H16.7505C16.338 12.0008 16.0005 12.3383 16.0005 12.7508C16.0005 13.1633 16.338 13.5008 16.7505 13.5008H19.2513C19.6638 13.5008 20.0013 13.1633 20.0013 12.7508C20.0013 12.3383 19.6615 12.0008 19.249 12.0008Z" fill="white"/>
<path d="M20.501 3.5H13.2494C12.8346 3.5 12.4994 3.83516 12.4994 4.25C12.4994 4.66484 12.8346 5 13.2494 5H19.9994C20.5525 5 21.0002 5.44766 21.0002 6.00078V18.0008C21.0002 18.5539 20.5525 19.0016 19.9994 19.0016H12.251C11.8361 19.0016 11.501 19.3367 11.501 19.7516C11.501 20.1664 11.8361 20.5016 12.251 20.5016H20.501C21.6049 20.5016 22.5002 19.6062 22.5002 18.5023V5.50156C22.5002 4.39531 21.6049 3.5 20.501 3.5Z" fill="white"/>
</svg>
src/assets/svg/form/message.svg 0 → 100644
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M18.7857 17.5777H7.38904L3 20V10.287V10.2876V4.21481C3 3.54363 3.54339 3 4.21429 3H18.7857C19.456 3 20 3.54363 20 4.21481V16.3629C20 17.0334 19.456 17.5777 18.7857 17.5777ZM18.7857 4.82221C18.7857 4.48692 18.5137 4.21481 18.1786 4.21481H4.82143C4.48629 4.21481 4.21429 4.48692 4.21429 4.82221V12.7178V15.7555V17.5819L6.73454 16.3629H18.1786C18.5137 16.3629 18.7857 16.0908 18.7857 15.7555V4.82221ZM14.5357 9.07403H6.03571C5.70057 9.07403 5.42857 8.80191 5.42857 8.46663C5.42857 8.13134 5.70057 7.85923 6.03571 7.85923H14.5357C14.8709 7.85923 15.1429 8.13134 15.1429 8.46663C15.1429 8.80191 14.8709 9.07403 14.5357 9.07403ZM6.03571 11.5036H9.67857C10.0137 11.5036 10.2857 11.7758 10.2857 12.111C10.2857 12.4463 10.0137 12.7185 9.67857 12.7185H6.03571C5.70057 12.7185 5.42857 12.4463 5.42857 12.111C5.42857 11.7758 5.70057 11.5036 6.03571 11.5036Z" fill="white"/>
</svg>
src/assets/svg/form/startLiveStream.svg 0 → 100644
<svg width="16" height="16" viewBox="0 0 16 16" fill="" xmlns="http://www.w3.org/2000/svg">
<path d="M7.79102 0.232422C3.49609 0.232422 0 3.72656 0 8.02344C0.00195312 12.3184 3.49609 15.8125 7.79102 15.8125C12.0859 15.8125 15.5801 12.3184 15.5801 8.02344C15.5801 3.72852 12.0859 0.232422 7.79102 0.232422ZM11.1699 8.47266L6.28906 11.291C5.94336 11.4902 5.51172 11.2402 5.51172 10.8418V5.20508C5.51172 4.80664 5.94336 4.55664 6.28906 4.75586L11.1699 7.57422C11.5156 7.77344 11.5156 8.27344 11.1699 8.47266Z" fill=""/>
</svg>
src/components/Admin/AdminPublicPage.vue
......@@ -74,6 +74,7 @@
:local_key="form.local_key"
:edit_page="form.edit_page"
:checkbox="form.checkbox"
:edit_key="form.edit_key"
@ChangeList="ChangeList"
@ChoseList="ChoseList"
>
......@@ -83,6 +84,9 @@
<template #mp3="{ row }">
<slot name="mp3" :row="row"></slot>
</template>
<template #edit="{ row }">
<slot name="edit" :row="row"> </slot>
</template>
</CustomTable>
</div>
<slot></slot>
......
src/components/Admin/PageEdit.vue
......@@ -36,6 +36,18 @@
<template v-if="item.icon == 'TextToSpeech'">
<TextToSpeechSvg style="fill: white"></TextToSpeechSvg>
</template>
<template v-else-if="item.icon == 'message'">
<MessageSvg style="fill: white"></MessageSvg>
</template>
<template v-else-if="item.icon == 'crossTalk'">
<CrossTalk></CrossTalk>
</template>
<template v-else-if="item.icon == 'discourseBind'">
<DiscourseBindSvg></DiscourseBindSvg>
</template>
<template v-else-if="item.icon == 'ManualResponse'">
<ManualResponseSvg></ManualResponseSvg>
</template>
<template v-else>
<img :src="item.icon" alt="" />
</template>
......@@ -67,17 +79,37 @@
</template>
</CustomInput>
</template>
<template v-if="it.type == 'select'">
<template v-else-if="it.type == 'select'">
<CustomSelect
:options="it.options"
v-model="it.value"
:item="{}"
:align="it.align"
:audio="it.audio"
width="800px"
></CustomSelect>
</template>
<template v-if="it.type == 'textarea'">
<CustomTextarea v-model="it.value"></CustomTextarea>
<template v-else-if="it.type == 'textarea'">
<CustomTextarea
v-model="it.value"
:disabled="form.is_send ? form.is_send.disabled : false"
></CustomTextarea>
</template>
<template v-else-if="it.type == 'number'">
<CustomInput
type="number"
align="left"
class="edit-input"
v-model="it.value"
:placeholder="it.placeholder"
:disabled="it.disabled ? it.disabled : false"
>
<template #rightIcon>
<template v-if="!it.disabled">
<span class="input-right-icon"> M </span>
</template>
</template>
</CustomInput>
</template>
</div>
</div>
......@@ -101,6 +133,21 @@
:url="''"
></CustomAudio>
</template>
<template v-if="form.start_broadcast">
<StartBroadcast :status="'not_on_air'"></StartBroadcast>
</template>
<template v-if="form.is_send">
<div class="custom-send-box">
<CustomButton
@click="onSend"
class="custom-send-btn"
:class="{
'send-btn-disabled': form.is_send.disabled,
}"
>{{ form.is_send.label }}</CustomButton
>
</div>
</template>
</div>
</div>
</div>
......@@ -119,23 +166,43 @@
<script lang="ts" setup>
import CustomAudio from './audio.vue';
import CustomButton from './button.vue';
import CustomTextarea from '@/components/custom/textarea.vue';
import CustomTextarea from './Textarea.vue';
import CustomSelect from './select.vue';
import StartBroadcast from './StartBroadcast.vue';
import BackListSvg from '@/assets/svg/edit/backList.svg';
import DeleteSvg from '@/assets/svg/edit/delete.svg';
import EditInputSvg from '@/assets/svg/edit/editInput.svg';
import CustomInput from './input.vue';
import TextToSpeechSvg from '@/assets/svg/form/textToSpeech.svg';
import MessageSvg from '@/assets/svg/form/message.svg';
import CrossTalk from '@/assets/svg/form/crossTalk.svg';
import DiscourseBindSvg from '@/assets/svg/form/discourseBind.svg';
import ManualResponseSvg from '@/assets/svg/form/ManualResponse.svg';
import { useRouter } from 'vue-router';
import { show_message } from '@/utils/tdesign_tool';
const props = defineProps<{
form: any;
}>();
const router = useRouter();
const backTable = () => {
const { back_url } = props.form;
if (!back_url) {
show_message('缺少返回配置');
return;
}
router.replace({
path: props.form.back_url,
});
};
// 发起请求
const onSend = () => {
//
const { is_send } = props.form;
if (is_send && is_send.api) {
//
}
};
</script>
<style lang="less">
......@@ -249,6 +316,25 @@ const backTable = () => {
}
}
}
.custom-send-box {
max-width: 800px;
text-align: right;
.custom-send-btn {
height: 36px;
background: #00dddd;
width: 72px;
border-radius: 3px;
margin-top: 20px;
color: black;
font-weight: 400;
font-size: 14px;
}
.send-btn-disabled {
background: #4a4a4a;
color: #adadad;
cursor: not-allowed;
}
}
.edit-input {
height: auto;
......
src/components/Admin/StartBroadcast.vue 0 → 100644
<template>
<div class="admin-start-broadcast">
<CustomButton
@click="onClose"
:class="[
'live-stream--default',
BroadcastStatus == 'not_on_air' ? 'close-live-stream--disabled' : '',
BroadcastStatus == 'air_success' ? 'can-close-live-stream' : '',
]"
>
关播
<template #icon>
<span class="stop-broadcast-icon">
<CloseSvg></CloseSvg>
</span>
</template>
</CustomButton>
<!-- -->
<CustomButton
@click="onStart"
:class="[
'live-stream--default',
BroadcastStatus == 'not_on_air' ? 'start-not-air' : '',
BroadcastStatus == 'air_success' ? 'start-not-air--success' : '',
]"
>
{{ StartLiveStreamText() }}
<template #icon>
<span class="start-broadcast-icon">
<StartLiveStreamSvg></StartLiveStreamSvg>
</span>
</template>
</CustomButton>
</div>
</template>
<script lang="ts" setup>
import { ref } from 'vue';
import CustomButton from './button.vue';
import CloseSvg from '@/assets/svg/form/close.svg';
import StartLiveStreamSvg from '@/assets/svg/form/startLiveStream.svg';
const props = withDefaults(
defineProps<{
status: string;
}>(),
{}
);
const emit = defineEmits(['update:modelValue']);
/**
* 开播状态
* not_on_air-未开播
* air_success - 已开播
*/
const BroadcastStatus = ref<'not_on_air' | 'air_success'>('not_on_air');
// 关播按钮loading
const CloseLoading = ref(false);
// 开播按钮loading
const StartLoading = ref(false);
// 开播按钮显示的文字
const StartLiveStreamText = () => {
if (BroadcastStatus.value == 'not_on_air') {
return '开播';
} else if (BroadcastStatus.value == 'air_success') {
return '开播中';
}
return '开播';
};
// 关播
const onClose = () => {
if (BroadcastStatus.value == 'air_success') {
// 开播成功才可以关闭
}
};
// 开播
const onStart = () => {
if (BroadcastStatus.value == 'not_on_air') {
// 未开播才可以开播
console.log('可以开播');
}
};
</script>
<style lang="less">
.admin-start-broadcast {
display: flex;
align-items: center;
justify-content: flex-end;
margin-top: 20px;
& > :first-child {
margin-right: 12px;
}
.live-stream--default {
border-radius: 3px;
height: 36px;
font-weight: 400;
font-size: 14px;
.stop-broadcast-icon,
.start-broadcast-icon {
display: flex;
align-items: center;
svg {
transition: all 0.2s;
}
}
&:hover {
svg {
transition: all 0.2s;
}
}
}
// 禁止点击
.close-live-stream--disabled {
border: 1px solid #8e8e8e;
color: #8e8e8e;
svg {
fill: #8e8e8e;
}
&:hover {
cursor: not-allowed;
background: transparent;
border-color: #8e8e8e;
color: #8e8e8e;
}
}
// 可以关播
.can-close-live-stream {
border: 1px solid #e5404f;
color: #e5404f;
svg {
fill: #e5404f;
}
&:hover {
border-color: transparent;
background: #e5404f;
color: #000000;
svg {
fill: #000000;
}
}
}
// 开播按钮未开播状态
.start-not-air {
border: 1px solid #00dddd;
color: #00dddd;
.start-broadcast-icon {
svg {
fill: #00dddd;
}
}
&:hover {
border-color: transparent;
color: black;
svg {
fill: black;
}
}
}
// 开播中
.start-not-air--success {
border: 1px solid transparent;
background: #00dddd;
color: black;
.start-broadcast-icon {
svg {
fill: black;
}
}
&:hover {
border-color: transparent;
}
}
}
</style>
src/components/Admin/Textarea.vue 0 → 100644
<template>
<div class="admin-textarea-box">
<TTextarea
class="custom-t-textarea"
v-model="textarea_value"
:placeholder="placeholder"
:maxcharacter="maxlength"
:autosize="{
maxRows: maxRows,
minRows: minRows,
}"
></TTextarea>
<div class="position-text">
<span> {{ textareaLength }}/{{ maxlength }}</span> ｜
<span class="reset-btn" @click="reset">清空</span>
</div>
<template v-if="disabled">
<div class="live-stream-disabled">
<img :src="imgs.disabled" alt="" />
<div class="disabled-text">该直播间暂未开播</div>
</div>
</template>
</div>
</template>
<script lang="ts" setup>
import { Textarea as TTextarea } from 'tdesign-vue-next';
import { computed, ref, watch } from 'vue';
const props = withDefaults(
defineProps<{
modelValue: string;
placeholder?: string;
maxRows?: number;
minRows?: number;
maxlength?: number | null;
disabled?: boolean;
}>(),
{
placeholder: '请输入',
maxRows: 5,
minRows: 5,
maxlength: 500,
disabled: false,
}
);
const emit = defineEmits(['update:modelValue']);
const imgs = {
disabled: new URL('../../assets/svg/form/disabled.svg', import.meta.url).href,
};
const textarea_value = ref('');
const reset = () => {
textarea_value.value = '';
};
const textareaLength = computed(() => {
// 文本总长度
const total_len = textarea_value.value.length;
if (total_len) {
// 获取中文文本的长度
let re = /[\u4E00-\u9FA5]/g;
let list = textarea_value.value.match(re);
if (list && list.length) {
// 加上其他字符的长度
const other_len = total_len - list.length;
return list.length * 2 + other_len;
}
}
return total_len;
});
watch(
() => textarea_value.value,
(v) => {
emit('update:modelValue', v);
}
);
watch(
() => props.modelValue,
(v) => {
textarea_value.value = v;
}
);
</script>
<style lang="less">
@import '@/style/variables.less';
.admin-textarea-box {
width: 100%;
max-width: 800px;
background: #181818;
border: @main-border;
color: white;
resize: none;
border-radius: 8px;
transition: border 0.2s;
position: relative;
&:focus-within {
border-color: #00f9f9;
transition: all 0.2s;
}
.custom-t-textarea {
.t-textarea__inner {
background: #181818;
border: none;
color: white;
padding: 6px 12px;
resize: none;
border-radius: 8px;
transition: border 0.2s;
&::placeholder {
color: #888fa2;
}
}
.t-textarea__limit {
display: none;
}
.t-is-focused {
box-shadow: none;
}
}
.position-text {
font-size: @font-size-12;
text-align: right;
padding-right: 12px;
padding-bottom: 6px;
.reset-btn {
cursor: pointer;
user-select: none;
color: #00f9f9;
}
}
.live-stream-disabled {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
cursor: not-allowed;
.disabled-text {
font-weight: 400;
font-size: 14px;
color: #adadad;
margin-top: 12px;
}
}
}
</style>
src/components/Admin/select.vue
......@@ -25,10 +25,14 @@
:label="item.label"
></t-option>
</TSelect>
<template v-if="audio">
<CustomAudio></CustomAudio>
</template>
</div>
</template>
<script lang="ts" setup>
import CustomAudio from './audio.vue';
import { Select as TSelect, Option as TOption } from 'tdesign-vue-next';
import { ref, watch } from 'vue';
const props = withDefaults(
......@@ -39,10 +43,12 @@ const props = withDefaults(
width?: string;
className?: string;
align?: string;
audio?: boolean;
}>(),
{
width: '357px',
align: 'center',
audio: false,
}
);
const emit = defineEmits(['update:modelValue']);
......@@ -84,6 +90,8 @@ watch(
}
}
.custom-admin-select {
display: flex;
align-items: center;
.select-label {
color: white;
width: 60px;
......@@ -94,7 +102,6 @@ watch(
height: 35px;
}
.t-select__wrap {
width: 357px;
height: 35px;
.t-select-input {
height: 100%;
......
src/components/Admin/table.vue
......@@ -28,7 +28,9 @@
<slot name="mp3" :row="row"></slot>
</template>
<template #edit="{ row }">
<span class="edit-text" @click="onEdit(row)">编辑</span>
<slot name="edit" :row="row">
<span class="edit-text" @click="onEdit(row)">编辑</span>
</slot>
</template>
</TTable>
<div class="custom-pagination">
......@@ -50,9 +52,7 @@ import { onBeforeMount, reactive, ref } from 'vue';
import { Pagination as TPagination } from 'tdesign-vue-next';
// import { TASKTYPE } from '@/utils/api/Task';
import { getLocalData, setLocalData } from '@/utils/tool';
import { show_message } from '@/utils/tdesign_tool';
import { useRouter } from 'vue-router';
import { edit_page_key } from '@/constants/token';
import { EditButtonEvent } from '@/constants/admin_form';
const props = withDefaults(
defineProps<{
api: string;
......@@ -61,13 +61,13 @@ const props = withDefaults(
local_key: string;
edit_page: string;
checkbox?: boolean;
edit_key: string;
}>(),
{
checkbox: true,
}
);
const emit = defineEmits(['ChangeList', 'ChoseList']);
const router = useRouter();
// 获取本地的page
const getPage = () => {
const page = getLocalData(props.local_key, 'session');
......@@ -134,16 +134,8 @@ const CheckOne = (row: any) => {
// 打开编辑页面
const onEdit = (row: any) => {
const { edit_page } = props;
if (edit_page) {
// 行数据存本地
setLocalData(edit_page_key, JSON.stringify(row), 'session');
router.push({
path: edit_page,
});
} else {
show_message('缺少编辑配置');
}
const { edit_page, edit_key } = props;
EditButtonEvent(edit_key, edit_page, row);
};
// 获取表格数据
......@@ -253,6 +245,11 @@ onBeforeMount(() => {
font-size: @font-size-14;
.edit-text {
cursor: pointer;
transition: color 0.2s;
&:hover {
color: @main-color-1;
transition: color 0.2s;
}
}
}
}
......
src/constants/admin_form.ts
import { getLocalData, setLocalData } from '@/utils/tool';
import router from '@/router';
import { show_message } from '@/utils/tdesign_tool';
// 清空admin-form的value值
export const ResetForm = (list: any[]) => {
list.forEach((item: any) => {
......@@ -18,3 +21,46 @@ export const getFilterParams = (list: any[]) => {
});
return params;
};
// 编辑按钮点击
export const EditButtonEvent = (key: string, path: string, row: any) => {
if (key && path) {
// 行数据存本地
setLocalData(key, JSON.stringify(row), 'session');
router.push({
path: path,
});
} else {
show_message('缺少编辑配置');
}
};
// 获取编辑页面本地缓存
export const getEditLocalData = (key: string, path: string) => {
const local_data = getLocalData(key, 'session');
if (!local_data) {
// 没有本地数据,返回页面
show_message('禁止访问');
// 返回话术管理
router.replace({
path: path,
});
} else {
return local_data;
}
};
// 编辑页面填充数据
export const EditFillData = (form: any[], row: any) => {
form.forEach((item: any) => {
item.lists.forEach((it: any) => {
// 查找name相同的字段
Object.keys(row).forEach((key: string) => {
if (it.name == key) {
// 填充数据
it.value = row[key];
}
});
});
});
};
src/constants/token.tsx
......@@ -8,7 +8,15 @@ export const emailReg = /^\w{3,}(\.\w+)*@[A-z0-9]+(\.[A-z]{2,8}){1,2}$/;
export const remember_password_phone = 'remember_phone';
export const remember_password_email = 'remember_email';
// 话术编辑页面本地key
export const edit_page_key = 'discourse_management_edit';
export const discourse_management_edit = 'discourse_management_edit_key';
// 互动设置编辑页面本地key
export const interactive_setting_edit = 'interactive_setting_edit_key';
// 直播管理编辑页面本地key
export const live_stream_edit = 'live_stream_edit_key';
// 直播管理查看页面本地key
export const live_stream_detail = 'live_stream_detail_key';
// 直播管理--人工回复本地key
export const live_stream_reply = 'live_stream_reply_key';
// 图片详情展示的key
export const image_local_key = 'local_photo_gallery';
......
src/layout/tab/content.vue 0 → 100644
<template>
<router-view v-slot="{ Component }" v-if="is_load">
<transition name="fade" mode="out-in">
<component :is="Component" />
</transition>
</router-view>
</template>
<script lang="ts" setup>
import { useStore } from 'vuex';
import { computed } from 'vue';
const store = useStore();
// 刷新页面
const is_load = computed(() => store.getters['progress/load']);
</script>
<style lang="less">
@import '@/style/variables';
/**
* 常见的贝塞尔曲线
* --ease-in-quad: cubic-bezier(.55, .085, .68, .53);
--ease-in-cubic: cubic-bezier(.55, .055, .675, .19);
--ease-in-quart: cubic-bezier(.895, .03, .685, .22);
--ease-in-quint: cubic-bezier(.755, .05, .855, .06);
--ease-in-expo: cubic-bezier( .95, .05, .795, .035);
--ease-in-circ: cubic-bezier( .6, .04, .98, .335);
--ease-out-quad: cubic-bezier( .25, .46, .45, .94);
--ease-out-cubic: cubic-bezier( .215, .61, .355, 1);
--ease-out-quart: cubic-bezier( .165, .84, .44, 1);
--ease-out-quint: cubic-bezier( .23, 1, .32, 1);
--ease-out-expo: cubic-bezier(.19, 1, .22, 1);
--ease-out-circ: cubic-bezier(.075, .82, .165, 1);
--ease-in-out-quad: cubic-bezier(.455, .03, .515, .955);
--ease-in-out-cubic: cubic-bezier(.645, .045, .355, 1);
--ease-in-out-quart: cubic-bezier(.77, 0, .175, 1);
--ease-in-out-quint: cubic-bezier(.86, 0, .07, 1);
--ease-in-out-expo: cubic-bezier(l, 0, 0, 1);
--ease-in-out-circ: cubic-bezier(.785, .135, .15, .86);
*/
.fade-enter-active,
.fade-leave-active {
transition: all 0.2s ease-out;
}
.fade-enter-from,
.fade-leave-to {
transform: translateX(100px);
opacity: 0;
}
</style>
src/layout/tab/index.less
......@@ -72,11 +72,14 @@
width: 40px;
transition: all 0.3s;
}
.custom-content {
.custom-tab-content {
flex: 1;
overflow-y: auto;
z-index: 1000;
position: relative;
overflow: hidden;
& > :first-child {
overflow-y: auto;
}
.admin-page-progress {
width: 100%;
position: absolute;
......
src/layout/tab/index.tsx
......@@ -7,14 +7,13 @@ import { RouterView, useRoute, useRouter } from 'vue-router';
import { getCurrentDevice, getLocalData, setLocalData } from '@/utils/tool';
import { Progress as TProgress } from 'tdesign-vue-next';
import { useStore } from 'vuex';
import Content from './content.vue';
export default defineComponent({
setup(props) {
let navStatusKey = 'navstatus';
const store = useStore();
const route = useRoute();
const router = useRouter();
// 刷新页面
const is_load = computed(() => store.getters['progress/load']);
// 页面进度条状态
const ProgressStatus = computed(() => store.getters['progress/progress']);
const tabOptions = computed(() => [
......@@ -33,7 +32,7 @@ export default defineComponent({
{
icon: <LpSvg></LpSvg>,
label: '直播管理',
value: '/lp',
value: '/AILiveStreaming/LiveStream',
disable: false,
},
]);
......@@ -51,6 +50,12 @@ export default defineComponent({
onMounted(() => {
// 缓存里的路由
const local_router = getCurrentRoute();
if (
local_router == '/lp' ||
local_router == '/AILiveStreaming/InteractiveSetting2'
) {
return;
}
// 当前路由
const cur_router = route.path;
let replace_router = '';
......@@ -207,7 +212,7 @@ export default defineComponent({
)}
</div>
</div>
<div class="custom-content custom-scrollbar">
<div class="custom-tab-content custom-scrollbar">
{ProgressStatus.value.show ? (
<div class="admin-page-progress">
<TProgress
......@@ -219,7 +224,7 @@ export default defineComponent({
) : (
''
)}
{is_load.value ? <RouterView></RouterView> : ''}
<Content></Content>
</div>
</div>
</header>
......
src/pages/AILiveStreaming/DiscourseManagement/index.vue
......@@ -11,9 +11,6 @@
<CustomAudio :url="row.mp3"></CustomAudio>
</template>
</AdminPublicPageVue>
<!--
<div class="custom-discourse-management"></div>
-->
</template>
<script lang="ts" setup>
......@@ -23,6 +20,7 @@ import { reactive } from 'vue';
import { isDevContext } from '@/utils/tool';
import { ResetForm } from '@/constants/admin_form';
import { AdminFilterApi } from '@/utils/api/ai';
import { discourse_management_edit } from '@/constants/token';
// 表单配置项
const ManagementForm = reactive({
title: '话术列表',
......@@ -47,6 +45,8 @@ const ManagementForm = reactive({
checkbox: true,
// 编辑页面
edit_page: '/AILiveStreaming/DiscourseManagement/edit',
// 编辑页面的key--存储行数据
edit_key: discourse_management_edit,
// 新增页面
create_page: '/AILiveStreaming/DiscourseManagement/create',
// 多选功能操作项
......@@ -152,7 +152,4 @@ const ResetFilter = () => {
};
</script>
<style lang="less">
.custom-discourse-management {
}
</style>
<style lang="less"></style>
src/pages/AILiveStreaming/DiscourseManagementCreate/index.vue
......@@ -5,7 +5,6 @@
<script lang="ts" setup>
import PageEdit from '@/components/Admin/PageEdit.vue';
import { reactive } from 'vue';
import { edit_page_key } from '@/constants/token';
import { getLocalData, isDevContext } from '@/utils/tool';
import { show_message } from '@/utils/tdesign_tool';
import { useRouter } from 'vue-router';
......
src/pages/AILiveStreaming/DiscourseManagementEdit/index.vue
......@@ -5,10 +5,11 @@
<script lang="ts" setup>
import PageEdit from '@/components/Admin/PageEdit.vue';
import { onBeforeMount, reactive } from 'vue';
import { edit_page_key } from '@/constants/token';
import { discourse_management_edit } from '@/constants/token';
import { getLocalData, isDevContext } from '@/utils/tool';
import { show_message } from '@/utils/tdesign_tool';
import { useRouter } from 'vue-router';
import { getEditLocalData, EditFillData } from '@/constants/admin_form';
const router = useRouter();
const imgs = {
fill: new URL('../../../assets/svg/form/edit.svg', import.meta.url).href,
......@@ -20,6 +21,7 @@ const ManagementForm = reactive({
body_title: '编辑',
// 是否显示返回列表页
back: true,
back_url: '/AILiveStreaming/DiscourseManagement',
// 能否删除,
delete: true,
// 删除api
......@@ -115,25 +117,13 @@ const ManagementForm = reactive({
],
});
const getEditData = () => {
let local_data = getLocalData(edit_page_key, 'session');
if (!local_data) {
// 没有本地数据,返回页面
show_message('禁止访问');
// 返回话术管理
router.replace({
path: '/AILiveStreaming/DiscourseManagement',
});
} else {
// 有数据--填充到form表单里
// ManagementForm.form
console.log(local_data);
}
};
onBeforeMount(() => {
// 本地是否有缓存
getEditData();
const row = getEditLocalData(
discourse_management_edit,
ManagementForm.back_url
);
// 填充数据
EditFillData(ManagementForm.form_options, row);
});
</script>
......
src/pages/AILiveStreaming/InteractiveSetting/index.vue
<template>
<div class="">111</div>
<AdminPublicPageVue
:form="ManagementForm"
v-model:list="ManagementForm.table_list"
@reset="ResetFilter"
>
<template #title>
<div>111</div>
</template>
</AdminPublicPageVue>
</template>
<script lang="ts" setup></script>
<script lang="ts" setup>
import AdminPublicPageVue from '@/components/Admin/AdminPublicPage.vue';
import { reactive } from 'vue';
import { isDevContext } from '@/utils/tool';
import { ResetForm } from '@/constants/admin_form';
import { AdminFilterApi } from '@/utils/api/ai';
import { interactive_setting_edit } from '@/constants/token';
// 表单配置项
const ManagementForm = reactive({
title: '互动设置',
title_2: '列表',
// 能否刷新
refresh: true,
// 能否筛选
filter: true,
// 筛选接口
filter_api: isDevContext() ? '' : '',
// 能否新增
add: true,
// 表格key--用来缓存表格分页
local_key: 'admin_interactive_setting',
// 表格数据
table_list: [],
// 表格接口
table_api: isDevContext() ? '' : '',
// api类型
table_api_type: 'get',
// 能否多选--默认为true
checkbox: true,
// 编辑页面
edit_page: '/AILiveStreaming/InteractiveSetting/edit',
// 编辑页面的key--存储行数据
edit_key: interactive_setting_edit,
// 新增页面
create_page: '/AILiveStreaming/InteractiveSetting/create',
// 多选功能操作项
row_selected_options: [
{
label: '删除',
value: 'delete',
confirm: true,
},
],
// 表格columns-列
table_columns: [
{
title: 'check_all',
colKey: 'checkbox',
},
{
title: 'ID',
colKey: 'id',
},
{
title: '标题',
colKey: 'title',
align: 'center',
},
{
title: '语言',
colKey: 'language',
align: 'center',
},
{
title: '类型',
colKey: 'type',
align: 'center',
},
{
title: '操作',
colKey: 'edit',
align: 'right',
},
],
filter_option: [
{
type: 'select',
name: 'select_title',
label: '标题',
placeholder: '请选择标题',
value: '',
options: [
{
label: '你好',
value: '你好',
},
{
label: '你好2',
value: '你好2',
},
],
},
{
type: 'select',
name: 'select_product',
label: '产品',
placeholder: '产品',
value: '',
options: [
{
label: '你好',
value: '你好',
},
{
label: '你好2',
value: '你好2',
},
],
},
{
type: 'select',
name: 'select_language',
label: '语言',
placeholder: '语言',
value: '',
options: [
{
label: '你好',
value: '你好',
},
{
label: '你好2',
value: '你好2',
},
],
},
],
});
// 重置表单并重新请求
const ResetFilter = () => {
ResetForm(ManagementForm.filter_option);
// 请求接口
// AdminFilterApi();
};
</script>
<style lang="less"></style>
src/pages/AILiveStreaming/InteractiveSettingCreate/index.vue 0 → 100644
<template>
<PageEdit :form="ManagementForm"></PageEdit>
</template>
<script lang="ts" setup>
import PageEdit from '@/components/Admin/PageEdit.vue';
import { reactive } from 'vue';
import { getLocalData, isDevContext } from '@/utils/tool';
import { show_message } from '@/utils/tdesign_tool';
import { useRouter } from 'vue-router';
const router = useRouter();
const imgs = {
fill: new URL('../../../assets/svg/form/edit.svg', import.meta.url).href,
};
// 新增组件--所有value为空
const ManagementForm = reactive({
title: '互动设置',
title_2: '新增',
body_title: '新增',
// 是否显示返回列表页
back: true,
back_url: '/AILiveStreaming/InteractiveSetting',
// 能否删除,
delete: false,
// 删除api
// delete_api: isDevContext() ? '' : '',
// 能否提交
submit: true,
// 提交接口
submit_api: isDevContext() ? '' : '',
//能否重置
reset: true,
// 是否转换为语音
conversion: false,
// 播放音频
play_audio: false,
form_options: [
{
icon: '',
title: '',
lists: [
{
type: 'text',
label: '类型',
name: 'title_1',
value: '',
placeholder: '请输入类型',
// 是否禁用
disabled: false,
},
],
},
{
icon: 'TextToSpeech',
title: '语音设置',
lists: [
{
type: 'select',
label: '语言',
name: 'language_1',
placeholder: '请选择语言',
value: '',
align: 'left',
options: [
{
label: '中文',
value: 'cn',
},
{
label: '英语',
value: 'en',
},
],
},
{
type: 'select',
label: '语音',
name: 'voice',
placeholder: '请选择语音',
value: '',
align: 'left',
audio: true,
options: [
{
label: '小微 (直播间专属)',
value: '123',
},
{
label: '小爱 (直播间专属)',
value: '12345',
},
],
},
],
},
// 串场互动
{
icon: 'crossTalk',
title: '串场互动话术设置',
lists: [
{
type: 'text',
label: '标题',
name: 'title_1',
value: '',
placeholder: '请输入标题',
},
{
type: 'textarea',
label: '话术内容',
name: 'title_2',
value: '',
placeholder: '请输入话术内容',
},
],
},
],
});
</script>
<style lang="less"></style>
src/pages/AILiveStreaming/InteractiveSettingEdit/index.vue 0 → 100644
<template>
<PageEdit :form="ManagementForm"></PageEdit>
</template>
<script lang="ts" setup>
import PageEdit from '@/components/Admin/PageEdit.vue';
import { onBeforeMount, reactive } from 'vue';
import { interactive_setting_edit } from '@/constants/token';
import { getLocalData, isDevContext } from '@/utils/tool';
import { show_message } from '@/utils/tdesign_tool';
import { useRouter } from 'vue-router';
import { getEditLocalData, EditFillData } from '@/constants/admin_form';
const router = useRouter();
const imgs = {
fill: new URL('../../../assets/svg/form/edit.svg', import.meta.url).href,
};
// 编辑页面组件
const ManagementForm = reactive({
title: '互动设置',
title_2: '编辑',
body_title: '编辑',
// 是否显示返回列表页
back: true,
back_url: '/AILiveStreaming/InteractiveSetting',
// 能否删除,
delete: true,
// 删除api
delete_api: isDevContext() ? '' : '',
// 能否提交
submit: true,
submit_api: isDevContext() ? '' : '',
//能否重置
reset: true,
// 是否转换为语音
conversion: false,
// 播放音频
play_audio: false,
form_options: [
{
icon: '',
title: '',
lists: [
{
type: 'text',
label: '类型',
name: 'title_1',
value: '自动回复设置',
},
],
},
{
icon: 'TextToSpeech',
title: '语音设置',
lists: [
{
type: 'select',
label: '语言',
name: 'language_1',
placeholder: '请选择语言',
value: '',
align: 'left',
options: [
{
label: '中文',
value: 'cn',
},
{
label: '英语',
value: 'en',
},
],
},
{
type: 'select',
label: '语音',
name: 'voice',
placeholder: '请选择语音',
value: '',
align: 'left',
audio: true,
options: [
{
label: '小微 (直播间专属)',
value: '123',
},
{
label: '小爱 (直播间专属)',
value: '12345',
},
],
},
],
},
{
icon: 'message',
title: '自动回复设置',
lists: [
{
type: 'text',
label: '触发关键词',
name: 'language_20',
placeholder: '请输入',
value: '',
align: 'left',
},
{
type: 'textarea',
label: '回复内容',
name: 'product_30',
placeholder: '请输入语音内容',
value: '',
},
],
},
],
});
onBeforeMount(() => {
// 本地是否有缓存
const row = getEditLocalData(
interactive_setting_edit,
ManagementForm.back_url
);
// 填充
EditFillData(ManagementForm.form_options, row);
});
</script>
<style lang="less"></style>
src/pages/AILiveStreaming/LiveStream/index.vue 0 → 100644
<template>
<AdminPublicPageVue
:form="ManagementForm"
v-model:list="ManagementForm.table_list"
@reset="ResetFilter"
>
<template #title>
<div>111</div>
</template>
<template #edit="{ row }">
<!-- custom -->
<div class="custom-operation" @click="onEdit(row)">编辑</div>
<div class="custom-operation" @click="onDetail(row)">查看</div>
<div class="custom-operation" @click="onReply(row)">人工回复</div>
</template>
</AdminPublicPageVue>
</template>
<script lang="ts" setup>
import AdminPublicPageVue from '@/components/Admin/AdminPublicPage.vue';
import { reactive } from 'vue';
import { isDevContext } from '@/utils/tool';
import { ResetForm, EditButtonEvent } from '@/constants/admin_form';
import { AdminFilterApi } from '@/utils/api/ai';
import { useRouter } from 'vue-router';
import {
live_stream_edit,
live_stream_detail,
live_stream_reply,
} from '@/constants/token';
const router = useRouter();
// 表单配置项
const ManagementForm = reactive({
title: '直播管理',
title_2: '列表',
// 能否刷新
refresh: true,
// 能否筛选
filter: true,
// 筛选接口
filter_api: isDevContext() ? '' : '',
// 能否新增
add: true,
// 表格key--用来缓存表格分页
local_key: 'admin_live_stream',
// 表格数据
table_list: [],
// 表格接口
table_api: isDevContext() ? '' : '',
// api类型
table_api_type: 'get',
// 能否多选--默认为true
checkbox: true,
// 编辑页面
edit_page: '/AILiveStreaming/LiveStream/edit',
// 查看页面
detail_page: '/AILiveStreaming/LiveStream/detail',
// 人工回复页面
reply_page: '/AILiveStreaming/LiveStream/reply',
// 编辑页面的key--存储行数据
edit_key: live_stream_edit,
// 新增页面
create_page: '/AILiveStreaming/LiveStream/create',
// 多选功能操作项
row_selected_options: [
{
label: '删除',
value: 'delete',
confirm: true,
},
],
// 表格columns-列
table_columns: [
{
title: 'check_all',
colKey: 'checkbox',
},
{
title: '直播间标题',
colKey: 'lv_title',
},
{
title: '直播间连接',
colKey: 'connect',
align: 'center',
},
{
title: '状态',
colKey: 'status',
align: 'center',
},
{
title: '操作',
colKey: 'edit',
align: 'left',
width: '140px',
},
],
filter_option: [
{
type: 'select',
name: 'select_title',
label: '标题',
placeholder: '请选择标题',
value: '',
options: [
{
label: '你好',
value: '你好',
},
{
label: '你好2',
value: '你好2',
},
],
},
{
type: 'select',
name: 'select_product',
label: '产品',
placeholder: '产品',
value: '',
options: [
{
label: '你好',
value: '你好',
},
{
label: '你好2',
value: '你好2',
},
],
},
{
type: 'select',
name: 'select_language',
label: '语言',
placeholder: '语言',
value: '',
options: [
{
label: '你好',
value: '你好',
},
{
label: '你好2',
value: '你好2',
},
],
},
],
});
// 重置表单并重新请求
const ResetFilter = () => {
ResetForm(ManagementForm.filter_option);
// 请求接口
// AdminFilterApi();
};
// 编辑
const onEdit = (row: any) => {
EditButtonEvent(live_stream_edit, ManagementForm.edit_page, row);
};
// 查看
const onDetail = (row: any) => {
EditButtonEvent(live_stream_detail, ManagementForm.detail_page, row);
};
const onReply = (row: any) => {
//
EditButtonEvent(live_stream_reply, ManagementForm.reply_page, row);
};
</script>
<style lang="less">
@import '@/style/variables';
.custom-operation {
cursor: pointer;
transition: color 0.2s;
&:hover {
color: @main-color-1;
transition: color 0.2s;
}
}
</style>
src/pages/AILiveStreaming/LiveStreamCreate/index.vue 0 → 100644
<template>
<PageEdit :form="ManagementForm"></PageEdit>
</template>
<script lang="ts" setup>
import PageEdit from '@/components/Admin/PageEdit.vue';
import { reactive } from 'vue';
import { getLocalData, isDevContext } from '@/utils/tool';
import { show_message } from '@/utils/tdesign_tool';
import { useRouter } from 'vue-router';
const router = useRouter();
const imgs = {
fill: new URL('../../../assets/svg/form/edit.svg', import.meta.url).href,
};
// 新增组件--所有value为空
const ManagementForm = reactive({
title: '互动设置',
title_2: '新增',
body_title: '新增',
// 是否显示返回列表页
back: true,
back_url: '/AILiveStreaming/InteractiveSetting',
// 能否删除,
delete: false,
// 删除api
// delete_api: isDevContext() ? '' : '',
// 能否提交
submit: true,
// 提交接口
submit_api: isDevContext() ? '' : '',
//能否重置
reset: true,
// 是否转换为语音
conversion: false,
// 播放音频
play_audio: false,
form_options: [
{
icon: '',
title: '',
lists: [
{
type: 'text',
label: '类型',
name: 'title_1',
value: '',
placeholder: '请输入类型',
// 是否禁用
disabled: false,
},
],
},
{
icon: 'TextToSpeech',
title: '语音设置',
lists: [
{
type: 'select',
label: '语言',
name: 'language_1',
placeholder: '请选择语言',
value: '',
align: 'left',
options: [
{
label: '中文',
value: 'cn',
},
{
label: '英语',
value: 'en',
},
],
},
{
type: 'select',
label: '语音',
name: 'voice',
placeholder: '请选择语音',
value: '',
align: 'left',
audio: true,
options: [
{
label: '小微 (直播间专属)',
value: '123',
},
{
label: '小爱 (直播间专属)',
value: '12345',
},
],
},
],
},
// 串场互动
{
icon: 'crossTalk',
title: '串场互动话术设置',
lists: [
{
type: 'text',
label: '标题',
name: 'title_1',
value: '',
placeholder: '请输入标题',
},
{
type: 'textarea',
label: '话术内容',
name: 'title_2',
value: '',
placeholder: '请输入话术内容',
},
],
},
],
});
</script>
<style lang="less"></style>
src/pages/AILiveStreaming/LiveStreamDetail/index.vue 0 → 100644
<template>
<PageEdit :form="ManagementForm"></PageEdit>
</template>
<script lang="ts" setup>
import PageEdit from '@/components/Admin/PageEdit.vue';
import { onBeforeMount, reactive } from 'vue';
import { live_stream_detail } from '@/constants/token';
import { getLocalData, isDevContext } from '@/utils/tool';
import { show_message } from '@/utils/tdesign_tool';
import { useRouter } from 'vue-router';
import { getEditLocalData, EditFillData } from '@/constants/admin_form';
const router = useRouter();
const imgs = {
fill: new URL('../../../assets/svg/form/edit.svg', import.meta.url).href,
};
// 编辑页面组件
const ManagementForm = reactive({
title: '直播管理',
title_2: '查看',
body_title: '查看',
// 是否显示返回列表页
back: true,
back_url: '/AILiveStreaming/LiveStream',
// 能否删除,
delete: true,
// 删除api
delete_api: isDevContext() ? '' : '',
// 能否提交
submit: false,
// submit_api: isDevContext() ? '' : '',
//能否重置
reset: false,
// 是否转换为语音
conversion: false,
// 播放音频
play_audio: false,
// 开播按钮
start_broadcast: true,
form_options: [
{
icon: imgs.fill,
title: '基础填写',
lists: [
{
type: 'text',
label: '直播间标题',
name: 'title_1',
value: '',
disabled: true,
placeholder: '',
},
{
type: 'text',
label: '直播间连接',
name: 'title_12',
value: '',
},
],
},
{
icon: 'discourseBind',
title: '话术绑定',
lists: [
{
type: 'select',
label: '直播话术',
name: 'language_1',
placeholder: '请选择语言',
value: '',
align: 'left',
options: [
{
label: '话术1',
value: 'cn',
},
{
label: '话术2',
value: 'en',
},
],
},
{
type: 'select',
label: '自动回复话术',
name: 'voice',
placeholder: '请选择自动回复话术',
value: '',
align: 'left',
options: [
{
label: '自动回复话术1',
value: '123',
},
{
label: '自动回复话术2',
value: '12345',
},
],
},
{
type: 'select',
label: '串场互动话术',
name: 'voice',
placeholder: '请选择串场互动话术',
value: '',
align: 'left',
options: [
{
label: '串场互动话术1',
value: '123',
},
{
label: '串场互动话术2',
value: '12345',
},
],
},
{
type: 'number',
name: 'number',
label: '串场互动触发时间间隔',
value: '',
},
],
},
],
});
onBeforeMount(() => {
// 本地是否有缓存
const row = getEditLocalData(live_stream_detail, ManagementForm.back_url);
EditFillData(ManagementForm.form_options, row);
});
</script>
<style lang="less"></style>
src/pages/AILiveStreaming/LiveStreamEdit/index.vue 0 → 100644
<template>
<PageEdit :form="ManagementForm"></PageEdit>
</template>
<script lang="ts" setup>
import PageEdit from '@/components/Admin/PageEdit.vue';
import { onBeforeMount, reactive } from 'vue';
import { live_stream_edit } from '@/constants/token';
import { getLocalData, isDevContext } from '@/utils/tool';
import { show_message } from '@/utils/tdesign_tool';
import { useRouter } from 'vue-router';
import { getEditLocalData, EditFillData } from '@/constants/admin_form';
const router = useRouter();
const imgs = {
fill: new URL('../../../assets/svg/form/edit.svg', import.meta.url).href,
};
// 编辑页面组件
const ManagementForm = reactive({
title: '直播管理',
title_2: '编辑',
body_title: '编辑',
// 是否显示返回列表页
back: true,
back_url: '/AILiveStreaming/LiveStream',
// 能否删除,
delete: true,
// 删除api
delete_api: isDevContext() ? '' : '',
// 能否提交
submit: true,
submit_api: isDevContext() ? '' : '',
//能否重置
reset: true,
// 是否转换为语音
conversion: false,
// 播放音频
play_audio: false,
form_options: [
{
icon: imgs.fill,
title: '基础填写',
lists: [
{
type: 'text',
label: '直播间标题',
name: 'title_1',
value: '',
disabled: true,
placeholder: '',
},
{
type: 'text',
label: '直播间连接',
name: 'title_12',
value: '',
},
],
},
{
icon: 'discourseBind',
title: '话术绑定',
lists: [
{
type: 'select',
label: '直播话术',
name: 'language_1',
placeholder: '请选择语言',
value: '',
align: 'left',
options: [
{
label: '话术1',
value: 'cn',
},
{
label: '话术2',
value: 'en',
},
],
},
{
type: 'select',
label: '自动回复话术',
name: 'voice',
placeholder: '请选择自动回复话术',
value: '',
align: 'left',
options: [
{
label: '自动回复话术1',
value: '123',
},
{
label: '自动回复话术2',
value: '12345',
},
],
},
{
type: 'select',
label: '串场互动话术',
name: 'voice',
placeholder: '请选择串场互动话术',
value: '',
align: 'left',
options: [
{
label: '串场互动话术1',
value: '123',
},
{
label: '串场互动话术2',
value: '12345',
},
],
},
{
type: 'number',
name: 'number',
label: '串场互动触发时间间隔',
value: '',
},
],
},
],
});
onBeforeMount(() => {
// 本地是否有缓存
const row = getEditLocalData(live_stream_edit, ManagementForm.back_url);
EditFillData(ManagementForm.form_options, row);
});
</script>
<style lang="less"></style>
src/pages/AILiveStreaming/LiveStreamReply/index.vue 0 → 100644
<template>
<PageEdit :form="ManagementForm"></PageEdit>
</template>
<script lang="ts" setup>
import PageEdit from '@/components/Admin/PageEdit.vue';
import { onBeforeMount, reactive } from 'vue';
import { live_stream_edit } from '@/constants/token';
import { getLocalData, isDevContext } from '@/utils/tool';
import { show_message } from '@/utils/tdesign_tool';
import { useRouter } from 'vue-router';
const router = useRouter();
const imgs = {
fill: new URL('../../../assets/svg/form/edit.svg', import.meta.url).href,
};
// 编辑页面组件
const ManagementForm = reactive({
title: '直播管理',
title_2: '人工回复',
body_title: '人工回复',
// 是否显示返回列表页
back: true,
back_url: '/AILiveStreaming/LiveStream',
// 能否删除,
delete: false,
// 删除api
delete_api: isDevContext() ? '' : '',
// 能否提交
submit: false,
submit_api: isDevContext() ? '' : '',
//能否重置
reset: false,
// 是否转换为语音
conversion: false,
// 播放音频
play_audio: false,
// 发送按钮
is_send: {
disabled: true,
label: '发送',
api: isDevContext() ? '' : '',
},
form_options: [
{
icon: 'TextToSpeech',
title: '语音设置',
lists: [
{
type: 'select',
label: '语言',
name: 'language_1',
placeholder: '请选择语言',
value: '',
align: 'left',
options: [
{
label: '中文',
value: 'cn',
},
{
label: '英语',
value: 'en',
},
],
},
{
type: 'select',
label: '语音',
name: 'voice',
placeholder: '请选择语音',
value: '',
align: 'left',
audio: true,
options: [
{
label: '小微 (直播间专属)',
value: '123',
},
{
label: '小爱 (直播间专属)',
value: '12345',
},
],
},
],
},
{
icon: 'ManualResponse',
title: '人工回复',
lists: [
{
type: 'textarea',
label: '回复内容',
name: 'product_30',
placeholder: '请输入语音内容',
value: '',
},
],
},
],
});
const getEditData = () => {
let local_data = getLocalData(live_stream_edit, 'session');
if (!local_data) {
// 没有本地数据,返回页面
show_message('禁止访问');
// 返回话术管理
router.replace({
path: '/AILiveStreaming/DiscourseManagement',
});
} else {
// 有数据--填充到form表单里
// ManagementForm.form
console.log(local_data);
}
};
onBeforeMount(() => {
// 本地是否有缓存
getEditData();
});
</script>
<style lang="less"></style>
src/router/modules/home.ts
......@@ -164,6 +164,59 @@ export default [
component: () =>
import('@/pages/AILiveStreaming/InteractiveSetting/index.vue'),
},
// 互动编辑
{
path: '/AILiveStreaming/InteractiveSetting/edit',
name: 'InteractiveSettingEdit',
component: () =>
import(
'@/pages/AILiveStreaming/InteractiveSettingEdit/index.vue'
),
},
// 新增互动
{
path: '/AILiveStreaming/InteractiveSetting/create',
name: 'InteractiveSettingCreate',
component: () =>
import(
'@/pages/AILiveStreaming/InteractiveSettingCreate/index.vue'
),
},
// 直播管理 LiveStream
{
path: '/AILiveStreaming/LiveStream',
name: 'LiveStream',
component: () =>
import('@/pages/AILiveStreaming/LiveStream/index.vue'),
},
// 直播编辑
{
path: '/AILiveStreaming/LiveStream/edit',
name: 'LiveStreamEdit',
component: () =>
import('@/pages/AILiveStreaming/LiveStreamEdit/index.vue'),
},
// 新增直播
{
path: '/AILiveStreaming/LiveStream/create',
name: 'LiveStreamCreate',
component: () =>
import('@/pages/AILiveStreaming/LiveStreamCreate/index.vue'),
},
// 直播管理--查看行数据
{
path: '/AILiveStreaming/LiveStream/detail',
name: 'LiveStreamDetail',
component: () =>
import('@/pages/AILiveStreaming/LiveStreamDetail/index.vue'),
},
// 直播管理--人工回复
{
path: '/AILiveStreaming/LiveStream/reply',
name: 'LiveStreamReply',
component: () =>
import('@/pages/AILiveStreaming/LiveStreamReply/index.vue'),
},
],
},
],
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment