Merge branch 'main' of ssh://18.167.251.121:10002/aidlab/FiDA_Front

This commit is contained in:
X1627315083@163.com
2026-02-27 16:24:04 +08:00
22 changed files with 274 additions and 133 deletions

View File

@@ -91,3 +91,20 @@ export const GetUserInfo = () => {
loading: true,
})
}
/**
*
* @param data
* @param data.base
* @param data.vibe
* @param data.role
* @returns
*/
export const UpdateUserProfile = (data) => {
return request({
url: '/api/user/profile',
method: 'put',
data
})
}

View File

@@ -14,6 +14,7 @@
import { ref, inject } from 'vue'
import { NODE_DATATYPE } from '../../tools/index.d'
const nodeManager = inject('nodeManager') as any
const stateManager = inject('stateManager') as any
const props = defineProps({
node: { required: true, type: Object }
})
@@ -46,9 +47,10 @@
const onClickItem = (v) => {
const id = props.node.id
if (!id) return
nodeManager.deleteNode(id)
stateManager.deleteNode(id)
nodeManager.createCardNode({ data: { type: v.type } })
}
defineExpose({})
</script>

View File

@@ -23,7 +23,7 @@
</template>
<script setup lang="ts">
import { computed, ref, useAttrs } from 'vue'
import { computed, ref, useAttrs, onMounted, inject } from 'vue'
import CardsSelect from './cards-select.vue'
import ToRealStyle from './to-real-style.vue'
import SurfaceEdit from './surface-edit.vue'
@@ -32,9 +32,9 @@
import To3View from './to-3view.vue'
import To3DModel from './to-3d-model.vue'
import ToVideo from './to-video.vue'
import AddPrint from './add-print.vue'
import ToCAD from './to-cad.vue'
// import ToVideo from './to-video.vue'
// import AddPrint from './add-print.vue'
// import ToCAD from './to-cad.vue'
const components = [
{
type: 'cards-select',
@@ -73,23 +73,8 @@
title: 'To 3D Model',
component: To3DModel
}
// {
// type: 'to-video',
// title: 'To Video',
// component: ToVideo
// },
// {
// type: 'to-cad',
// title: 'To CAD',
// component: ToCAD
// },
// {
// type: 'add-print',
// title: 'Add Print',
// component: AddPrint
// }
]
const emit = defineEmits(['add', 'generate'])
const nodeManager = inject('nodeManager') as any
const props = defineProps({
type: {
type: String as () =>
@@ -101,6 +86,10 @@
| 'to-3d-model'
| 'to-3view',
default: 'to-real-style'
},
data: {
type: Object,
default: () => ({})
}
})
const attrs = useAttrs()
@@ -111,8 +100,21 @@
const onGenerateClick = () => {
const data = { ...componentRef.value.data }
console.log(data)
emit('generate')
nodeManager.createResultNode({
data: {
data: {
url: 'https://s3-alpha-sig.figma.com/img/ea2f/590e/9638f62a2fc91e31f33db0022db1642c?Expires=1773014400&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=M0B8oJJOk~dGG0aZAqOIocAp7T0LFdJ9FYmCrEZVTCRzYxM6SJRNtYMTX-rTO3Z~s14QINh~o-S41XiZnBv-0zcKjuWot~VVaNHfd0~1LesfNe2KwvCinT~72btFut1pheLnKE-wWCX5ewtonxU77bnw386YPMTqv7DBZzksf2udsJA7NmOYD6~TUG3Q2dWSt~zPH~lkaidscPqpCnCbqzljCEi4RiHY4U3A45l5XypcX2umqn1UaYUFCTqV9471J4qdB6Dg2pcKocdp-7-3s1De6Q~2SmBOrSgDQ~KEADCB2lhKfhxgWmy0lwMvhTd4l90ygVZDWZRABgjHNrGUvg__'
}
}
})
}
onMounted(() => {
for (const key in props.data) {
if (componentRef.value?.data?.hasOwnProperty(key)) {
componentRef.value.data[key] = props.data[key]
}
}
})
</script>
<style lang="less" scoped>

