czg_team/cashier_admin_app
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

first

Browse Source
This commit is contained in:
YeMingfei666
2024-09-10 10:49:08 +08:00
parent b5fd06b800
commit dd4f5938da
6391 changed files with 722800 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

362
pages/release/release - 副本.vue Normal file
View File

@@ -0,0 +1,362 @@
<template>
<view class="rekeaseMain">
<view class="main-title">
营销内容
</view>
<view class="banner-mian">
<view class="banner-list" v-for="(img,index) in imgList" :key="img">
<view class="banner-list-title">
第{{index+1}}屏广告
</view>
<image :src="img.url" mode="" @click="previewImage(img.url)"></image>
<view class="del-box">
<view class="del-tip" @click="delImg(index)">
<image style="height: 30rpx;width: 30rpx;margin-top:0rpx;" src="../../static/img/del.svg"
mode=""></image>
<text>删除</text>
</view>
</view>
</view>
<view class="addimg-box" v-if="imgList.length<5">
<view class="addimg-title" @click="cjimg">
<image src="../../static/img/add.svg" mode=""></image>
<view class="">
加一屏广告
</view>
</view>
</view>
</view>
<view class="">
<button
style="background: linear-gradient(45deg, #17c5c6, #15ccb0);color: #fff;border: 0; margin-top: 20rpx; margin-bottom: 60rpx;"
@click="beforeUploadImg">发布营销内容</button>
</view>
<view class="main-title">
跑马灯内容
</view>
<view class="PMDtextarea-box" v-show="!changeImgFlag">
<textarea v-model="PMDtextarea" name="" id="" maxlength="20"
style="background:#f4f4f4; width:100%;height:150rpx; box-sizing: border-box; border-radius: 10rpx; padding: 20rpx;"></textarea>
<view class="PMDtextarea-num">
{{PMDtextarea.length}}/20
</view>
</view>
<view class="fontColor-select">
<text>选择字体颜色</text>
<view @click="changeFontColor('font')"
style="width: 50rpx;height: 50rpx;border-radius: 10rpx; margin-left: 50rpx;"
:style="{background:fontColor}"></view>
</view>
<view class="fontColor-select">
<text>选择背景颜色</text>
<view @click="changeFontColor('background')"
style="width: 50rpx;height: 50rpx;border-radius: 10rpx; margin-left: 50rpx;"
:style="{background:BackgroundColor}"></view>
</view>
<view class="">
<button
style="background: linear-gradient(45deg, #17c5c6, #15ccb0);color: #fff;border: 0; margin-top: 20rpx; margin-bottom: 60rpx;"
@click="releaseLamp">发布跑马灯</button>
</view>
<view class="">
<button
style="background:#d1f3f5;color: #4ac3c3;border: 1px solid #15ccb0; margin-top: 20rpx; margin-bottom: 60rpx;">查看效果</button>
</view>
<picker-color :isShow="showPickerColor" :bottom="0" @callback='getPickerColor' />
<view class="">
<l-clipper v-if="show" @success="successImg" @cancel="show = false" :width="800" :height="960"
:is-lock-width="true" :is-lock-height="true" />
<!-- <button @tap="show = true">裁剪</button> -->
</view>
</view>
</template>
<script>
import {
$pmdfb,
$getImgWH,
$initializeImg,
$NewOssFilesForm,
$uploadImg
} from "@/http/apiManager.js"
import pickerColor from "@/components/helang-pickerColor/helang-pickerColor.vue"
import storageManage from '@/commons/utils/storageManage.js'
export default {
components: {
"picker-color": pickerColor,
},
data() {
return {
imgList: [],
changeImgFlag: false,
PMDtextarea: '',
showPickerColor: false,
fontColor: '#000',
BackgroundColor: '#000',
colorType: '',
selectImgData: {},
imageUrl: 'https://img12.360buyimg.com/pop/s1180x940_jfs/t1/97205/26/1142/87801/5dbac55aEf795d962/48a4d7a63ff80b8b.jpg',
show: false,
url: '',
formParams: '',
isOss: '',
ossImgUrl: [],
OSSurl: '',
}
},
onLoad(options) {
this.picUrl = ''; // 初始化图片
this.getImgWH()
this.getInitializeIMG() //回显图片
},
methods: {
cjimg() {
this.show = true
},
successImg(e) {
console.log(e);
this.show = false
this.imgList.push({
url: e.url
})
},
async getImgWH() {
let res = await $getImgWH('QR939200003565')
console.log(res);
if (res.code === 0) {
this.picSizeH = res.bizData.picHeight
this.picSizeW = res.bizData.picWidth
}
},
async getInitializeIMG() {
let res = await $initializeImg('QR939200003565')
console.log(res);
if (res.code === 0) {
if (res.bizData.length > 1) {
res.bizData.map(item => {
this.imgList.push({
url: item.picName
})
})
}
}
},
async releaseLamp() {
let data = {
deviceNo: 'QR939200003565',
inputText: this.PMDtextarea,
fontColor: this.fontColor,
bgColor: this.BackgroundColor,
}
let res = await $pmdfb(data)
console.log(res);
},
getPickerColor(color) {
if (color) {
if (this.colorType === 'font') {
this.fontColor = color
} else {
this.BackgroundColor = color
}
}
this.showPickerColor = false
},
changeFontColor(type) {
this.colorType = type
this.showPickerColor = true
},
previewImage(url) {
console.log(url);
let data = {
urls: []
}
data.urls.push(url)
uni.previewImage(data)
},
changeImg() {
this.changeImgFlag = true
},
delImg(index) {
this.imgList.splice(index, 1)
},
beforeUploadImg() {
this.ossImgUrl = []
let that = this
this.imgList.map(img => {
uni.getFileInfo({
filePath: img.url,
async success(imgs) {
let res = await $NewOssFilesForm({
bizType: "applyment",
sourceFileName: img.url,
sourceFileSize: imgs.size,
})
that.OSSurl = res.bizData.formActionUrl
that.formParams = res.bizData.formParams
that.ossImgUrl.push(res.bizData.ossFileUrl)
that.isOss = true
}
})
})
setTimeout(()=>{
console.log(that.ossImgUrl);
that.uploadImg(that.imgList, that.OSSurl, that.formParams, that.isOss, that.ossImgUrl)
},1000)
},
uploadImg(tempFilePaths, url, formParams, isOss, ossImgUrl) {
console.log(tempFilePaths, url, formParams, isOss, ossImgUrl);
const token = storageManage.token()
var successCount = 0 //多图时，上传成功数量
var qualification = [] //多图存储
let carouselPicInfo = []
ossImgUrl.forEach((item)=>{
carouselPicInfo.push({
picName: item
})
})
console.log(carouselPicInfo);
uni.uploadFile({
url: url,
filePath: this.imgList[0],
name: "file",
header: {
itoken: token,
},
formData: this.formParams,
// 代表完成的函数 注：此处可以传入三个函数 success （成功）/ fail（失败） / complete （完成）
// complete(res) {
// console.log(res,'resresres');
// $uploadImg({
// deviceNo: 'QR939200003565',
// carouselPicInfo: carouselPicInfo,
// }).then(({
// bizData
// }) => {
// console.log(bizData);
// })
// }
})
}
}
}
</script>
<style lang="scss" scoped>
.rekeaseMain {
padding: 20rpx;
.main-title {
line-height: 60rpx;
position: relative;
padding-left: 20rpx;
}
.main-title::after {
content: '';
display: block;
width: 8rpx;
background: #16c3c3;
height: 30rpx;
position: absolute;
left: 0;
top: 17rpx;
}
.banner-mian {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.banner-list {
width: 48%;
text-align: center;
height: 470rpx;
margin-top: 20rpx;
.banner-list-title {
background: #e7f9f9;
padding: 15rpx;
font-size: 24rpx;
color: #1ac3c7;
border-radius: 10rpx 10rpx 0 0;
height: 40rpx;
}
image {
width: 100%;
border-radius: 10rpx;
margin-top: -10rpx;
height: 340rpx;
}
.del-box {
display: flex;
justify-content: center;
margin-top: 16rpx;
.del-tip {
width: 40%;
background: #fce3df;
color: #f00;
border-radius: 30rpx;
border: 1px solid #f00;
font-size: 26rpx;
display: flex;
align-items: center;
justify-content: center;
padding: 4rpx;
}
}
}
.addimg-box {
width: 48%;
background: #f4f4f4;
border-radius: 10rpx;
display: flex;
align-items: center;
justify-content: center;
height: 400rpx;
margin-top: 20rpx;
.addimg-title {
display: flex;
flex-direction: column;
align-items: center;
image {
width: 50rpx;
height: 50rpx;
}
}
}
}
.PMDtextarea-box {
position: relative;
.PMDtextarea-num {
position: absolute;
right: 5rpx;
bottom: 10rpx;
}
}
.fontColor-select {
display: flex;
margin: 30rpx 0;
}
}
</style>

