|
|
@@ -1,317 +1,338 @@
|
|
|
<!-- editniotice -->
|
|
|
<template>
|
|
|
- <view class="editniotice">
|
|
|
- <Header :title="title" />
|
|
|
- <view style="height: 94upx;"></view>
|
|
|
- <view class="content">
|
|
|
- <view class="content-warp">
|
|
|
- <view class="uni-list-cell">
|
|
|
- <view class="name">选择店铺：</view>
|
|
|
- <view class="uni-list-cell-db">
|
|
|
- <picker
|
|
|
- @change="bindPickerChange"
|
|
|
- :value="storeIndex"
|
|
|
- :range="storeList"
|
|
|
- :disabled="storeDisabled"
|
|
|
- range-key="name"
|
|
|
- class="uni-upd"
|
|
|
- >
|
|
|
- <view class="uni-input">{{ storeList[storeIndex].name }}</view>
|
|
|
- </picker>
|
|
|
- <view class="icon-warp">
|
|
|
- <image
|
|
|
- src="../../../static/images/moreicon.png"
|
|
|
- class="iconRight"
|
|
|
- ></image>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="inputnamt">
|
|
|
- <view class="title">新闻标题：</view>
|
|
|
- <input
|
|
|
- class="txt"
|
|
|
- v-model="noticeMessage.title"
|
|
|
- type="text"
|
|
|
- placeholder="请输入新闻标题"
|
|
|
- placeholder-style="color:#8f8f8f;"
|
|
|
- />
|
|
|
- </view>
|
|
|
- <view class="icon-warp">
|
|
|
- <view class="title">上传图标：</view>
|
|
|
- <image
|
|
|
- class="icon"
|
|
|
- :src="noticeMessage.icon"
|
|
|
- v-if="noticeMessage.icon"
|
|
|
- ></image>
|
|
|
- <view class="upload" @tap="upload">点击上传</view>
|
|
|
- </view>
|
|
|
- <view class="noticeContent">
|
|
|
- <view class="container">
|
|
|
- <editor
|
|
|
- id="editor"
|
|
|
- class="ql-container"
|
|
|
- :placeholder="placeholder"
|
|
|
- @input="saveTxt"
|
|
|
- @ready="onEditorReady"
|
|
|
- ></editor>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="btn-warp">
|
|
|
- <view class="btn" @tap="saveNotice">提交发布</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <rf-loading v-if="loading"></rf-loading>
|
|
|
- </view>
|
|
|
+ <view class="editniotice">
|
|
|
+ <Header :title="title" />
|
|
|
+ <view style="height: 94upx;"></view>
|
|
|
+ <view class="content">
|
|
|
+ <view class="content-warp">
|
|
|
+ <view class="uni-list-cell">
|
|
|
+ <view class="name">选择店铺：</view>
|
|
|
+ <view class="uni-list-cell-db">
|
|
|
+ <picker
|
|
|
+ @change="bindPickerChange"
|
|
|
+ :value="storeIndex"
|
|
|
+ :range="storeList"
|
|
|
+ :disabled="storeDisabled"
|
|
|
+ range-key="name"
|
|
|
+ class="uni-upd"
|
|
|
+ >
|
|
|
+ <view class="uni-input">{{ storeList[storeIndex].name }}</view>
|
|
|
+ </picker>
|
|
|
+ <view class="icon-warp">
|
|
|
+ <image
|
|
|
+ src="../../../static/images/moreicon.png"
|
|
|
+ class="iconRight"
|
|
|
+ ></image>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="inputnamt">
|
|
|
+ <view class="title">新闻标题：</view>
|
|
|
+ <input
|
|
|
+ class="txt"
|
|
|
+ v-model="noticeMessage.title"
|
|
|
+ type="text"
|
|
|
+ placeholder="请输入新闻标题"
|
|
|
+ placeholder-style="color:#8f8f8f;"
|
|
|
+ />
|
|
|
+ </view>
|
|
|
+ <view class="icon-warp">
|
|
|
+ <view class="title">上传图标：</view>
|
|
|
+ <image
|
|
|
+ class="icon"
|
|
|
+ :src="noticeMessage.icon"
|
|
|
+ v-if="noticeMessage.icon"
|
|
|
+ ></image>
|
|
|
+ <view class="upload" @tap="upload">点击上传</view>
|
|
|
+ </view>
|
|
|
+ <view class="noticeContent">
|
|
|
+ <view class="container">
|
|
|
+ <editor
|
|
|
+ id="editor"
|
|
|
+ class="ql-container"
|
|
|
+ :placeholder="placeholder"
|
|
|
+ @input="saveTxt"
|
|
|
+ @ready="onEditorReady"
|
|
|
+ ></editor>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="btn-warp">
|
|
|
+ <view class="btn" @tap="saveNotice">提交发布</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <rf-loading v-if="loading"></rf-loading>
|
|
|
+ </view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
import Header from '../../components/header';
|
|
|
import moment from '@/common/moment';
|
|
|
export default {
|
|
|
- name: 'editniotice',
|
|
|
- components: {
|
|
|
- Header
|
|
|
- },
|
|
|
- data() {
|
|
|
- //这里存放数据
|
|
|
- return {
|
|
|
- loading: true,
|
|
|
- scenicId: '',
|
|
|
- title: '公告编辑',
|
|
|
- storeList: [{ name: '请选择公告所属店铺', id: '' }],
|
|
|
- storeIndex: 0,
|
|
|
- storeId: '',
|
|
|
- storeDisabled: true,
|
|
|
- newid: '',
|
|
|
+ name: 'editniotice',
|
|
|
+ components: {
|
|
|
+ Header,
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ //这里存放数据
|
|
|
+ return {
|
|
|
+ loading: true,
|
|
|
+ scenicId: '',
|
|
|
+ title: '公告编辑',
|
|
|
+ storeList: [{ name: '请选择公告所属店铺', id: '' }],
|
|
|
+ storeIndex: 0,
|
|
|
+ storeId: '',
|
|
|
+ storeDisabled: true,
|
|
|
+ newid: '',
|
|
|
|
|
|
- icon: '1',
|
|
|
- placeholder: '请输入公告内容',
|
|
|
- mastknow: '',
|
|
|
+ placeholder: '请输入公告内容',
|
|
|
+ mastknow: '',
|
|
|
|
|
|
- noticeMessage: {
|
|
|
- content: '',
|
|
|
- icon: '',
|
|
|
- title: '',
|
|
|
- sid: '',
|
|
|
- id: ''
|
|
|
- }
|
|
|
- };
|
|
|
+ iconUrl: '',
|
|
|
+ noticeMessage: {
|
|
|
+ content: '',
|
|
|
+ icon: '',
|
|
|
+ title: '',
|
|
|
+ sid: '',
|
|
|
+ id: '',
|
|
|
+ type: '2'
|
|
|
+ },
|
|
|
+ };
|
|
|
},
|
|
|
- onLoad(option) {
|
|
|
+ onLoad(option) {
|
|
|
this.newid = option.id;
|
|
|
console.log(this.newid);
|
|
|
this.getShopMessage();
|
|
|
if (this.newid === 'add') {
|
|
|
- this.title = '添加公告'
|
|
|
- this.loading =false
|
|
|
+ this.title = '添加公告';
|
|
|
+ this.loading = false;
|
|
|
} else {
|
|
|
- this.loading = false
|
|
|
- return
|
|
|
this.getNoticeBuyId();
|
|
|
}
|
|
|
- },
|
|
|
+ },
|
|
|
|
|
|
- //方法集合
|
|
|
- methods: {
|
|
|
- // 选择店铺
|
|
|
- bindPickerChange(e) {
|
|
|
- this.storeIndex = e.detail.value;
|
|
|
+ //方法集合
|
|
|
+ methods: {
|
|
|
+ // 选择店铺
|
|
|
+ bindPickerChange(e) {
|
|
|
+ this.storeIndex = e.detail.value;
|
|
|
this.storeId = this.storeList[this.storeIndex].id;
|
|
|
- console.log(this.storeId);
|
|
|
- },
|
|
|
- // 商家信息
|
|
|
- async getShopMessage() {
|
|
|
- await this.$http.get('/getUserInfo').then(async res => {
|
|
|
- if (res.data) {
|
|
|
- this.scenicId = res.data.id;
|
|
|
- this.getShopList();
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- async getShopList() {
|
|
|
- this.storeList = [{ name: '请选择公告所属店铺', id: '' }];
|
|
|
- await this.$http
|
|
|
- .get('/shop/getList', {
|
|
|
- mid: this.scenicId
|
|
|
- })
|
|
|
- .then(async res => {
|
|
|
- if (res.data) {
|
|
|
- let arr = [];
|
|
|
- res.data.forEach(element => {
|
|
|
- arr.push({ name: element.name, id: element.id });
|
|
|
- });
|
|
|
- this.storeList = this.storeList.concat(arr);
|
|
|
- this.storeDisabled = false;
|
|
|
+ this.noticeMessage.sid = this.storeId
|
|
|
+ console.log(this.storeId);
|
|
|
+ },
|
|
|
+ // 商家信息
|
|
|
+ async getShopMessage() {
|
|
|
+ await this.$http.get('/getUserInfo').then(async (res) => {
|
|
|
+ if (res.data) {
|
|
|
+ this.scenicId = res.data.id;
|
|
|
+ this.getShopList();
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ async getShopList() {
|
|
|
+ this.storeList = [{ name: '请选择公告所属店铺', id: '' }];
|
|
|
+ await this.$http
|
|
|
+ .get('/shop/getList', {
|
|
|
+ mid: this.scenicId,
|
|
|
+ })
|
|
|
+ .then(async (res) => {
|
|
|
+ if (res.data) {
|
|
|
+ let arr = [];
|
|
|
+ res.data.forEach((element) => {
|
|
|
+ arr.push({ name: element.name, id: element.id });
|
|
|
+ });
|
|
|
+ this.storeList = this.storeList.concat(arr);
|
|
|
+ this.storeDisabled = false;
|
|
|
|
|
|
- if (this.noticeMessage) {
|
|
|
- // 店铺回显
|
|
|
- this.storeId = this.noticeMessage.sid;
|
|
|
- this.storeList.forEach((item, index) => {
|
|
|
- if (this.storeId === item.id) {
|
|
|
- this.storeIndex = index;
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- // 获取单个公告的信息
|
|
|
- async getNoticeBuyId() {
|
|
|
- this.loading = true;
|
|
|
- await this.$http.get('/news/getById/' + this.newid).then(async res => {
|
|
|
- console.log(res);
|
|
|
- if (res.code === 200) {
|
|
|
- this.noticeMessage = res.data;
|
|
|
- this.loading = false;
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
- // 富文本
|
|
|
- onEditorReady() {
|
|
|
- uni
|
|
|
- .createSelectorQuery()
|
|
|
- .select('#editor')
|
|
|
- .context(res => {
|
|
|
- this.editorCtx = res.context;
|
|
|
- this.editorCtx.setContents({
|
|
|
- html: this.noticeMessage.content
|
|
|
- });
|
|
|
- })
|
|
|
- .exec();
|
|
|
- },
|
|
|
- saveTxt(e) {
|
|
|
- this.noticeMessage.content = e.detail.html;
|
|
|
- },
|
|
|
- // 保存编辑
|
|
|
- saveNotice() {
|
|
|
- console.log(this.noticeMessage);
|
|
|
- this.$http.put('/news/updata', this.noticeMessage).then(res => {
|
|
|
- if (res.code === 200 && res.msg === 'OK') {
|
|
|
- this.$mHelper.toast('提交成功！');
|
|
|
- setTimeout(() => {
|
|
|
- this.$mRouter.back();
|
|
|
- }, 800);
|
|
|
- }
|
|
|
- });
|
|
|
- },
|
|
|
+ if (this.noticeMessage) {
|
|
|
+ // 店铺回显
|
|
|
+ this.storeId = this.noticeMessage.sid;
|
|
|
+ this.storeList.forEach((item, index) => {
|
|
|
+ if (this.storeId === item.id) {
|
|
|
+ this.storeIndex = index;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 获取单个公告的信息
|
|
|
+ async getNoticeBuyId() {
|
|
|
+ this.loading = true;
|
|
|
+ await this.$http.get('/news/getById/' + this.newid).then(async (res) => {
|
|
|
+ console.log(res);
|
|
|
+ if (res.code === 200) {
|
|
|
+ console.log(res);
|
|
|
+ this.noticeMessage = res.data;
|
|
|
+ this.loading = false;
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
+ // 富文本
|
|
|
+ onEditorReady() {
|
|
|
+ uni
|
|
|
+ .createSelectorQuery()
|
|
|
+ .select('#editor')
|
|
|
+ .context((res) => {
|
|
|
+ this.editorCtx = res.context;
|
|
|
+ this.editorCtx.setContents({
|
|
|
+ html: this.noticeMessage.content,
|
|
|
+ });
|
|
|
+ })
|
|
|
+ .exec();
|
|
|
+ },
|
|
|
+ saveTxt(e) {
|
|
|
+ this.noticeMessage.content = e.detail.html;
|
|
|
+ },
|
|
|
+ // 保存编辑
|
|
|
+ saveNotice() {
|
|
|
+ console.log(this.noticeMessage);
|
|
|
+ this.$http.post('/news/add', this.noticeMessage).then((res) => {
|
|
|
+ if (res.code === 200 && res.msg === 'OK') {
|
|
|
+ this.$mHelper.toast('提交成功！');
|
|
|
+ setTimeout(() => {
|
|
|
+ this.$mRouter.back();
|
|
|
+ }, 800);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ },
|
|
|
|
|
|
- // --------------------------
|
|
|
+ // --------------------------
|
|
|
|
|
|
// 图标上传
|
|
|
- upload() {
|
|
|
- let _self = this
|
|
|
- uni.chooseImage({
|
|
|
- count: 1,
|
|
|
- sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
|
|
|
- sourceType: ['album'], // camera 使用相机 album 从相册中选
|
|
|
- success: function(res) {
|
|
|
+ upload() {
|
|
|
+ let _self = this;
|
|
|
+ uni.chooseImage({
|
|
|
+ count: 1,
|
|
|
+ sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
|
|
|
+ sourceType: ['album'], // camera 使用相机 album 从相册中选
|
|
|
+ success: function (res) {
|
|
|
// 成功则返回图片的本地文件路径列表 tempFilePaths
|
|
|
- _self.noticeMessage.icon = res.tempFilePaths[0];
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
+ _self.noticeMessage.icon = res.tempFilePaths[0];
|
|
|
+ uni.uploadFile({
|
|
|
+ url: 'http://192.168.100.135:83/merch/common/upload/oss',
|
|
|
+ filePath: _self.noticeMessage.icon,
|
|
|
+ name: 'file',
|
|
|
+ formData: {
|
|
|
+ 'user': 'test'
|
|
|
+ },
|
|
|
+ success:(res)=>{
|
|
|
+ let data = JSON.parse(res.data)
|
|
|
+ console.log(data);
|
|
|
+ _self.noticeMessage.icon = data.data
|
|
|
+ },
|
|
|
+ onUploadProgress: function (progressEvent) {
|
|
|
+ // 上传进度回调
|
|
|
+ let percentCompleted = Math.round(
|
|
|
+ (progressEvent.loaded * 100) / progressEvent.total
|
|
|
+ );
|
|
|
+ console.log(percentCompleted);
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
+ },
|
|
|
};
|
|
|
</script>
|
|
|
<style lang="scss" scoped>
|
|
|
.editniotice {
|
|
|
- .content {
|
|
|
- padding: 25upx 0;
|
|
|
- }
|
|
|
- .content-warp {
|
|
|
- padding: 0 33upx 100upx;
|
|
|
- background-color: #fff;
|
|
|
- box-sizing: border-box;
|
|
|
- }
|
|
|
- .uni-list-cell {
|
|
|
- border-bottom: 2px solid #f4f4f4;
|
|
|
- .name {
|
|
|
- color: #2f2f2f;
|
|
|
- font-size: 28upx;
|
|
|
- }
|
|
|
- .uni-list-cell-db {
|
|
|
- height: 80upx;
|
|
|
- font-size: 28upx;
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- background-color: #fff;
|
|
|
- color: #8f8f8f;
|
|
|
- font-size: 30upx;
|
|
|
- .uni-upd {
|
|
|
- width: 100%;
|
|
|
- }
|
|
|
- }
|
|
|
- .uni-input {
|
|
|
- height: 100%;
|
|
|
- line-height: 80upx;
|
|
|
- }
|
|
|
- .icon-warp {
|
|
|
- width: 19upx;
|
|
|
- .iconRight {
|
|
|
- width: 19upx;
|
|
|
- height: 27upx;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- .inputnamt {
|
|
|
- height: 80upx;
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- border-bottom: 2px solid #f4f4f4;
|
|
|
- .title {
|
|
|
- color: #2f2f2f;
|
|
|
- }
|
|
|
- .txt {
|
|
|
- flex: 1;
|
|
|
- }
|
|
|
- }
|
|
|
- .icon-warp {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding: 20upx 0;
|
|
|
- border-bottom: 2px solid #f4f4f4;
|
|
|
- .title {
|
|
|
- color: #2f2f2f;
|
|
|
- }
|
|
|
- .icon {
|
|
|
- width: 185upx;
|
|
|
- height: 185upx;
|
|
|
- background-color: pink;
|
|
|
- border-radius: 20upx;
|
|
|
- }
|
|
|
- .upload {
|
|
|
- width: 185upx;
|
|
|
- height: 185upx;
|
|
|
- border: 2px dashed #ccc;
|
|
|
- text-align: center;
|
|
|
- line-height: 185upx;
|
|
|
- border-radius: 20upx;
|
|
|
- }
|
|
|
- }
|
|
|
- .noticeContent {
|
|
|
- padding: 40upx;
|
|
|
- border: 2px solid #f4f4f4;
|
|
|
- margin-top: 20upx;
|
|
|
- }
|
|
|
- .btn-warp {
|
|
|
- margin-top: 80upx;
|
|
|
- display: flex;
|
|
|
- justify-content: center;
|
|
|
- .btn {
|
|
|
- width: 600upx;
|
|
|
- height: 90upx;
|
|
|
- border-radius: 20upx;
|
|
|
- text-align: center;
|
|
|
- line-height: 90upx;
|
|
|
- color: #fff;
|
|
|
- font-size: 30upx;
|
|
|
- font-weight: 700;
|
|
|
- letter-spacing: 2upx;
|
|
|
- background-color: #169bd5;
|
|
|
- }
|
|
|
- }
|
|
|
+ .content {
|
|
|
+ padding: 25upx 0;
|
|
|
+ }
|
|
|
+ .content-warp {
|
|
|
+ padding: 0 33upx 100upx;
|
|
|
+ background-color: #fff;
|
|
|
+ box-sizing: border-box;
|
|
|
+ }
|
|
|
+ .uni-list-cell {
|
|
|
+ border-bottom: 2px solid #f4f4f4;
|
|
|
+ .name {
|
|
|
+ color: #2f2f2f;
|
|
|
+ font-size: 28upx;
|
|
|
+ }
|
|
|
+ .uni-list-cell-db {
|
|
|
+ height: 80upx;
|
|
|
+ font-size: 28upx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ background-color: #fff;
|
|
|
+ color: #8f8f8f;
|
|
|
+ font-size: 30upx;
|
|
|
+ .uni-upd {
|
|
|
+ width: 100%;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .uni-input {
|
|
|
+ height: 100%;
|
|
|
+ line-height: 80upx;
|
|
|
+ }
|
|
|
+ .icon-warp {
|
|
|
+ width: 19upx;
|
|
|
+ .iconRight {
|
|
|
+ width: 19upx;
|
|
|
+ height: 27upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .inputnamt {
|
|
|
+ height: 80upx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ border-bottom: 2px solid #f4f4f4;
|
|
|
+ .title {
|
|
|
+ color: #2f2f2f;
|
|
|
+ }
|
|
|
+ .txt {
|
|
|
+ flex: 1;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .icon-warp {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ align-items: center;
|
|
|
+ padding: 20upx 0;
|
|
|
+ border-bottom: 2px solid #f4f4f4;
|
|
|
+ .title {
|
|
|
+ color: #2f2f2f;
|
|
|
+ }
|
|
|
+ .icon {
|
|
|
+ width: 185upx;
|
|
|
+ height: 185upx;
|
|
|
+ background-color: pink;
|
|
|
+ border-radius: 20upx;
|
|
|
+ }
|
|
|
+ .upload {
|
|
|
+ width: 185upx;
|
|
|
+ height: 185upx;
|
|
|
+ border: 2px dashed #ccc;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 185upx;
|
|
|
+ border-radius: 20upx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .noticeContent {
|
|
|
+ padding: 40upx;
|
|
|
+ border: 2px solid #f4f4f4;
|
|
|
+ margin-top: 20upx;
|
|
|
+ }
|
|
|
+ .btn-warp {
|
|
|
+ margin-top: 80upx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: center;
|
|
|
+ .btn {
|
|
|
+ width: 600upx;
|
|
|
+ height: 90upx;
|
|
|
+ border-radius: 20upx;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 90upx;
|
|
|
+ color: #fff;
|
|
|
+ font-size: 30upx;
|
|
|
+ font-weight: 700;
|
|
|
+ letter-spacing: 2upx;
|
|
|
+ background-color: #169bd5;
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
</style>
|