View File

@@ -1,12 +1,12 @@
<template>
<div class="header-tools">
<span class="icon"><svg-icon name="c-mouse" size="16" /></span>
<span class="icon"><svg-icon name="c-hand" size="18" /></span>
<span class="icon"><svg-icon name="c-t" size="18" /></span>
<span class="icon" @click="emit('mouse')"><svg-icon name="c-mouse" size="16" /></span>
<span class="icon" @click="emit('hand')"><svg-icon name="c-hand" size="18" /></span>
<span class="icon" @click="emit('t')"><svg-icon name="c-t" size="18" /></span>
<span class="line"></span>
<span class="icon"><svg-icon name="c-undo" size="18" /></span>
<span class="icon"><svg-icon name="c-redo" size="18" /></span>
<button class="export">
<span class="icon" @click="emit('undo')"><svg-icon name="c-undo" size="18" /></span>
<span class="icon" @click="emit('redo')"><svg-icon name="c-redo" size="18" /></span>
<button class="export" @click="emit('export')">
<span class="icon"><svg-icon name="export" size="11" /></span>
<span class="text">Export</span>
</button>
@@ -19,7 +19,7 @@
zoom: { default: 1, type: Number },
step: { default: 0.1, type: Number }
})
const emit = defineEmits(['add', 'sub'])
const emit = defineEmits(['mouse', 'hand', 't', 'undo', 'redo', 'export'])
</script>
<style lang="less" scoped>

View File

