上传多张图片, 用files
<template>
<view class="page">
<view>
<view class="cu-load load-modal" v-if="finsh == false">
<view class="cuIcon-emojifill text-orange"></view>
<view class="gray-text">加载中...</view>
</view>
<!-- 开始。。。。。。。。。。。。。。。。。 -->
<!-- <view class="cu-bar bg-white ">
<view class="action">
模板名字:{{templateInfo.name}}
</view>
</view> -->
<!-- <view class="cu-bar bg-white ">
<view class="action">
请填写相关内容:
</view>
</view> -->
<!-- 主题模块 -->
<view v-if="finsh">
<form v-if="look == false">
<view class="ml margin-top" style="display: block;" v-for="(item, index) in templateInfo.eventsEntityList">
<view class="title">{{(index + 1) + ":" + item.name}}</view>
<view style="margin-top: 10rpx;" >
<textarea maxlength="-1" placeholder="请输入" style="height: 100rpx;" v-model="inputText[index]"></textarea>
</view>
</view>
</form>
<form v-if="look == true">
<view class="ml margin-top" style="display: block;" v-for="(item, index) in templateInfo.eventsEntityList">
<view class="title">{{(index + 1) + ":" + item.name}}</view>
<view style="margin-top: 10rpx;">
<view class="title" style="margin-left: 38rpx;">{{inputText[index]}}</view>
</view>
</view>
</form>
<form >
<view class="cu-form-group ">
<view class="title">上传资料图片(选填)</view>
<button class="cu-btn bg-green shadow" data-target="Modal" @click="chooiceImages()">点击上传</button>
</view>
<text class="jiachu" style="font-weight: 400; color: #007AFF; margin-left: 30rpx;" v-for="(item, index) in tempFilePaths">{{item}}</text>
<view class=" margin-top" style="margin-left: 30rpx;" v-if="tempFilePaths.length != 0">
<view class="title">
<text class="jiachu" style="font-weight: 400; color: #007AFF;" @click="preView">点击预览</text>
</view>
</view>
</form>
<!-- <view class="ml black">
<view class="title">模板名字:</view>
</view>
<view class="ml ">
<view class="title">{{name}}</view>
</view>
<view class="ml black">
<view class="title">{{prompting}}</view>
</view> -->
<!-- <input style="display: block; margin-left: 30rpx; margin-top: 15rpx;" placeholder="请输入..." name="input"
v-model="description"></input> -->
<view v-if="look == false">
<view class="ml liuc">
<view class="title" style="font-weight: 800;">审批流程如下:</view>
</view>
<form>
<view v-for="(item, index) in list" class="spnode">
<view class="title" style="margin-left: 30rpx; font-weight: 600;">节点{{index + 1}} <text v-if="item.dynamic == 1"> (动态节点, 请选择审批人)</text> </view>
<view v-if="item.dynamic == 1">
<view class="ml2">
<view class="title">节点标题:</view>
<view>{{item.name}}</view>
</view>
<view class="ml2">
<view class="title">选择学院:</view>
<view class="sun-input-box">
<view class="sun-input-box">
<view class="uni-list-cell-db" @click="changeCollegeIndex(index)">
<picker @change="bindPickerChange" :value="collegeIndexList[index]" :range="array">
<view class="uni-input">{{array[collegeIndexList[index]]}}</view>
</picker>
</view>
</view>
</view>
</view>
<view class="ml2">
<view class="title">选择老师:</view>
<view class="sun-input-box">
<view class="sun-input-box">
<view class="uni-list-cell-db" @click="changeCollegeIndex(index)">
<picker @change="bindPickerChange2" :value="collegeIndexList[index]"
:range="teacherList[index]">
<view class="uni-input">{{teacherList[index][teacherListIndex[index]]}}</view>
</picker>
</view>
</view>
</view>
</view>
<view class="cu-bar bg-white" style="width: 100%; margin-top: 20rpx;" >
<view class="search-form round">
<!-- <text class="cuIcon-search"></text> -->
<input v-model="searchText[index]" type="text" placeholder="输入关键字筛选审批人" confirm-type="search" style="padding-left: 20rpx;"></input>
</view>
<view class="action" >
<button class="cu-btn shadow-blur round" style="background-color: rgb(17, 198, 69); color: #fff;" @click="searchSPR(index)">确定</button>
</view>
</view>
</view>
<view v-else>
<view class="ml2">
<view class="title">节点标题:</view>
<view class="title">{{item.name}}</view>
</view>
<view class="ml2">
<view class="title">审批人:</view>
<view class="title">{{item.userName}}</view>
</view>
</view>
</view>
</form>
</view>
<view v-if="look == true">
<view class="ml liuc">
<view class="title" style="font-weight: 800;">审批流程如下:</view>
</view>
<form>
<view v-for="(item, index) in list" style="margin-bottom: 60rpx;">
<view class="title" style="margin-left: 30rpx; font-weight: 600;">节点{{index + 1}} <text v-if="item.dynamic == 1"> (动态节点, 请选择审批人)</text> </view>
<view >
<view class="ml2">
<view class="title">节点标题:</view>
<view class="title">{{item.name}}</view>
</view>
<view class="ml2">
<view class="title">审批人:</view>
<view class="title">{{teacherList[index][teacherListIndex[index]]}}</view>
</view>
</view>
</view>
</form>
</view>
<!-- <button class="cu-btn round" :class="['bg-' + 'cyan']" style="margin-top: 20rpx; margin-left: 20rpx;"
@click="ctreateOA">增加节点</button>
<button class="cu-btn round" :class="['bg-' + 'red']" style="margin-top: 20rpx; margin-left: 20rpx;"
@click="deleteOA">删除节点</button> -->
<button class="cu-btn round" :class="['bg-' + 'green']" style="width: 40%; margin-top: 40rpx; margin-left: 5%;"
@click="havelook">{{bu == undefined ? '查看' : bu}}</button>
<button class="cu-btn round" :class="['bg-' + 'blue']" style="width: 40%; margin-top: 40rpx; margin-left: 5%;"
@click="submitOA01">提交审批</button>
</view>
</view>
</view>
</template>
<script>
import constant from "../../common/constant/constant.js"
let baseUrl = constant.url;
export default {
data() {
return {
kindex: 0,
modalName: null,
array: [], //所有的学院
index: 0,
appId: '', //用户的学院ID
collegeIndexList: [0], //我们选择的学院ID下标存在这里
currentIndex: 0, //当前操作的哪个节点
appIdList: [], // 存的是学院的ID
node: [], //代表节点的数量
//下面是选择了学院后的, 学院里面人的列表
teacherList: [], //老师列表
teacherListIndex: [], // 每个节点选择的老师的index
teacherIdList: [], //老师的id列表 二维数组,
nodeNum: 0,
nodeSum: 0,
scope: '',
template_name: '',
template_info: '',
nodeName: [],
switchA: [],
templateId: '',
list: null,
name: '',
prompting: '',
templateName: '',
userNumber: '',
description: '',
appName: '',
userName: '',
templateInfo: null,
searchText: [],
inputText: [],
look: false,
bu: '查看',
finsh: false,
approveTemplateRequest: {},
fileList:[],
tempFilePaths: [],
events: "",
nodeEntityList: ""
}
},
methods: {
preView(){
//console.log(res);
uni.previewImage({
urls: this.tempFilePaths,
longPressActions: {
itemList: ['发送给朋友', '保存图片', '收藏'],
success: function(data) {
console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
},
fail: function(err) {
console.log(err.errMsg);
}
}
});
},
chooiceImages(){ //选择图片
uni.chooseImage({
count: 9, //默认9
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
sourceType: ['album'], //从相册选择
success: (chooseImageRes) => {
const tempFilePaths = chooseImageRes.tempFilePaths;
this.tempFilePaths = tempFilePaths;
let fileList = [];
for (var i = 0; i < tempFilePaths.length; i++) {
fileList.push({
name: 'file' + i,
uri: tempFilePaths[i]
})
}
console.log("-------------");
console.log(fileList);
this.fileList = fileList;
}
});
},
// sumitNotWithImges(){
// this.api.createOneApprove(this.approveTemplateRequest).then(res => {
// uni.showToast({
// title: '申请成功,正在跳转',
// duration: 1500
// })
// setTimeout(function() {
// uni.switchTab({
// url: '/pages/OAIndex/OAIndex'
// });
// }, 1000)
// })
// },
submitImages(){ // 最后提交信息的代码********************************************************************************
console.log(this.templateId);
uni.uploadFile({
url: baseUrl + "/main/upload/uploadSPImg",
files: this.fileList,
header: {
"SUSE-TOKEN": uni.getStorageSync("token"),
"USER-ID": uni.getStorageSync("userId")
},
formData: {
templateId: this.templateId,
appId: this.appId,
userNumber: this.userNumber,
events: this.events,
appName: this.appName,
userName: this.userName,
nodeEntityList: this.nodeEntityList
},
success: (uploadFileRes) => {
console.log(uploadFileRes);
uni.showToast({
title: '申请成功,正在跳转',
duration: 1500
})
setTimeout(function() {
uni.switchTab({
url: '/pages/OAIndex/OAIndex'
});
}, 1000)
}
});
},
havelook(){
this.look = ! this.look;
if(this.look){
this.bu = "编辑";
}else{
this.bu = "查看";
}
},
SwitchA(index) {
//this.switchA[index] = !this.switchA[index];
this.$set(this.switchA, index, !this.switchA[index])
console.log(this.switchA);
},
showModal(e) {
this.modalName = e.currentTarget.dataset.target
},
hideModal(e) {
this.modalName = null
},
addNode() {
this.modalName = null
},
RegionChange(e) {
this.region = e.detail.value
},
bindPickerChange: function(e) { //改变的事件名
//console.log('picker发送选择改变,携带值为', e.target.value) 用于输出改变索引值
this.index = e.target.value //将数组改变索引赋给定义的index变量
//this.collegeIndexList[this.currentIndex] = e.target.value;
this.$set(this.collegeIndexList, this.currentIndex, e.target.value)
// console.log(this.currentIndex);
// console.log(this.collegeIndexList[this.currentIndex]);
// console.log(this.array[this.collegeIndexList[this.currentIndex]]);
this.jg = this.array[this.index] //将array【改变索引】的值赋给定义的jg变量
//console.log("学院为:",this.jg) //输出获取的籍贯值,例如:中国
//console.log(this.appId);
this.setTeacher(this.appIdList[e.target.value])
},
bindPickerChange2: function(e) { //改变的事件名
//console.log('picker发送选择改变,携带值为', e.target.value) 用于输出改变索引值
this.index = e.target.value //将数组改变索引赋给定义的index变量
//this.collegeIndexList[this.currentIndex] = e.target.value;
this.$set(this.teacherListIndex, this.currentIndex, e.target.value)
// console.log(this.currentIndex);
console.log(this.teacherListIndex[this.currentIndex]);
// console.log(this.array[this.collegeIndexList[this.currentIndex]]);
this.jg = this.teacherList[this.currentIndex][this.index] //将array【改变索引】的值赋给定义的jg变量
//console.log("学院为:",this.jg) //输出获取的籍贯值,例如:中国
this.teacherListIndex[this.currentIndex] = e.target.value;
//console.log(this.appId);
},
changeCollegeIndex(index) {
//console.log(index);
this.currentIndex = index;
},
ctreateOA() {
this.nodeSum += 1;
this.collegeIndexList.push(0);
this.addTeachers(this.appIdList[0]);
},
deleteOA() {
this.nodeSum -= 1;
},
addTeachers(appid) {
let t = [];
let t2 = [];
console.log(appid);
this.api.listTeachersByAppId(appid).then(res => {
this.finsh = true;
this.api.checkRole(res);
//console.log(res[1].data.data);
for (let i = 0; i < res[1].data.data.length; i++) {
t.push(res[1].data.data[i].username)
t2.push(res[1].data.data[i].userid)
}
//console.log(t);
//this.$set(this.teacherIdList, this.teacherIdList.length, t2);
//this.$set(this.teacherList, this.teacherList.length, t);
//this.$set(this.teacherListIndex, this.teacherListIndex.length, 0);
for (var i = 0; i < 100; i++) {
this.teacherList.push(t);
this.teacherIdList.push(t2);
this.teacherListIndex.push(0)
}
//console.log(this.teacherList);
})
},
searchSPR(index){
console.log(index);
this.currentIndex = index;
this.appIdList[index];
console.log(this.appIdList[this.collegeIndexList[index]]);
this.setTeacher(this.appIdList[this.collegeIndexList[index]], this.searchText[index], index);
},
// setTeacher(appid) {
// let t = [];
// let t2 = [];
// console.log(appid);
// this.api.listTeachersByAppId(appid).then(res => {
// //console.log(res[1].data.data);
// for (let i = 0; i < res[1].data.data.length; i++) {
// t.push(res[1].data.data[i].username)
// t2.push(res[1].data.data[i].userid)
// }
// //console.log(t);
// this.$set(this.teacherIdList, this.currentIndex, t2);
// this.$set(this.teacherList, this.currentIndex, t);
// this.$set(this.teacherListIndex, this.currentIndex, 0);
// // this.teacherIdList.push(t2);
// // this.teacherList.push(t);
// //console.log(this.teacherList);
// })
// },
setTeacher(appid, searchkey, index) {
let t = [];
let t2 = [];
console.log(appid);
this.api.listTeachersByAppId(appid, searchkey).then(res => {
this.finsh = true;
this.api.checkRole(res);
console.log(res[1].data.data);
for (let i = 0; i < res[1].data.data.length; i++) {
t.push(res[1].data.data[i].username)
t2.push(res[1].data.data[i].userid)
}
//console.log(t);
if(index == undefined){
index = this.currentIndex;
}
this.$set(this.teacherIdList, index, t2);
this.$set(this.teacherList, index, t);
this.$set(this.teacherListIndex, index, 0);
// this.teacherIdList.push(t2);
// this.teacherList.push(t);
//console.log(this.teacherList);
})
},
submitOA01(){
for(let i = 0; i < this.templateInfo.eventsEntityList.length; i++){
// this.inputText.push("a")
if(this.inputText[i] == "" || this.inputText[i] == undefined){
uni.showToast({
title: "资料未填写完成",
image: '/static/imgs/noRole.png',
duration: 3000
})
return;
}
}
let that = this;
uni.showModal({
title: '提示',
content: '确定提交吗?',
success: function(res) {
if (res.confirm) {
that.submitOA();
} else if (res.cancel) {
// console.log('用户点击取消');
}
}
});
},
submitOA() {
let approveTemplateRequest = {
templateId: this.templateId,
appId: this.appId,
userNumber: this.userNumber,
events: "",
appName: this.appName,
userName: this.userName,
approveNodeEntityList: [
]
};
/*
**************拼接JSON字符串 提交的信息********************************************************
*/
let s = "[";
for(let i = 0; i < this.templateInfo.eventsEntityList.length; i++){
s += "{";
s += '"name":"' + this.templateInfo.eventsEntityList[i].name + '",'
s += '"ans":"' + this.inputText[i] + '",'
s += '"eventId":"' + this.templateInfo.eventsEntityList[i].eventId + '"'
s += "}"
if(i != this.templateInfo.eventsEntityList.length - 1){
s += ",";
}
}
s += "]"
this.events = s;
approveTemplateRequest.events = s;
/*
*********************************************这里是模板节点信息 ********************************************************
*/
s = "[";
for (let i = 0; i < this.list.length; i++) {
let item = this.list[i];
if (item.dynamic == 1) {
let t = {};
s += "{";
s += '"name":"' + this.teacherList[i][this.teacherListIndex[i]] + '",'
s += '"userAppId":"' + this.appIdList[this.collegeIndexList[i]] + '",'
s += '"userNumber":"' + this.teacherIdList[i][this.teacherListIndex[i]] + '"'
s += "}"
if(i != this.list.length - 1){
s += ",";
}
t.name = this.teacherList[i][this.teacherListIndex[i]];
t.userAppId = this.appIdList[this.collegeIndexList[i]];
t.userNumber = this.teacherIdList[i][this.teacherListIndex[i]];
approveTemplateRequest.approveNodeEntityList.push(t);
}
}
s += "]"
this.nodeEntityList = s;
console.log(approveTemplateRequest);
this.approveTemplateRequest = approveTemplateRequest;
console.log("AAAAAAAAAAAAAAAA");
this.submitImages();// ******************************************调用最后提交代码方法***************************************
// this.api.createOneApprove(approveTemplateRequest).then(res => {
// uni.showToast({
// title: '申请成功,正在跳转',
// duration: 1500
// })
// setTimeout(function() {
// uni.switchTab({
// url: '/pages/OAIndex/OAIndex'
// });
// }, 1000)
// })
}
},
created() {
this.api.getCollege().then(res => {
this.finsh = true;
this.api.checkRole(res);
for (let i = 0; i < res[1].data.data.length; i++) {
this.$set(this.array, i, res[1].data.data[i].appname);
this.array.push(res[1].data.data[i].appname)
this.appIdList.push(res[1].data.data[i].appid)
}
this.college = res[1].data.data;
this.appId = res[1].data.data[0].appid;
this.addTeachers(this.appId);
})
},
onLoad: function(option) { //option为object类型,会序列化上个页面传递的参数
this.templateId = option.id;
this.name = option.name;
this.prompting = option.prompting;
this.scope = option.scope;
uni.setNavigationBarTitle({
title: option.name
});
// this.api.findNodesByTemplateId(this.templateId).then(res => {
// this.list = res[1].data.data;
// //console.log(this.list);
// })
this.api.findTemplateByTemplateId(this.templateId).then(res=>{
this.finsh = true;
this.api.checkRole(res);
this.list = res[1].data.data.approveNodeVOList;
this.templateInfo = res[1].data.data;
console.log(this.templateInfo);
//console.log(this.templateInfo);
// for(let i = 0; i < this.templateInfo.eventsEntityList.length; i++){
// this.inputText[i] = "是是是";
// }
})
for (let i = 0; i < 100; i++) {
this.collegeIndexList[i] = 0;
this.teacherListIndex[i] = 0;
};
let that = this;
uni.getStorage({
key: "userInfo",
success: function(res) {
//console.log(res.data);
that.appName = res.data.appName;
that.appId = res.data.appid;
that.userNumber = res.data.userid;
that.userName = res.data.username;
}
});
},
}
</script>
<style scoped>
.page{
background-color: #ffff;
margin-top: -30rpx;
padding-top: 30rpx;
height: 100%;
background-color: #ffffff;
}
.ml {
background-color: #ffffff;
padding: 1upx 30upx;
display: flex;
align-items: center;
min-height: 100upx;
justify-content: space-between;
border-top: 1px solid #f1f1f1;
padding-top: 30rpx;
}
.spnode{
margin-bottom: 60rpx;
border-top: 1px solid #f1f1f1;
padding-top: 30rpx;
}
.black {
font-weight: 600;
margin-top: 30rpx;
}
.liuc{
font-size: 30rpx;
margin-top: 30rpx;
margin-bottom: 10rpx;
}
.ml2{
padding: 1upx 30upx;
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 30rpx;
font-size: 30rpx;
}
.jiachu {
font-weight: 600;
}
</style>
上传单张图片 用路径
<template>
<view class="user">
<!-- 头部 -->
<view class="user-wrap" >
<view class="setting iconfont icon31shezhi"></view>
<view class="info">
<image class="avatar" mode="aspectFill" :src="myUserInfo.headImgUrl == null || myUserInfo.headImgUrl == '' ? defaultHeadUrl:baseImgUrl + myUserInfo.headImgUrl " @click="chageHeadImg"></image>
<view class="nickname">{{ myUserInfo.username }}</view>
</view>
</view>
<!-- 订单状态 -->
<view class="order-status">
<view class="status-wrap">
<!-- 单元格 -->
<!-- <view class="cell">
<view class="cell-left">
<image class="cell-icon" src="/static/images/user/icon-order.png" mode="aspectFill"></image>
<view class="cell-text">全部订单</view>
</view>
<view class="iconfont iconmore1"></view>
</view> -->
<!-- 订单状态 -->
<!-- <view class="status-list">
<view class="status-item" hover-class="btn-hover" v-for="(item, index) in orderStatusList" :key="index">
<view class="item-icon" :class="item.icon"></view>
<view class="item-text">{{ item.name }}</view>
</view>
</view> -->
</view>
</view>
<!-- 滑动导航 -->
<!-- <view style="border-radius: 20rpx; overflow: hidden; margin: 0 20rpx;">
<com-nav :list="list" :col="4"></com-nav>
</view> -->
<!-- 用户功能 -->
<view class="com-item" style="margin-top: 80rpx;">
<view class="com-wrap">
<view class="cell" v-for="(item, index) in userList" :key="index"
@click="serverListClick2(item)"
v-if="userInfo.jurisdictionLevel >= item.level">
<view class="cell-left">
<image class="cell-icon" :src="item.icon" mode="aspectFill"></image>
<view class="cell-text">{{ item.title }}</view>
</view>
<view class="iconfont iconmore1 tishinum" v-if="item.num > 0">{{item.num}}</view>
</view>
</view>
</view>
<!-- 用户服务 -->
<view class="com-item">
<view class="com-wrap">
<view class="cell" v-for="(item, index) in serverList" :key="index"
@click="serverListClick(item)">
<view class="cell-left">
<image class="cell-icon" :src="item.icon" mode="aspectFill"></image>
<view class="cell-text">{{ item.title }}</view>
</view>
<view class="iconfont iconmore1"></view>
</view>
</view>
</view>
</view>
</template>
<script>
import comNav from './components/com-nav.vue'
import constant from "../../common/constant/constant.js"
let baseUrl = constant.url;
let baseImgUrl = constant.baseImgUrl;
export default {
components: {
comNav
},
data() {
return {
myRole: 'student',
roleCode: '',
userInfo: {
headPicUrl: '/static/images/user/avatar.jpg',
nickName: '史蒂芬.林'
},
orderStatusList: [{
name: '待付款',
icon: 'iconfont icon31daifukuan',
status: 10
},
{
name: '待发货',
icon: 'iconfont icon31daifahuo',
status: 30
},
{
name: '待收货',
icon: 'iconfont icon31daishouhuo',
status: 40
},
{
name: '待评价',
icon: 'iconfont icon31daipingjia',
status: 50
},
{
name: '已完成',
icon: 'iconfont icon31yiguanzhudianpu',
status: 55
}
],
currentIndex: 0,
list: [{
icon: '/static/images/user/class-01.png',
text: '我的电子券'
},
{
icon: '/static/images/user/class-02.png',
text: '退换/售后'
},
{
icon: '/static/images/user/class-03.png',
text: '我的积分'
},
{
icon: '/static/images/user/class-04.png',
text: '送礼提醒'
}
],
userList: [
{
title: '管理台',
icon: '/static/images/user/icon-kefu.png',
path: 'browse-list',
level: 4,
url: '/pages/user/secondpage/admin/admin'
},
{
title: '扩展功能',
icon: '/static/images/user/icon-collect.png',
path: 'collect-list',
level: 0,
//url: '/pages/user/secondpage/released',
url: '/pages/user/secondpage/extern/extern'
},
// {
// title: '新闻统计',
// icon: '/static/images/user/class-04.png',
// path: 'browse-list',
// level: 0,
// url: '/pages/statistics/index'
// },
{
title: '我的审批',
icon: '/static/images/user/class-02.png',
path: 'browse-list',
level: 0,
url: '/pages/OAIndex/myOAList/myOAList'
},
{
title: '待我审批',
icon: '/static/images/user/class-04.png',
path: 'browse-list',
num: 0,
level: 1,
url: '/pages/OAIndex/needOA/needOA'
},
],
serverList: [{
title: '帮助中心',
icon: '/static/images/user/icon-help.png',
path: 'help',
all:true,
url: '/pages/user/secondpage/help'
},
{
title: '版本',
icon: '/static/images/user/icon-order.png',
path: 'kefu',
all:true,
url: '/pages/user/secondpage/version'
},
{
title: '退出登录',
icon: '/static/images/user/icon-about.png',
text: '1.0.0',
all:true,
url: 'logout'
}
],
myUserInfo: '',
defaultHeadUrl:'../../static/imgs/suse_logo.jpg',
baseImgUrl: baseImgUrl
};
},
methods: {
changeImgUrl(){
this.api.getUserInfo(this.myUserInfo.userid).then(res=>{
this.api.checkRole(res);
this.myUserInfo.headImgUrl = res[1].data.data.headImgUrl;
uni.setStorage({
key: 'userInfo',
data: this.myUserInfo,
});
console.log(this.myUserInfo.headImgUrl);
})
},
chageHeadImg(){
uni.chooseImage({
count: 1,
sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图,默认二者都有
// sourceType: ['album'],//从相册选择
success: (chooseImageRes) => {
const tempFilePaths = chooseImageRes.tempFilePaths;
uni.uploadFile({
url: baseUrl + "/main/upload/uploadHeadImg", //仅为示例,非真实的接口地址
filePath: tempFilePaths[0],
name: 'file',
header: {
"SUSE-TOKEN": uni.getStorageSync("token"),
"USER-ID": uni.getStorageSync("userId")
},
formData: {
'userId': this.myUserInfo.userid
},
success: (uploadFileRes) => {
console.log(uploadFileRes.data);
this.changeImgUrl();
}
});
}
});
},
// 下拉刷新
onPullDownRefresh() {
let _self = this
console.log('refresh');
this.listNeedMeToApprove();
setTimeout(function() {
uni.stopPullDownRefresh();//停止当前页面下拉刷新
}, 1000);
},
serverListClick(item, index) {
if(item.url == 'logout'){
uni.showModal({
title: '提示',
content: '确定要退出吗?',
success: function(res) {
if (res.confirm) {
console.log("aa");
uni.clearStorageSync();
uni.redirectTo({
url: "/pages/login/login"
})
} else if (res.cancel) {
// console.log('用户点击取消');
}
}
});
}else {
let myUrl = item.url;
uni.navigateTo({
url: myUrl
})
}
},
serverListClick2(item, index) {
let myUrl = item.url;
const value = uni.getStorageSync('userInfo');
uni.navigateTo({
url: myUrl
})
},
listNeedMeToApprove(){
// console.log("------------------");
this.api.listNeedMeToApprove(this.myUserInfo.appid, this.myUserInfo.userid).then(res=>{
this.api.checkRole(res);
// console.log(res);
// console.log(this.userList[5]);
this.userList[3].num = res[1].data.data.length;
console.log(res[1].data.data,);
uni.setStorage({
key: 'myReading',
data: res[1].data.data,
});
})
}
},
created() {
let that = this;
uni.getStorage({
key: "userInfo",
success: function(res) {
console.log(res.data);
that.myUserInfo = res.data;
console.log(that.myUserInfo);
that.myRole = res.data.role;
that.userInfo = res.data;
that.listNeedMeToApprove();
}
})
}
};
</script>
<style lang="scss" scoped>
.tishinum {
width: 60rpx !important;
height: 40rpx !important;
line-height: 40rpx !important;
background-color:red;
color: #fff !important;
border-radius: 10px !important;
font-size: 15rpx !important;
text-align: center !important;
}
page {
background: #f2f2f2;
}
.btn-hover {
background: #f2f2f2 !important;
}
.user {
.user-wrap {
display: flex;
justify-content: center;
align-items: center;
height: 50vw;
padding: 30rpx;
z-index: 9;
border-radius: 0 0 20% 20%;
background-image: url('~@/static/extern/2024.png');
background-size: cover;
.setting {
color: #fff;
position: absolute;
top: 60rpx;
left: 60rpx;
font-size: 50rpx;
}
.info {
position: absolute;
text-align: center;
.avatar {
width: 150rpx;
height: 150rpx;
border-radius: 50%;
}
.nickname {
color: #fff;
font-size: 28rpx;
}
}
}
.order-status {
padding: 0 20rpx;
margin-top: -10vw;
.status-wrap {
border-radius: 25rpx;
overflow: hidden;
.status-list {
display: flex;
justify-content: space-evenly;
align-items: center;
background: #fff;
padding-top: 30rpx;
padding-bottom: 30rpx;
.status-item {
flex: 1;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
.item-icon {
line-height: 1;
font-size: 65rpx;
color: #bbb;
}
.item-text {
font-size: 28rpx;
color: #666;
margin-top: 5rpx;
}
}
}
}
}
.com-item {
padding-left: 20rpx;
padding-right: 20rpx;
margin-top: 20rpx;
.com-wrap {
border-radius: 25rpx;
overflow: hidden;
}
}
.cell {
height: 80rpx;
padding-left: 20rpx;
padding-right: 20rpx;
display: flex;
justify-content: space-between;
align-items: center;
background: #fff;
border-bottom: 1px solid #f8f8f8;
&:active {
background: #f2f2f2;
}
&:last-child {
border-bottom: none !important;
}
.cell-left {
display: flex;
align-items: center;
.cell-icon {
width: 50rpx;
height: 50rpx;
}
.cell-text {
color: #666;
font-size: 28rpx;
margin-left: 20rpx;
}
}
.iconfont {
font-size: 40rpx;
color: #999;
}
}
}
</style>
更新APP
<template>
<view style="width: 100%; height: 100%;">
<view class="cu-load load-modal" v-if="finsh == false ">
<view class="cuIcon-emojifill text-orange"></view>
<view class="gray-text">{{showText}}</view>
</view>
<view class="top">
<text>当前版本:{{vsersionCode}}</text>
<text class="startUpdate" @click="updateVersion">检测更新</text>
</view>
<!-- 進度展示 -->
<view class="steps" style="margin-top: 50rpx;">
<view class="step" v-for="(item, i) in list" :key="i">
<!-- 左侧 -->
<view class="step_left">{{item.createTime}}</view>
<!-- <view class="reading" v-if="item.currentNode == 1">审批中</view> -->
<!-- 中部 -->
<view class="step_mid">
<view class="step_dot" :style="colorList2[1]">{{ stepType === 'number' ? i + 1 : '' }}</view>
<template v-if="i < list.length - 1">
<view class="step_line" :style="colorList[1]"></view>
</template>
</view>
<!-- 右侧 -->
<view class="step_right">
<view class="step_name">版本:{{ item.versionCode }}</view>
<view class="step_idea">更新内容:{{ item.message}}</view>
<!-- <view class="step_idea" v-if="item.idea == 2">未通过</view> -->
<!-- <view class="step_idea" v-if="(item.idea == 1 || item.idea == 2) && item.description != ''">审批意见:{{item.description}}</view> -->
</view>
</view>
</view>
</view>
</template>
<script>
import constant from "../../../common/constant/constant.js"
let vsersionCode = constant.versionCode;
export default {
props: {
// 步骤条格式 数字或者为点
stepType: {
type: String,
default: 'dot'
},
// 激活颜色
activeColor: {
type: String,
default: '#00ff7f'
},
refuseColor: {
type: String,
default: '#ff0000'
},
},
data() {
return {
kk: 'background-color: #007AFF;',
colorList: ['', 'background-color: #00de6b;', ''],
colorList2: ['', 'background-color: #00de6b;', 'background-color: #ff0000;'],
list: [{
currentNode: 1,
time: 'ss',
idea: 1,
versionCode: "sss",
message: "ss",
},
{
currentNode: 1,
time: 'ss',
idea: 1,
versionCode: "sss",
message: "ss",
},
{
currentNode: 1,
time: 'ss',
idea: 1,
versionCode: "sss",
message: "ss",
},
{
currentNode: 1,
time: 'ss',
idea: 1,
versionCode: "sss",
message: "ss",
}
],
vsersionCode: vsersionCode,
finsh: true,
showText: '正在下载安装包...'
};
},
created() {
this.getList();
},
methods: {
upload(url) {
let that = this;
uni.showModal({
title: '更新提示',
content: '当前存在高级版本,确定下载更新安装包吗?',
confirmText: '下载更新',
success: function(res) {
if (res.confirm) {
that.finsh = false;
that.showText = '正在下载安装包...';
var dtask = plus.downloader.createDownload(url, {}, function(d, status) {
that.finsh = true;
// 下载完成
if (status == 200) {
plus.runtime.install(plus.io.convertLocalFileSystemURL(d
.filename), {}, {}, function(error) {
uni.showToast({
title: '安装成功',
duration: 1500
});
})
} else {
uni.showToast({
title: '更新失败',
duration: 1500
});
}
});
dtask.start()
};
}
})
},
updateVersion() {
this.finsh = false;
this.api.getNewestVersion().then(res => {
console.log(res[1].data.data.versionCode);
if (res[1].data.data.versionCode == this.vsersionCode) {
uni.showToast({
title: '这已是最新版本',
duration: 1500
})
} else {
this.upload(res[1].data.data.uploadUrl);
}
})
this.finsh = true;
},
getList() {
this.list = [];
this.api.listAppVersionRecord().then(res => {
console.log(res);
for (var i = res[1].data.data.length - 1; i >= 0; i--) {
this.list.push(res[1].data.data[i]);
}
//this.list = res[1].data.data
})
},
getNewest() {
}
}
};
</script>
<style lang="scss" scoped>
.steps {
.reading {
position: absolute;
left: 50rpx;
color: #55aa00;
font-weight: 600;
}
.step {
display: flex;
.step_left {
width: 140rpx;
margin-top: -14rpx;
font-size: 26rpx;
line-height: 36rpx;
text-align: right;
}
.step_mid {
width: 40rpx;
display: flex;
flex-wrap: wrap;
justify-content: center;
margin: 0 25rpx;
.step_dot {
width: 40rpx;
height: 40rpx;
background: #fafafa;
border: 5rpx solid #f5f5f5;
border-radius: 50%;
color: #ffffff;
font-size: 28rpx;
text-align: center;
line-height: 40rpx;
}
.active_dot {
background: #00ff7f;
border: 5rpx solid #e3ebff;
}
.step_line {
width: 4rpx;
height: 160rpx;
background-color: #eeeeee;
}
.active_line {
background: #00ff00;
}
}
.step_right {
width: 430rpx;
height: fit-content;
padding: 25rpx 30rpx;
margin-top: -14rpx;
background-color: #fcfcfc;
border-radius: 10rpx;
display: flex;
flex-wrap: wrap;
align-content: center;
view {
width: 100%;
}
.step_name {
font-size: 30rpx;
margin-bottom: 10rpx;
}
.step_idea {
color: #999999;
font-size: 26rpx;
line-height: 40rpx;
}
}
}
}
.top {
margin-top: 50rpx;
margin-left: 50rpx;
}
.startUpdate {
float: right;
margin-right: 50rpx;
color: #007AFF;
}
</style>