peihaoyu/nebula
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

暂存-fix刷新路由跳转丢失和name不存在bug

Browse Source
This commit is contained in:
祝梦园 2024-03-06 16:49:05 +08:00
parent 0faa495d95
commit 0e669aab00
5 changed files with 499 additions and 501 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
components/ImgCropper.vue
View File

@ -75,13 +75,8 @@ export default {
methods: {
onSubmit() {
this.$refs.cropper.getCropData(data => {
// console.log(data)
this.$emit('onSubmit',data)
});
/*
this.$emit('onSubmit',this.cropImg)
*/
},
onOpen() {
this.oldAvatarUrl = JSON.parse(JSON.stringify(this.avatarUrl))

24
pages/admin.vue
View File

@ -1,13 +1,13 @@
<template>
<el-row type="flex" justify="center" :gutter="8">
<el-col v-if="hasPermissions" :span="20">
<el-col :span="4">
<el-col :span="4" v-if="menus">
<el-menu
:default-active="activeMenu"
class="el-menu-vertical-demo"
@select="handleSelectMenu">
<template v-for="menu in menus">
<el-menu-item :key="menu.name" :index="menu.name">
<el-menu-item v-if="!(menu.isEdit)||false" :key="menu.name" :index="menu.name">
<i :class="menu.icon"></i>
<span slot="title">{{ menu.title }}</span>
</el-menu-item>
@ -131,10 +131,18 @@ export default {
},
{
title: '产品管理',
name: 'admin-products',
path: '/admin/products',
name: 'admin-product',
path: '/admin/product/index',
icon: 'el-icon-box',
closable: true
},
{
title: '产品编辑',
name: 'admin-product-post-product_id',
path: '/admin/product/post/:id?',
icon: 'el-icon-postcard',
closable: true,
isEdit: true
}
]
}
@ -189,11 +197,13 @@ export default {
_ts.$store.commit('admin/pushTags', _ts.menus[index])
reset = '1'
}
let params = _ts.$route.params
params.reset = reset
let query = _ts.$route.query
_ts.$router.push({
name: item,
params: {
reset: reset
}
params,
query
})
},
handleSelectMenu(item) {

109
pages/admin/products.vue → pages/admin/product/index.vue
View File

@ -7,6 +7,9 @@
<el-breadcrumb-item>产品管理</el-breadcrumb-item>
</el-breadcrumb>
</el-col>
<el-col>
<el-button type="primary" @click="handleAdd">新增产品</el-button>
</el-col>
<el-col>
<el-table
:data="products.list"
@ -74,43 +77,39 @@
</el-pagination>
</el-col>
</el-row>
<el-dialog :title="`物流公司-${isEdit?'修改':'新增'}项目`" :visible.sync='editVisible'
center width='880px'>
<el-form ref='formStore' :model='formStore' :rules='rules' label-poionsit='right' label-width='110px'>
<div style="margin-bottom:20px">
<img @click="cropperVisible=true" :src="formStore.productImgUrl"
style="width: 120px;height: 120px;margin: 0 auto;display: block">
</div>
<!-- <el-dialog :title="`物流公司-${isEdit?'修改':'新增'}项目`" :visible.sync='editVisible'-->
<!-- center width='880px'>-->
<!-- <el-form ref='formStore' :model='formStore' :rules='rules' label-poionsit='right' label-width='110px'>-->
<!-- <div style="margin-bottom:20px">-->
<!-- <img @click="cropperVisible=true" :src="formStore.productImgUrl"-->
<!-- style="width: 120px;height: 120px;margin: 0 auto;display: block">-->
<!-- </div>-->
<el-form-item label='产品名称' prop='productTitle'>
<el-input v-model='formStore.productTitle' placeholder='请输入产品名称'/>
</el-form-item>
<el-form-item label='产品价格' prop='code'>
<el-input v-model='formStore.productPrice' placeholder='请输入产品价格'/>
</el-form-item>
<el-form-item label='产品描述' prop='type'>
<el-input v-model='formStore.productDescription' placeholder='请输入产品描述'/>
</el-form-item>
<el-form-item label='tags' prop='order'>
<el-input v-model='formStore.tags' placeholder='请输入tags'/>
</el-form-item>
</el-form>
<span slot='footer' class='dialog-footer'>
<el-button @click='cropperVisible = false'>取 消</el-button>
<el-button type='primary' @click='handelStore'>确 定</el-button>
</span>
</el-dialog>
<ImgCropper append-to-body @onSubmit="updateUser" :visible.sync='cropperVisible'
:avatarUrl="formStore.productImgUrl||''"></ImgCropper>
<!-- <el-form-item label='产品名称' prop='productTitle'>-->
<!-- <el-input v-model='formStore.productTitle' placeholder='请输入产品名称'/>-->
<!-- </el-form-item>-->
<!-- <el-form-item label='产品价格' prop='code'>-->
<!-- <el-input v-model='formStore.productPrice' placeholder='请输入产品价格'/>-->
<!-- </el-form-item>-->
<!-- <el-form-item label='产品描述' prop='type'>-->
<!-- <el-input v-model='formStore.productDescription' placeholder='请输入产品描述'/>-->
<!-- </el-form-item>-->
<!-- <el-form-item label='tags' prop='order'>-->
<!-- <el-input v-model='formStore.tags' placeholder='请输入tags'/>-->
<!-- </el-form-item>-->
<!-- </el-form>-->
<!-- <span slot='footer' class='dialog-footer'>-->
<!-- <el-button @click='cropperVisible = false'>取 消</el-button>-->
<!-- <el-button type='primary' @click='handelStore'>确 定</el-button>-->
<!-- </span>-->
<!-- </el-dialog>-->
</div>
</template>
<script>
import ImgCropper from "~/components/ImgCropper.vue";
import {mapState} from 'vuex';
import VueCropper from "vue-cropper";
// import VueCropper from "vue-cropper";
const rules = {
productTitle: [
@ -121,7 +120,7 @@ const rules = {
}
export default {
name: "products",
name: "productsList",
middleware: 'auth',
fetch() {
let {store, params, error} = this.$nuxt.context
@ -146,15 +145,12 @@ export default {
isEdit: false
}
},
components: {
ImgCropper, VueCropper
},
methods: {
onRouter(name, data) {
this.$router.push({
path: `/${name}/${data}`
})
},
// onRouter(name, data) {
// this.$router.push({
// path: `/${name}/${data}`
// })
// },
toggleStatus(index, product) {
let _ts = this;
let title, status;
@ -206,23 +202,15 @@ export default {
})
},
handleEdit(index, row) {
this.formStore = row
this.editVisible = true
// this.$router.push({
// path: `/admin/product/post/${row.idProduct}`
// })
// this.formStore = {...row}
// this.editVisible = true
this.$router.push({
path: `/admin/product/post/${row.idProduct}`,
})
},
handelStore() {
//这里是其他信息保存
},
updateUser(data) {
//这里是单图片保存
let _ts = this;
if (data) {
// let user = _ts.user;
this.formStore.productImgUrl = data
// user.avatarType = 1
this.formStore.idProduct = this.formStore.idProduct ? this.formStore.idProduct : 0
_ts.$axios[this.formStore.idProduct ? '$put' : '$post']('/api/product/post', this.formStore).then(function (res) {
if (res) {
console.log('res')
@ -231,9 +219,20 @@ export default {
// })
}
})
} else _ts.$message.error('失败，请重试');
},
updateUser(data) {
let _ts = this;
if (data) {
this.formStore.productImgUrl = data
this.formStore.productImgType = 1
// this.cropperVisible = false
} else _ts.$message.error('失败，请重试');
},
handleAdd() {
this.isEdit = false
this.formStore = {}
this.editVisible = true
}
}
}
</script>

853
pages/admin/product/post/_product_id.vue
View File

@ -1,440 +1,435 @@
<template>
<el-row class="products">
<el-col v-if="hasPermissions">
<el-col>
<el-input
v-model="productTitle"
class="product-title"
placeholder="请输入标题"
@change="setLocalstorage('title',productTitle)">
</el-input>
</el-col>
<el-col>
<div id="contentEditor"></div>
</el-col>
<el-col style="margin-top: 1rem;">
<el-select
style="width: 100%;"
v-model="productTags"
multiple
filterable
allow-create
default-first-option
remote
:remote-method="remoteMethod"
placeholder="请选择文章标签"
:loading="loading"
@change="setLocalstorage('tags',productTags)">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</el-col>
<el-col v-if="!isEdit" style="margin-top: 1rem;padding-right:3rem;text-align: right;">
<el-button :loading="doLoading" @click="saveArticle" plain>保存草稿</el-button>
<el-button type="primary" :loading="doLoading" @click="postArticle" plain>发布</el-button>
</el-col>
<el-col v-else style="margin-top: 1rem;padding-right:3rem;text-align: right;">
<el-button type="danger" :loading="doLoading" @click="deleteArticle" plain>删除</el-button>
<el-button v-if="productStatus === '1'" :loading="doLoading" @click="saveArticle" plain>保存草稿</el-button>
<el-button v-if="productStatus === '0'" :loading="doLoading" type="primary" @click="postArticle" plain>更新</el-button>
<el-button v-else type="primary" :loading="doLoading" @click="postArticle" plain>发布</el-button>
</el-col>
</el-col>
<el-col v-else class="text-center">
<el-alert
title="用户无权限"
type="warning"
center
show-icon
:closable="false">
</el-alert>
</el-col>
</el-row>
<div>
test
test
</div>
</template>
<!--<template>-->
<!-- <el-row class="products">-->
<!-- <el-col>-->
<!-- <el-col>-->
<!-- <el-input-->
<!-- v-model="productTitle"-->
<!-- class="product-title"-->
<!-- placeholder="请输入标题"-->
<!-- @change="setLocalstorage('title',productTitle)">-->
<!-- </el-input>-->
<!-- </el-col>-->
<!-- <el-col>-->
<!-- <div id="contentEditor"></div>-->
<!-- </el-col>-->
<!-- <el-col style="margin-top: 1rem;">-->
<!-- </el-col>-->
<!-- <el-col v-if="!isEdit" style="margin-top: 1rem;padding-right:3rem;text-align: right;">-->
<!-- <el-button :loading="doLoading" @click="saveArticle" plain>保存草稿</el-button>-->
<!-- <el-button type="primary" :loading="doLoading" @click="postArticle" plain>发布</el-button>-->
<!-- </el-col>-->
<!-- <el-col v-else style="margin-top: 1rem;padding-right:3rem;text-align: right;">-->
<!-- <el-button type="danger" :loading="doLoading" @click="deleteArticle" plain>删除</el-button>-->
<!-- <el-button v-if="productStatus === '1'" :loading="doLoading" @click="saveArticle" plain>保存草稿</el-button>-->
<!-- <el-button v-if="productStatus === '0'" :loading="doLoading" type="primary" @click="postArticle" plain>更新</el-button>-->
<!-- <el-button v-else type="primary" :loading="doLoading" @click="postArticle" plain>发布</el-button>-->
<!-- </el-col>-->
<!-- </el-col>-->
<!--&lt;!&ndash; <el-col v-else class="text-center">&ndash;&gt;-->
<!--&lt;!&ndash; <el-alert&ndash;&gt;-->
<!--&lt;!&ndash; title="用户无权限"&ndash;&gt;-->
<!--&lt;!&ndash; type="warning"&ndash;&gt;-->
<!--&lt;!&ndash; center&ndash;&gt;-->
<!--&lt;!&ndash; show-icon&ndash;&gt;-->
<!--&lt;!&ndash; :closable="false">&ndash;&gt;-->
<!--&lt;!&ndash; </el-alert>&ndash;&gt;-->
<!--&lt;!&ndash; </el-col>&ndash;&gt;-->
<!-- </el-row>-->
<!--</template>-->
<script>
import Vue from 'vue';
import {mapState} from 'vuex';
import apiConfig from '~/config/api.config';
<!--<script>-->
<!--import Vue from 'vue';-->
<!--import {mapState} from 'vuex';-->
<!--import apiConfig from '~/config/api.config';-->
export default {
name: "PostProducts",
middleware: 'auth',
validate({params, store}) {
if (typeof params.product_id === 'undefined') {
return true;
}
return params.product_id && !isNaN(Number(params.product_id))
},
asyncData({store, params, error}) {
return Promise.all([
store.dispatch('product/fetchPostDetail', params)
.catch(err => error({statusCode: 404}))
])
},
computed: {
...mapState({
product: state => state.product.detail.data
}),
hasPermissions() {
let account = this.$store.state.auth.user?.nickname;
if (account) {
if (this.$route.params.product_id) {
if (account === this.product.productAuthor.userNickname) {
return true;
}
} else {
return true;
}
}
return this.$auth.hasScope('blog_admin') || this.$auth.hasScope('admin');
}
},
data() {
return {
contentEditor: null,
tokenURL: {
URL: '',
linkToImageURL: '',
token: ''
},
idArticle: 0,
productTitle: '',
productContent: '',
productType: 0,
productTags: [],
productStatus: '0',
options: [],
list: [],
loading: false,
doLoading: false,
isEdit: false,
notificationFlag: true
}
},
methods: {
_initEditor(data) {
let _ts = this;
<!--export default {-->
<!-- name: "PostProducts",-->
<!-- middleware: 'auth',-->
<!-- validate({params, store}) {-->
<!-- if (typeof params.product_id === 'undefined') {-->
<!-- return true;-->
<!-- }-->
<!-- return params.product_id && !isNaN(Number(params.product_id))-->
<!-- },-->
<!-- asyncData({store, params, error}) {-->
<!-- return Promise.all([-->
<!-- store.dispatch('product/fetchPostDetail', params)-->
<!-- .catch(err => error({statusCode: 404}))-->
<!-- ])-->
<!-- },-->
<!-- computed: {-->
<!-- ...mapState({-->
<!-- product: state => state.product.detail.data-->
<!-- }),-->
<!-- // hasPermissions() {-->
<!-- // let account = this.$store.state.auth.user?.nickname;-->
<!-- // if (account) {-->
<!-- // if (this.$route.params.product_id) {-->
<!-- // if (account === this.product.productAuthor.userNickname) {-->
<!-- // return true;-->
<!-- // }-->
<!-- // } else {-->
<!-- // return true;-->
<!-- // }-->
<!-- // }-->
<!-- // return this.$auth.hasScope('blog_admin') || this.$auth.hasScope('admin');-->
<!-- // }-->
<!-- },-->
<!-- data() {-->
<!-- return {-->
<!-- contentEditor: null,-->
<!-- tokenURL: {-->
<!-- URL: '',-->
<!-- linkToImageURL: '',-->
<!-- token: ''-->
<!-- },-->
<!-- formStore:{-->
<!-- idArticle: 0,-->
<!-- productTitle: '',-->
<!-- productContent: '',-->
<!-- productType: 0,-->
<!-- productTags: [],-->
<!-- productStatus: '0',-->
<!-- },-->
<!-- idArticle: 0,-->
<!-- productTitle: '',-->
<!-- productContent: '',-->
<!-- productType: 0,-->
<!-- productTags: [],-->
<!-- productStatus: '0',-->
<!-- options: [],-->
<!-- list: [],-->
<!-- loading: false,-->
<!-- doLoading: false,-->
<!-- isEdit: false,-->
<!-- notificationFlag: true-->
<!-- }-->
<!-- },-->
<!-- methods: {-->
<!-- _initEditor(data) {-->
<!-- let _ts = this;-->
let toolbar = [
'emoji',
'headings',
'bold',
'italic',
'strike',
'link',
'|',
'list',
'ordered-list',
'check',
'outdent',
'indent',
'|',
'quote',
'line',
'code',
'inline-code',
'insert-before',
'insert-after',
'|',
'upload',
// 'record',
'table',
'|',
'undo',
'redo',
'|',
'edit-mode',
{
name: 'more',
toolbar: [
'fullscreen',
'both',
'preview',
'info'
],
}]
return new Vue.Vditor(data.id, {
toolbar,
mode: 'sv',
tab: '\t',
cdn: apiConfig.VDITOR,
cache: {
enable: this.$route.params.product_id ? false : true,
id: this.$route.params.product_id ? this.$route.params.product_id : '',
},
after() {
_ts.contentEditor.setValue(data.value ? data.value : '');
},
hint: {
emoji: Vue.emoji
},
preview: {
hljs: {
enable: true,
lineNumber: true,
style: 'github'
},
markdown: {
toc: true,
autoSpace: true
},
math: {
inlineDigit: true
},
delay: 500,
mode: data.mode,
/*url: `${process.env.Server}/api/console/markdown`,*/
parse: (element) => {
if (element.style.display === 'none') {
return
}
// LazyLoadImage();
// Vue.Vditor.highlightRender({style: 'github'}, element, this.contentEditor);
},
theme: {
cdn: apiConfig.VDITOR_CSS
}
},
upload: {
max: 10 * 1024 * 1024,
url: this.tokenURL.URL,
linkToImgUrl: this.tokenURL.linkToImageURL,
token: this.tokenURL.token,
filename: name => name.replace(/[^(a-zA-Z0-9\u4e00-\u9fa5\.)]/g, '').
replace(/[\?\\/:|<>\*\[\]\(\)\$%\{\}@~]/g, '').
replace('/\\s/g', '')
},
height: data.height,
counter: 102400,
resize: {
enable: data.resize,
},
lang: this.$store.state.locale,
placeholder: data.placeholder,
})
},
setLocalstorage(type) {
if (typeof arguments[0] === 'object') {
localStorage.setItem('productTags', arguments[1]);
return
}
switch (type) {
case 'title': {
localStorage.setItem('product-title', arguments[1])
break;
}
case 'tags': {
localStorage.setItem('product-tags', arguments[1]);
break;
}
}
},
remoteMethod(query) {
if (query !== '') {
this.loading = true;
setTimeout(() => {
this.loading = false;
this.options = this.list.filter(item => {
return item.label.toLowerCase()
.indexOf(query.toLowerCase()) > -1;
});
}, 200);
} else {
this.options = [];
}
},
deleteArticle() {
let _ts = this;
_ts.doLoading = true;
this.$confirm('确定删除吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
let id = _ts.$route.params.product_id;
_ts.$axios.$delete('/api/product/delete/' + id).then(function (res) {
if (res && res.message) {
_ts.$message(res.message);
return false;
}
localStorage.removeItem('product-title');
localStorage.removeItem('product-tags');
_ts.contentEditor.setValue('');
_ts.$set(_ts, 'notificationFlag', false);
_ts.$router.push({
name: 'index'
})
})
}).catch(() => {
_ts.doLoading = false;
});
<!-- let toolbar = [-->
<!-- 'emoji',-->
<!-- 'headings',-->
<!-- 'bold',-->
<!-- 'italic',-->
<!-- 'strike',-->
<!-- 'link',-->
<!-- '|',-->
<!-- 'list',-->
<!-- 'ordered-list',-->
<!-- 'check',-->
<!-- 'outdent',-->
<!-- 'indent',-->
<!-- '|',-->
<!-- 'quote',-->
<!-- 'line',-->
<!-- 'code',-->
<!-- 'inline-code',-->
<!-- 'insert-before',-->
<!-- 'insert-after',-->
<!-- '|',-->
<!-- 'upload',-->
<!-- // 'record',-->
<!-- 'table',-->
<!-- '|',-->
<!-- 'undo',-->
<!-- 'redo',-->
<!-- '|',-->
<!-- 'edit-mode',-->
<!-- {-->
<!-- name: 'more',-->
<!-- toolbar: [-->
<!-- 'fullscreen',-->
<!-- 'both',-->
<!-- 'preview',-->
<!-- 'info'-->
<!-- ],-->
<!-- }]-->
<!-- return new Vue.Vditor(data.id, {-->
<!-- toolbar,-->
<!-- mode: 'sv',-->
<!-- tab: '\t',-->
<!-- cdn: apiConfig.VDITOR,-->
<!-- cache: {-->
<!-- enable: this.$route.params.product_id ? false : true,-->
<!-- id: this.$route.params.product_id ? this.$route.params.product_id : '',-->
<!-- },-->
<!-- after() {-->
<!-- _ts.contentEditor.setValue(data.value ? data.value : '');-->
<!-- },-->
<!-- hint: {-->
<!-- emoji: Vue.emoji-->
<!-- },-->
<!-- preview: {-->
<!-- hljs: {-->
<!-- enable: true,-->
<!-- lineNumber: true,-->
<!-- style: 'github'-->
<!-- },-->
<!-- markdown: {-->
<!-- toc: true,-->
<!-- autoSpace: true-->
<!-- },-->
<!-- math: {-->
<!-- inlineDigit: true-->
<!-- },-->
<!-- delay: 500,-->
<!-- mode: data.mode,-->
<!-- /*url: `${process.env.Server}/api/console/markdown`,*/-->
<!-- parse: (element) => {-->
<!-- if (element.style.display === 'none') {-->
<!-- return-->
<!-- }-->
<!-- // LazyLoadImage();-->
<!-- // Vue.Vditor.highlightRender({style: 'github'}, element, this.contentEditor);-->
<!-- },-->
<!-- theme: {-->
<!-- cdn: apiConfig.VDITOR_CSS-->
<!-- }-->
<!-- },-->
<!-- upload: {-->
<!-- max: 10 * 1024 * 1024,-->
<!-- url: this.tokenURL.URL,-->
<!-- linkToImgUrl: this.tokenURL.linkToImageURL,-->
<!-- token: this.tokenURL.token,-->
<!-- filename: name => name.replace(/[^(a-zA-Z0-9\u4e00-\u9fa5\.)]/g, '').-->
<!-- replace(/[\?\\/:|<>\*\[\]\(\)\$%\{\}@~]/g, '').-->
<!-- replace('/\\s/g', '')-->
<!-- },-->
<!-- height: data.height,-->
<!-- counter: 102400,-->
<!-- resize: {-->
<!-- enable: data.resize,-->
<!-- },-->
<!-- lang: this.$store.state.locale,-->
<!-- placeholder: data.placeholder,-->
<!-- })-->
<!-- },-->
<!-- setLocalstorage(type) {-->
<!-- if (typeof arguments[0] === 'object') {-->
<!-- localStorage.setItem('productTags', arguments[1]);-->
<!-- return-->
<!-- }-->
<!-- switch (type) {-->
<!-- case 'title': {-->
<!-- localStorage.setItem('product-title', arguments[1])-->
<!-- break;-->
<!-- }-->
<!-- case 'tags': {-->
<!-- localStorage.setItem('product-tags', arguments[1]);-->
<!-- break;-->
<!-- }-->
<!-- }-->
<!-- },-->
<!-- remoteMethod(query) {-->
<!-- if (query !== '') {-->
<!-- this.loading = true;-->
<!-- setTimeout(() => {-->
<!-- this.loading = false;-->
<!-- this.options = this.list.filter(item => {-->
<!-- return item.label.toLowerCase()-->
<!-- .indexOf(query.toLowerCase()) > -1;-->
<!-- });-->
<!-- }, 200);-->
<!-- } else {-->
<!-- this.options = [];-->
<!-- }-->
<!-- },-->
<!-- deleteArticle() {-->
<!-- let _ts = this;-->
<!-- _ts.doLoading = true;-->
<!-- this.$confirm('确定删除吗?', '提示', {-->
<!-- confirmButtonText: '确定',-->
<!-- cancelButtonText: '取消',-->
<!-- type: 'warning'-->
<!-- }).then(() => {-->
<!-- let id = _ts.$route.params.product_id;-->
<!-- _ts.$axios.$delete('/api/product/delete/' + id).then(function (res) {-->
<!-- if (res && res.message) {-->
<!-- _ts.$message(res.message);-->
<!-- return false;-->
<!-- }-->
<!-- localStorage.removeItem('product-title');-->
<!-- localStorage.removeItem('product-tags');-->
<!-- _ts.contentEditor.setValue('');-->
<!-- _ts.$set(_ts, 'notificationFlag', false);-->
<!-- _ts.$router.push({-->
<!-- name: 'index'-->
<!-- })-->
<!-- })-->
<!-- }).catch(() => {-->
<!-- _ts.doLoading = false;-->
<!-- });-->
},
async postArticle() {
let _ts = this;
_ts.doLoading = true;
let id = _ts.$route.params.product_id;
let productContent = _ts.contentEditor.getValue();
let productContentHtml = await _ts.contentEditor.getHTML();
if (!(_ts.productTitle && productContent)) {
_ts.$message("标题/正文不能为空！");
_ts.doLoading = false;
return false;
}
let product = {
idArticle: _ts.idArticle,
productTitle: _ts.productTitle,
productContent: productContent,
productContentHtml: productContentHtml,
productTags: _ts.productTags.join(","),
productStatus: 0
};
_ts.$axios[id ? '$put' : '$post']('/api/product/post', product).then(function (res) {
if (res) {
if (res.message) {
_ts.$message(res.message);
_ts.doLoading = false;
return false;
}
localStorage.removeItem('product-title');
localStorage.removeItem('product-tags');
_ts.contentEditor.setValue('');
_ts.$store.commit('product/clearDetailData')
_ts.$set(_ts, 'notificationFlag', false);
_ts.$router.push({
path: `/product/${res}`
})
}
})
<!-- },-->
<!-- async postArticle() {-->
<!-- let _ts = this;-->
<!-- _ts.doLoading = true;-->
<!-- let id = _ts.$route.params.product_id;-->
<!-- let productContent = _ts.contentEditor.getValue();-->
<!-- let productContentHtml = await _ts.contentEditor.getHTML();-->
<!-- if (!(_ts.productTitle && productContent)) {-->
<!-- _ts.$message("标题/正文不能为空！");-->
<!-- _ts.doLoading = false;-->
<!-- return false;-->
<!-- }-->
<!-- let product = {-->
<!-- idArticle: _ts.idArticle,-->
<!-- productTitle: _ts.productTitle,-->
<!-- productContent: productContent,-->
<!-- productContentHtml: productContentHtml,-->
<!-- productTags: _ts.productTags.join(","),-->
<!-- productStatus: 0-->
<!-- };-->
<!-- _ts.$axios[id ? '$put' : '$post']('/api/product/post', product).then(function (res) {-->
<!-- if (res) {-->
<!-- if (res.message) {-->
<!-- _ts.$message(res.message);-->
<!-- _ts.doLoading = false;-->
<!-- return false;-->
<!-- }-->
<!-- localStorage.removeItem('product-title');-->
<!-- localStorage.removeItem('product-tags');-->
<!-- _ts.contentEditor.setValue('');-->
<!-- _ts.$store.commit('product/clearDetailData')-->
<!-- _ts.$set(_ts, 'notificationFlag', false);-->
<!-- _ts.$router.push({-->
<!-- path: `/product/${res}`-->
<!-- })-->
<!-- }-->
<!-- })-->
},
async saveArticle() {
let _ts = this;
_ts.doLoading = true;
let id = _ts.$route.params.product_id;
let productContent = _ts.contentEditor.getValue();
let productContentHtml = await _ts.contentEditor.getHTML();
if (!(_ts.productTitle && productContent)) {
_ts.$message("标题/正文不能为空！");
_ts.doLoading = false;
return false;
}
let product = {
idArticle: _ts.idArticle,
productTitle: _ts.productTitle,
productContent: productContent,
productContentHtml: productContentHtml,
productTags: _ts.productTags.join(","),
productStatus: 1
};
_ts.$axios[id ? '$put' : '$post']('/api/product/post', product).then(function (res) {
if (res) {
if (res.message) {
_ts.$message(res.message);
_ts.doLoading = false;
return false;
}
localStorage.removeItem('product-title');
localStorage.removeItem('product-tags');
_ts.contentEditor.setValue('');
_ts.$set(_ts, 'notificationFlag', false);
_ts.$router.push({
path: `/draft/${res}`
})
}
})
},
getTags() {
let _ts = this;
_ts.$axios.$get('/api/tag/tags').then(function (res) {
if (res) {
_ts.$set(_ts, 'list', res);
}
})
}
},
beforeRouteLeave(to, from, next) {
let _ts = this;
if (_ts.notificationFlag) {
_ts.$confirm('系统可能不会保存您所做的更改。', '离开此网站?', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
next();
}).catch(() => {
return false
});
_ts.$store.commit("setActiveMenu", "product-post");
} else {
next();
}
},
beforeDestroy() {
window.onbeforeunload = null;
},
async mounted() {
console.log('??')
if (!this.hasPermissions) {
return
}
window.addEventListener('beforeunload', e => {
e = e || window.event;
<!-- },-->
<!-- async saveArticle() {-->
<!-- let _ts = this;-->
<!-- _ts.doLoading = true;-->
<!-- let id = _ts.$route.params.product_id;-->
<!-- let productContent = _ts.contentEditor.getValue();-->
<!-- let productContentHtml = await _ts.contentEditor.getHTML();-->
<!-- if (!(_ts.productTitle && productContent)) {-->
<!-- _ts.$message("标题/正文不能为空！");-->
<!-- _ts.doLoading = false;-->
<!-- return false;-->
<!-- }-->
<!-- let product = {-->
<!-- idArticle: _ts.idArticle,-->
<!-- productTitle: _ts.productTitle,-->
<!-- productContent: productContent,-->
<!-- productContentHtml: productContentHtml,-->
<!-- productTags: _ts.productTags.join(","),-->
<!-- productStatus: 1-->
<!-- };-->
<!-- _ts.$axios[id ? '$put' : '$post']('/api/product/post', product).then(function (res) {-->
<!-- if (res) {-->
<!-- if (res.message) {-->
<!-- _ts.$message(res.message);-->
<!-- _ts.doLoading = false;-->
<!-- return false;-->
<!-- }-->
<!-- localStorage.removeItem('product-title');-->
<!-- localStorage.removeItem('product-tags');-->
<!-- _ts.contentEditor.setValue('');-->
<!-- _ts.$set(_ts, 'notificationFlag', false);-->
<!-- _ts.$router.push({-->
<!-- path: `/draft/${res}`-->
<!-- })-->
<!-- }-->
<!-- })-->
<!-- },-->
<!-- getTags() {-->
<!-- let _ts = this;-->
<!-- _ts.$axios.$get('/api/tag/tags').then(function (res) {-->
<!-- if (res) {-->
<!-- _ts.$set(_ts, 'list', res);-->
<!-- }-->
<!-- })-->
<!-- }-->
<!-- },-->
<!-- beforeRouteLeave(to, from, next) {-->
<!-- let _ts = this;-->
<!-- if (_ts.notificationFlag) {-->
<!-- _ts.$confirm('系统可能不会保存您所做的更改。', '离开此网站?', {-->
<!-- confirmButtonText: '确定',-->
<!-- cancelButtonText: '取消',-->
<!-- type: 'warning'-->
<!-- }).then(() => {-->
<!-- next();-->
<!-- }).catch(() => {-->
<!-- return false-->
<!-- });-->
<!-- _ts.$store.commit("setActiveMenu", "product-post");-->
<!-- } else {-->
<!-- next();-->
<!-- }-->
<!-- },-->
<!-- beforeDestroy() {-->
<!-- window.onbeforeunload = null;-->
<!-- },-->
<!-- async mounted() {-->
<!-- console.log('??')-->
<!-- // if (!this.hasPermissions) {-->
<!-- // return-->
<!-- // }-->
<!-- window.addEventListener('beforeunload', e => {-->
<!-- e = e || window.event;-->
// 兼容IE8和Firefox 4之前的版本
if (e) {
e.returnValue = '关闭提示';
}
<!-- // 兼容IE8和Firefox 4之前的版本-->
<!-- if (e) {-->
<!-- e.returnValue = '关闭提示';-->
<!-- }-->
// Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+
return '关闭提示';
});
let _ts = this;
_ts.$store.commit('setActiveMenu', 'product-post');
const responseData = await _ts.$axios.$get('/api/upload/token');
if (responseData) {
_ts.$set(_ts, 'tokenURL', {
token: responseData.uploadToken || '',
URL: responseData.uploadURL || '',
linkToImageURL: responseData.linkToImageURL || ''
})
}
<!-- // Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+-->
<!-- return '关闭提示';-->
<!-- });-->
<!-- let _ts = this;-->
<!-- _ts.$store.commit('setActiveMenu', 'product-post');-->
<!-- const responseData = await _ts.$axios.$get('/api/upload/token');-->
<!-- if (responseData) {-->
<!-- _ts.$set(_ts, 'tokenURL', {-->
<!-- token: responseData.uploadToken || '',-->
<!-- URL: responseData.uploadURL || '',-->
<!-- linkToImageURL: responseData.linkToImageURL || ''-->
<!-- })-->
<!-- }-->
_ts.getTags();
Vue.nextTick(() => {
let productContent = '';
if (_ts.$route.params.product_id) {
_ts.$set(_ts, 'isEdit', true);
let product = _ts.product;
_ts.$set(_ts, 'idArticle', product.idArticle);
_ts.$set(_ts, 'productTitle', product.productTitle);
_ts.$set(_ts, 'productContent', product.productContent);
_ts.$set(_ts, 'productStatus', product.productStatus);
_ts.$set(_ts, 'productTags', (product.productTags).split(','));
localStorage.setItem("product-title", product.productTitle);
localStorage.setItem("product-tags", (product.productTags).split(','));
productContent = product.productContent
} else {
_ts.$set(_ts, 'isEdit', false);
}
_ts.contentEditor = _ts._initEditor({
id: 'contentEditor',
mode: 'both',
height: 480,
placeholder: '', //_ts.$t('inputContent', _ts.$store.state.locale)
resize: false,
value: productContent
});
})
}
}
</script>
<!-- _ts.getTags();-->
<!-- Vue.nextTick(() => {-->
<!-- let productContent = '';-->
<!-- if (_ts.$route.params.product_id) {-->
<!-- _ts.$set(_ts, 'isEdit', true);-->
<!-- let product = _ts.product;-->
<!-- _ts.$set(_ts, 'idArticle', product.idArticle);-->
<!-- _ts.$set(_ts, 'productTitle', product.productTitle);-->
<!-- _ts.$set(_ts, 'productContent', product.productContent);-->
<!-- _ts.$set(_ts, 'productStatus', product.productStatus);-->
<!-- _ts.$set(_ts, 'productTags', (product.productTags).split(','));-->
<!-- localStorage.setItem("product-title", product.productTitle);-->
<!-- localStorage.setItem("product-tags", (product.productTags).split(','));-->
<!-- productContent = product.productContent-->
<!-- } else {-->
<!-- _ts.$set(_ts, 'isEdit', false);-->
<!-- }-->
<!-- _ts.contentEditor = _ts._initEditor({-->
<!-- id: 'contentEditor',-->
<!-- mode: 'both',-->
<!-- height: 480,-->
<!-- placeholder: '', //_ts.$t('inputContent', _ts.$store.state.locale)-->
<!-- resize: false,-->
<!-- value: productContent-->
<!-- });-->
<!-- })-->
<!-- }-->
<!--}-->
<!--</script>-->
<style lang="less">
@import "~vditor/src/assets/less/index.less";
</style>
<!--<style lang="less">-->
<!--@import "~vditor/src/assets/less/index.less";-->
<!--</style>-->

3
pages/user/settings/account.vue
View File

@ -93,7 +93,6 @@
<script>
import {mapState} from 'vuex';
import ImgCropper from "~/components/ImgCropper.vue";
import VueCropper from "vue-cropper";
import saveSvg from "save-svg-as-png";
import Avataaars from 'vuejs-avataaars';
@ -103,7 +102,7 @@ export default {
name: "account",
middleware: 'auth',
components: {
ImgCropper, VueCropper, Avataaars
ImgCropper, Avataaars
},
computed: {
...mapState({