@@ -1,10 +1,31 @@
<template>
<div class="node start" :class="{ center: posCenter }">
<template v-if="type === NODE_TYPE.INPUT">
<Handle type="source" id="Right" :position="Position.Right" />
</template>
<template v-else-if="type === NODE_TYPE.SECONDARY">
<Handle type="target" id="Left" :position="Position.Left" />
<Handle type="source" id="Right" :position="Position.Right" />
</template>
<template v-else-if="type === NODE_TYPE.OUTPUT">
<Handle type="target" id="Left" :position="Position.Left" />
</template>
<div class="item">
<slot></slot>
</div>
<div class="add" @mousedown.stop v-if="isAdd" @click="onAdd">
<svg-icon name="add" size="14" size-unit="px" />
</div>
</div>
</template>
<script lang="ts" setup>
import { Handle, Position } from '@vue-flow/core'
import { NODE_TYPE } from '../tools/index.d'
import { NODE_DATATYPE } from '../tools/index.d'
import { computed } from 'vue'
const props = defineProps({
type: {
type: String as () => 'InputNode' | 'SecondaryNode',
type: String,
default: 'InputNode'
},
node: {
@@ -19,41 +40,29 @@
const nodes = computed(() => props.stateManager.nodes.value)
const firstNode = computed(() => nodes.value[0])
const lastNode = computed(() => nodes.value[nodes.value.length - 1])
const notAddNodeTypes = [NODE_DATATYPE.CARDS_SELECT]
const isAdd = computed(
() => props.node.id === lastNode.value.id && !notAddNodeTypes.includes(props.node.data.type)
() => props.node.id === lastNode.value.id && NODE_DATATYPE.RESULT_IMAGE === props.node.data.type
)
const onAdd = () => {
props.stateManager.nodeManager.createCardsSelect()
}
const posCenter = computed(() => {
const arr = [NODE_DATATYPE.RESULT_IMAGE]
return arr.includes(props.node?.data?.type)
})
</script>
<template>
<div class="node start">
<template v-if="type === 'InputNode'">
<Handle type="source" id="Right" :position="Position.Right" />
</template>
<template v-else-if="type === 'SecondaryNode'">
<Handle type="target" id="Left" :position="Position.Left" />
<Handle type="source" id="Right" :position="Position.Right" />
</template>
<div class="item">
<slot></slot>
</div>
<div class="add" @mousedown.stop v-if="isAdd" @click="onAdd">
<svg-icon name="add" size="14" size-unit="px" />
</div>
</div>
</template>
<style lang="less" scoped>
.node {
position: relative;
--top: 50px;
.vue-flow__handle {
width: 5px;
height: 5px;
top: 50px;
width: 12px;
height: 12px;
top: var(--top);
z-index: 10;
background: #b5b5b5;
border: 1px solid #ffffff;
}
> .item {
position: relative;
@@ -63,9 +72,8 @@
width: 32px;
height: 32px;
border: 2px solid #fff;
// bottom: -16px;
top: var(--top);
right: -16px;
top: 50%;
transform: translateY(-50%);
background-color: #ed8936;
border-radius: 50%;
@@ -78,5 +86,8 @@
cursor: pointer;
z-index: 20;
}
&.center {
--top: 50%;
}
}
</style>

View File

@@ -16,10 +16,7 @@
<span class="text">Edit</span>
</button>
</div>
<img
class="image"
src="https://s3-alpha-sig.figma.com/img/ea2f/590e/9638f62a2fc91e31f33db0022db1642c?Expires=1773014400&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=M0B8oJJOk~dGG0aZAqOIocAp7T0LFdJ9FYmCrEZVTCRzYxM6SJRNtYMTX-rTO3Z~s14QINh~o-S41XiZnBv-0zcKjuWot~VVaNHfd0~1LesfNe2KwvCinT~72btFut1pheLnKE-wWCX5ewtonxU77bnw386YPMTqv7DBZzksf2udsJA7NmOYD6~TUG3Q2dWSt~zPH~lkaidscPqpCnCbqzljCEi4RiHY4U3A45l5XypcX2umqn1UaYUFCTqV9471J4qdB6Dg2pcKocdp-7-3s1De6Q~2SmBOrSgDQ~KEADCB2lhKfhxgWmy0lwMvhTd4l90ygVZDWZRABgjHNrGUvg__"
/>
<img class="image" :src="data.url" />
<div class="more" @click="showMenu = !showMenu" @mousedown.stop>
<svg-icon name="more" size="24" size-unit="px" color="#C9C9C9" />
</div>
@@ -40,10 +37,19 @@
</template>
<script setup lang="ts">
import { reactive, ref, onBeforeUnmount } from 'vue'
const showHeader = ref(true)
import { reactive, ref, onBeforeUnmount, useAttrs } from 'vue'
const props = defineProps({
data: {
type: Object,
default: () => ({})
}
})
const attrs = useAttrs()
const showHeader = ref(!!attrs.node?.data?.isHeader)
const showMenu = ref(false)
const data = reactive({})
const data = reactive({
url: props.data?.url || ''
})
const menus = ref([
{ label: 'Copy', tip: 'Ctrl+C', on: () => {} },
{ label: 'Paste', tip: 'Ctrl+V', on: () => {} },

View File

@@ -11,27 +11,19 @@
@node-drag-stop="(e) => eventManager.handleNodeDragStop(e)"
@viewport-change="(e) => eventManager.handleViewportChange(e)"
>
<template #node-InputNode="nodeProps">
<node type="InputNode" :stateManager="stateManager" :node="nodeProps">
<component
:is="nodeProps.data.component"
:node="nodeProps"
v-bind="nodeProps.data"
/>
</node>
</template>
<template #node-SecondaryNode="nodeProps">
<node type="SecondaryNode" :stateManager="stateManager" :node="nodeProps">
<template v-for="v in nodeTypes" :key="v" #[`node-${v}`]="nodeProps">
<node :type="v" :stateManager="stateManager" :node="nodeProps">
<component
:is="nodeProps.data.component"
:node="nodeProps"
:data="nodeProps.data.data"
v-bind="nodeProps.data"
/>
</node>
</template>
</VueFlow>
</div>
<header-tools />
<header-tools @export="exportFlow" />
<zoom
:zoom="stateManager.zoom.value"
:step="0.1"
@@ -43,6 +35,7 @@
<script setup lang="ts">
import { VueFlow, useVueFlow } from '@vue-flow/core'
import { useLayout } from '@/utils/treeDiagram'
import { NODE_TYPE } from './tools/index.d'
// 组件
import headerTools from './components/header-tools.vue'
import zoom from '../components/zoom.vue'
@@ -56,6 +49,7 @@
import { NodeManager } from './manager/NodeManager'
const vueFlow = ref<any>()
const nodeTypes = ref([NODE_TYPE.INPUT, NODE_TYPE.SECONDARY, NODE_TYPE.OUTPUT])
// 状态管理器
const stateManager = new StateManager({ vueFlow })
@@ -96,12 +90,22 @@
}, 0)
}
const exportFlow = () => {
// flowManager.exportFlow()
console.log(flowManager.exportFlow())
}
onMounted(() => {
window.vueFlow = vueFlow
window.nodes = nodes
nodeManager.createResultNode()
// nodeManager.createCardsSelect()
// nodeManager.createResultNode()
// window['vueFlow'] = vueFlow
// window['nodes'] = nodes
nodeManager.createResultNode({
data: {
isHeader: false,
data: {
url: 'https://s3-alpha-sig.figma.com/img/ea2f/590e/9638f62a2fc91e31f33db0022db1642c?Expires=1773014400&Key-Pair-Id=APKAQ4GOSFWCW27IBOMQ&Signature=M0B8oJJOk~dGG0aZAqOIocAp7T0LFdJ9FYmCrEZVTCRzYxM6SJRNtYMTX-rTO3Z~s14QINh~o-S41XiZnBv-0zcKjuWot~VVaNHfd0~1LesfNe2KwvCinT~72btFut1pheLnKE-wWCX5ewtonxU77bnw386YPMTqv7DBZzksf2udsJA7NmOYD6~TUG3Q2dWSt~zPH~lkaidscPqpCnCbqzljCEi4RiHY4U3A45l5XypcX2umqn1UaYUFCTqV9471J4qdB6Dg2pcKocdp-7-3s1De6Q~2SmBOrSgDQ~KEADCB2lhKfhxgWmy0lwMvhTd4l90ygVZDWZRABgjHNrGUvg__'
}
}
})
})
</script>
<style lang="less">

View File

@@ -21,7 +21,11 @@ export class NodeManager {
/** 删除节点 */
deleteNode(id: string) {
this.stateManager.nodes.value = this.stateManager.nodes.value.filter((node: any) => node.id !== id)
this.stateManager.deleteNode(id)
}
/** 添加节点 */
addNode(node: any) {
this.stateManager.addNode(node)
}
/** 创建节点 */
@@ -33,46 +37,47 @@ export class NodeManager {
const position = options.position ||
!lastNode ? { x: positionX, y: positionY } :
{ x: lastNode.position.x + lastNode.dimensions.width + 50 + positionX, y: lastNode.position.y + positionY }
const data = { ...(options?.data || {}) }
const data = options?.data || {}
data['component'] = options.component
const options_ = {
id,
position,
data
}
this.stateManager.nodes.value.push(options_)
this.addNode(options_)
return options_;
}
/** 创建结果节点 */
createResultNode(options?: NodeOptions) {
const options_ = {
...(options ? options : {}),
component: resultImage,
data: {
type: NODE_DATATYPE.RESULT_IMAGE,
isHeader: true,
...(options?.data || {}),
},
...(options ? options : {}),
}
return this.createNode(options_)
}
/** 创建卡片选择节点 */
createCardsSelect(options?: NodeOptions) {
const options_ = {
...(options ? options : {}),
component: card,
positionY: 50,
data: {
type: NODE_DATATYPE.CARDS_SELECT,
...(options?.data || {}),
},
...(options ? options : {}),
}
return this.createNode(options_)
}
/** 创建卡片节点 */
createCardNode(options?: NodeOptions) {
const options_ = {
component: card,
...(options ? options : {}),
component: card,
}
return this.createNode(options_)
}

View File

@@ -1,5 +1,13 @@
import { ref, computed } from "vue";
import { NODE_TYPE } from '../tools/index.d'
export interface NodesItem {
id: string
type: string
class: string
position: { x: number, y: number }
data: { component: any, type: string }
}
export class StateManager {
vueFlow: any
nodes: any
@@ -18,15 +26,7 @@ export class StateManager {
}
constructor(options) {
this.vueFlow = options.vueFlow
this.nodes = ref<any[]>([
// {
// id: '8',
// type: 'SecondaryNode',
// class: 'custom-node',
// position: { x: 0, y: 0 },
// data: { component: card, type: 'edit-material' }
// }
]);
this.nodes = ref<NodesItem[]>([]);
this.nodes_ = computed(() => {
return this.nodes.value.map((node, index) => {
const obj = {
@@ -34,10 +34,13 @@ export class StateManager {
}
if (index === 0) {
obj.class = 'custom-node start';
obj.type = 'InputNode';
obj.type = NODE_TYPE.INPUT;
} else if (index === this.nodes.value.length - 1) {
obj.class = 'custom-node end';
obj.type = NODE_TYPE.OUTPUT;
} else {
obj.class = 'custom-node';
obj.type = 'SecondaryNode';
obj.type = NODE_TYPE.SECONDARY;
}
return obj
})
@@ -53,7 +56,7 @@ export class StateManager {
id: `el-${id}-${target}`,
source: id,
target: target,
type: 'smoothstep'
type: 'output'
})
}
})
@@ -62,6 +65,14 @@ export class StateManager {
this.zoom = ref(1)
}
/** 添加节点 */
addNode(node: NodesItem) {
this.nodes.value.push(node)
}
/** 删除节点 */
deleteNode(id: string) {
this.nodes.value = this.nodes.value.filter((node: NodesItem) => node.id !== id)
}
getLastNode() {
return this.nodes.value[this.nodes.value.length - 1]
}

View File

@@ -1,3 +1,12 @@
/**
* 节点类型
*/
export const NODE_TYPE = {
INPUT: 'InputNode',
SECONDARY: 'SecondaryNode',
OUTPUT: 'OutputNode',
}
/**
* 节点数据类型
*/
@@ -10,4 +19,4 @@ export const NODE_DATATYPE = {
COLOR_PALETTE: 'color-palette',
TO_3VIEW: 'to-3view',
TO_3D_MODEL: 'to-3d-model',
}
}

20
src/ignoredWarning.ts Normal file
View File

@@ -0,0 +1,20 @@
// 定义要忽略的警告关键词列表
const ignoredWarnings = [
'`markRaw` or using `shallowRef` instead of `ref`',
]
/** 忽略组件响应式警告 */
export default function (app) {
// 只忽略组件响应式警告
app.config.warnHandler = (msg, instance, trace) => {
// 检查是否包含要忽略的关键词
const shouldIgnore = ignoredWarnings.some(warning =>
msg.includes(warning)
)
// 如果不应该忽略,才输出警告
if (!shouldIgnore) {
console.warn(msg, instance, trace)
}
}
}

View File

@@ -15,7 +15,11 @@ import "./router/router-config" // 路由守卫,做动态路由的地方
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import ignoredWarning from './ignoredWarning'
const app = createApp(App)
ignoredWarning(app)
app.use(router)
.use(ElementPlus)
.use(store)

View File

@@ -4,7 +4,7 @@ import { defineStore } from 'pinia'
import { ref, computed } from 'vue'
import { removeLocal, setLocal } from '@/utils/local'
import MyEvent from '@/utils/myEvent'
import { Logout, GetUserInfo } from '@/api/login'
import { Logout, GetUserInfo } from '@/api/user'
export const useUserInfoStore = defineStore('userInfo', () => {
const state = ref({
userInfo: {},

View File

@@ -47,6 +47,7 @@
overflow: hidden;
display: flex;
user-select: none;
> .right-main {
flex: 1;
display: flex;
@@ -61,8 +62,10 @@
}
}
}
.bg-1 {
z-index: -1;
background: #f8f7f5;
animation: opacity-in 0.5s ease-in-out 1 both;
}
.bg-2 {
@@ -73,7 +76,6 @@
width: 100%;
height: 100%;
overflow: hidden;
// background-color: rgba(248, 247, 245, 1);
> * {
position: absolute;
border-radius: 50%;

View File

@@ -1,7 +1,7 @@
<template>
<div>
<div class="label">Region</div>
<dropdown-menu v-model="region" :list="regions" @change="changeRegion" />
<dropdown-menu v-model="base" :list="baseList" @change="changeBase" />
</div>
<div>
<div class="label">Role</div>
@@ -25,9 +25,10 @@
import dropdownMenu from '@/components/dropdown-menu.vue'
import { useUserInfoStore } from '@/stores'
import { useI18n } from 'vue-i18n'
const userInfoStore = useUserInfoStore()
const { locale } = useI18n()
const region = ref('China')
const regions = ref([
const base = ref(userInfoStore.state.userInfo.base)
const baseList = ref([
{ label: 'United States', value: 'United States' },
{ label: 'Singapore', value: 'Singapore' },
{ label: 'Australia', value: 'Australia' },
@@ -39,16 +40,17 @@
{ label: 'Canada', value: 'Canada' },
{ label: 'Germany', value: 'Germany' }
])
const changeRegion = (value: string) => {
const changeBase = (value: string) => {
console.log(value)
}
const role = ref('Designer')
const role = ref(userInfoStore.state.userInfo.role)
const roles = ref([
{ label: 'Designer', value: 'Designer' },
{ label: 'Student', value: 'Student' },
{ label: 'Teacher', value: 'Teacher' },
{ label: 'Parent', value: 'Parent' }
{ label: 'Parent', value: 'Parent' },
{ value: 'Other', label: 'Other' }
])
const changeRole = (value: string) => {
console.log(value)

View File

@@ -64,7 +64,7 @@
<script setup lang="ts">
import md5 from 'md5'
import { Login } from '@/api/login'
import { Login } from '@/api/user'
import { computed, reactive, ref } from 'vue'
import { useRouter } from 'vue-router'
import { validateEmail, validatePass, validatePrivacy } from './tools'

View File

@@ -67,7 +67,7 @@
<script setup lang="ts">
import md5 from 'md5'
import { Register } from '@/api/login'
import { Register } from '@/api/user'
import { computed, reactive, ref } from 'vue'
import { useRouter } from 'vue-router'
import { validateName, validateEmail, validatePass, validatePrivacy } from './tools'

View File

@@ -55,7 +55,7 @@
<script setup lang="ts">
import md5 from 'md5'
import { ForgotPassword } from '@/api/login'
import { ForgotPassword } from '@/api/user'
import { computed, reactive, ref } from 'vue'
import { useRouter } from 'vue-router'
import { validateEmail, validatePass } from './tools'

View File

@@ -14,7 +14,7 @@
<script setup lang="ts">
import md5 from 'md5'
import { ElMessage } from 'element-plus'
import { SendVerificationCode } from '@/api/login'
import { SendVerificationCode } from '@/api/user'
import { computed, onBeforeUnmount, onMounted, ref } from 'vue'
import { CountDown } from '@/utils/tools'
import InputCode from '@/components/input-code.vue'

View File

@@ -32,6 +32,7 @@
<script setup lang="ts">
import { computed, ref, markRaw } from 'vue'
import { UpdateUserProfile } from '@/api/user'
import nuic1 from './nuic-1.vue'
import nuic2 from './nuic-2.vue'
import nuic3 from './nuic-3.vue'
@@ -44,16 +45,38 @@
const onClose = () => {
router.push({ name: 'mainInput' })
}
const onNext = () => {
const onNext = (value) => {
const index = active.value + 1
if (index < list.length) {
router.push({ query: { index } })
} else {
loading.value = true
setTimeout(() => {
router.push({ name: 'mainInput' })
}, 5000)
const data = {
...route.query,
...(value ? value : {})
}
delete data.index
if (index < list.length) {
router.push({
query: {
...data,
index
}
})
} else {
onSubmit(data)
}
}
const onSubmit = (data) => {
loading.value = true
const stime = Date.now()
UpdateUserProfile(data)
.then((res) => {
if (!res) return (loading.value = false)
const time = stime - Date.now() + 3000
setTimeout(() => {
router.push({ name: 'mainInput' })
}, time)
})
.catch((err) => {
loading.value = false
})
}
</script>

View File

@@ -10,7 +10,7 @@
</div>
</div>
<div class="btns">
<button class="next" @click="emit('next')">{{ $t('Nuic.next') }}</button>
<button class="next" @click="onNext">{{ $t('Nuic.next') }}</button>
<button class="more" @click="onLoadMore">
<span>{{ $t('Nuic.loadMore') }}</span>
<div><svg-icon name="refresh-single" size="24" /></div>
@@ -34,6 +34,15 @@
{ id: 7, url: '/image/nuic/style-7.png', title: '沙发', active: false },
{ id: 8, url: '/image/nuic/style-8.png', title: '桌子', active: false }
])
const onNext = () => {
const data = {
vibe: list.value
.filter((v) => v.active)
.map((v) => v.id)
.join(',')
}
emit('next', data)
}
const onLoadMore = () => {}
</script>

View File

@@ -4,10 +4,10 @@
<div class="select-item">
<div class="title">{{ $t('Nuic.basedIn') }}</div>
<el-select v-model="data.based">
<el-select v-model="data.base">
<el-option
class="el-select__option"
v-for="v in data.basedList"
v-for="v in data.baseList"
:key="v.value"
:label="v.label"
:value="v.value"
@@ -27,7 +27,7 @@
</el-select>
</div>
<div class="btns">
<button class="next" @click="emit('next')">{{ $t('Nuic.allSet') }}</button>
<button class="next" @click="onNext">{{ $t('Nuic.allSet') }}</button>
</div>
</div>
</template>
@@ -38,21 +38,35 @@
const router = useRouter()
const emit = defineEmits(['next'])
const data = reactive({
basedList: [
{ value: '1', label: 'Student' },
{ value: '2', label: 'Teacher' },
{ value: '3', label: 'Parent' },
{ value: '4', label: 'Other' }
baseList: [
{ label: 'United States', value: 'United States' },
{ label: 'Singapore', value: 'Singapore' },
{ label: 'Australia', value: 'Australia' },
{ label: 'South Korea', value: 'South Korea' },
{ label: 'China', value: 'China' },
{ label: 'Italy', value: 'Italy' },
{ label: 'France', value: 'France' },
{ label: 'Japan', value: 'Japan' },
{ label: 'Canada', value: 'Canada' },
{ label: 'Germany', value: 'Germany' }
],
roleList: [
{ value: '1', label: 'Student' },
{ value: '2', label: 'Teacher' },
{ value: '3', label: 'Parent' },
{ value: '4', label: 'Other' }
{ label: 'Designer', value: 'Designer' },
{ value: 'Student', label: 'Student' },
{ value: 'Teacher', label: 'Teacher' },
{ value: 'Parent', label: 'Parent' },
{ value: 'Other', label: 'Other' }
],
based: '',
role: ''
base: 'China',
role: 'Student'
})
const onNext = () => {
const data_ = {
base: data.base,
role: data.role
}
emit('next', data_)
}
</script>
<style lang="less" scoped>