remove files
This commit is contained in:
parent
f623168382
commit
d5be633585
|
|
@ -1,23 +0,0 @@
|
||||||
.DS_Store
|
|
||||||
node_modules
|
|
||||||
/dist
|
|
||||||
|
|
||||||
|
|
||||||
# local env files
|
|
||||||
.env.local
|
|
||||||
.env.*.local
|
|
||||||
|
|
||||||
# Log files
|
|
||||||
npm-debug.log*
|
|
||||||
yarn-debug.log*
|
|
||||||
yarn-error.log*
|
|
||||||
pnpm-debug.log*
|
|
||||||
|
|
||||||
# Editor directories and files
|
|
||||||
.idea
|
|
||||||
.vscode
|
|
||||||
*.suo
|
|
||||||
*.ntvs*
|
|
||||||
*.njsproj
|
|
||||||
*.sln
|
|
||||||
*.sw?
|
|
||||||
|
|
@ -1,19 +0,0 @@
|
||||||
# wenhua
|
|
||||||
|
|
||||||
## Project setup
|
|
||||||
```
|
|
||||||
npm install
|
|
||||||
```
|
|
||||||
|
|
||||||
### Compiles and hot-reloads for development
|
|
||||||
```
|
|
||||||
npm run serve
|
|
||||||
```
|
|
||||||
|
|
||||||
### Compiles and minifies for production
|
|
||||||
```
|
|
||||||
npm run build
|
|
||||||
```
|
|
||||||
|
|
||||||
### Customize configuration
|
|
||||||
See [Configuration Reference](https://cli.vuejs.org/config/).
|
|
||||||
|
|
@ -1,5 +0,0 @@
|
||||||
module.exports = {
|
|
||||||
presets: [
|
|
||||||
'@vue/cli-plugin-babel/preset'
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|
@ -1,19 +0,0 @@
|
||||||
{
|
|
||||||
"compilerOptions": {
|
|
||||||
"target": "es5",
|
|
||||||
"module": "esnext",
|
|
||||||
"baseUrl": "./",
|
|
||||||
"moduleResolution": "node",
|
|
||||||
"paths": {
|
|
||||||
"@/*": [
|
|
||||||
"src/*"
|
|
||||||
]
|
|
||||||
},
|
|
||||||
"lib": [
|
|
||||||
"esnext",
|
|
||||||
"dom",
|
|
||||||
"dom.iterable",
|
|
||||||
"scripthost"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
}
|
|
||||||
File diff suppressed because it is too large
Load Diff
|
|
@ -1,31 +0,0 @@
|
||||||
{
|
|
||||||
"name": "wenhua",
|
|
||||||
"version": "0.1.0",
|
|
||||||
"private": true,
|
|
||||||
"scripts": {
|
|
||||||
"serve": "vue-cli-service serve",
|
|
||||||
"build": "vue-cli-service build"
|
|
||||||
},
|
|
||||||
"dependencies": {
|
|
||||||
"axios": "^1.6.8",
|
|
||||||
"core-js": "^3.8.3",
|
|
||||||
"element-ui": "^2.15.14",
|
|
||||||
"vue": "^2.6.14",
|
|
||||||
"vue-router": "^3.5.1",
|
|
||||||
"vuex": "^3.6.2"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@vue/cli-plugin-babel": "~5.0.0",
|
|
||||||
"@vue/cli-plugin-router": "~5.0.0",
|
|
||||||
"@vue/cli-plugin-vuex": "~5.0.0",
|
|
||||||
"@vue/cli-service": "~5.0.0",
|
|
||||||
"less": "^4.0.0",
|
|
||||||
"less-loader": "^8.0.0",
|
|
||||||
"vue-template-compiler": "^2.6.14"
|
|
||||||
},
|
|
||||||
"browserslist": [
|
|
||||||
"> 1%",
|
|
||||||
"last 2 versions",
|
|
||||||
"not dead"
|
|
||||||
]
|
|
||||||
}
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 4.2 KiB |
|
|
@ -1,17 +0,0 @@
|
||||||
<!DOCTYPE html>
|
|
||||||
<html lang="">
|
|
||||||
<head>
|
|
||||||
<meta charset="utf-8">
|
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
|
||||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
|
||||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<noscript>
|
|
||||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled. Please enable it to continue.</strong>
|
|
||||||
</noscript>
|
|
||||||
<div id="app"></div>
|
|
||||||
<!-- built files will be auto injected -->
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
|
|
@ -1,55 +0,0 @@
|
||||||
<template>
|
|
||||||
<div id="app">
|
|
||||||
<router-view/>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<style lang="less">
|
|
||||||
#app {
|
|
||||||
font-family: Avenir, Helvetica, Arial, sans-serif;
|
|
||||||
-webkit-font-smoothing: antialiased;
|
|
||||||
-moz-osx-font-smoothing: grayscale;
|
|
||||||
// text-align: center;
|
|
||||||
color: #2c3e50;
|
|
||||||
}
|
|
||||||
* {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
a {
|
|
||||||
text-decoration: none;
|
|
||||||
}
|
|
||||||
html,
|
|
||||||
body {
|
|
||||||
height: 100%;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar {
|
|
||||||
-webkit-appearance: none;
|
|
||||||
width: 0px;
|
|
||||||
// height: 0px;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-track {
|
|
||||||
background-color: transparent;
|
|
||||||
-webkit-border-radius: 2em;
|
|
||||||
-moz-border-radius: 2em;
|
|
||||||
border-radius: 2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb {
|
|
||||||
cursor: pointer;
|
|
||||||
background-color: rgb(147, 147, 153, 0.5);
|
|
||||||
-webkit-border-radius: 2em;
|
|
||||||
-moz-border-radius: 2em;
|
|
||||||
border-radius: 2em;
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-thumb:hover {
|
|
||||||
background: rgba(0, 0, 0, 0.3);
|
|
||||||
}
|
|
||||||
|
|
||||||
::-webkit-scrollbar-corner {
|
|
||||||
background: rgba(0, 0, 0, 0);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,53 +0,0 @@
|
||||||
// 引入封装的请求
|
|
||||||
import {
|
|
||||||
getData,
|
|
||||||
postData,
|
|
||||||
getIdData,
|
|
||||||
getIddData,
|
|
||||||
getcIdData,
|
|
||||||
deleteData,
|
|
||||||
getIdddData,
|
|
||||||
getIddDataQuestions,
|
|
||||||
LayOut
|
|
||||||
} from "./http";
|
|
||||||
|
|
||||||
let apiServe = {
|
|
||||||
// 登录接口
|
|
||||||
login: (data) => getData("login", "get", data),
|
|
||||||
// 注册登录
|
|
||||||
register: (data) => postData("register", "post", data),
|
|
||||||
// 获取用户信息
|
|
||||||
admin:(data) => getData("getUserInfo", "get", data),
|
|
||||||
// 编辑用户
|
|
||||||
editAdmin: (data) => postData('updateUserInfor', 'post', data),
|
|
||||||
// 文化长廊列表
|
|
||||||
Cllist: (data) => getData('culture/list', "get", data),
|
|
||||||
// 文化长廊详情
|
|
||||||
Clwh: (id) => getIdData('culture/detail', 'get', id),
|
|
||||||
// 获取问题列表
|
|
||||||
getWishData: (data) => getData('question/questionList', 'get', data),
|
|
||||||
// 添加问题
|
|
||||||
getWish: (data) => postData('question/addQuestion', 'post', data),
|
|
||||||
// 问题选项
|
|
||||||
getwishxx:(id) => getIddData('question/questionOptions', 'get', id),
|
|
||||||
// 答题
|
|
||||||
getwishdt:(id) => getIddDataQuestions('question/answerQuestion', 'get', id),
|
|
||||||
// 获取留言列表
|
|
||||||
getliuyan:(data) => getData("message/list", "get", data),
|
|
||||||
// 添加留言列表
|
|
||||||
addliuyan:(data) => postData("message/add", "post", data),
|
|
||||||
// 查看评论
|
|
||||||
pinglun:(data) => getcIdData("culture/comment", "get", data),
|
|
||||||
// 添加评论
|
|
||||||
addpinglun:(data) => postData("culture/addComment", "post", data),
|
|
||||||
// 删除留言
|
|
||||||
delliuyan:(data) => deleteData("message", "delete", data),
|
|
||||||
// 商城列表
|
|
||||||
shoplist:(data) => getData("good/list", "get", data),
|
|
||||||
// 商城购买
|
|
||||||
shop:(id) => getIdddData("point/getGoodByPoint", "get", id),
|
|
||||||
//注销
|
|
||||||
LogOut:() => LayOut("logout","get")
|
|
||||||
}
|
|
||||||
|
|
||||||
export { apiServe };
|
|
||||||
|
|
@ -1,237 +0,0 @@
|
||||||
// 1.引入axios
|
|
||||||
import axios from 'axios';
|
|
||||||
// 引入 element ui
|
|
||||||
import { Message } from 'element-ui';
|
|
||||||
//引入路由实例
|
|
||||||
import router from '@/router';
|
|
||||||
let path = ''
|
|
||||||
const server = axios.create({
|
|
||||||
// 设置端口前缀
|
|
||||||
baseURL: 'https://9miao.fun:6838/prod-api/api/',
|
|
||||||
// 设置超时时间
|
|
||||||
timeout: 5000,
|
|
||||||
// 设置请求头 全局
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
"saToken" : localStorage.getItem('token')
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
// 请求拦截器 发送请求的路上干点什么
|
|
||||||
server.interceptors.request.use(config => {
|
|
||||||
// 排除登录或者注册接口 当不是登录或者注册接口的时候必须要传递token
|
|
||||||
if (config.url != '/login' && config.url != '/register') {
|
|
||||||
config.headers.token = localStorage.getItem('token');
|
|
||||||
}
|
|
||||||
// 每次请求都会把路径存起来
|
|
||||||
path = config.url
|
|
||||||
return config;
|
|
||||||
})
|
|
||||||
|
|
||||||
// // 响应拦截器
|
|
||||||
// server.interceptors.response.use(res => {
|
|
||||||
// // 判断请求是否成功
|
|
||||||
// if (res.data.token.code == 200) {
|
|
||||||
// return res.data.token
|
|
||||||
// } else if (res.data.token.code == 401) {
|
|
||||||
// // 将后端的失败提示消息弹出去
|
|
||||||
// Message({
|
|
||||||
// message: res.data.token.msg,
|
|
||||||
// type: 'error'
|
|
||||||
// });
|
|
||||||
|
|
||||||
// // 判断请求的接口路径
|
|
||||||
// if (path == '/register' || path == '/login') {
|
|
||||||
// return;
|
|
||||||
// } else {
|
|
||||||
// router.push('/')
|
|
||||||
// }
|
|
||||||
// } else {
|
|
||||||
// Message({
|
|
||||||
// message: res.data.token.msg,
|
|
||||||
// type: 'error'
|
|
||||||
// })
|
|
||||||
// }
|
|
||||||
// });
|
|
||||||
|
|
||||||
|
|
||||||
// 封装post
|
|
||||||
export function postData(url, method, data) {
|
|
||||||
return new Promise(resolve => {
|
|
||||||
// 调用自定义的axios
|
|
||||||
server({
|
|
||||||
method,
|
|
||||||
url,
|
|
||||||
data
|
|
||||||
})
|
|
||||||
.then(res => {
|
|
||||||
resolve(res);
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
Message({
|
|
||||||
message: '系统错误POST',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 封装get
|
|
||||||
export function getData(url, method, data) {
|
|
||||||
return new Promise(resolve => {
|
|
||||||
// 调用自定义的axios
|
|
||||||
server({
|
|
||||||
method,
|
|
||||||
url,
|
|
||||||
params: data
|
|
||||||
})
|
|
||||||
.then(res => {
|
|
||||||
resolve(res,"resHttps");
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
Message({
|
|
||||||
message: '系统错误GET',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
// 封装get 通过id 详情
|
|
||||||
export function getIdData(url, method, id) {
|
|
||||||
return new Promise(resolve => {
|
|
||||||
// 调用自定义的axios
|
|
||||||
server({
|
|
||||||
method,
|
|
||||||
url: `${url}?id=${id}`,
|
|
||||||
// params: data
|
|
||||||
})
|
|
||||||
.then(res => {
|
|
||||||
resolve(res);
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
Message({
|
|
||||||
message: '系统错误',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
// 封装get 通过id 详情
|
|
||||||
export function getIddData(url, method, id) {
|
|
||||||
return new Promise(resolve => {
|
|
||||||
// 调用自定义的axios
|
|
||||||
server({
|
|
||||||
method,
|
|
||||||
url: `${url}?questionId=${id}`,
|
|
||||||
// params: data
|
|
||||||
})
|
|
||||||
.then(res => {
|
|
||||||
resolve(res);
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
Message({
|
|
||||||
message: '系统错误',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
export function getIddDataQuestions(url, method, id) {
|
|
||||||
return new Promise(resolve => {
|
|
||||||
// 调用自定义的axios
|
|
||||||
server({
|
|
||||||
method,
|
|
||||||
url: `${url}?optionId=${id}`,
|
|
||||||
// params: data
|
|
||||||
})
|
|
||||||
.then(res => {
|
|
||||||
resolve(res);
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
Message({
|
|
||||||
message: '系统错误',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
export function LayOut(url,method){
|
|
||||||
return new Promise(resolve => {
|
|
||||||
// 调用自定义的axios
|
|
||||||
server({
|
|
||||||
method,
|
|
||||||
url,
|
|
||||||
// params: data
|
|
||||||
})
|
|
||||||
.then(res => {
|
|
||||||
resolve(res);
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
Message({
|
|
||||||
message: '系统错误',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
|
|
||||||
export function getIdddData(url, method, id) {
|
|
||||||
return new Promise(resolve => {
|
|
||||||
// 调用自定义的axios
|
|
||||||
server({
|
|
||||||
method,
|
|
||||||
url: `${url}?goodId=${id}`,
|
|
||||||
// params: data
|
|
||||||
})
|
|
||||||
.then(res => {
|
|
||||||
resolve(res);
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
Message({
|
|
||||||
message: '系统错误',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
// 封装get 通过id 详情
|
|
||||||
export function getcIdData(url, method, id) {
|
|
||||||
return new Promise(resolve => {
|
|
||||||
// 调用自定义的axios
|
|
||||||
server({
|
|
||||||
method,
|
|
||||||
url: `${url}?cid=${id}`,
|
|
||||||
// params: data
|
|
||||||
})
|
|
||||||
.then(res => {
|
|
||||||
resolve(res);
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
Message({
|
|
||||||
message: '系统错误',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
export function deleteData(url, method, id) {
|
|
||||||
return new Promise(resolve => {
|
|
||||||
// 调用自定义的axios
|
|
||||||
server({
|
|
||||||
method,
|
|
||||||
url: `${url}/${id}`,
|
|
||||||
// params: data
|
|
||||||
})
|
|
||||||
.then(res => {
|
|
||||||
resolve(res);
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
Message({
|
|
||||||
message: '系统错误',
|
|
||||||
type: 'error'
|
|
||||||
})
|
|
||||||
})
|
|
||||||
})
|
|
||||||
}
|
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 520 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 527 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 131 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 197 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 82 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 795 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 78 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 194 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 4.6 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 612 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 6.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 7.3 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 5.1 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.9 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 2.7 KiB |
|
|
@ -1,248 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="index">
|
|
||||||
<!-- 轮播图 -->
|
|
||||||
<el-carousel indicator-position="outside">
|
|
||||||
<el-carousel-item v-for="(item, index) in imgs" :key="index">
|
|
||||||
<h3><img :src="item.url" alt="" /></h3>
|
|
||||||
</el-carousel-item>
|
|
||||||
</el-carousel>
|
|
||||||
|
|
||||||
<div class="sub">
|
|
||||||
<div class="sublist">
|
|
||||||
<div class="item">
|
|
||||||
<img src="../../assets/12.jpg" alt="" />
|
|
||||||
<p>添加</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="item">
|
|
||||||
<img src="../../assets/12.jpg" alt="" />
|
|
||||||
<p>编辑</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="item">
|
|
||||||
<img src="../../assets/12.jpg" alt="" />
|
|
||||||
<p>删除</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<h2>文化长廊</h2>
|
|
||||||
|
|
||||||
<div class="changlang">
|
|
||||||
<div class="cllist">
|
|
||||||
<div
|
|
||||||
class="cllist_item"
|
|
||||||
v-for="(item, index) in list"
|
|
||||||
:key="index"
|
|
||||||
@click="desc(item.id,item.userId)"
|
|
||||||
>
|
|
||||||
<img :src="item.cultureImage" alt="" />
|
|
||||||
<div class="item_box">
|
|
||||||
<p>{{ item.cultureTitle }}</p>
|
|
||||||
<p v-html="item.cultureContent"></p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { apiServe } from '@/api/api.js'
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
imgs: [
|
|
||||||
{
|
|
||||||
url: "https://qiniu.ltshgs.com/5cfc3b6898394a9681d9fed627100d1e.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
url: "https://qiniu.ltshgs.com/501d1c0683724753a1f8f43ba9d53b32.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
url: "https://qiniu.ltshgs.com/a32b4f50c0184073bb12aaaa9ebce3b5.jpg",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
url: "https://qiniu.ltshgs.com/4d0888b9477a4ec69a2387e53ff1c8a9.jpg",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
|
|
||||||
list: [
|
|
||||||
],
|
|
||||||
cdata:{
|
|
||||||
|
|
||||||
},
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {
|
|
||||||
this.cdata.token = localStorage.getItem('token')
|
|
||||||
console.log(this.token);
|
|
||||||
this.searchUser()
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
desc(id,cid) {
|
|
||||||
console.log(id);
|
|
||||||
this.$router.push({ path:"/desc", query: { id: id} });
|
|
||||||
},
|
|
||||||
searchUser() {
|
|
||||||
apiServe.Cllist(this.cdata).then((res) => {
|
|
||||||
console.log(res,"resVueIndex");
|
|
||||||
this.list = res.data.data
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="less">
|
|
||||||
.index::v-deep {
|
|
||||||
height: 100%;
|
|
||||||
// background-color: #ccc;
|
|
||||||
|
|
||||||
.el-carousel__container {
|
|
||||||
height: 780px;
|
|
||||||
position: relative;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-carousel__item h3 {
|
|
||||||
color: #475669;
|
|
||||||
font-size: 16px;
|
|
||||||
margin: 0;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 100%;
|
|
||||||
height: 780px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-carousel__indicators--horizontal {
|
|
||||||
// height: 1px;
|
|
||||||
position: absolute;
|
|
||||||
bottom: 24px;
|
|
||||||
left: 50%;
|
|
||||||
transform: translate(-50%);
|
|
||||||
z-index: 99;
|
|
||||||
// background-color: aqua;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-carousel__indicators--horizontal button {
|
|
||||||
width: 50px;
|
|
||||||
background-color: #ffffff;
|
|
||||||
height: 5px !important;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-carousel__arrow--left {
|
|
||||||
width: 50px;
|
|
||||||
height: 50px;
|
|
||||||
font-size: 20px;
|
|
||||||
position: absolute;
|
|
||||||
left: 30px;
|
|
||||||
top: 50%;
|
|
||||||
z-index: 99;
|
|
||||||
}
|
|
||||||
|
|
||||||
.el-carousel__arrow--right {
|
|
||||||
width: 50px;
|
|
||||||
height: 50px;
|
|
||||||
font-size: 20px;
|
|
||||||
position: absolute;
|
|
||||||
right: 30px;
|
|
||||||
top: 50%;
|
|
||||||
z-index: 99;
|
|
||||||
}
|
|
||||||
.sub {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin-top: 40px;
|
|
||||||
// background-color: red;
|
|
||||||
.sublist {
|
|
||||||
width: 1250px;
|
|
||||||
height: 200px;
|
|
||||||
// margin: 0 auto;
|
|
||||||
background-color: #fff;
|
|
||||||
border-radius: 10px;
|
|
||||||
// box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.3);
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
|
|
||||||
// background-color: aqua;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-around;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.item {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 100px;
|
|
||||||
height: 100px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
border-radius: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
h2 {
|
|
||||||
text-align: center;
|
|
||||||
margin-top: 40px;
|
|
||||||
font-size: 32px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.changlang {
|
|
||||||
width: 100%;
|
|
||||||
margin-top: 20px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
padding-bottom: 30px;
|
|
||||||
|
|
||||||
.cllist {
|
|
||||||
width: 1250px;
|
|
||||||
height: 100%;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
// box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3);
|
|
||||||
// background-color: #fff;
|
|
||||||
border-radius: 5px;
|
|
||||||
|
|
||||||
.cllist_item {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background-color: #ffffff;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 120px;
|
|
||||||
height: 120px;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item_box {
|
|
||||||
margin-left: 20px;
|
|
||||||
|
|
||||||
p:first-child {
|
|
||||||
margin-bottom: 30px;
|
|
||||||
font-size: 24px;
|
|
||||||
}
|
|
||||||
|
|
||||||
p:last-child {
|
|
||||||
// margin-bottom: 30px;
|
|
||||||
font-size: 16px;
|
|
||||||
color: #979797;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,338 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="box">
|
|
||||||
<div class="content">
|
|
||||||
<div class="btn" @click="send">
|
|
||||||
<p>留言</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="container">
|
|
||||||
<!-- <div class="title">题目推荐</div> -->
|
|
||||||
|
|
||||||
<div class="item" v-for="(item, index) in list" :key="index">
|
|
||||||
<img :src="item.avatar" alt="" />
|
|
||||||
<div class="item_box">
|
|
||||||
<p>{{ item.title }}</p>
|
|
||||||
<p>{{ item.content }}</p>
|
|
||||||
<div class="bottom_item">
|
|
||||||
<div class="btns">
|
|
||||||
<p class="btns_time">
|
|
||||||
{{ item.nickname }} 发布于 {{ item.createTime }}
|
|
||||||
</p>
|
|
||||||
<p class="btns_btn" @click="del(item.id)">删除当前留言</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-dialog
|
|
||||||
title="发布题目"
|
|
||||||
:visible.sync="dialogVisible"
|
|
||||||
width="40%"
|
|
||||||
:before-close="handleClose"
|
|
||||||
>
|
|
||||||
<!-- <p style="text-align: center;">发布题目</p> -->
|
|
||||||
<el-upload
|
|
||||||
class="avatar-uploader"
|
|
||||||
action="https://9miao.fun:6838/prod-api/common/alibabaUpload"
|
|
||||||
:show-file-list="false"
|
|
||||||
:headers="headerObj"
|
|
||||||
:on-success="handleAvatarSuccess"
|
|
||||||
>
|
|
||||||
<img v-if="imageUrl" :src="imageUrl" class="avatar" />
|
|
||||||
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
|
||||||
</el-upload>
|
|
||||||
<span slot="footer" class="dialog-footer">
|
|
||||||
<el-form ref="form" :model="form" label-width="80px">
|
|
||||||
<el-form-item label="留言人">
|
|
||||||
<el-input v-model="form.nickname"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="留言内容">
|
|
||||||
<el-input v-model="form.content"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<!-- <el-form-item label="">
|
|
||||||
<el-input v-model="form.name"></el-input>
|
|
||||||
</el-form-item> -->
|
|
||||||
</el-form>
|
|
||||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
|
||||||
<el-button type="primary" @click="upload">确 定</el-button>
|
|
||||||
</span>
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { apiServe } from "@/api/api";
|
|
||||||
export default {
|
|
||||||
name: "WenhuaWebuiZhiShi",
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
list: [],
|
|
||||||
|
|
||||||
dialogVisible: false,
|
|
||||||
|
|
||||||
form: {},
|
|
||||||
headerObj: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
saToken: localStorage.getItem("token"),
|
|
||||||
},
|
|
||||||
imageUrl: "",
|
|
||||||
cdata: {},
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {
|
|
||||||
this.cdata.token = localStorage.getItem("token");
|
|
||||||
let token = localStorage.getItem("token");
|
|
||||||
if (!token) {
|
|
||||||
if (!token) {
|
|
||||||
this.$confirm("您还未登录，是否前去登录?", "提示", {
|
|
||||||
confirmButtonText: "确定",
|
|
||||||
cancelButtonText: "取消",
|
|
||||||
type: "warning",
|
|
||||||
})
|
|
||||||
.then(() => {
|
|
||||||
// 跳转登录
|
|
||||||
this.$router.push("/login");
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
this.$message({
|
|
||||||
type: "info",
|
|
||||||
message: "已取消",
|
|
||||||
});
|
|
||||||
this.$router.push("/");
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
this.searchUser();
|
|
||||||
console.log(this.list,"this.list")
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
send() {
|
|
||||||
this.dialogVisible = true;
|
|
||||||
},
|
|
||||||
searchUser() {
|
|
||||||
apiServe.getliuyan().then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
this.list = res.data.data;
|
|
||||||
console.log(this.list,"res.data.this.list")
|
|
||||||
});
|
|
||||||
},
|
|
||||||
handleClose(done) {
|
|
||||||
this.$confirm("确认关闭？")
|
|
||||||
.then((_) => {
|
|
||||||
done();
|
|
||||||
})
|
|
||||||
.catch((_) => {});
|
|
||||||
},
|
|
||||||
|
|
||||||
handleAvatarSuccess(res, file) {
|
|
||||||
console.log(res, file);
|
|
||||||
this.imageUrl = URL.createObjectURL(file.raw);
|
|
||||||
},
|
|
||||||
|
|
||||||
upload() {
|
|
||||||
// 若验证成功 此时应该调登录接口
|
|
||||||
let data = {
|
|
||||||
content: this.form.content,
|
|
||||||
username: this.form.nickname,
|
|
||||||
avatar: this.imageUrl,
|
|
||||||
};
|
|
||||||
apiServe.addliuyan(data).then((res) => {
|
|
||||||
setTimeout(() => {
|
|
||||||
this.$message({
|
|
||||||
message: "添加成功",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
this.dialogVisible = false;
|
|
||||||
}, 1000);
|
|
||||||
location.reload();
|
|
||||||
|
|
||||||
});
|
|
||||||
},
|
|
||||||
del(index) {
|
|
||||||
apiServe.delliuyan(index).then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
// this.list = res.data.data
|
|
||||||
setTimeout(() => {
|
|
||||||
this.$message({
|
|
||||||
message: "删除成功",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
// location.reload();
|
|
||||||
}, 1000);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="less">
|
|
||||||
.box::v-deep {
|
|
||||||
height: 100%;
|
|
||||||
// background-color: #ccc;
|
|
||||||
padding: 50px 60px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.content {
|
|
||||||
width: 1000px;
|
|
||||||
// height: 300px;
|
|
||||||
// background-color: #ffffff;
|
|
||||||
padding: 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
border-radius: 5px;
|
|
||||||
|
|
||||||
.btn {
|
|
||||||
// width: 100px;
|
|
||||||
// background-color: rgba(0, 0, 0, alpha);
|
|
||||||
// padding: 15px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
p {
|
|
||||||
width: 150px;
|
|
||||||
height: 40px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 40px;
|
|
||||||
background-color: rgba(22, 155, 213, 1);
|
|
||||||
font-size: 14px;
|
|
||||||
border-radius: 7px;
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.title {
|
|
||||||
margin-top: 20px;
|
|
||||||
// margin-left: 30px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
color: #333;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
// align-items: center;
|
|
||||||
padding: 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background-color: #ffffff;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
position: relative;
|
|
||||||
margin-top: 20px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 120px;
|
|
||||||
height: 120px;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item_box {
|
|
||||||
margin-left: 20px;
|
|
||||||
|
|
||||||
.bottom {
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
p:first-child {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
p:nth-child(2) {
|
|
||||||
// margin-bottom: 30px;
|
|
||||||
// width: 600px;
|
|
||||||
font-size: 16px;
|
|
||||||
color: #979797;
|
|
||||||
display: -webkit-box;
|
|
||||||
overflow: hidden;
|
|
||||||
-webkit-box-orient: vertical;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
-webkit-line-clamp: 3; //显示几行
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.bottom_item {
|
|
||||||
width: 600px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
position: absolute;
|
|
||||||
bottom: 20px;
|
|
||||||
right: 30px;
|
|
||||||
// position: relative;
|
|
||||||
|
|
||||||
.time {
|
|
||||||
font-size: 14px !important;
|
|
||||||
color: #000;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btns {
|
|
||||||
// width: 100px;
|
|
||||||
// background-color: rgba(0, 0, 0, alpha);
|
|
||||||
// padding: 15px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.btns_time {
|
|
||||||
font-size: 14px;
|
|
||||||
margin-right: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btns_btn {
|
|
||||||
width: 100px;
|
|
||||||
height: 30px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 30px;
|
|
||||||
background-color: rgba(22, 155, 213, 1);
|
|
||||||
font-size: 10px;
|
|
||||||
border-radius: 7px;
|
|
||||||
color: #ffffff;
|
|
||||||
background-color: red;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatar-uploader .el-upload {
|
|
||||||
border: 1px dashed #d9d9d9;
|
|
||||||
border-radius: 6px;
|
|
||||||
cursor: pointer;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
.avatar-uploader .el-upload:hover {
|
|
||||||
border-color: #409eff;
|
|
||||||
}
|
|
||||||
.avatar-uploader-icon {
|
|
||||||
font-size: 28px;
|
|
||||||
color: #8c939d;
|
|
||||||
width: 178px;
|
|
||||||
height: 178px;
|
|
||||||
line-height: 178px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.avatar {
|
|
||||||
width: 178px;
|
|
||||||
height: 178px;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,247 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="box">
|
|
||||||
<div class="mine">
|
|
||||||
<el-upload
|
|
||||||
class="avatar-uploader"
|
|
||||||
action="https://9miao.fun:6838/prod-api/common/alibabaUpload"
|
|
||||||
:show-file-list="false"
|
|
||||||
:headers="headerObj"
|
|
||||||
:on-success="handleAvatarSuccess"
|
|
||||||
:before-upload="beforeAvatarUpload">
|
|
||||||
<img v-if="user.avatar" :src="user.avatar" class="avatar" />
|
|
||||||
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
|
||||||
</el-upload>
|
|
||||||
|
|
||||||
<div class="msg">
|
|
||||||
<div class="item">
|
|
||||||
<p>昵称</p>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
:placeholder="username?username:'请输入昵称'"
|
|
||||||
v-model="user.nicekname"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="item">
|
|
||||||
<p>性别</p>
|
|
||||||
<div class="radio">
|
|
||||||
<el-radio v-model="user.sex" label="male">男</el-radio>
|
|
||||||
<el-radio v-model="user.sex" label="nv">女</el-radio>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="item">
|
|
||||||
<p>手机号</p>
|
|
||||||
<input
|
|
||||||
type="text"
|
|
||||||
placeholder="请输入手机号"
|
|
||||||
v-model="user.phonenumber"
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="btn">
|
|
||||||
<p @click="save">保存</p>
|
|
||||||
<p @click="logout">注销</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { apiServe } from "@/api/api.js";
|
|
||||||
import router from "@/router";
|
|
||||||
export default {
|
|
||||||
name: "WenhuaWebuiMine",
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
cdata: {},
|
|
||||||
headerObj: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
"saToken" : localStorage.getItem('token')
|
|
||||||
},
|
|
||||||
imageUrl:'',
|
|
||||||
UrlImgs:'',
|
|
||||||
user: {
|
|
||||||
phonenumber: "",
|
|
||||||
nicekname: "",
|
|
||||||
avatar: "",
|
|
||||||
sex: "",
|
|
||||||
},
|
|
||||||
username:"",
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {
|
|
||||||
this.cdata.token = localStorage.getItem("token");
|
|
||||||
this.searchUser();
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
handleSelect(e){
|
|
||||||
|
|
||||||
},
|
|
||||||
beforeAvatarUpload(file) {
|
|
||||||
const isJPG = file.type === 'image/jpeg';
|
|
||||||
const isLt2M = file.size / 1024 / 1024 < 2;
|
|
||||||
|
|
||||||
if (!isJPG) {
|
|
||||||
this.$message.error('上传头像图片只能是 JPG 格式!');
|
|
||||||
}
|
|
||||||
if (!isLt2M) {
|
|
||||||
this.$message.error('上传头像图片大小不能超过 2MB!');
|
|
||||||
}
|
|
||||||
return isJPG && isLt2M;
|
|
||||||
},
|
|
||||||
handleAvatarSuccess(res, file) {
|
|
||||||
this.imageUrl = URL.createObjectURL(file.raw);
|
|
||||||
// console.log(this.imageUrl,"onSuccessImgs");
|
|
||||||
this.user.avatar = this.imageUrl
|
|
||||||
},
|
|
||||||
searchUser() {
|
|
||||||
// $token=${this.cdata.token}
|
|
||||||
// console.log(this.cdata,"this.cdata")
|
|
||||||
apiServe.admin(this.cdata).then((res) => {
|
|
||||||
console.log(res,"MimeRes");
|
|
||||||
this.user = res.data.data;
|
|
||||||
this.imageUrl = res.data.data?.avatar;
|
|
||||||
this.username = res.data?.data?.username
|
|
||||||
localStorage.setItem("userid", res.data.data?.id);
|
|
||||||
localStorage.setItem("img", this.imageUrl);
|
|
||||||
});
|
|
||||||
},
|
|
||||||
save() {
|
|
||||||
console.log(this.user,"this.user")
|
|
||||||
apiServe.editAdmin(this.user).then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
this.$router.push("/index");
|
|
||||||
this.$message({
|
|
||||||
message: "个人信息保存成功!",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
},
|
|
||||||
logout(){
|
|
||||||
apiServe.LogOut().then(res => {
|
|
||||||
console.log(res,"注销用户")
|
|
||||||
localStorage.removeItem("img")
|
|
||||||
localStorage.removeItem("userid")
|
|
||||||
localStorage.removeItem("token")
|
|
||||||
this.$message({
|
|
||||||
message: '注销成功',
|
|
||||||
type: 'success'
|
|
||||||
})
|
|
||||||
this.$router.push("/")
|
|
||||||
location.reload();
|
|
||||||
})
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="less">
|
|
||||||
.box::v-deep {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.mine {
|
|
||||||
width: 1000px;
|
|
||||||
margin-top: 50px;
|
|
||||||
border-radius: 10px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
padding: 30px 0;
|
|
||||||
|
|
||||||
.msg {
|
|
||||||
width: 800px;
|
|
||||||
border-radius: 10px;
|
|
||||||
|
|
||||||
.btn {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
// background-color: rgba(242, 242, 242, 1);
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
p {
|
|
||||||
width: 150px;
|
|
||||||
height: 35px;
|
|
||||||
font-size: 14px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 35px;
|
|
||||||
background-color: rgba(22, 155, 213, 1);
|
|
||||||
color: #ffffff;
|
|
||||||
border-radius: 5px;
|
|
||||||
// padding: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.item {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
background-color: rgba(242, 242, 242, 1);
|
|
||||||
|
|
||||||
// justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
margin-top: 20px;
|
|
||||||
padding: 20px 30px 0;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-bottom: 50px;
|
|
||||||
|
|
||||||
p {
|
|
||||||
width: 100%;
|
|
||||||
text-align: left;
|
|
||||||
// margin-top: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.radio {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
margin-top: 20px;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
|
||||||
width: 100%;
|
|
||||||
height: 35px;
|
|
||||||
margin: 10px 0 20px;
|
|
||||||
padding-left: 15px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 5px;
|
|
||||||
border: 1px solid #ffffff !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.avatar-uploader .el-upload {
|
|
||||||
border: 1px dashed #d9d9d9;
|
|
||||||
border-radius: 6px;
|
|
||||||
cursor: pointer;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
.avatar-uploader .el-upload:hover {
|
|
||||||
border-color: #409eff;
|
|
||||||
}
|
|
||||||
.avatar-uploader-icon {
|
|
||||||
font-size: 28px;
|
|
||||||
color: #8c939d;
|
|
||||||
width: 178px;
|
|
||||||
height: 178px;
|
|
||||||
line-height: 178px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.avatar {
|
|
||||||
width: 178px;
|
|
||||||
height: 178px;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,99 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="box">
|
|
||||||
<div class="content">
|
|
||||||
<p>题目题目</p>
|
|
||||||
<!-- <input type="text" placeholder="请输入答案" /> -->
|
|
||||||
<el-input
|
|
||||||
type="textarea"
|
|
||||||
placeholder="请输入答案"
|
|
||||||
style="width: 600px; margin: 20px 0"
|
|
||||||
></el-input>
|
|
||||||
|
|
||||||
<div class="btn">
|
|
||||||
<p @click="save">保存</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: "WenhuaWebuiQuestDesc",
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {};
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
save() {
|
|
||||||
this.$message({
|
|
||||||
message: "提交成功！",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
this.$router.push('/zhishi')
|
|
||||||
}, 1000)
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="less">
|
|
||||||
.box::v-deep {
|
|
||||||
height: 100%;
|
|
||||||
// background-color: #ccc;
|
|
||||||
padding: 50px 60px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.content {
|
|
||||||
width: 1000px;
|
|
||||||
// height: 300px;
|
|
||||||
background-color: #ffffff;
|
|
||||||
padding: 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
border-radius: 5px;
|
|
||||||
display: flex;
|
|
||||||
justify-items: center;
|
|
||||||
align-items: center;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
.btn {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
// background-color: rgba(242, 242, 242, 1);
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
p {
|
|
||||||
width: 150px;
|
|
||||||
height: 35px;
|
|
||||||
font-size: 14px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 35px;
|
|
||||||
background-color: rgba(22, 155, 213, 1);
|
|
||||||
color: #ffffff;
|
|
||||||
border-radius: 5px;
|
|
||||||
// padding: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
input {
|
|
||||||
width: 500px;
|
|
||||||
height: 100px;
|
|
||||||
margin: 20px 0 20px;
|
|
||||||
padding-left: 15px;
|
|
||||||
padding-top: 10px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 5px;
|
|
||||||
border: 1px solid #ffffff !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,154 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="box">
|
|
||||||
<div class="content">
|
|
||||||
<div class="container">
|
|
||||||
<h1>积分商城</h1>
|
|
||||||
<hr />
|
|
||||||
<el-row :gutter="20">
|
|
||||||
<el-col :span="6" v-for="(item,index) in list" :key="index">
|
|
||||||
<div class="grid-content ">
|
|
||||||
<img src="item.goodPic" alt="" />
|
|
||||||
<h2>{{item.goodName}}</h2>
|
|
||||||
<h5>{{ item.goodDescription }}</h5>
|
|
||||||
<el-button type="primary" @click="gmshop(item.id)">兑换</el-button>
|
|
||||||
</div>
|
|
||||||
</el-col>
|
|
||||||
</el-row>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { apiServe } from "@/api/api";
|
|
||||||
export default {
|
|
||||||
name: "WenhuaWebuiZhiShi",
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
list: [],
|
|
||||||
imageUrl: "",
|
|
||||||
cdata: {},
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {
|
|
||||||
this.cdata.token = localStorage.getItem("token");
|
|
||||||
let token = localStorage.getItem("token");
|
|
||||||
console.log(token);
|
|
||||||
if (!token) {
|
|
||||||
if (!token) {
|
|
||||||
this.$confirm("您还未登录，是否前去登录?", "提示", {
|
|
||||||
confirmButtonText: "确定",
|
|
||||||
cancelButtonText: "取消",
|
|
||||||
type: "warning",
|
|
||||||
})
|
|
||||||
.then(() => {
|
|
||||||
// 跳转登录
|
|
||||||
this.$router.push("/login");
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
this.$message({
|
|
||||||
type: "info",
|
|
||||||
message: "已取消",
|
|
||||||
});
|
|
||||||
this.$router.push("/");
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
this.searchUser();
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
searchUser() {
|
|
||||||
apiServe.shoplist(this.cdata).then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
this.list = res.data.data;
|
|
||||||
});
|
|
||||||
},
|
|
||||||
gmshop(id){
|
|
||||||
this.$confirm("是否购买此商品?", "提示", {
|
|
||||||
confirmButtonText: "确定",
|
|
||||||
cancelButtonText: "取消",
|
|
||||||
type: "warning",
|
|
||||||
})
|
|
||||||
.then(() => {
|
|
||||||
// 跳转登录
|
|
||||||
apiServe.shop(id).then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
this.$message({
|
|
||||||
type:'success',
|
|
||||||
message: '兑换成功',
|
|
||||||
});
|
|
||||||
});
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
this.$message({
|
|
||||||
type: "info",
|
|
||||||
message: "已取消",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="less">
|
|
||||||
.box::v-deep {
|
|
||||||
height: 100%;
|
|
||||||
// background-color: #ccc;
|
|
||||||
padding: 50px 60px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.content {
|
|
||||||
width: 90%;
|
|
||||||
// height: 300px;
|
|
||||||
// background-color: #ffffff;
|
|
||||||
padding: 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
background-color: #fff;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
width: 100%;
|
|
||||||
.el-row {
|
|
||||||
margin-top: 50px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
&:last-child {
|
|
||||||
margin-bottom: 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-col {
|
|
||||||
border-radius: 4px;
|
|
||||||
}
|
|
||||||
.grid-content {
|
|
||||||
text-align: center;
|
|
||||||
height: auto;
|
|
||||||
border-radius: 4px;
|
|
||||||
min-height: 36px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
position: relative;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
img{
|
|
||||||
width: 90%;
|
|
||||||
display: block;
|
|
||||||
margin: 10px 0;
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
button{
|
|
||||||
margin-top: 10px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.row-bg {
|
|
||||||
padding: 10px 0;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,230 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="component-upload-image">
|
|
||||||
<el-upload
|
|
||||||
multiple
|
|
||||||
:action="uploadImgUrl"
|
|
||||||
list-type="picture-card"
|
|
||||||
:on-success="handleUploadSuccess"
|
|
||||||
:before-upload="handleBeforeUpload"
|
|
||||||
:limit="limit"
|
|
||||||
:on-error="handleUploadError"
|
|
||||||
:on-exceed="handleExceed"
|
|
||||||
ref="imageUpload"
|
|
||||||
:on-remove="handleDelete"
|
|
||||||
:show-file-list="true"
|
|
||||||
:headers="headers"
|
|
||||||
:file-list="fileList"
|
|
||||||
:on-preview="handlePictureCardPreview"
|
|
||||||
:class="{ hide: this.fileList.length >= this.limit }"
|
|
||||||
>
|
|
||||||
<i class="el-icon-plus"></i>
|
|
||||||
</el-upload>
|
|
||||||
|
|
||||||
<!-- 上传提示 -->
|
|
||||||
<div class="el-upload__tip" slot="tip" v-if="showTip">
|
|
||||||
请上传
|
|
||||||
<template v-if="fileSize">
|
|
||||||
大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b>
|
|
||||||
</template>
|
|
||||||
<template v-if="fileType">
|
|
||||||
格式为 <b style="color: #f56c6c">{{ fileType.join("/") }}</b>
|
|
||||||
</template>
|
|
||||||
的文件
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-dialog
|
|
||||||
:visible.sync="dialogVisible"
|
|
||||||
title="预览"
|
|
||||||
width="800"
|
|
||||||
append-to-body
|
|
||||||
>
|
|
||||||
<img
|
|
||||||
:src="dialogImageUrl"
|
|
||||||
style="display: block; max-width: 100%; margin: 0 auto"
|
|
||||||
/>
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// import { getToken } from "@/utils/auth";
|
|
||||||
|
|
||||||
export default {
|
|
||||||
props: {
|
|
||||||
value: [String, Object, Array],
|
|
||||||
// 图片数量限制
|
|
||||||
limit: {
|
|
||||||
type: Number,
|
|
||||||
default: 2,
|
|
||||||
},
|
|
||||||
// 大小限制(MB)
|
|
||||||
fileSize: {
|
|
||||||
type: Number,
|
|
||||||
default: 5,
|
|
||||||
},
|
|
||||||
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
|
||||||
fileType: {
|
|
||||||
type: Array,
|
|
||||||
default: () => ["png", "jpg", "jpeg"],
|
|
||||||
},
|
|
||||||
// 是否显示提示
|
|
||||||
isShowTip: {
|
|
||||||
type: Boolean,
|
|
||||||
default: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
number: 0,
|
|
||||||
uploadList: [],
|
|
||||||
dialogImageUrl: "",
|
|
||||||
dialogVisible: false,
|
|
||||||
hideUpload: false,
|
|
||||||
uploadImgUrl:
|
|
||||||
"https://9miao.fun:6838/prod-api" + "/common/alibabaUpload", // 上传的图片服务器地址
|
|
||||||
headers: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
saToken: localStorage.getItem("token"),
|
|
||||||
},
|
|
||||||
fileList: [],
|
|
||||||
};
|
|
||||||
},
|
|
||||||
watch: {
|
|
||||||
value: {
|
|
||||||
handler(val) {
|
|
||||||
if (val) {
|
|
||||||
// 首先将值转为数组
|
|
||||||
console.log(val);
|
|
||||||
const list = Array.isArray(val) ? val : val;
|
|
||||||
// 然后将数组转为对象数组
|
|
||||||
this.fileList = list.map((item) => {
|
|
||||||
if (typeof item === "string") {
|
|
||||||
console.log(item);
|
|
||||||
if (item.indexOf(this.baseUrl) === -1) {
|
|
||||||
item = { name: item, item };
|
|
||||||
} else {
|
|
||||||
item = { name: item, url: item };
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return item;
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
this.fileList = [];
|
|
||||||
return [];
|
|
||||||
}
|
|
||||||
},
|
|
||||||
deep: true,
|
|
||||||
immediate: true,
|
|
||||||
},
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
// 是否显示提示
|
|
||||||
showTip() {
|
|
||||||
return this.isShowTip && (this.fileType || this.fileSize);
|
|
||||||
},
|
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
// 上传前loading加载
|
|
||||||
handleBeforeUpload(file) {
|
|
||||||
let isImg = false;
|
|
||||||
if (this.fileType.length) {
|
|
||||||
let fileExtension = "";
|
|
||||||
if (file.name.lastIndexOf(".") > -1) {
|
|
||||||
fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1);
|
|
||||||
}
|
|
||||||
isImg = this.fileType.some((type) => {
|
|
||||||
if (file.type.indexOf(type) > -1) return true;
|
|
||||||
if (fileExtension && fileExtension.indexOf(type) > -1) return true;
|
|
||||||
return false;
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
isImg = file.type.indexOf("image") > -1;
|
|
||||||
}
|
|
||||||
const isJPG = file.type === "image/jpeg";
|
|
||||||
const isLt2M = file.size / 1024 / 1024 < 2;
|
|
||||||
if (!isJPG) {
|
|
||||||
this.$message.error("上传头像图片只能是 JPG 格式!");
|
|
||||||
}
|
|
||||||
if (!isLt2M) {
|
|
||||||
this.$message.error("上传头像图片大小不能超过 2MB!");
|
|
||||||
}
|
|
||||||
this.number++;
|
|
||||||
return isJPG && isLt2M;
|
|
||||||
},
|
|
||||||
// 文件个数超出
|
|
||||||
handleExceed() {
|
|
||||||
// this.$modal.msgError(`上传文件数量不能超过 ${this.limit} 个!`);
|
|
||||||
},
|
|
||||||
// 上传成功回调
|
|
||||||
handleUploadSuccess(res, file) {
|
|
||||||
if (res.code === 200) {
|
|
||||||
this.uploadList.push({ name: res.fileName, url: res.fileName });
|
|
||||||
this.uploadedSuccessfully();
|
|
||||||
} else {
|
|
||||||
this.number--;
|
|
||||||
// this.$modal.closeLoading();
|
|
||||||
// this.$modal.msgError(res.msg);
|
|
||||||
this.$refs.imageUpload.handleRemove(file);
|
|
||||||
this.uploadedSuccessfully();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
// 删除图片
|
|
||||||
handleDelete(file) {
|
|
||||||
const findex = this.fileList.map((f) => f.name).indexOf(file.name);
|
|
||||||
if (findex > -1) {
|
|
||||||
this.fileList.splice(findex, 1);
|
|
||||||
this.$emit("input", this.listToString(this.fileList));
|
|
||||||
}
|
|
||||||
},
|
|
||||||
// 上传失败
|
|
||||||
handleUploadError() {
|
|
||||||
// this.$modal.msgError("上传图片失败，请重试");
|
|
||||||
// this.$modal.closeLoading();
|
|
||||||
},
|
|
||||||
// 上传结束处理
|
|
||||||
uploadedSuccessfully() {
|
|
||||||
if (this.number > 0 && this.uploadList.length === this.number) {
|
|
||||||
this.fileList = this.fileList.concat(this.uploadList);
|
|
||||||
this.uploadList = [];
|
|
||||||
this.number = 0;
|
|
||||||
this.$emit("input", this.listToString(this.fileList));
|
|
||||||
// this.$modal.closeLoading();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
// 预览
|
|
||||||
handlePictureCardPreview(file) {
|
|
||||||
this.dialogImageUrl = file.url;
|
|
||||||
this.dialogVisible = true;
|
|
||||||
},
|
|
||||||
// 对象转成指定字符串分隔
|
|
||||||
listToString(list, separator) {
|
|
||||||
let strs = "";
|
|
||||||
separator = separator || ",";
|
|
||||||
for (let i in list) {
|
|
||||||
if (list[i].url) {
|
|
||||||
strs += list[i].url.replace(this.baseUrl, "") + separator;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
return strs != "" ? strs.substr(0, strs.length - 1) : "";
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style scoped lang="less">
|
|
||||||
// .el-upload--picture-card 控制加号部分
|
|
||||||
::v-deep.hide .el-upload--picture-card {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
// 去掉动画效果
|
|
||||||
::v-deep .el-list-enter-active,
|
|
||||||
::v-deep .el-list-leave-active {
|
|
||||||
transition: all 0s;
|
|
||||||
}
|
|
||||||
|
|
||||||
::v-deep .el-list-enter,
|
|
||||||
.el-list-leave-active {
|
|
||||||
opacity: 0;
|
|
||||||
transform: translateY(0);
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
|
|
@ -1,456 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="box">
|
|
||||||
<div class="content">
|
|
||||||
<div class="btn">
|
|
||||||
<p @click="send">发布题目</p>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="container">
|
|
||||||
<div class="title">题目推荐</div>
|
|
||||||
|
|
||||||
<div class="item" v-for="(item, index) in list" :key="index">
|
|
||||||
<img :src="item.questionImage" alt="" />
|
|
||||||
<div class="item_box">
|
|
||||||
<p>{{ item.questionTitle }}</p>
|
|
||||||
<p>{{ item.content }}</p>
|
|
||||||
<div class="bottom_item">
|
|
||||||
<p class="time">{{ item.questionTitle }} 发布于 {{ item.createTime }}</p>
|
|
||||||
<div class="btns">
|
|
||||||
<p @click="answer(item.id)">答题</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<el-dialog
|
|
||||||
title="发布题目"
|
|
||||||
:visible.sync="dialogVisible"
|
|
||||||
width="40%"
|
|
||||||
:before-close="handleClose"
|
|
||||||
>
|
|
||||||
<!-- <p style="text-align: center;">发布题目</p> -->
|
|
||||||
<el-upload
|
|
||||||
class="avatar-uploader"
|
|
||||||
action="https://9miao.fun:6838/prod-api/common/alibabaUpload"
|
|
||||||
:show-file-list="false"
|
|
||||||
:on-success="handleAvatarSuccess"
|
|
||||||
:headers="headerObj"
|
|
||||||
>
|
|
||||||
<!--
|
|
||||||
:before-upload="beforeAvatarUpload"-->
|
|
||||||
<img v-if="imageUrl" :src="imageUrl" class="avatar" />
|
|
||||||
<i v-else class="el-icon-plus avatar-uploader-icon"></i>
|
|
||||||
</el-upload>
|
|
||||||
<span slot="footer" class="dialog-footer">
|
|
||||||
<el-form ref="form" :model="form" label-width="80px">
|
|
||||||
<el-form-item label="题目名称">
|
|
||||||
<el-input v-model="form.questionTitle"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="发布人">
|
|
||||||
<el-input v-model="form.name"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="发布内容">
|
|
||||||
<el-input v-model="form.content"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="选项A">
|
|
||||||
<el-input v-model="form.content1"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="选项B">
|
|
||||||
<el-input v-model="form.content2"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="选项C">
|
|
||||||
<el-input v-model="form.content3"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="选项D">
|
|
||||||
<el-input v-model="form.content4"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="正确选项">
|
|
||||||
<el-input placeholder="A,B,C,D" v-model="form.isCorrect"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
|
||||||
<el-button type="primary" @click="upload">确 定</el-button>
|
|
||||||
</span>
|
|
||||||
</el-dialog>
|
|
||||||
|
|
||||||
<el-dialog
|
|
||||||
title="答题"
|
|
||||||
:visible.sync="dialogVisible1"
|
|
||||||
width="30%"
|
|
||||||
:before-close="handleClose"
|
|
||||||
>
|
|
||||||
<div class="radio">
|
|
||||||
<el-radio v-for="(iteme,ind) in sublist" v-model="radio" :key="ind" :label="iteme.optionName">{{iteme.content}}</el-radio>
|
|
||||||
</div>
|
|
||||||
<span slot="footer" class="dialog-footer">
|
|
||||||
<el-button @click="dialogVisible = false">取 消</el-button>
|
|
||||||
<el-button type="primary" @click="uploads">确 定</el-button>
|
|
||||||
</span>
|
|
||||||
</el-dialog>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { apiServe } from '@/api/api.js'
|
|
||||||
export default {
|
|
||||||
name: "WenhuaWebuiZhiShi",
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
list: [
|
|
||||||
],
|
|
||||||
headerObj: {
|
|
||||||
"Content-Type": "application/json",
|
|
||||||
"saToken" : localStorage.getItem('token')
|
|
||||||
},
|
|
||||||
dialogVisible: false,
|
|
||||||
|
|
||||||
dialogVisible1: false,
|
|
||||||
|
|
||||||
form: {},
|
|
||||||
|
|
||||||
imageUrl: "",
|
|
||||||
|
|
||||||
radio: "",
|
|
||||||
sublist:'',
|
|
||||||
radioList:''
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {
|
|
||||||
let token = localStorage.getItem('token')
|
|
||||||
console.log(token);
|
|
||||||
if(!token){
|
|
||||||
if(!token){
|
|
||||||
this.$confirm("您还未登录，是否前去登录?", "提示", {
|
|
||||||
confirmButtonText: "确定",
|
|
||||||
cancelButtonText: "取消",
|
|
||||||
type: "warning",
|
|
||||||
})
|
|
||||||
.then(() => {
|
|
||||||
// 跳转登录
|
|
||||||
this.$router.push("/login");
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
this.$message({
|
|
||||||
type: "info",
|
|
||||||
message: "已取消",
|
|
||||||
});
|
|
||||||
this.$router.push("/");
|
|
||||||
});
|
|
||||||
}
|
|
||||||
}
|
|
||||||
this.searchUser()
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
send() {
|
|
||||||
this.dialogVisible = true;
|
|
||||||
},
|
|
||||||
searchUser() {
|
|
||||||
|
|
||||||
apiServe.getWishData('').then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
this.list = res.data.data
|
|
||||||
});
|
|
||||||
},
|
|
||||||
handleClose(done) {
|
|
||||||
this.$confirm("确认关闭？")
|
|
||||||
.then((_) => {
|
|
||||||
done();
|
|
||||||
})
|
|
||||||
.catch((_) => {});
|
|
||||||
},
|
|
||||||
|
|
||||||
handleAvatarSuccess(res, file) {
|
|
||||||
this.imageUrl = URL.createObjectURL(file.raw);
|
|
||||||
console.log(this.imageUrl);
|
|
||||||
},
|
|
||||||
|
|
||||||
upload() {
|
|
||||||
console.log(this.form,"this.form")
|
|
||||||
const isCorrect ="选项"+this.form.isCorrect
|
|
||||||
let a;
|
|
||||||
if(isCorrect ==="选项A") {
|
|
||||||
a = "Option 1"
|
|
||||||
}
|
|
||||||
if(isCorrect ==="选项B") {
|
|
||||||
a = "Option 2"
|
|
||||||
}
|
|
||||||
if(isCorrect ==="选项C") {
|
|
||||||
a = "Option 3"
|
|
||||||
}
|
|
||||||
if(isCorrect ==="选项D") {
|
|
||||||
a = "Option 4"
|
|
||||||
}
|
|
||||||
console.log(a === "Option 1","a表天")
|
|
||||||
// 若验证成功 此时应该调登录接口
|
|
||||||
let data = {
|
|
||||||
questionTitle: this.form.questionTitle,
|
|
||||||
questionImage: this.imageUrl,
|
|
||||||
content: this.form.content,
|
|
||||||
optionReqVo:[
|
|
||||||
{
|
|
||||||
"optionName":"Option 1",
|
|
||||||
"questionId": 1,
|
|
||||||
"content":this.form.content1,
|
|
||||||
"isCorrect": a === "Option 1"? 1 : 0,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"optionName":"Option 2",
|
|
||||||
"questionId": 2,
|
|
||||||
"content":this.form.content2,
|
|
||||||
"isCorrect": a === "Option 2"? 1 : 0,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"optionName":"Option 3",
|
|
||||||
"questionId": 3,
|
|
||||||
"content":this.form.content3,
|
|
||||||
"isCorrect": a === "Option 3"? 1 : 0,
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"optionName":"Option 4",
|
|
||||||
"questionId": 4,
|
|
||||||
"content":this.form.content4,
|
|
||||||
"isCorrect": a === "Option 4"? 1 : 0,
|
|
||||||
}
|
|
||||||
]
|
|
||||||
|
|
||||||
}
|
|
||||||
apiServe.getWish(data).then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
this.$message({
|
|
||||||
message: '发布成功',
|
|
||||||
type: 'success'
|
|
||||||
})
|
|
||||||
setTimeout(() => {
|
|
||||||
this.dialogVisible = false;
|
|
||||||
location.reload();
|
|
||||||
}, 1000);
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
this.dialogVisible = false;
|
|
||||||
}, 1000);
|
|
||||||
},
|
|
||||||
|
|
||||||
uploads() {
|
|
||||||
var id;
|
|
||||||
this.sublist.forEach(item => {
|
|
||||||
if(item.optionName === this.radio) {
|
|
||||||
// console.log(item,'items')
|
|
||||||
id = item.id
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
||||||
apiServe.getwishdt(id).then((res) => {
|
|
||||||
// console.log(res,"res ZHIshi");
|
|
||||||
if(res.data.data) {
|
|
||||||
this.$message({
|
|
||||||
message: "答题成功",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
}else {
|
|
||||||
this.$message({
|
|
||||||
message: "错误",
|
|
||||||
type: "warning",
|
|
||||||
});
|
|
||||||
}
|
|
||||||
|
|
||||||
setTimeout(() => {
|
|
||||||
this.dialogVisible1 = false;
|
|
||||||
}, 1000);
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
},
|
|
||||||
|
|
||||||
answer(id) {
|
|
||||||
apiServe.getwishxx(id).then((res) => {
|
|
||||||
console.log(res,"getWishXX");
|
|
||||||
this.sublist = res.data.data
|
|
||||||
});
|
|
||||||
this.dialogVisible1 = true;
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="less">
|
|
||||||
.box::v-deep {
|
|
||||||
height: 100%;
|
|
||||||
// background-color: #ccc;
|
|
||||||
padding: 50px 60px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.content {
|
|
||||||
width: 1000px;
|
|
||||||
// height: 300px;
|
|
||||||
background-color: #ffffff;
|
|
||||||
padding: 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
border-radius: 5px;
|
|
||||||
|
|
||||||
.radio {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
// align-items: c;
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btn {
|
|
||||||
// width: 100px;
|
|
||||||
// background-color: rgba(0, 0, 0, alpha);
|
|
||||||
// padding: 15px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
|
|
||||||
p {
|
|
||||||
width: 150px;
|
|
||||||
height: 40px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 40px;
|
|
||||||
background-color: rgba(22, 155, 213, 1);
|
|
||||||
font-size: 14px;
|
|
||||||
border-radius: 7px;
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.title {
|
|
||||||
margin-top: 20px;
|
|
||||||
// margin-left: 30px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
color: #333;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item {
|
|
||||||
width: 100%;
|
|
||||||
display: flex;
|
|
||||||
// align-items: center;
|
|
||||||
padding: 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
background-color: #ffffff;
|
|
||||||
border-radius: 10px;
|
|
||||||
margin-bottom: 20px;
|
|
||||||
position: relative;
|
|
||||||
margin-top: 20px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 120px;
|
|
||||||
height: 120px;
|
|
||||||
border-radius: 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item_box {
|
|
||||||
margin-left: 20px;
|
|
||||||
|
|
||||||
.options {
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
|
|
||||||
.el-radio {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.bottom {
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
p:first-child {
|
|
||||||
margin-bottom: 5px;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
|
|
||||||
p:nth-child(2) {
|
|
||||||
// margin-bottom: 30px;
|
|
||||||
// width: 600px;
|
|
||||||
font-size: 16px;
|
|
||||||
color: #979797;
|
|
||||||
display: -webkit-box;
|
|
||||||
overflow: hidden;
|
|
||||||
-webkit-box-orient: vertical;
|
|
||||||
text-overflow: ellipsis;
|
|
||||||
-webkit-line-clamp: 3; //显示几行
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.bottom_item {
|
|
||||||
width: 600px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: space-between;
|
|
||||||
position: absolute;
|
|
||||||
bottom: 10px;
|
|
||||||
right: 30px;
|
|
||||||
// position: relative;
|
|
||||||
|
|
||||||
.time {
|
|
||||||
font-size: 14px !important;
|
|
||||||
color: #ffffff;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btns {
|
|
||||||
// width: 100px;
|
|
||||||
// background-color: rgba(0, 0, 0, alpha);
|
|
||||||
// padding: 15px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
|
|
||||||
p {
|
|
||||||
width: 100px;
|
|
||||||
height: 30px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 30px;
|
|
||||||
background-color: rgba(22, 155, 213, 1);
|
|
||||||
font-size: 10px;
|
|
||||||
border-radius: 7px;
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
.avatar-uploader .el-upload {
|
|
||||||
border: 1px dashed #d9d9d9;
|
|
||||||
border-radius: 6px;
|
|
||||||
cursor: pointer;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
}
|
|
||||||
.avatar-uploader .el-upload:hover {
|
|
||||||
border-color: #409eff;
|
|
||||||
}
|
|
||||||
.avatar-uploader-icon {
|
|
||||||
font-size: 28px;
|
|
||||||
color: #8c939d;
|
|
||||||
width: 178px;
|
|
||||||
height: 178px;
|
|
||||||
line-height: 178px;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
.avatar {
|
|
||||||
width: 178px;
|
|
||||||
height: 178px;
|
|
||||||
display: block;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,320 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="box">
|
|
||||||
<div class="content">
|
|
||||||
<div class="title">
|
|
||||||
<img src="../../assets/56.jpg" alt="" />
|
|
||||||
<p>厄斐琉斯</p>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="item_title">{{ this.list.cultureTitle }}</div>
|
|
||||||
<div class="item_content" v-html="this.list.cultureContent"></div>
|
|
||||||
<div class="imgs">
|
|
||||||
<img :src="this.list.cultureImage" />
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="search">
|
|
||||||
<input type="text" placeholder="说点什么吧！！！~~~~" v-model="commentContent" />
|
|
||||||
<div class="btns">
|
|
||||||
<p @click="answer">发送评论</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="answerList">
|
|
||||||
<div class="item_answer" v-for="(item, index) in answerList" :key="index">
|
|
||||||
<div class="title">
|
|
||||||
<img src="../../assets/56.jpg" alt="" />
|
|
||||||
<div>
|
|
||||||
<p>{{ item.name }}</p>
|
|
||||||
<p style="margin-top: 10px">{{ item.likeNum }}</p>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="item">
|
|
||||||
<div class="item_content">{{ item.commentContent }}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { apiServe } from '@/api/api';
|
|
||||||
export default {
|
|
||||||
name: "WenhuaWebuiZhiShiDesc",
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
id:null,
|
|
||||||
uid:null,
|
|
||||||
list:[],
|
|
||||||
answerList:[],
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
created() {
|
|
||||||
// 从路由的 query 中获取参数
|
|
||||||
this.id = this.$route.query.id;
|
|
||||||
this.uid = localStorage.getItem('userid')
|
|
||||||
},
|
|
||||||
mounted() {
|
|
||||||
this.searchUser()
|
|
||||||
this.pinglist()
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
searchUser() {
|
|
||||||
|
|
||||||
apiServe.Clwh(this.id).then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
this.list = res.data.data
|
|
||||||
});
|
|
||||||
},
|
|
||||||
pinglist() {
|
|
||||||
apiServe.pinglun(this.id).then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
this.answerList = res.data.data
|
|
||||||
});
|
|
||||||
},
|
|
||||||
answer() {
|
|
||||||
let cdata = {
|
|
||||||
commentContent:this.commentContent,
|
|
||||||
id:this.uid,
|
|
||||||
cid: this.id
|
|
||||||
|
|
||||||
}
|
|
||||||
apiServe.addpinglun(cdata).then((res) => {
|
|
||||||
console.log(res);
|
|
||||||
this.$message({
|
|
||||||
message: "评论成功！",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
setTimeout(() => {
|
|
||||||
|
|
||||||
location.reload();
|
|
||||||
}, 1000);
|
|
||||||
});
|
|
||||||
|
|
||||||
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped lang="less">
|
|
||||||
.box::v-deep {
|
|
||||||
width: 100%;
|
|
||||||
// height: 100vh;
|
|
||||||
// background-color: #ccc;
|
|
||||||
padding: 60px 60px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.content {
|
|
||||||
width: 1200px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
background-color: #fff;
|
|
||||||
padding: 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 5px;
|
|
||||||
// margin-left: 30px;
|
|
||||||
|
|
||||||
.title {
|
|
||||||
display: flex;
|
|
||||||
// justify-content: ;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 60px;
|
|
||||||
height: 60px;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.item {
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.item_title {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 24px;
|
|
||||||
margin-top: 20px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item_content {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.imgs {
|
|
||||||
display: flex;
|
|
||||||
// justify-content: space-around;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 150px;
|
|
||||||
height: 120px;
|
|
||||||
border-radius: 5px;
|
|
||||||
margin-right: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.role {
|
|
||||||
text-align: right;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.total {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.role_item {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
margin-right: 15px;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 30px;
|
|
||||||
height: 30px;
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.search {
|
|
||||||
width: 1200px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
margin-top: 40px;
|
|
||||||
// margin-left: 30px;
|
|
||||||
|
|
||||||
input {
|
|
||||||
width: 500px;
|
|
||||||
height: 30px;
|
|
||||||
background-color: #ffffff;
|
|
||||||
border-radius: 5px;
|
|
||||||
border: 1px solid #ccc !important;
|
|
||||||
padding-left: 15px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
}
|
|
||||||
|
|
||||||
.btns {
|
|
||||||
// width: 100px;
|
|
||||||
// background-color: rgba(0, 0, 0, alpha);
|
|
||||||
// padding: 15px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin-left: 10px;
|
|
||||||
// position: absolute;
|
|
||||||
// right: 0;
|
|
||||||
|
|
||||||
p {
|
|
||||||
width: 100px;
|
|
||||||
height: 30px;
|
|
||||||
text-align: center;
|
|
||||||
line-height: 30px;
|
|
||||||
background-color: rgba(22, 155, 213, 1);
|
|
||||||
font-size: 10px;
|
|
||||||
border-radius: 7px;
|
|
||||||
color: #ffffff;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.answerList {
|
|
||||||
width: 1200px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
background-color: #fff;
|
|
||||||
padding: 20px 30px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
border-radius: 5px;
|
|
||||||
margin-top: 20px;
|
|
||||||
// margin-left: 50px;
|
|
||||||
|
|
||||||
.item_answer {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
border-bottom: 1px solid #EBEBEB;
|
|
||||||
padding: 10px 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.title {
|
|
||||||
display: flex;
|
|
||||||
// justify-content: ;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 60px;
|
|
||||||
height: 60px;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
|
||||||
|
|
||||||
p {
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.item {
|
|
||||||
width: 100%;
|
|
||||||
|
|
||||||
.item_title {
|
|
||||||
font-weight: bold;
|
|
||||||
font-size: 24px;
|
|
||||||
margin-top: 20px;
|
|
||||||
margin-bottom: 10px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.item_content {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
margin-top: 15px;
|
|
||||||
margin-left: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.imgs {
|
|
||||||
display: flex;
|
|
||||||
// justify-content: space-around;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 150px;
|
|
||||||
height: 120px;
|
|
||||||
border-radius: 5px;
|
|
||||||
margin-right: 15px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.role {
|
|
||||||
text-align: right;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.total {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.role_item {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
margin-right: 15px;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 30px;
|
|
||||||
height: 30px;
|
|
||||||
margin-right: 5px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,13 +0,0 @@
|
||||||
import Vue from 'vue'
|
|
||||||
import App from './App.vue'
|
|
||||||
import router from './router'
|
|
||||||
import store from './store'
|
|
||||||
import ElementUI from 'element-ui';
|
|
||||||
import 'element-ui/lib/theme-chalk/index.css';
|
|
||||||
Vue.config.productionTip = false
|
|
||||||
Vue.use(ElementUI);
|
|
||||||
new Vue({
|
|
||||||
router,
|
|
||||||
store,
|
|
||||||
render: h => h(App)
|
|
||||||
}).$mount('#app')
|
|
||||||
|
|
@ -1,37 +0,0 @@
|
||||||
import Vue from 'vue'
|
|
||||||
import VueRouter from 'vue-router'
|
|
||||||
import Login from '../views/Login.vue'
|
|
||||||
import register from '../views/register.vue'
|
|
||||||
import HomeHeader from '@/views/commonHeader.vue'
|
|
||||||
import list from './list'
|
|
||||||
import HomeMain from '@/components/index/VueIndex.vue'
|
|
||||||
Vue.use(VueRouter)
|
|
||||||
|
|
||||||
const routes = [
|
|
||||||
{
|
|
||||||
path: '/',
|
|
||||||
redirect: 'index',
|
|
||||||
components: {
|
|
||||||
default: HomeMain,
|
|
||||||
header: HomeHeader,
|
|
||||||
// footer: HomeFooter
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: '/login',
|
|
||||||
name: 'login',
|
|
||||||
component: Login
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: '/register',
|
|
||||||
name: 'register',
|
|
||||||
component: register
|
|
||||||
},
|
|
||||||
list,
|
|
||||||
]
|
|
||||||
|
|
||||||
const router = new VueRouter({
|
|
||||||
routes
|
|
||||||
})
|
|
||||||
|
|
||||||
export default router
|
|
||||||
|
|
@ -1,74 +0,0 @@
|
||||||
export default {
|
|
||||||
// 定义路径
|
|
||||||
path: '/',
|
|
||||||
name: 'home',
|
|
||||||
// 动态引入路由 路由的懒加载
|
|
||||||
component: () => import('@/views/HomeView.vue'),
|
|
||||||
// 给indedx定义二级路由
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
path: 'index',
|
|
||||||
name: 'index',
|
|
||||||
// 动态引入路由 路由的懒加载
|
|
||||||
component: () => import("@/components/index/VueIndex.vue"),
|
|
||||||
meta: {
|
|
||||||
title: '首页'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'zhishi',
|
|
||||||
name: 'zhishi',
|
|
||||||
// 动态引入路由 路由的懒加载
|
|
||||||
component: () => import("@/components/zhishi/ZhiShi.vue"),
|
|
||||||
meta: {
|
|
||||||
title: '文化小知识'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'desc',
|
|
||||||
name: 'desc',
|
|
||||||
// 动态引入路由 路由的懒加载
|
|
||||||
component: () => import("@/components/zhishi/ZhiShiDesc.vue"),
|
|
||||||
meta: {
|
|
||||||
title: '文化小知识详情'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'liuyan',
|
|
||||||
name: 'liuyan',
|
|
||||||
// 动态引入路由 路由的懒加载
|
|
||||||
component: () => import("@/components/liuyan/LiuYan.vue"),
|
|
||||||
meta: {
|
|
||||||
title: '留言'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'mine',
|
|
||||||
name: 'mine',
|
|
||||||
// 动态引入路由 路由的懒加载
|
|
||||||
component: () => import("@/components/mine/mine.vue"),
|
|
||||||
meta: {
|
|
||||||
title: '个人中心'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'question',
|
|
||||||
name: 'question',
|
|
||||||
// 动态引入路由 路由的懒加载
|
|
||||||
component: () => import("@/components/questDesc/questDesc.vue"),
|
|
||||||
meta: {
|
|
||||||
title: '答题详情'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
path: 'shop',
|
|
||||||
name: 'shop',
|
|
||||||
// 动态引入路由 路由的懒加载
|
|
||||||
component: () => import("@/components/shop/shop.vue"),
|
|
||||||
meta: {
|
|
||||||
title: '积分商城'
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|
@ -1,17 +0,0 @@
|
||||||
import Vue from 'vue'
|
|
||||||
import Vuex from 'vuex'
|
|
||||||
|
|
||||||
Vue.use(Vuex)
|
|
||||||
|
|
||||||
export default new Vuex.Store({
|
|
||||||
state: {
|
|
||||||
},
|
|
||||||
getters: {
|
|
||||||
},
|
|
||||||
mutations: {
|
|
||||||
},
|
|
||||||
actions: {
|
|
||||||
},
|
|
||||||
modules: {
|
|
||||||
}
|
|
||||||
})
|
|
||||||
|
|
@ -1,38 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="home">
|
|
||||||
<el-container>
|
|
||||||
<el-header>
|
|
||||||
<commonHeader></commonHeader>
|
|
||||||
</el-header>
|
|
||||||
<el-main>
|
|
||||||
<router-view></router-view>
|
|
||||||
</el-main>
|
|
||||||
</el-container>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
// @ is an alias to /src
|
|
||||||
import commonHeader from "./commonHeader";
|
|
||||||
export default {
|
|
||||||
name: "HomeView",
|
|
||||||
components: {
|
|
||||||
commonHeader,
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
<style scoped lang="less">
|
|
||||||
.home::v-deep {
|
|
||||||
.el-header {
|
|
||||||
// height: 100px;
|
|
||||||
// background-color: #ccc;
|
|
||||||
background-color: #ffffff;
|
|
||||||
padding-bottom: 20px;
|
|
||||||
}
|
|
||||||
.el-card__body,
|
|
||||||
.el-main {
|
|
||||||
padding: 0;
|
|
||||||
background-color: #F5F6F3;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,132 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="login">
|
|
||||||
<div class="login_box">
|
|
||||||
<h1>请登录账号</h1>
|
|
||||||
<el-form
|
|
||||||
:model="ruleForm"
|
|
||||||
:rules="rules"
|
|
||||||
ref="ruleForm"
|
|
||||||
label-width="60px"
|
|
||||||
class="demo-ruleForm"
|
|
||||||
>
|
|
||||||
<el-form-item label="账号" prop="userName">
|
|
||||||
<el-input v-model="ruleForm.userName"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="密码" prop="passWord">
|
|
||||||
<el-input v-model="ruleForm.passWord" show-password></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" @click="submitForm('ruleForm')">登录</el-button>
|
|
||||||
<el-button @click="resetForm('ruleForm')">重置</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
没有账号，请立即
|
|
||||||
<router-link to="/register">注册</router-link>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { apiServe } from '@/api/api.js'
|
|
||||||
export default {
|
|
||||||
name: "BYEsame2307DLogin",
|
|
||||||
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
ruleForm: {
|
|
||||||
userName: '',
|
|
||||||
passWord: ''
|
|
||||||
},
|
|
||||||
rules: {
|
|
||||||
userName: [
|
|
||||||
// required表示是否必填, message表示验证提示, trigger表示验证触发的方式
|
|
||||||
{
|
|
||||||
required: true, message: '请输入账号', trigger: 'blur'
|
|
||||||
}
|
|
||||||
],
|
|
||||||
passWord: [
|
|
||||||
// required表示是否必填, message表示验证提示, trigger表示验证触发的方式
|
|
||||||
{
|
|
||||||
required: true, message: '请输入密码', trigger: 'blur'
|
|
||||||
}
|
|
||||||
]
|
|
||||||
}
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
submitForm(formName) {
|
|
||||||
// this.$refs[formName] 相当于
|
|
||||||
// this.$refs['formName'] 相当于
|
|
||||||
// this.$refs.formName
|
|
||||||
|
|
||||||
// validate 对整个表单进行验证
|
|
||||||
this.$refs[formName].validate(async (valid) => {
|
|
||||||
if (valid) {
|
|
||||||
// 若验证成功 此时应该调登录接口
|
|
||||||
let data = {
|
|
||||||
username: this.ruleForm.userName,
|
|
||||||
password: this.ruleForm.passWord,
|
|
||||||
}
|
|
||||||
let res = await apiServe.login(data);
|
|
||||||
console.log(res,"LoginRes")
|
|
||||||
if (res.data.token.code == 200) {
|
|
||||||
console.log(res,"res");
|
|
||||||
localStorage.setItem('token', res?.data?.token?.data);
|
|
||||||
this.$message({
|
|
||||||
message: '登陆成功',
|
|
||||||
type: 'success'
|
|
||||||
})
|
|
||||||
this.$router.push('/')
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
console.log('表单验证失败');
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
resetForm(formName) {
|
|
||||||
// 对整个表单进行重置 将所有字段重置为初始值并移除校验
|
|
||||||
this.$refs[formName].resetFields();
|
|
||||||
}
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.login::v-deep {
|
|
||||||
height: 100vh;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
.login_box {
|
|
||||||
width: 350px;
|
|
||||||
height: 300px;
|
|
||||||
box-shadow: 0 0 20px #999;
|
|
||||||
padding: 0 20px;
|
|
||||||
h1 {
|
|
||||||
text-align: center;
|
|
||||||
padding: 20px 0;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form {
|
|
||||||
.el-form-item {
|
|
||||||
&:nth-child(3),
|
|
||||||
&:nth-child(4) {
|
|
||||||
text-align: center;
|
|
||||||
.el-form-item__content {
|
|
||||||
margin-left: 0 !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:nth-child(4) {
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,129 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="header">
|
|
||||||
<div class="container">
|
|
||||||
<h2>公众文化平台</h2>
|
|
||||||
<div class="box">
|
|
||||||
<el-menu :default-active="this.$route.path" router class="el-menu-demo" mode="horizontal"
|
|
||||||
>
|
|
||||||
<!-- @select="handleSelect"-->
|
|
||||||
<el-menu-item index="/index">首页</el-menu-item>
|
|
||||||
<el-menu-item index="/zhishi">文化小知识</el-menu-item>
|
|
||||||
<el-menu-item index="/liuyan">留言板</el-menu-item>
|
|
||||||
<el-menu-item index="/shop">积分商城</el-menu-item>
|
|
||||||
</el-menu>
|
|
||||||
<el-dropdown>
|
|
||||||
<el-dropdown-menu slot="dropdown" > </el-dropdown-menu>
|
|
||||||
<div class="ronde" @click="handleOut">
|
|
||||||
<img src="../assets/mine.png" alt="" v-if="!token" />
|
|
||||||
<img :src="img" alt="">
|
|
||||||
</div>
|
|
||||||
<el-dropdown-menu slot="dropdown" v-if="token">
|
|
||||||
<el-dropdown-item >
|
|
||||||
<a href="javascript:;" @click="gomine" >个人中心</a>
|
|
||||||
</el-dropdown-item>
|
|
||||||
</el-dropdown-menu>
|
|
||||||
</el-dropdown>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
userName: localStorage.getItem("userName"),
|
|
||||||
token: '',
|
|
||||||
img: ''
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {
|
|
||||||
this.token = localStorage.getItem('token')
|
|
||||||
this.img = localStorage.getItem('img')
|
|
||||||
// console.log(this.img, "this.img")
|
|
||||||
},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
handleOut() {
|
|
||||||
let token = localStorage.getItem('token')
|
|
||||||
console.log(token, "Tokens")
|
|
||||||
if (!token) {
|
|
||||||
this.$confirm("是否前去登录?", "提示", {
|
|
||||||
confirmButtonText: "确定",
|
|
||||||
cancelButtonText: "取消",
|
|
||||||
type: "warning",
|
|
||||||
})
|
|
||||||
.then(() => {
|
|
||||||
// 跳转登录
|
|
||||||
this.$router.push("/login");
|
|
||||||
})
|
|
||||||
.catch(() => {
|
|
||||||
this.$message({
|
|
||||||
type: "info",
|
|
||||||
message: "已取消",
|
|
||||||
});
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
handleClick() {
|
|
||||||
// this.$store.state.Collapse.isCollapse = !this.$store.state.Collapse.isCollapse
|
|
||||||
this.$store.commit(
|
|
||||||
"changeCollapse",
|
|
||||||
!this.$store.state.Collapse.isCollapse
|
|
||||||
);
|
|
||||||
},
|
|
||||||
// 触发全局组件 在vuex 中存储的状态
|
|
||||||
openUserDialog() {
|
|
||||||
this.$store.commit("changeDialogUserId", "");
|
|
||||||
this.$store.commit("changeDialogUserForm", true);
|
|
||||||
},
|
|
||||||
gomine() {
|
|
||||||
this.$router.push("/mine");
|
|
||||||
}
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.header {
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.container {
|
|
||||||
width: 1200px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.box {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
|
|
||||||
.el-menu-demo {
|
|
||||||
margin-right: 30px;
|
|
||||||
// background-color: #ccc;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.ronde {
|
|
||||||
width: 50px;
|
|
||||||
height: 50px;
|
|
||||||
border-radius: 50%;
|
|
||||||
background-color: #fff;
|
|
||||||
margin-right: 50px;
|
|
||||||
|
|
||||||
img {
|
|
||||||
width: 30px;
|
|
||||||
height: 30px;
|
|
||||||
margin-top: 10px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
span {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,184 +0,0 @@
|
||||||
<template>
|
|
||||||
<div class="register">
|
|
||||||
<div class="register_box">
|
|
||||||
<h1>请注册账号</h1>
|
|
||||||
<el-form
|
|
||||||
:model="ruleForm"
|
|
||||||
:rules="rules"
|
|
||||||
ref="ruleForm"
|
|
||||||
label-width="64px"
|
|
||||||
class="demo-ruleForm"
|
|
||||||
>
|
|
||||||
<el-form-item label="用户名" prop="userName">
|
|
||||||
<el-input v-model="ruleForm.userName"></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item label="密码" prop="passWord">
|
|
||||||
<el-input v-model="ruleForm.passWord" show-password></el-input>
|
|
||||||
</el-form-item>
|
|
||||||
<!-- <el-form-item label="管理员" prop="name">-->
|
|
||||||
<!-- <el-input v-model="ruleForm.name" ></el-input>-->
|
|
||||||
<!-- </el-form-item>-->
|
|
||||||
<el-form-item label="角色">
|
|
||||||
<el-select v-model="ruleForm.value2" clearable placeholder="请选择">
|
|
||||||
<el-option
|
|
||||||
v-for="item in role"
|
|
||||||
:key="item.value"
|
|
||||||
:label="item.label"
|
|
||||||
:value="item.value">
|
|
||||||
</el-option>
|
|
||||||
</el-select>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
<el-button type="primary" @click.enter="submitForm('ruleForm')"
|
|
||||||
>注册</el-button
|
|
||||||
>
|
|
||||||
<el-button @click="resetForm('ruleForm')">重置</el-button>
|
|
||||||
</el-form-item>
|
|
||||||
<el-form-item>
|
|
||||||
已有账号，请立即
|
|
||||||
<router-link to="/login">登录</router-link>
|
|
||||||
</el-form-item>
|
|
||||||
</el-form>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
import { apiServe } from "@/api/api.js";
|
|
||||||
export default {
|
|
||||||
data() {
|
|
||||||
return {
|
|
||||||
ruleForm: {
|
|
||||||
userName: "",
|
|
||||||
passWord: "",
|
|
||||||
name: "",
|
|
||||||
value2:""
|
|
||||||
},
|
|
||||||
role: [
|
|
||||||
{
|
|
||||||
value: "1",
|
|
||||||
label: "超级管理员",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: "2",
|
|
||||||
label: "管理员",
|
|
||||||
},
|
|
||||||
{
|
|
||||||
value: "3",
|
|
||||||
label: "普通用户",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
rules: {
|
|
||||||
userName: [
|
|
||||||
// required表示是否必填, message表示验证提示, trigger表示验证触发的方式
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: "请输入账号",
|
|
||||||
trigger: "blur",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
passWord: [
|
|
||||||
// required表示是否必填, message表示验证提示, trigger表示验证触发的方式
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: "请输入密码",
|
|
||||||
trigger: "blur",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
name: [
|
|
||||||
// required表示是否必填, message表示验证提示, trigger表示验证触发的方式
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: "请输入管理员名称",
|
|
||||||
trigger: "blur",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
role: [
|
|
||||||
// required表示是否必填, message表示验证提示, trigger表示验证触发的方式
|
|
||||||
{
|
|
||||||
required: true,
|
|
||||||
message: "请输入管理员名称",
|
|
||||||
trigger: "blur",
|
|
||||||
},
|
|
||||||
],
|
|
||||||
},
|
|
||||||
};
|
|
||||||
},
|
|
||||||
|
|
||||||
mounted() {},
|
|
||||||
|
|
||||||
methods: {
|
|
||||||
submitForm(formName) {
|
|
||||||
// this.$refs[formName] 相当于
|
|
||||||
// this.$refs['formName'] 相当于
|
|
||||||
// this.$refs.formName
|
|
||||||
// validate 对整个表单进行验证
|
|
||||||
this.$refs[formName].validate(async (valid) => {
|
|
||||||
if (valid) {
|
|
||||||
// 若验证成功 此时应该调登录接口
|
|
||||||
let data = {
|
|
||||||
username: this.ruleForm.userName,
|
|
||||||
password: this.ruleForm.passWord,
|
|
||||||
Authrizy:this.ruleForm.value2,
|
|
||||||
};
|
|
||||||
console.log(data);
|
|
||||||
let res = await apiServe.register(data);
|
|
||||||
if (res) {
|
|
||||||
this.$message({
|
|
||||||
message: "注册成功",
|
|
||||||
type: "success",
|
|
||||||
});
|
|
||||||
console.log(res,"RegisterRes")
|
|
||||||
this.$router.push("/login");
|
|
||||||
} else {
|
|
||||||
console.log("表单验证失败");
|
|
||||||
// return false
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
resetForm(formName) {
|
|
||||||
// 对整个表单进行重置 将所有字段重置为初始值并移除校验
|
|
||||||
this.$refs[formName].resetFields();
|
|
||||||
},
|
|
||||||
},
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style lang="less" scoped>
|
|
||||||
.register::v-deep {
|
|
||||||
height: 100vh;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
align-items: center;
|
|
||||||
.register_box {
|
|
||||||
width: 350px;
|
|
||||||
height: 415px;
|
|
||||||
box-shadow: 0 0 20px #999;
|
|
||||||
padding: 0 20px;
|
|
||||||
h1 {
|
|
||||||
text-align: center;
|
|
||||||
padding: 20px 0;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-form {
|
|
||||||
.el-form-item {
|
|
||||||
&:nth-child(5),
|
|
||||||
&:nth-child(6) {
|
|
||||||
text-align: center;
|
|
||||||
.el-form-item__content {
|
|
||||||
margin-left: 0 !important;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
&:nth-child(6) {
|
|
||||||
text-align: right;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.el-select {
|
|
||||||
width: 285px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
@ -1,4 +0,0 @@
|
||||||
const { defineConfig } = require('@vue/cli-service')
|
|
||||||
module.exports = defineConfig({
|
|
||||||
transpileDependencies: true
|
|
||||||
})
|
|
||||||
Loading…
Reference in New Issue