From 1861d195f7f3a7364c1099356858c94a6c0741e2 Mon Sep 17 00:00:00 2001
From: 明梦爽 <2972214568@qq.com>
Date: 星期三, 02 三月 2022 18:11:16 +0800
Subject: [PATCH] 所有功能实现
---
src/utils/request.js | 5
src/components/page/News.vue | 11
src/components/page/index.vue | 6
src/api/api.js | 73 ++++--
src/components/Administrator/Edit.vue | 128 ++++++++----
src/components/Administrator/AdEdit.vue | 156 +++++++++++++++
src/main.js | 2
src/components/Home.vue | 2
src/components/page/introduce.vue | 5
src/components/Administrator/EditLunBo.vue | 95 ++++++--
src/components/Administrator/Welcome.vue | 64 ++++++
11 files changed, 433 insertions(+), 114 deletions(-)
diff --git a/src/api/api.js b/src/api/api.js
index c867b16..e01e24d 100644
--- a/src/api/api.js
+++ b/src/api/api.js
@@ -20,69 +20,94 @@
export const getNewsList = data => {
return request({
method: 'POST',
- url:'/news/list',
- params:data,
+ url: '/news/list',
+ params: data,
})
}
//鑾峰彇鍙湁涓�绡囨柊闂�
export const getnew = data => {
return request({
method: 'GET',
- url:`/news/main/${data}`
+ url: `/news/main/${data}`
})
}
//淇敼鏂伴椈
export const update = data => {
return request({
- method:'POST',
- url:'/news/update',
- params:data,
+ method: 'POST',
+ url: '/news/update',
+ params: data,
})
}
//鍒犻櫎鏂伴椈
export const deleteNew = data => {
return request({
- method:'POST',
- url:'/news/delete',
- params:data,
+ method: 'POST',
+ url: '/news/delete',
+ params: data,
})
}
//妯＄硦鏌ヨ
export const fuzzy = data => {
return request({
- method:'POST',
- url:'/news/fuzzy',
- params:data,
+ method: 'POST',
+ url: '/news/fuzzy',
+ params: data,
})
}
//娣诲姞鏂伴椈
-export const add = data => {
+export const add = (data, fd) => {
return request({
- method:'POST',
- url:'/news/add',
- params:data
+ method: 'POST',
+ url: '/news/add',
+ params: data,
+ data: fd
})
}
//鐧诲綍
export const login = data => {
return request({
- method:'POST',
- url:'/login',
- params:data
+ method: 'POST',
+ url: '/login',
+ params: data
})
}
//鑾峰彇鏅�氱鐞嗗憳鍒楄〃
export const getmain = () => {
return request({
method: 'GET',
- url:'/admin/list'
+ url: '/admin/list'
})
}
//瓒呯淇敼鏅璐﹀彿瀵嗙爜
export const editAccount = data => {
return request({
- method:'POST',
- url:'/admin/updatePassword',
- params:data
+ method: 'POST',
+ url: '/admin/updatePassword',
+ params: data
})
-}
\ No newline at end of file
+}
+//鍒犻櫎鏅�氱鐞嗗憳
+export const deleteAd = data => {
+ return request({
+ method: 'POST',
+ url: '/admin/delete',
+ params: data
+ })
+}
+//娉ㄥ唽鏅�氱鐞嗗憳
+export const addAd = data => {
+ return request({
+ method: 'POST',
+ url: '/admin/add',
+ params: data
+ })
+}
+//鏂囦欢涓婁紶
+export const fileUpload = fd => {
+ return request({
+ method: 'POST',
+ url: '/uploading',
+ data: fd
+ })
+}
diff --git a/src/components/Administrator/AdEdit.vue b/src/components/Administrator/AdEdit.vue
index 665807a..a87374c 100644
--- a/src/components/Administrator/AdEdit.vue
+++ b/src/components/Administrator/AdEdit.vue
@@ -1,6 +1,7 @@
<template>
<div>
<el-card class="box-card">
+ <el-button type="primary" @click="add()" icon="el-icon-circle-plus" class='add'>娉ㄥ唽鏂扮殑绠＄悊鍛樿处鍙�</el-button>
<!-- 鏂伴椈琛ㄦ牸鍖哄煙 -->
<el-table
:data="tableData"
@@ -22,42 +23,187 @@
<template slot-scope="scope">
<!-- {{ scope.row.id }} -->
<div>
- <el-button type="success" @click="look(scope.row.id)">娣诲姞</el-button>
- <el-button type="warning" @click="showEditDialog(scope.row.id)">淇敼</el-button>
- <el-button type="info" @click="deleteNews(scope.row.id)">鍒犻櫎</el-button>
+ <el-button type="primary" @click="showEditDialog(scope.row.id)" icon="el-icon-edit"></el-button>
+ <el-button type="danger" @click="deleteAds(scope.row.id)" icon="el-icon-delete"></el-button>
</div>
</template>
</el-table-column>
</el-table>
</el-card>
+ <!-- 淇敼璐︽埛鐨勫璇濇 -->
+ <el-dialog
+ title="淇敼鏅�氱鐞嗗憳瀵嗙爜"
+ :visible.sync="editDialogVisible"
+ width="50%"
+ @close="editClose">
+ <!-- rules琛ㄥ崟楠岃瘉瑙勫垯锛宺ef褰撳墠琛ㄥ崟鐨勯獙璇佸璞� -->
+ <el-form ref="editFormRef" :model="editForm" label-width="80px" status-icon>
+ <el-form-item label="鐢ㄦ埛鍚�:">
+ <el-input v-model="editForm.username" prefix-icon="iconfont icon-user" placeholder="璇疯緭鍏ヨ处鍙�" clearable=""></el-input>
+ </el-form-item>
+ <el-form-item label="鏃у瘑鐮�:">
+ <el-input v-model="editForm.oldPassword" prefix-icon="iconfont icon-3702mima" type="password" show-password placeholder="璇疯緭鍏ユ棫瀵嗙爜"></el-input>
+ </el-form-item>
+ <el-form-item label="鏂板瘑鐮�:">
+ <el-input v-model="editForm.password" prefix-icon="iconfont icon-3702mima" type="password" show-password placeholder="璇疯緭鍏ユ柊瀵嗙爜"></el-input>
+ </el-form-item>
+ </el-form>
+ <span slot="footer" class="dialog-footer">
+ <el-button @click="cancel">鍙� 娑�</el-button>
+ <el-button type="primary" @click="subEdit()">纭� 瀹�</el-button>
+ </span>
+ </el-dialog>
+ <!-- 娣诲姞绠＄悊鍛樺璇濇 -->
+ <el-dialog
+ title="娣诲姞鏅�氱鐞嗗憳"
+ :visible.sync="addDialogVisible"
+ width="50%"
+ @close="addClose">
+ <!-- rules琛ㄥ崟楠岃瘉瑙勫垯锛宺ef褰撳墠琛ㄥ崟鐨勯獙璇佸璞� -->
+ <el-form ref="addFormRef" :model="addForm" label-width="80px" status-icon>
+ <el-form-item label="鐢ㄦ埛鍚�:">
+ <el-input v-model="addForm.username" prefix-icon="iconfont icon-user" placeholder="璇疯緭鍏ヨ处鍙�" clearable=""></el-input>
+ </el-form-item>
+ <el-form-item label="瀵嗙爜:">
+ <el-input v-model="addForm.password" prefix-icon="iconfont icon-3702mima" type="password" show-password placeholder="璇疯緭鍏ュ瘑鐮�"></el-input>
+ </el-form-item>
+ </el-form>
+ <span slot="footer" class="dialog-footer">
+ <el-button @click="canceladd">鍙� 娑�</el-button>
+ <el-button type="primary" @click="addEdit()">娉� 鍐�</el-button>
+ </span>
+ </el-dialog>
</div>
</template>
<script>
-import { getmain,editAccount } from '../../api/api'
+import { getmain,editAccount,deleteAd,addAd } from '../../api/api'
export default {
data() {
return {
tableData:[], //鏅�氱鐞嗗憳鍒楄〃
+ editDialogVisible:false,
+ addDialogVisible:false,
+ editForm:{ username:'',oldPassword:'',password:'' }, //淇敼琛ㄥ崟瀵硅薄
+ addForm:{ username:'',password:'' } //娣诲姞绠＄悊瀵硅薄
}
},
created(){
this.ready()
},
methods:{
+ //鑾峰彇閾虹鍒楄〃
ready(){
getmain().then(res => {
- console.log(res);
+ // console.log(res);
if(res.code == 200){
this.tableData = res.data
}
})
+ },
+ //灞曠ず缂栬緫瀵硅瘽妗�
+ showEditDialog(){
+ this.editDialogVisible = true
+ },
+ editClose(){
+ this.editForm.username = '';
+ this.editForm.oldPassword = '';
+ this.editForm.password = '';
+ },
+ cancel(){
+ this.editForm.username = '';
+ this.editForm.oldPassword = '';
+ this.editForm.password = '';
+ this.editDialogVisible = false
+ },
+ //缂栬緫纭畾浜嬩欢
+ subEdit(){
+ const data = {
+ username:this.editForm.username,
+ oldPassword:this.editForm.oldPassword,
+ password:this.editForm.password
+ }
+ editAccount(data).then(res => {
+ // console.log(res);
+ if(res.code == 200){
+ this.$message.success('璐︽埛淇敼鎴愬姛')
+ this.editDialogVisible = false
+ this.ready()
+ }else{
+ this.$message.error('璐︽埛淇敼澶辫触')
+ }
+ })
+ },
+ //鍒犻櫎鏅�氱鐞嗗憳
+ async deleteAds(id){
+ // console.log(id);
+ const res = await this.$confirm('姝ゆ搷浣滃皢姘镐箙鍒犻櫎璇ョ鐞嗚处鍙�, 鏄惁缁х画?', '鎻愮ず', {
+ confirmButtonText: '纭畾',
+ cancelButtonText: '鍙栨秷',
+ type: 'warning'
+ }).catch(err => {
+ return err
+ })
+ //濡傛灉鐢ㄦ埛鐐瑰嚮纭畾鍒欒繑鍥瀋onfirm
+ //濡傛灉鐢ㄦ埛鐐瑰嚮鍙栨秷鍒欒繑鍥瀋ancel
+ console.log(res);
+ if(res !== 'confirm'){
+ return this.$message.info('宸插彇娑堝垹闄')
+ }else{
+ // console.log(id);
+ const data = {
+ id:id
+ }
+ //鍙傛暟data 瑕佷互瀵硅薄鐨勫舰寮忎紶鍏�
+ deleteAd(data).then(res => {
+ // console.log('>>>'+res);
+ if(res.code == 200){
+ this.$message.success('鍒犻櫎鎴愬姛锛�')
+ this.ready()
+ }else{
+ return this.$message.error('鍒犻櫎澶辫触锛�')
+ }
+ })
+ }
+ },
+ add(){
+ this.addDialogVisible = true
+ },
+ //娉ㄥ唽鍙栨秷娓呯┖
+ canceladd(){
+ this.addForm.username = '';
+ this.addForm.password = '';
+ this.addDialogVisible = false
+ },
+ addClose(){
+ this.addForm.username = '';
+ this.addForm.password = '';
+ },
+ //娉ㄥ唽鎻愪氦
+ addEdit(){
+ const data = {
+ username:this.addForm.username,
+ password:this.addForm.password
+ }
+ addAd(data).then(res => {
+ if(res.code == 200){
+ this.$message.success('娉ㄥ唽鎴愬姛')
+ this.addDialogVisible = false
+ this.ready()
+ }else{
+ this.$message.error('娉ㄥ唽澶辫触')
+ }
+ })
+
}
}
}
</script>
<style lang="less" scoped>
+.add{
+ margin-bottom: 10px;
+}
</style>
\ No newline at end of file
diff --git a/src/components/Administrator/Edit.vue b/src/components/Administrator/Edit.vue
index 16e10cc..dce7624 100644
--- a/src/components/Administrator/Edit.vue
+++ b/src/components/Administrator/Edit.vue
@@ -3,31 +3,27 @@
<el-row><h3 style="margin-top: 0px">{{ $route.query.title }}</h3></el-row>
鏂伴椈鏍囬锛�<el-input v-model="title" placeholder="璇疯緭鍏ユ柊闂绘爣棰�"></el-input><br/><br/>
鍙戝竷鏃ユ湡锛�<el-date-picker format="yyyy 骞� MM 鏈� dd 鏃�" value-format="yyyy-MM-dd" v-model="releaseTime" placeholder="璇烽�夋嫨鏂伴椈鍙戝竷鏃ユ湡"></el-date-picker><br/><br/>
- <!-- <el-upload
- class="upload-demo"
- ref="upload"
- drag
- action
- :auto-upload="false"
- :http-request="httpRequest"
- multiple
- :file-list="fileList">
- <i class="el-icon-upload"></i>
- <div class="el-upload__text">灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em></div>
- <div class="el-upload__tip" slot="tip">鍙兘涓婁紶jpg/png鏂囦欢锛屼笖涓嶈秴杩�500kb</div>
- </el-upload><br/> -->
鏂伴椈鍐呭锛�<quill-editor ref="text" v-model="content" class="myQuillEditor" :options="editorOption" />
<el-row style="margin-top:50px;">
<el-button type="success" @click="submit">鍙戝竷</el-button>
+ <!-- <input type="file" @change="chooseFile"/><br/><br/>
+ <el-button type="success" @click="tijiao">鎻愪氦</el-button><br/><br/>
+ <img :src="'http://localhost:7070/'+this.photo" style="width: 400px"> -->
</el-row>
</div>
</template>
<script>
-import { add } from '../../api/api'
-import { quillEditor } from 'vue-quill-editor'
+import axios from 'axios'
+
+import { add,fileUpload, login } from '../../api/api'
+import {quillEditor,Quill} from 'vue-quill-editor'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
+import { container, ImageExtend,QuillWatch } from 'quill-image-extend-module'
+Quill.register('modules/ImageExtend', ImageExtend)
+axios.defaults.withCredentials = true;
+
export default {
components:{ quillEditor },
data(){
@@ -35,16 +31,58 @@
title:'', //鏍囬鍐呭
releaseTime:'', //鍙戝竷鏃ユ湡
content: '', //鏂伴椈鍐呭
+ picture:null,
+ photo:'',
newsCategoryId:2,
editorOption: {
placeholder: "璇疯緭鍏ユ鏂�",
- // editorOption閲屾槸鏀惧浘鐗囦笂浼犻厤缃弬鏁扮敤鐨勶紝渚嬪锛�
- action: '/api/product/richtext_img_upload.do', // 蹇呭～鍙傛暟 鍥剧墖涓婁紶鍦板潃
- methods: 'POST', // 蹇呭～鍙傛暟 鍥剧墖涓婁紶鏂瑰紡
- token: '', // 鍙�夊弬鏁� 濡傛灉闇�瑕乼oken楠岃瘉锛屽亣璁句綘鐨則oken鏈夊瓨鏀惧湪sessionStorage
- name: 'upload_file', // 蹇呭～鍙傛暟 鏂囦欢鐨勫弬鏁板悕
- size: 10000000, // 鍙�夊弬鏁� 鍥剧墖澶у皬锛屽崟浣嶄负Kb, 1M = 1024Kb
- accept: 'multipart/form-data, image/png, image/gif, image/jpeg, image/bmp, image/x-icon,image/jpg' // 鍙�� 鍙笂浼犵殑鍥剧墖鏍煎紡
+ modules: {
+ ImageExtend: { // 濡傛灉涓嶄綔璁剧疆锛屽嵆{} 鍒欎緷鐒跺紑鍚鍒剁矘璐村姛鑳戒笖浠ase64鎻掑叆
+ name: 'file', // 鍥剧墖鍙傛暟鍚�
+ loading: true,
+ size: 10, // 鍙�夊弬鏁� 鍥剧墖澶у皬锛屽崟浣嶄负M锛�1M = 1024kb
+ action:'http://localhost:7070/uploading',
+ response: (res) => {
+ console.log(res);
+ return 'http://localhost:7070/'+res.data
+ },
+ headers: (xhr) => {
+ // axios.defaults.withCredentials = true;
+ // xhr.setRequestHeader('Cookie','NMTID=00OVM6QOJcTDVhqDUtvgSnd-5FBxLcAAAF9nTiDHg; JSESSIONID=5ACC52D29A2434E09450CB975E08C288')
+ }, // 鍙�夊弬鏁� 璁剧疆璇锋眰澶撮儴
+ sizeError: () => {}, // 鍥剧墖瓒呰繃澶у皬鐨勫洖璋�
+ start: () => {}, // 鍙�夊弬鏁� 鑷畾涔夊紑濮嬩笂浼犺Е鍙戜簨浠�
+ end: () => {}, // 鍙�夊弬鏁� 鑷畾涔変笂浼犵粨鏉熻Е鍙戠殑浜嬩欢锛屾棤璁烘垚鍔熸垨鑰呭け璐�
+ error: () => {}, // 鍙�夊弬鏁� 涓婁紶澶辫触瑙﹀彂鐨勪簨浠�
+ success: () => {}, // 鍙�夊弬鏁� 涓婁紶鎴愬姛瑙﹀彂鐨勪簨浠�
+ change: (xhr, formData) => {
+ // formData.append('token', 'myToken')
+ } // 鍙�夊弬鏁� 姣忔閫夋嫨鍥剧墖瑙﹀彂锛屼篃鍙敤鏉ヨ缃ご閮紝浣嗘瘮headers澶氫簡涓�涓弬鏁帮紝鍙缃甪ormData
+ },
+ toolbar:{
+ container:[
+ ['bold', 'italic', 'underline', 'strike'], //鍔犵矖锛屾枩浣擄紝涓嬪垝绾匡紝鍒犻櫎绾�
+ ['blockquote', 'code-block'], //寮曠敤锛屼唬鐮佸潡
+ [{ 'header': 1 }, { 'header': 2 }], // 鏍囬锛岄敭鍊煎鐨勫舰寮忥紱1銆�2琛ㄧず瀛椾綋澶у皬
+ [{ 'list': 'ordered'}, { 'list': 'bullet' }], //鍒楄〃
+ [{ 'script': 'sub'}, { 'script': 'super' }], // 涓婁笅鏍�
+ [{ 'indent': '-1'}, { 'indent': '+1' }], // 缂╄繘
+ [{ 'direction': 'rtl' }], // 鏂囨湰鏂瑰悜
+ [{ 'size': ['small', false, 'large', 'huge'] }], // 瀛椾綋澶у皬
+ [{ 'header': [1, 2, 3, 4, 5, 6, false] }], //鍑犵骇鏍囬
+ [{ 'color': [] }, { 'background': [] }], // 瀛椾綋棰滆壊锛屽瓧浣撹儗鏅鑹�
+ [{ 'font': [] }], //瀛椾綋
+ [{ 'align': [] }], //瀵归綈鏂瑰紡
+ ['clean'], //娓呴櫎瀛椾綋鏍峰紡
+ ['image'] //涓婁紶鍥剧墖銆佷笂浼犺棰�
+ ],
+ handlers: {
+ 'image': function () { // 鍔寔鍘熸潵鐨勫浘鐗囩偣鍑绘寜閽簨浠�
+ QuillWatch.emit(this.quill.id)
+ }
+ }
+ },
+ },
} , //缂栬緫鍣ㄦ柊闂诲璞�
fileList:[],
}
@@ -53,40 +91,34 @@
// console.log('>>>>>>>',this.$route.query.id);
this.newsCategoryId = this.$route.query.id
},
+ mounted(){
+ },
methods:{
- // jsonData(formData){ var jsonData = {}; formData.forEach((value, key) => jsonData[key] = value); return jsonData },
- // httpRequest(params){
- // const pictureFile = params.file;
- // const newsCategoryId = this.newsCategoryId;
- // const content = this.content;
- // const title = this.title;
- // const releaseTime = this.releaseTime;
- // var formData = new FormData();
- // formData.append("pictureFile",pictureFile)
- // formData.append("newsCategoryId",newsCategoryId)
- // formData.append("content",content)
- // formData.append("title",title)
- // formData.append("releaseTime",releaseTime)
- // console.log(this.jsonData(formData));
- // add(this.jsonData(formData)).then(res => {
- // console.log(res);
- // if(res.code !== 200){
- // return this.$message.error('鍙戝竷鏂伴椈澶辫触锛岃閲嶈瘯锛�')
- // }else{
- // this.$message.success('鏂伴椈鍙戝竷鎴愬姛锛�')
- // console.log(this.content);
- // this.$router.go(-1)
+ // chooseFile(file){
+ // this.picture = file.target.files[0];
+ // console.log(this.picture)
+ // return false;
+ // },
+ // tijiao(){
+ // const fd = new FormData()
+ // fd.append('file',this.picture)
+ // fileUpload(fd).then(res => {
+ // console.log(res)
+ // if(res.code == 200){
+ // this.photo = res.data
+ // console.log(this.photo);
// }
// })
// },
submit(){
- // this.$refs.upload.submit();
const data = {
newsCategoryId:this.newsCategoryId,
content:this.content,
title:this.title,
releaseTime:this.releaseTime
}
+ console.log(this.content);
+ // console.log(this.newsCategoryId);
add(data).then(res => {
console.log(res);
if(res.code !== 200){
@@ -97,7 +129,7 @@
this.$router.go(-1)
}
})
- }
+ },
}
}
</script>
@@ -115,4 +147,8 @@
bottom: 20px;
left: 168px;
}
+.ql-editor img{
+ width: 100px !important;
+ height: 100px !important;
+}
</style>
\ No newline at end of file
diff --git a/src/components/Administrator/EditLunBo.vue b/src/components/Administrator/EditLunBo.vue
index 47900d7..b8ae69d 100644
--- a/src/components/Administrator/EditLunBo.vue
+++ b/src/components/Administrator/EditLunBo.vue
@@ -3,29 +3,23 @@
<el-row><h3 style="margin-top: 0px">{{ $route.query.title }}</h3></el-row>
鏂伴椈鏍囬锛�<el-input v-model="title" placeholder="璇疯緭鍏ユ柊闂绘爣棰�"></el-input><br/><br/>
鍙戝竷鏃ユ湡锛�<el-date-picker format="yyyy 骞� MM 鏈� dd 鏃�" value-format="yyyy-MM-dd" v-model="releaseTime" placeholder="璇烽�夋嫨鏂伴椈鍙戝竷鏃ユ湡"></el-date-picker><br/><br/>
- <el-upload
- class="upload-demo"
- drag
- action="http://localhost:8080//news/add"
- :on-remove="handleRemove"
- multiple>
- <i class="el-icon-upload"></i>
- <div class="el-upload__text">灏嗘枃浠舵嫋鍒版澶勶紝鎴�<em>鐐瑰嚮涓婁紶</em></div>
- <div class="el-upload__tip" slot="tip">鍙兘涓婁紶jpg/png鏂囦欢锛屼笖涓嶈秴杩�500kb</div>
- </el-upload><br/>
+ <input type="file" @change="chooseFile"/><br/><br/>
鏂伴椈鍐呭锛�<quill-editor ref="text" v-model="content" class="myQuillEditor" :options="editorOption" />
<el-row style="margin-top:50px;">
<el-button type="success" @click="submit">鍙戝竷</el-button>
</el-row>
- 杞挱鍥�
</div>
</template>
<script>
-import { add } from '../../api/api'
-import { quillEditor } from 'vue-quill-editor'
+import { add,fileUpload, login } from '../../api/api'
+import {quillEditor,Quill} from 'vue-quill-editor'
import 'quill/dist/quill.core.css'
import 'quill/dist/quill.snow.css'
import 'quill/dist/quill.bubble.css'
+import { container, ImageExtend,QuillWatch } from 'quill-image-extend-module'
+Quill.register('modules/ImageExtend', ImageExtend)
+// axios.defaults.withCredentials = true;
+
export default {
components:{ quillEditor },
data(){
@@ -33,17 +27,58 @@
title:'', //鏍囬鍐呭
releaseTime:'', //鍙戝竷鏃ユ湡
content: '', //鏂伴椈鍐呭
- newsCategoryId:2,
+ newsCategoryId:45,
editorOption: {
placeholder: "璇疯緭鍏ユ鏂�",
- // editorOption閲屾槸鏀惧浘鐗囦笂浼犻厤缃弬鏁扮敤鐨勶紝渚嬪锛�
- action: '/api/product/richtext_img_upload.do', // 蹇呭～鍙傛暟 鍥剧墖涓婁紶鍦板潃
- methods: 'POST', // 蹇呭～鍙傛暟 鍥剧墖涓婁紶鏂瑰紡
- token: '', // 鍙�夊弬鏁� 濡傛灉闇�瑕乼oken楠岃瘉锛屽亣璁句綘鐨則oken鏈夊瓨鏀惧湪sessionStorage
- name: 'upload_file', // 蹇呭～鍙傛暟 鏂囦欢鐨勫弬鏁板悕
- size: 10000000, // 鍙�夊弬鏁� 鍥剧墖澶у皬锛屽崟浣嶄负Kb, 1M = 1024Kb
- accept: 'multipart/form-data, image/png, image/gif, image/jpeg, image/bmp, image/x-icon,image/jpg' // 鍙�� 鍙笂浼犵殑鍥剧墖鏍煎紡
+ modules: {
+ ImageExtend: { // 濡傛灉涓嶄綔璁剧疆锛屽嵆{} 鍒欎緷鐒跺紑鍚鍒剁矘璐村姛鑳戒笖浠ase64鎻掑叆
+ name: 'file', // 鍥剧墖鍙傛暟鍚�
+ loading: true,
+ size: 10, // 鍙�夊弬鏁� 鍥剧墖澶у皬锛屽崟浣嶄负M锛�1M = 1024kb
+ action:'http://localhost:7070/uploading',
+ response: (res) => {
+ console.log(res);
+ return 'http://localhost:7070/'+res.data
+ },
+ headers: (xhr) => {
+ // axios.defaults.withCredentials = true;
+ // xhr.setRequestHeader('Cookie','NMTID=00OVM6QOJcTDVhqDUtvgSnd-5FBxLcAAAF9nTiDHg; JSESSIONID=5ACC52D29A2434E09450CB975E08C288')
+ }, // 鍙�夊弬鏁� 璁剧疆璇锋眰澶撮儴
+ sizeError: () => {}, // 鍥剧墖瓒呰繃澶у皬鐨勫洖璋�
+ start: () => {}, // 鍙�夊弬鏁� 鑷畾涔夊紑濮嬩笂浼犺Е鍙戜簨浠�
+ end: () => {}, // 鍙�夊弬鏁� 鑷畾涔変笂浼犵粨鏉熻Е鍙戠殑浜嬩欢锛屾棤璁烘垚鍔熸垨鑰呭け璐�
+ error: () => {}, // 鍙�夊弬鏁� 涓婁紶澶辫触瑙﹀彂鐨勪簨浠�
+ success: () => {}, // 鍙�夊弬鏁� 涓婁紶鎴愬姛瑙﹀彂鐨勪簨浠�
+ change: (xhr, formData) => {
+ // formData.append('token', 'myToken')
+ } // 鍙�夊弬鏁� 姣忔閫夋嫨鍥剧墖瑙﹀彂锛屼篃鍙敤鏉ヨ缃ご閮紝浣嗘瘮headers澶氫簡涓�涓弬鏁帮紝鍙缃甪ormData
+ },
+ toolbar:{
+ container:[
+ ['bold', 'italic', 'underline', 'strike'], //鍔犵矖锛屾枩浣擄紝涓嬪垝绾匡紝鍒犻櫎绾�
+ ['blockquote', 'code-block'], //寮曠敤锛屼唬鐮佸潡
+ [{ 'header': 1 }, { 'header': 2 }], // 鏍囬锛岄敭鍊煎鐨勫舰寮忥紱1銆�2琛ㄧず瀛椾綋澶у皬
+ [{ 'list': 'ordered'}, { 'list': 'bullet' }], //鍒楄〃
+ [{ 'script': 'sub'}, { 'script': 'super' }], // 涓婁笅鏍�
+ [{ 'indent': '-1'}, { 'indent': '+1' }], // 缂╄繘
+ [{ 'direction': 'rtl' }], // 鏂囨湰鏂瑰悜
+ [{ 'size': ['small', false, 'large', 'huge'] }], // 瀛椾綋澶у皬
+ [{ 'header': [1, 2, 3, 4, 5, 6, false] }], //鍑犵骇鏍囬
+ [{ 'color': [] }, { 'background': [] }], // 瀛椾綋棰滆壊锛屽瓧浣撹儗鏅鑹�
+ [{ 'font': [] }], //瀛椾綋
+ [{ 'align': [] }], //瀵归綈鏂瑰紡
+ ['clean'], //娓呴櫎瀛椾綋鏍峰紡
+ ['image'] //涓婁紶鍥剧墖銆佷笂浼犺棰�
+ ],
+ handlers: {
+ 'image': function () { // 鍔寔鍘熸潵鐨勫浘鐗囩偣鍑绘寜閽簨浠�
+ QuillWatch.emit(this.quill.id)
+ }
+ }
+ },
+ },
} , //缂栬緫鍣ㄦ柊闂诲璞�
+ fileList:[],
}
},
created(){
@@ -51,20 +86,26 @@
this.newsCategoryId = this.$route.query.id
},
methods:{
- handleRemove(file,fileList){
- console.log(file,fileList);
+ chooseFile(file) {
+ this.pictureFile = file.target.files[0];
+ console.log(this.pictureFile)
+ console.log(file);
+ return false;
},
submit(){
+ const fd = new FormData();
+ fd.append('pictureFile',this.pictureFile);
const data = {
newsCategoryId:this.newsCategoryId,
content:this.content,
- title:this.title,
releaseTime:this.releaseTime,
- pictureFile:this.file,
+ title:this.title
}
- add(data).then(res => {
+ // console.log(999)
+ add(data,fd).then(res => {
console.log(res);
- if(res.code !== 200){
+ console.log(this.newsCategoryId);
+ if (res.code != 200) {
return this.$message.error('鍙戝竷鏂伴椈澶辫触锛岃閲嶈瘯锛�')
}else{
this.$message.success('鏂伴椈鍙戝竷鎴愬姛锛�')
diff --git a/src/components/Administrator/Welcome.vue b/src/components/Administrator/Welcome.vue
index b46f470..8f99e0f 100644
--- a/src/components/Administrator/Welcome.vue
+++ b/src/components/Administrator/Welcome.vue
@@ -1,14 +1,74 @@
<template>
<div>
<h2>娆㈣繋杩涘叆鍚庡彴绠＄悊绯荤粺</h2>
+
+ <el-upload
+ ref="upload"
+ action
+ accept="image/*"
+ :limit= 3
+ :file-list='filelist'
+ list-type="picture-card"
+ :on-preview="handlePictureCardPreview"
+ :on-remove="handleRemove"
+ :http-request='upload'>
+ <i class="el-icon-plus"></i>
+ </el-upload>
+ <el-dialog :visible.sync="dialogVisible">
+ <img width="100%" :src="dialogImageUrl" alt="">
+ </el-dialog>
+ <el-button @click="save">淇濆瓨</el-button>
</div>
</template>
<script>
-
-
+import {fileUpload, update} from '../../api/api'
export default {
+ data() {
+ return {
+ // fileList: []
+ imageUrl:'',
+ filelist:[],
+ delList:[],
+ dialogVisible:false,
+ dialogImageUrl:'',
+ }
+ },
+ methods:{
+ save(){
+ //鍙栧埌鍥剧墖闆嗗悎
+ let uploadImglist = this.$refs.upload.uploadFiles
+ console.log(uploadImglist);
+ let formData = new FormData();
+ uploadImglist.forEach(item => {
+ //ready鐘舵�佺殑鏄湭涓婁紶鐨� success鏄凡缁忎笂浼犳垚鍔熺殑锛屽彧闇�瑕佹坊鍔犳湭涓婁紶鐨勫嵆鍙�
+ if(item.status == "ready"){
+ formData.append('file', item.raw);
+ }
+ });
+ formData.get('file')
+ fileUpload(formData).then(res=>{
+ //涓婁紶鎺ュ彛
+ console.log(res);
+ })
+ },
+ // 棰勮鍥剧墖
+ handlePictureCardPreview(file){
+ this.dialogVisible = true
+ this.dialogImageUrl=file.url
+ console.log(this.dialogImageUrl);
+ },
+ // 鍒犻櫎鍥剧墖
+ handleRemove(file){
+ //鍒ゆ柇鐘舵�侊紝濡傛灉鏄笂浼犳垚鍔熺殑 闇�瑕佹妸id鍔犲埌鍒犻櫎id闆嗗悎閲岄潰
+ if(file.status == 'success'){
+ this.delList.push(file.id)
+ }
+ },
+ upload(){
+ }
+ }
}
</script>
diff --git a/src/components/Home.vue b/src/components/Home.vue
index 7bafe07..3e42a65 100644
--- a/src/components/Home.vue
+++ b/src/components/Home.vue
@@ -45,7 +45,7 @@
// this.getNavArr();
},
mounted() {
- let api3 = 'http://localhost:8080/news_type/all'
+ let api3 = 'http://localhost:7070/news_type/all'
axios.get(api3).then((res)=>{
// console.log(res);
this.menuList2 = res.data.data
diff --git a/src/components/page/News.vue b/src/components/page/News.vue
index 3d576af..2914833 100644
--- a/src/components/page/News.vue
+++ b/src/components/page/News.vue
@@ -3,10 +3,10 @@
<!-- <p>{{ this.$route.query.id }}</p> -->
<div class="header">
<h2>{{ title }}</h2>
- <p>鍙戝竷鏃ユ湡锛歿{ releaseTime }} 鐐瑰嚮閲忥細[ {{hits}} ]</p>
+ <p>鍙戝竷鏃ユ湡锛歿{ releaseTime }} 鐐瑰嚮閲忥細[ {{(hits+1)/2}} ]</p>
</div>
<hr>
- <div v-html="content"></div>
+ <div v-html="content" class="ql-editor"></div>
</div>
</template>
<script>
@@ -54,4 +54,11 @@
height: 35px;
line-height: 35px;
}
+.ql-editor{
+ padding: 12px 0px !important;
+}
+.ql-editor img{
+ width: 600px;
+ height: 400px;
+}
</style>
\ No newline at end of file
diff --git a/src/components/page/index.vue b/src/components/page/index.vue
index 506c2ad..789723f 100644
--- a/src/components/page/index.vue
+++ b/src/components/page/index.vue
@@ -3,10 +3,10 @@
<!-- 棣栭〉涓婂崐閮ㄥ垎 -->
<el-row type="flex" class="row-bg" justify="space-between">
<div class="block marr10">
- <el-carousel height="460px" arrow="always" :interval="3000">
+ <el-carousel height="450px" arrow="always" :interval="3000">
<el-carousel-item v-for="(item,index) in imgList" :key="index">
- <div @click="gonew(item.id)" class="cursor">
- <img :src="'http://localhost:8080/'+item.picturePath" alt="" style="width:105%;">
+ <div @click="gonew(item.id)" class="cursor" style="width:590px; height:450px">
+ <img :src="'http://localhost:7070/'+item.picturePath" alt="" style="width:100%; height:90%">
</div>
</el-carousel-item>
</el-carousel>
diff --git a/src/components/page/introduce.vue b/src/components/page/introduce.vue
index 631982e..41641c1 100644
--- a/src/components/page/introduce.vue
+++ b/src/components/page/introduce.vue
@@ -15,7 +15,7 @@
<!-- 鏂伴椈鍐呭 -->
<el-card class="box-card">
<el-col>
- <div v-html="this.new.content"></div>
+ <div v-html="this.new.content" class="ql-editor"></div>
</el-col>
</el-card>
</el-row>
@@ -116,4 +116,7 @@
.ft-black {
color: #000;
}
+.ql-editor{
+ padding: 12px 0px !important;
+}
</style>
\ No newline at end of file
diff --git a/src/main.js b/src/main.js
index ba50c0f..801199f 100644
--- a/src/main.js
+++ b/src/main.js
@@ -13,7 +13,7 @@
// 閰嶇疆璇锋眰鐨勮窡璺緞
// axios.defaults.baseURL = 'http://8.140.68.52:8181'
// axios.defaults.baseURL = 'http://127.0.0.1:8888/api/private/v1'
-axios.defaults.baseURL = 'http://localhost:8080/'
+axios.defaults.baseURL = 'http://localhost:7070/'
axios.defaults.withCredentials = true;
axios.interceptors.request.use(config => {
// console.log(config)
diff --git a/src/utils/request.js b/src/utils/request.js
index dbffe70..ee13a3f 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -1,9 +1,10 @@
//瀵筧xios鐨勫皝瑁�
import axios from 'axios'
-let is_baseURL = 'http://localhost:8080/'//娴嬭瘯鐜
+let is_baseURL = 'http://localhost:7070/'//娴嬭瘯鐜
//鍒涘缓axios瀹炰緥
const request = axios.create({
- baseURL: is_baseURL
+ baseURL: is_baseURL,
+ headers:{'Content-Type':'application/x-www-form-urlencoded'}
})
//response鏈嶅姟鍣ㄥ搷搴旀嫤鎴櫒
request.interceptors.response.use(
--
Gitblit v1.8.0