develoop
ww
4 months ago
parent
a570de2a2f
commit
db33196725
25 changed files with 1623 additions and 1065 deletions
@ -1,5 +1,5 @@ |
||||
# 变量必须以 VITE_ 为前缀才能暴露给外部读取 |
||||
NODE_ENV = 'development' |
||||
VITE_APP_TITLE = '无糖运营平台' |
||||
# VITE_APP_BASE_API = 'http://127.0.0.1:8008' |
||||
VITE_APP_BASE_API = 'http://39.106.16.162:8080' |
||||
VITE_APP_BASE_API = 'http://127.0.0.1:8080' |
||||
# VITE_APP_BASE_API = 'http://39.106.16.162:8080' |
||||
|
||||
|
After Width: | Height: | Size: 4.0 KiB |
|
After Width: | Height: | Size: 189 KiB |
@ -1,9 +1,9 @@ |
||||
// 引入仓库
|
||||
import { createPinia } from 'pinia' |
||||
import persist from 'pinia-plugin-persistedstate' |
||||
// import persist from 'pinia-plugin-persistedstate'
|
||||
// 创建仓库
|
||||
const pinia = createPinia() |
||||
// 暴露仓库
|
||||
pinia.use(persist) |
||||
// pinia.use(persist)
|
||||
export default pinia |
||||
export * from './modules/user' |
||||
// export * from './modules/user'
|
||||
|
||||
@ -0,0 +1,84 @@ |
||||
<script setup> |
||||
import conheader from '@/views/home/components/ConHeader.vue' |
||||
import fe from '@/assets/images/fe.jpg' |
||||
</script> |
||||
<template> |
||||
<div class="lesson_container" style="width: 95%"> |
||||
<conheader :title="`课程列表`"></conheader> |
||||
<div class="lessonlist-content"> |
||||
<div class="lessonlist-item" v-for="item in 3" :key="item"> |
||||
<div class="lessonlist-item-img"> |
||||
<img :src="fe" alt="" style="width: 100%; height: 140px" /> |
||||
</div> |
||||
<div class="lessonlist-item-info"> |
||||
<h3>课程名称</h3> |
||||
<div class="p"><p>编辑</p></div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</div> |
||||
</template> |
||||
|
||||
<style scoped> |
||||
.lesson_container { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: space-between; |
||||
margin: 0 auto; |
||||
padding: 20px 0; |
||||
} |
||||
|
||||
.lessonlist-content { |
||||
display: flex; |
||||
flex-wrap: wrap; |
||||
justify-content: space-between; |
||||
margin: 10px 0; |
||||
} |
||||
|
||||
.lesson_container { |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: space-between; |
||||
margin: 0 auto; |
||||
padding: 5px 0; |
||||
} |
||||
.lessonlist-item { |
||||
width: 270px; |
||||
height: 200px; |
||||
border-radius: 10px; |
||||
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1); |
||||
} |
||||
.lessonlist-item-img { |
||||
width: 100%; |
||||
height: 140px; |
||||
} |
||||
.lessonlist-item-info { |
||||
padding: 10px; |
||||
display: flex; |
||||
flex-direction: column; |
||||
justify-content: space-between; |
||||
} |
||||
.lessonlist-item-info h3 { |
||||
font-size: 16px; |
||||
font-weight: bold; |
||||
margin-bottom: 5px; |
||||
} |
||||
.lessonlist-item-info .p { |
||||
width: 100%; |
||||
display: flex; |
||||
justify-content: end; |
||||
} |
||||
.lessonlist-item-info p { |
||||
font-size: 12px; |
||||
color: #a7c4f7; |
||||
line-height: 1.5; |
||||
box-sizing: border-box; |
||||
border: 2px solid #a7c4f7; |
||||
border-radius: 10px; |
||||
margin-bottom: 5px; |
||||
width: 50px; |
||||
margin: 5px; |
||||
text-align: center; |
||||
cursor: pointer; |
||||
} |
||||
</style> |
||||
@ -1,30 +1,5 @@ |
||||
<template> |
||||
<div> |
||||
<!-- Dialog组件 --> |
||||
<Dialog |
||||
v-model="dialogVisible" |
||||
@confirm="collectData" |
||||
:name="readonlyName" |
||||
:age="readonlyAge" |
||||
/> |
||||
</div> |
||||
<div>学生</div> |
||||
</template> |
||||
|
||||
<script setup> |
||||
import { ref, readonly } from 'vue' |
||||
|
||||
const dialogVisible = ref(false) // 控制Dialog的显示与隐藏 |
||||
const name = ref('John') // 可修改字段 |
||||
const age = ref(25) // 可修改字段 |
||||
|
||||
const readonlyName = readonly(name) // 将name字段设置为只读 |
||||
const readonlyAge = readonly(age) // 将age字段设置为只读 |
||||
|
||||
const collectData = () => { |
||||
// 在这里可以收集Dialog中的其他可修改字段的数据 |
||||
// ... |
||||
|
||||
console.log(readonlyName.value) // 可以访问只读字段的值 |
||||
console.log(readonlyAge.value) // 可以访问只读字段的值 |
||||
} |
||||
</script> |
||||
<style lang="scss"></style> |
||||
|
||||
@ -1,68 +0,0 @@ |
||||
<template> |
||||
<div> |
||||
<el-button type="primary" @click="openDrawer">Open Drawer</el-button> |
||||
<el-drawer |
||||
title="Drawer Title" |
||||
v-model:visible="drawerVisible" |
||||
:direction="drawerDirection" |
||||
> |
||||
<el-table :data="formModel" style="width: 100%"> |
||||
<el-table-column prop="name" label="Name"></el-table-column> |
||||
<el-table-column prop="content" label="Content"> |
||||
<template v-slot="scope"> |
||||
<el-input |
||||
v-model="scope.row.content" |
||||
@input="handleInput(scope.row)" |
||||
></el-input> |
||||
</template> |
||||
</el-table-column> |
||||
</el-table> |
||||
|
||||
<template v-slot:footer> |
||||
<div> |
||||
<el-button @click="cancelEdit">Cancel</el-button> |
||||
<el-button type="primary" @click="saveEdit">Save</el-button> |
||||
</div> |
||||
</template> |
||||
</el-drawer> |
||||
</div> |
||||
</template> |
||||
|
||||
<script> |
||||
export default { |
||||
data() { |
||||
return { |
||||
formModel: [ |
||||
{ name: 'Macbook', content: 9.9 }, |
||||
{ name: 'iPhone', content: 9.9 }, |
||||
{ name: '小米电脑', content: 9.9 }, |
||||
{ name: '小米电脑', content: 9.9 }, |
||||
{ name: '小米电脑', content: 9.9 }, |
||||
{ name: '小米电脑', content: 9.9 }, |
||||
{ name: '小米电脑', content: 9.9 }, |
||||
{ name: '小米电脑', content: 9.9 }, |
||||
{ name: '小米电脑', content: 9.9 }, |
||||
], |
||||
drawerVisible: false, |
||||
drawerDirection: 'ltr', |
||||
} |
||||
}, |
||||
methods: { |
||||
openDrawer() { |
||||
this.drawerVisible = true |
||||
}, |
||||
cancelEdit() { |
||||
this.drawerVisible = false |
||||
}, |
||||
saveEdit() { |
||||
// 执行保存修改的逻辑，可以将数据发送给后端进行保存 |
||||
console.log('Save Edit:', this.formModel) |
||||
this.drawerVisible = false |
||||
}, |
||||
handleInput(row) { |
||||
// 处理输入框的输入事件，可以在此处更新数据 |
||||
console.log('Handle Input:', row) |
||||
}, |
||||
}, |
||||
} |
||||
</script> |
||||
Loading…
Reference in new issue