377
pages/release/release.vue Normal file
View File

@@ -0,0 +1,377 @@
<template>
<view class="rekeaseMain">
<view class="main-title">
营销内容
</view>
<view class="banner-mian">
<view class="banner-list" v-for="(img,index) in imgList" :key="img">
<view class="banner-list-title">
第{{index+1}}屏广告
</view>
<image :src="img.url" mode="" @click="previewImage(img.url)"></image>
<view class="del-box">
<view class="del-tip" @click="delImg(index)">
<image style="height: 30rpx;width: 30rpx;margin-top:0rpx;" src="../../static/img/del.svg"
mode=""></image>
<text>删除</text>
</view>
</view>
</view>
<view class="addimg-box" v-if="imgList.length<5">
<view class="addimg-title" @click="cjimg">
<image src="../../static/img/add.svg" mode=""></image>
<view class="">
加一屏广告
</view>
</view>
</view>
</view>
<view class="">
<button
style="background: linear-gradient(45deg, #17c5c6, #15ccb0);color: #fff;border: 0; margin-top: 20rpx; margin-bottom: 60rpx;"
@click="uploadImg">发布营销内容</button>
</view>
<view class="main-title">
跑马灯内容
</view>
<view class="PMDtextarea-box" v-show="!changeImgFlag">
<textarea v-model="PMDtextarea" name="" id="" maxlength="20"
style="background:#f4f4f4; width:100%;height:150rpx; box-sizing: border-box; border-radius: 10rpx; padding: 20rpx;"></textarea>
<view class="PMDtextarea-num">
{{PMDtextarea.length}}/20
</view>
</view>
<view class="fontColor-select">
<text>选择字体颜色</text>
<view @click="changeFontColor('font')"
style="width: 50rpx;height: 50rpx;border-radius: 10rpx; margin-left: 50rpx;"
:style="{background:fontColor}"></view>
</view>
<view class="fontColor-select">
<text>选择背景颜色</text>
<view @click="changeFontColor('background')"
style="width: 50rpx;height: 50rpx;border-radius: 10rpx; margin-left: 50rpx;"
:style="{background:BackgroundColor}"></view>
</view>
<view class="">
<button
style="background: linear-gradient(45deg, #17c5c6, #15ccb0);color: #fff;border: 0; margin-top: 20rpx; margin-bottom: 60rpx;"
@click="releaseLamp">发布跑马灯</button>
</view>
<view class="">
<button
style="background:#d1f3f5;color: #4ac3c3;border: 1px solid #15ccb0; margin-top: 20rpx; margin-bottom: 60rpx;">查看效果</button>
</view>
<picker-color :isShow="showPickerColor" :bottom="0" @callback='getPickerColor' />
<view class="">
<l-clipper v-if="show" @success="successImg" @cancel="show = false"
:width="800" :height="960"/>
<!-- <button @tap="show = true">裁剪</button> -->
</view>
</view>
</template>
<script>
import {
$pmdfb,
$getImgWH,
$initializeImg,
$NewOssFilesForm,
$uploadImg
} from "@/http/apiManager.js"
import pickerColor from "@/components/helang-pickerColor/helang-pickerColor.vue"
import storageManage from '@/commons/utils/storageManage.js'
export default {
components: {
"picker-color": pickerColor,
},
data() {
return {
imgList: [],
changeImgFlag: false,
PMDtextarea: '',
showPickerColor: false,
fontColor: '#000',
BackgroundColor: '#000',
colorType: '',
selectImgData: {},
imageUrl: 'https://img12.360buyimg.com/pop/s1180x940_jfs/t1/97205/26/1142/87801/5dbac55aEf795d962/48a4d7a63ff80b8b.jpg',
show: false,
url: '',
formParams: '',
isOss: '',
ossImgUrl: [],
OSSurl: '',
UploadImgList:[],
deviceNo:null,
}
},
onLoad(options) {
console.log(options,'deviceNodeviceNodeviceNodeviceNo');
if(options.deviceNo){
this.deviceNo=options.deviceNo
}
this.picUrl = ''; // 初始化图片
this.getImgWH()
this.getInitializeIMG() //回显图片
},
methods: {
cjimg() {
this.show = true
},
successImg(e) {
console.log(e);
this.show = false
this.imgList.push({
url: e.url
})
this.beforeUploadImg(e.url)
},
async getImgWH() {
let res = await $getImgWH(this.deviceNo)
console.log(res);
if (res.code === 0) {
this.picSizeH = res.bizData.picHeight
this.picSizeW = res.bizData.picWidth
}
},
async getInitializeIMG() {
let res = await $initializeImg(this.deviceNo)
console.log(res);
if (res.code === 0) {
if (res.bizData) {
res.bizData.map(item => {
this.imgList.push({
url: item.picName
})
})
}
}
},
async releaseLamp() {
let data = {
deviceNo: this.deviceNo,
inputText: this.PMDtextarea,
fontColor: this.fontColor,
bgColor: this.BackgroundColor,
}
let res = await $pmdfb(data)
console.log(res);
},
getPickerColor(color) {
if (color) {
if (this.colorType === 'font') {
this.fontColor = color
} else {
this.BackgroundColor = color
}
}
this.showPickerColor = false
},
changeFontColor(type) {
this.colorType = type
this.showPickerColor = true
},
previewImage(url) {
console.log(url);
let data = {
urls: []
}
data.urls.push(url)
uni.previewImage(data)
},
changeImg() {
this.changeImgFlag = true
},
delImg(index) {
this.imgList.splice(index, 1)
this.UploadImgList.splice(index,1)
},
beforeUploadImg(urls) {
let that=this
uni.getFileInfo({
filePath: urls,
success: (imgs) => {
console.log(imgs,'sourceFileNamesourceFileName');
$NewOssFilesForm({
bizType: "applyment",
// bizType: "material",
sourceFileName: urls,
sourceFileSize: imgs.size,
}).then(({
bizData
}) => {
console.log(bizData);
const token = storageManage.token()
let url=bizData.formActionUrl
let ossFileUrl=bizData.ossFileUrl
//调用图片上传方法
uni.uploadFile({
url: url,
filePath: urls,
name: "file",
header: {
itoken: token,
},
formData: bizData.formParams,
// 代表完成的函数 注：此处可以传入三个函数 success （成功）/ fail（失败） / complete （完成）
complete(res) {
console.log(res);
if(res.statusCode===200){
that.UploadImgList.push(ossFileUrl)
}
}
})
})
}
})
},
uploadImg() {
let carouselPicInfo=[]
this.imgList.forEach(item=>{
if(item.url.indexOf('aliyuncs')!==-1){
carouselPicInfo.push({
picName:item.url
})
}
})
this.UploadImgList.forEach(item=>{
carouselPicInfo.push({
picName:item
})
})
$uploadImg({
deviceNo:this.deviceNo,
carouselPicInfo:carouselPicInfo,
}).then(res=>{
uni.showToast({
title: '发布成功',
//将值设置为 success 或者直接不用写icon这个参数
icon: 'success',
//显示持续时间为 2秒
duration: 1000
})
})
}
}
}
</script>
<style lang="scss" scoped>
.rekeaseMain {
padding: 20rpx;
.main-title {
line-height: 60rpx;
position: relative;
padding-left: 20rpx;
}
.main-title::after {
content: '';
display: block;
width: 8rpx;
background: #16c3c3;
height: 30rpx;
position: absolute;
left: 0;
top: 17rpx;
}
.banner-mian {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
.banner-list {
width: 48%;
text-align: center;
height: 470rpx;
margin-top: 20rpx;
.banner-list-title {
background: #e7f9f9;
padding: 15rpx;
font-size: 24rpx;
color: #1ac3c7;
border-radius: 10rpx 10rpx 0 0;
height: 40rpx;
}
image {
width: 100%;
border-radius: 10rpx;
margin-top: -10rpx;
height: 340rpx;
}
.del-box {
display: flex;
justify-content: center;
margin-top: 16rpx;
.del-tip {
width: 40%;
background: #fce3df;
color: #f00;
border-radius: 30rpx;
border: 1px solid #f00;
font-size: 26rpx;
display: flex;
align-items: center;
justify-content: center;
padding: 4rpx;
}
}
}
.addimg-box {
width: 48%;
background: #f4f4f4;
border-radius: 10rpx;
display: flex;
align-items: center;
justify-content: center;
height: 400rpx;
margin-top: 20rpx;
.addimg-title {
display: flex;
flex-direction: column;
align-items: center;
image {
width: 50rpx;
height: 50rpx;
}
}
}
}
.PMDtextarea-box {
position: relative;
.PMDtextarea-num {
position: absolute;
right: 5rpx;
bottom: 10rpx;
}
}
.fontColor-select {
display: flex;
margin: 30rpx 0;
}
}
</style>