commitfangxiaoting_branch1939e14ddfMerge:899117eb9e78faAuthor: “fangxiaoting” <“a3197878436@163.com”> Date: Fri May 10 02:13:10 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into develop commit899117e4e5Author: “fangxiaoting” <“a3197878436@163.com”> Date: Fri May 10 02:12:49 2024 +0800 Squashed commit of the following: commit1b382b341fAuthor: “fangxiaoting” <“a3197878436@163.com”> Date: Fri May 10 02:11:39 2024 +0800 上传前端代码 commitb9e78fa06cMerge:b2e827c3d22404Author: mafc2zqui <a3197878436@163.com> Date: Fri May 3 23:52:19 2024 +0800 Merge pull request '模型更新' (#5) from fangxiaoting_branch into develop commit3d22404b47Author: “fangxiaoting” <“a3197878436@163.com”> Date: Fri May 3 23:50:29 2024 +0800 模型更新 commitb2e827c347Merge:0192f9583407bdAuthor: “fangxiaoting” <“a3197878436@163.com”> Date: Fri May 3 23:43:38 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into fangxiaoting_branch commit0192f950ddAuthor: “fangxiaoting” <“a3197878436@163.com”> Date: Fri May 3 23:42:19 2024 +0800 模型更新 commit83407bd3baAuthor: zcx <1078327420@qq.com> Date: Fri May 3 23:37:33 2024 +0800 修改 commit663435a581Author: zcx <1078327420@qq.com> Date: Fri May 3 22:34:17 2024 +0800 修改 commit36fbc12d08Author: zcx <1078327420@qq.com> Date: Sun Apr 28 11:38:16 2024 +0800 需求规格说明书修改 commit6bca593ec3Author: zcx <1078327420@qq.com> Date: Sun Apr 28 11:07:23 2024 +0800 需求规格说明书修改 commit391a963ed1Author: zcx <1078327420@qq.com> Date: Sun Mar 31 20:19:05 2024 +0800 软件需求规格说明书修改 commit980edec786Author: zcx <1078327420@qq.com> Date: Sun Mar 31 20:10:26 2024 +0800 类图 commitd94abd4c90Author: zcx <1078327420@qq.com> Date: Sun Mar 31 20:04:21 2024 +0800 修改 commitd7d86f5604Merge:8854944333c3cbAuthor: zcx <1078327420@qq.com> Date: Sun Mar 31 20:04:11 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into develop commit8854944deaAuthor: zcx <1078327420@qq.com> Date: Sun Mar 31 20:04:04 2024 +0800 用例图.png commit333c3cb903Author: wyf <18818870625@163.com> Date: Sun Mar 31 17:22:26 2024 +0800 更新了顺序图 commit07210f5f0dMerge:4e53d8a5f41da9Author: zcx <1078327420@qq.com> Date: Sun Mar 31 16:49:56 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into develop commit4e53d8a46dAuthor: zcx <1078327420@qq.com> Date: Sun Mar 31 16:49:49 2024 +0800 需求规格说明书修改 commit5f41da9cdfAuthor: “fangxiaoting” <“a3197878436@163.com”> Date: Sun Mar 31 16:49:12 2024 +0800 添加顺序图 commit61157e1f2bMerge:e20883fdd7398cAuthor: “fangxiaoting” <“a3197878436@163.com”> Date: Sun Mar 31 16:47:19 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into fangxiaoting_branch commitdd7398cb56Author: zcx <1078327420@qq.com> Date: Sun Mar 31 16:44:32 2024 +0800 需求构思修改 commit2a1529af0aMerge:322d81a5cfb29dAuthor: zcx <1078327420@qq.com> Date: Sun Mar 31 16:41:07 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into develop commit322d81a4b4Author: zcx <1078327420@qq.com> Date: Sun Mar 31 16:40:59 2024 +0800 用例图.png commit5cfb29d3aeAuthor: 张林浩 <1260788704@qq.com> Date: Sun Mar 31 15:34:43 2024 +0800 新增用户注册分析类图 commit8b9957a08dMerge:44e573fd2b8003Author: zcx <1078327420@qq.com> Date: Sun Mar 31 14:16:58 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into develop commit44e573f056Author: zcx <1078327420@qq.com> Date: Sun Mar 31 14:16:50 2024 +0800 通信系统顺序图修改 commit66da63b0c6Merge:8310feed2b8003Author: 张林浩 <1260788704@qq.com> Date: Sun Mar 31 11:54:55 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into develop commitd2b8003ab9Author: wyf <18818870625@163.com> Date: Sun Mar 31 11:54:43 2024 +0800 顺序图更新 commit8310fee972Merge:ee6b6ee098be51Author: 张林浩 <1260788704@qq.com> Date: Sun Mar 31 11:53:23 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into develop commit0fa06c8a2fMerge:c664e20098be51Author: wyf <18818870625@163.com> Date: Sun Mar 31 11:53:09 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into develop commit098be51ef0Author: zcx <1078327420@qq.com> Date: Sun Mar 31 11:52:52 2024 +0800 部分修改 commitc664e208b1Author: wyf <18818870625@163.com> Date: Sun Mar 31 11:52:30 2024 +0800 顺序图更新 commitee6b6ee082Merge:9088b867af78b9Author: 张林浩 <1260788704@qq.com> Date: Sun Mar 31 11:51:04 2024 +0800 Merge branch 'develop' of https://bdgit.educoder.net/mwxbgi697/softegg into develop commit9088b86c8dAuthor: 张林浩 <1260788704@qq.com> Date: Sun Mar 31 11:50:57 2024 +0800 优化顺序图 commit7af78b9ccfAuthor: zcx <1078327420@qq.com> Date: Sun Mar 31 11:50:37 2024 +0800 顺序图 commit9e760becf3Author: 张林浩 <1260788704@qq.com> Date: Sun Mar 31 11:41:02 2024 +0800 新增导游方竞价顺序图 commit82dc2d8ec1Author: 张林浩 <1260788704@qq.com> Date: Sun Mar 31 11:25:57 2024 +0800 优化行程评价顺序图 commit998e72478dAuthor: 张林浩 <1260788704@qq.com> Date: Sun Mar 31 11:23:50 2024 +0800 新增行程评价顺序图 commitcfe5662b2eAuthor: wyf <18818870625@163.com> Date: Sun Mar 31 10:52:40 2024 +0800 更新文档 commite63d703600Author: 张林浩 <1260788704@qq.com> Date: Sun Mar 31 10:45:27 2024 +0800 修复文档 commit7517f39178Author: 张林浩 <1260788704@qq.com> Date: Sun Mar 31 10:42:26 2024 +0800 修复文档 commite20883fafcAuthor: “fangxiaoting” <“a3197878436@163.com”> Date: Fri Mar 29 10:37:03 2024 +0800 修改需求规格说明书 # Conflicts: # src/前端/walktofree/src/components/new_file.vue
“fangxiaoting”
1 year ago
parent
0bd73e8716
commit
6a7287fb4b
@ -1,29 +1,2 @@
|
||||
# walktofree
|
||||
|
||||
This template should help get you started developing with Vue 3 in Vite.
|
||||
|
||||
## Recommended IDE Setup
|
||||
|
||||
[VSCode](https://code.visualstudio.com/) + [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur).
|
||||
|
||||
## Customize configuration
|
||||
|
||||
See [Vite Configuration Reference](https://vitejs.dev/config/).
|
||||
|
||||
## Project Setup
|
||||
|
||||
```sh
|
||||
npm install
|
||||
```
|
||||
|
||||
### Compile and Hot-Reload for Development
|
||||
|
||||
```sh
|
||||
npm run dev
|
||||
```
|
||||
|
||||
### Compile and Minify for Production
|
||||
|
||||
```sh
|
||||
npm run build
|
||||
```
|
||||
npm run dev
|
||||
File diff suppressed because it is too large
Load Diff
@ -0,0 +1,117 @@
|
||||
<template>
|
||||
<div class="home-container">
|
||||
<h1>首页</h1>
|
||||
|
||||
<div class="search-container">
|
||||
<input type="text" class="search-input" placeholder="世界这么大出去看看吧">
|
||||
<button class="search-button" @click="gotoSearchPage()">搜索</button>
|
||||
</div>
|
||||
|
||||
<div class="image-container">
|
||||
<img src="../../photos/background.png" alt="图片描述" class="search-image">
|
||||
</div>
|
||||
|
||||
<div class="footer-nav">
|
||||
<button>首页</button>
|
||||
<button @click="gotomessage()">消息</button>
|
||||
<button @click="gotomine()">我的</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
/* 添加样式以定义图片的大小和位置 */
|
||||
.image-container {
|
||||
text-align: center; /* 或者根据你的需求来设置 */
|
||||
margin-top: 20px; /* 你可以根据需要调整这个值 */
|
||||
}
|
||||
|
||||
.home-container {
|
||||
/* 添加你的样式 */
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
/* 可能需要为内容添加一些底部空间以容纳底部导航 */
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.search-container {
|
||||
/* 定义搜索框容器的样式 */
|
||||
text-align: center;
|
||||
margin-bottom: 20px; /* 根据需要添加一些底部间距 */
|
||||
display: flex;
|
||||
align-items: center; /* 垂直居中 */
|
||||
justify-content: center; /* 水平居中（如果不需要完全居中，可以去掉这个）*/
|
||||
}
|
||||
|
||||
.search-input {
|
||||
/* 定义搜索框的样式 */
|
||||
flex: 1; /* 占据剩余空间 */
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.search-button {
|
||||
/* 定义搜索按钮的样式 */
|
||||
margin-left: 10px; /* 与搜索框之间的间距 */
|
||||
padding: 10px 20px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
background-color: #ccc;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.search-button:hover {
|
||||
/* 搜索按钮点击时的样式 */
|
||||
background-color: #bbb;
|
||||
}
|
||||
|
||||
.footer-nav {
|
||||
/* 定义底部导航的样式 */
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 10px;
|
||||
background-color: #f5f5f5; /* 示例背景色 */
|
||||
}
|
||||
|
||||
.footer-nav button {
|
||||
/* 定义按钮的样式 */
|
||||
flex: 1;
|
||||
border: none;
|
||||
padding: 10px;
|
||||
background-color: #ccc;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.footer-nav button:hover {
|
||||
/* 按钮点击时的样式 */
|
||||
background-color: #bbb;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Home',
|
||||
methods: {
|
||||
gotohome() {
|
||||
this.$router.push('/home');
|
||||
},
|
||||
gotomessage() {
|
||||
this.$router.push('/message');
|
||||
},
|
||||
gotomine() {
|
||||
this.$router.push('/mine');
|
||||
},
|
||||
gotoSearchPage() {
|
||||
this.$router.push('/searchPage');
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,11 @@
|
||||
<script setup>
|
||||
|
||||
</script>
|
||||
|
||||
<template>
|
||||
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,67 @@
|
||||
<template>
|
||||
<div class="home-container">
|
||||
<h1>消息页面</h1>
|
||||
|
||||
<!-- 在这里添加你的主页内容 -->
|
||||
|
||||
<div class="footer-nav">
|
||||
<button @click="gotohome()">首页</button>
|
||||
<button @click="gotomessage()">消息</button>
|
||||
<button @click="gotomine()">我的</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.home-container {
|
||||
/* 添加你的样式 */
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
/* 可能需要为内容添加一些底部空间以容纳底部导航 */
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.footer-nav {
|
||||
/* 定义底部导航的样式 */
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 10px;
|
||||
background-color: #f5f5f5; /* 示例背景色 */
|
||||
}
|
||||
|
||||
.footer-nav button {
|
||||
/* 定义按钮的样式 */
|
||||
flex: 1;
|
||||
border: none;
|
||||
padding: 10px;
|
||||
background-color: #ccc;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.footer-nav button:hover {
|
||||
/* 按钮点击时的样式 */
|
||||
background-color: #bbb;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Message',
|
||||
methods: {
|
||||
gotohome() {
|
||||
this.$router.push('/home');
|
||||
},
|
||||
gotomessage() {
|
||||
this.$router.push('/message');
|
||||
},
|
||||
gotomine() {
|
||||
this.$router.push('/mine');
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because it is too large
Load Diff
|
Before Width: | Height: | Size: 787 KiB After Width: | Height: | Size: 787 KiB |
@ -1,9 +1,13 @@
|
||||
import { createApp } from 'vue';
|
||||
import App from './App.vue';
|
||||
import router from './router';
|
||||
import ElementPlus from 'element-plus';
|
||||
import 'element-plus/theme-chalk/index.css';
|
||||
import VueDatePicker from '@vuepic/vue-datepicker';
|
||||
import '@vuepic/vue-datepicker/dist/main.css'
|
||||
|
||||
const app = createApp(App);
|
||||
|
||||
app.use(ElementPlus);
|
||||
app.use(router);
|
||||
|
||||
app.component('VueDatePicker', VueDatePicker);
|
||||
app.mount('#app');
|
||||
@ -0,0 +1,41 @@
|
||||
<template>
|
||||
<div>
|
||||
<h1>任务列表</h1>
|
||||
<div v-for="task in tasks" :key="task.id" class="task-item">
|
||||
<div>{{ task.title }}</div>
|
||||
<div>{{ task.description }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tasks: []
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
this.fetchTasks();
|
||||
},
|
||||
methods: {
|
||||
async fetchTasks() {
|
||||
try {
|
||||
const response = await fetch('http://localhost:3000/tasks');
|
||||
const data = await response.json();
|
||||
this.tasks = data;
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.task-item {
|
||||
border: 1px solid #ccc;
|
||||
padding: 10px;
|
||||
margin: 10px 0;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,95 @@
|
||||
<template>
|
||||
<div class="user-feedback">
|
||||
<!-- 输入评价 -->
|
||||
<div class="feedback-input">
|
||||
<h2>写下你的评价吧</h2>
|
||||
<form @submit.prevent="submitFeedback">
|
||||
<textarea id="feedback" v-model.trim="feedback" rows="4" cols="50" placeholder="在这里输入您的评价"></textarea>
|
||||
<button type="submit">发布评价</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- 已发布评价 -->
|
||||
<div class="submitted-feedback" v-if="submittedFeedback">
|
||||
<h2>已发布评价</h2>
|
||||
<div class="feedback-item">
|
||||
<p>{{ submittedFeedback }}</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import axios from 'axios';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
feedback: '',
|
||||
submittedFeedback: ''
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
submitFeedback() {
|
||||
if (!this.feedback.trim()) {
|
||||
return;
|
||||
}
|
||||
|
||||
axios.post('/api/feedback', { feedback: this.feedback.trim() })
|
||||
.then(response => {
|
||||
this.submittedFeedback = response.data.feedback;
|
||||
this.feedback = ''; // 清空输入框
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error submitting feedback:', error);
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.user-feedback {
|
||||
max-width: 600px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
|
||||
.feedback-input {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
textarea {
|
||||
width: 100%;
|
||||
padding: 8px;
|
||||
font-size: 16px;
|
||||
border: 1px solid #28a7a3;
|
||||
border-radius: 4px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
button {
|
||||
padding: 8px 16px;
|
||||
font-size: 16px;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
background-color: #007bff;
|
||||
color: #003f3f;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.submitted-feedback {
|
||||
border-top: 1px solid #a6cfee;
|
||||
padding-top: 20px;
|
||||
}
|
||||
|
||||
.feedback-item {
|
||||
background-color: #abd4ee;
|
||||
border: 1px solid #c2f1fb;
|
||||
border-radius: 4px;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
.feedback-item p {
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
@ -1,40 +0,0 @@
|
||||
|
||||
<template>
|
||||
|
||||
<div class="home-container">
|
||||
|
||||
<h1>欢迎来到主页</h1>
|
||||
|
||||
<!-- 在这里添加你的主页内容 -->
|
||||
|
||||
</div>
|
||||
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
<style scoped>
|
||||
|
||||
.home-container {
|
||||
|
||||
/* 添加你的样式 */
|
||||
|
||||
text-align: center;
|
||||
|
||||
padding: 20px;
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
|
||||
name: 'Home'
|
||||
|
||||
}
|
||||
|
||||
</script>
|
||||
@ -0,0 +1,134 @@
|
||||
<template>
|
||||
<div class="home-container">
|
||||
<div class="return">
|
||||
<button class="addDemand-button" @click="gotoAddDemandPage()">+</button>
|
||||
</div>
|
||||
|
||||
<h1>首页</h1>
|
||||
<div class="search-container">
|
||||
<input type="text" class="search-input" placeholder="世界这么大出去看看吧">
|
||||
<button class="search-button" @click="gotoSearchPage()">搜索</button>
|
||||
</div>
|
||||
|
||||
<div class="image-container">
|
||||
<img src="../data/picture/background.png" alt="图片描述" class="search-image">
|
||||
</div>
|
||||
|
||||
<div class="footer-nav">
|
||||
<button>首页</button>
|
||||
<button @click="gotomessage()">消息</button>
|
||||
<button @click="gotomine()">我的</button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
|
||||
/* 添加样式以定义图片的大小和位置 */
|
||||
.image-container {
|
||||
text-align: center; /* 或者根据你的需求来设置 */
|
||||
margin-top: 20px; /* 你可以根据需要调整这个值 */
|
||||
}
|
||||
|
||||
.home-container {
|
||||
/* 添加你的样式 */
|
||||
text-align: center;
|
||||
padding: 20px;
|
||||
/* 可能需要为内容添加一些底部空间以容纳底部导航 */
|
||||
padding-bottom: 50px;
|
||||
}
|
||||
|
||||
.search-container {
|
||||
/* 定义搜索框容器的样式 */
|
||||
text-align: center;
|
||||
margin-bottom: 20px; /* 根据需要添加一些底部间距 */
|
||||
display: flex;
|
||||
align-items: center; /* 垂直居中 */
|
||||
justify-content: center; /* 水平居中（如果不需要完全居中，可以去掉这个）*/
|
||||
}
|
||||
|
||||
.search-input {
|
||||
/* 定义搜索框的样式 */
|
||||
flex: 1; /* 占据剩余空间 */
|
||||
padding: 10px;
|
||||
border-radius: 5px;
|
||||
border: 1px solid #ccc;
|
||||
}
|
||||
|
||||
.search-button {
|
||||
/* 定义搜索按钮的样式 */
|
||||
margin-left: 10px; /* 与搜索框之间的间距 */
|
||||
padding: 10px 20px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
background-color: #ccc;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.search-button:hover {
|
||||
/* 搜索按钮点击时的样式 */
|
||||
background-color: #bbb;
|
||||
}
|
||||
|
||||
.addDemand-button {
|
||||
/* 定义返回按钮的样式 */
|
||||
position: fixed; /* 使按钮位置固定 */
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
margin: 0;
|
||||
padding: 10px 20px;
|
||||
border: none;
|
||||
border-radius: 5px;
|
||||
background-color: #ccc;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.footer-nav {
|
||||
/* 定义底部导航的样式 */
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 10px;
|
||||
background-color: #f5f5f5; /* 示例背景色 */
|
||||
}
|
||||
|
||||
.footer-nav button {
|
||||
/* 定义按钮的样式 */
|
||||
flex: 1;
|
||||
border: none;
|
||||
padding: 10px;
|
||||
background-color: #ccc;
|
||||
color: #333;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.footer-nav button:hover {
|
||||
/* 按钮点击时的样式 */
|
||||
background-color: #bbb;
|
||||
}
|
||||
</style>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'Home',
|
||||
methods: {
|
||||
gotomessage() {
|
||||
this.$router.push('/message');
|
||||
},
|
||||
gotomine() {
|
||||
this.$router.push('/mine');
|
||||
},
|
||||
gotoSearchPage() {
|
||||
this.$router.push('/searchPage');
|
||||
},
|
||||
gotoAddDemandPage() {
|
||||
this.$router.push('/addDemandPage');
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@ -0,0 +1,114 @@
|
||||
<script lang="ts" setup>
|
||||
import { ref, onBeforeMount, watch, watchEffect } from 'vue'
|
||||
import axios from 'axios'
|
||||
import { ElSelect, ElOption } from 'element-plus'
|
||||
import { AreaList } from '../components/types'
|
||||
import { format, addDays } from 'date-fns'
|
||||
import Return from '../components/return.vue'
|
||||
|
||||
const province = ref('')
|
||||
const city = ref('')
|
||||
const area = ref('')
|
||||
const remark = ref('')
|
||||
|
||||
const provinceList = ref<AreaList[]>([])
|
||||
const cityList = ref<AreaList[]>([])
|
||||
const areaList = ref<AreaList[]>([])
|
||||
const rangeValue = ref<string[]>([format(new Date(), 'yyyy-MM-dd'), format(addDays(new Date(), 1), 'yyyy-MM-dd')])
|
||||
|
||||
// 获取到JSON数据
|
||||
const getProvinceList = async () => {
|
||||
const res = await axios.get<AreaList[]>('https://yjy-oss-files.oss-cn-zhangjiakou.aliyuncs.com/tuxian/area.json')
|
||||
provinceList.value = res.data
|
||||
console.log(provinceList.value)
|
||||
}
|
||||
const publish = () => {
|
||||
// 在这里编写发布时需要执行的逻辑
|
||||
if(city.value!=''){
|
||||
axios.post(`http://106.52.218.118:12607/users/pupdate`,{city:city.value,time:rangeValue.value,remark:remark.value})
|
||||
.then(response => {
|
||||
alert("发布成功")
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('发布失败', error);
|
||||
});}
|
||||
else{
|
||||
alert("请输入目的地")
|
||||
}
|
||||
};
|
||||
onBeforeMount(async()=>{
|
||||
getProvinceList()
|
||||
})
|
||||
|
||||
watchEffect(() => {
|
||||
console.log('rangeValue:', rangeValue.value)
|
||||
})
|
||||
// 监听省份的值改变调用的函数
|
||||
watch(province, (newValue, oldValue) => {
|
||||
const matchedProvince = provinceList.value.find(item => item.name === newValue)
|
||||
if (matchedProvince) {
|
||||
cityList.value = matchedProvince.areaList
|
||||
city.value = '' // 重置城市选择
|
||||
areaList.value = [] // 重置区县选项
|
||||
console.log(cityList.value)
|
||||
}
|
||||
})
|
||||
// 监听 市 的值改变调用的函数
|
||||
watch(city, (newValue, oldValue) => {
|
||||
const matchedCity = cityList.value.find(item => item.name === newValue)
|
||||
if (matchedCity) {
|
||||
areaList.value = matchedCity.areaList
|
||||
area.value = '' // 重置区县选择
|
||||
console.log(areaList.value)
|
||||
}
|
||||
})
|
||||
</script>
|
||||
<template>
|
||||
<div>
|
||||
<Return></Return>
|
||||
</div>
|
||||
|
||||
<div><h2>发布需求</h2></div>
|
||||
<div class="addDemand-container">
|
||||
<div style="display: flex;">
|
||||
<p style="color: red;">*</p>
|
||||
<el-select v-model="province" clearable placeholder="省份">
|
||||
<el-option v-for="item in provinceList" :key="item.code" :label="item.name" :value="item.name" />
|
||||
</el-select>
|
||||
<el-select v-model="city" clearable placeholder="城市">
|
||||
<el-option v-for="item in cityList" :key="item.code" :label="item.name" :value="item.name" />
|
||||
</el-select>
|
||||
<!--<el-select v-model="area" clearable placeholder="Select">
|
||||
<el-option v-for="item in areaList" :key="item.code" :label="item.name" :value="item.name" />
|
||||
</el-select>-->
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<VueDatePicker
|
||||
placeholder="请选择出行时间"
|
||||
range
|
||||
:min-date="new Date()"
|
||||
format="yyyy-MM-dd"
|
||||
:width="280"
|
||||
v-model="rangeValue" />
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<label for="user-input">备注信息:</label>
|
||||
<input type="text" id="remark" v-model="remark" placeholder="">
|
||||
</div>
|
||||
|
||||
<el-button type="primary" @click="publish">发布</el-button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.addDemand-container {
|
||||
max-width: 400px;
|
||||
margin: 0 auto;
|
||||
padding: 30px;
|
||||
border: 1px solid #00ff00;
|
||||
border-radius: 5px;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
@ -0,0 +1,8 @@
|
||||
<template>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
</script>
|
||||
|
||||
<style>
|
||||
</style>
|
||||
Loading…
Reference in new issue