@@ -2,14 +2,15 @@ | |||||
<view class="cu-form-group"> | <view class="cu-form-group"> | ||||
<view class="grid col-4 grid-square flex-sub"> | <view class="grid col-4 grid-square flex-sub"> | ||||
<view | <view | ||||
v-for="(path, index) in imgList" | |||||
v-for="(item, index) in imgList" | |||||
@tap="viewImg" | @tap="viewImg" | ||||
:key="index" | :key="index" | ||||
class="bg-img" | class="bg-img" | ||||
> | > | ||||
<!-- {{API + '/user/img?data=' + (path.path ? path.path : path)}} --> | |||||
<image | <image | ||||
v-if="showfile()" | v-if="showfile()" | ||||
:src="path.path ? path.path : path" | |||||
:src="API + item.url" | |||||
mode="aspectFill" | mode="aspectFill" | ||||
></image> | ></image> | ||||
<view v-if="!readonly" @tap.stop="delImg(index)" class="cu-tag bg-red" style="width: 18px; height: 18px; font-size: 24px"> | <view v-if="!readonly" @tap.stop="delImg(index)" class="cu-tag bg-red" style="width: 18px; height: 18px; font-size: 24px"> | ||||
@@ -71,18 +72,66 @@ export default { | |||||
let {tempFilePaths,tempFiles} = res | let {tempFilePaths,tempFiles} = res | ||||
if(!this.validate(tempFiles))return | if(!this.validate(tempFiles))return | ||||
const newList = JSON.parse(JSON.stringify(this.imgList || [])).concat( | const newList = JSON.parse(JSON.stringify(this.imgList || [])).concat( | ||||
tempFilePaths | |||||
tempFilePaths.map(item=>{ | |||||
return{ | |||||
url:item, | |||||
id:'' | |||||
} | |||||
}) | |||||
); | ); | ||||
this.imgList = newList | this.imgList = newList | ||||
this.$emit("update:value", newList); | this.$emit("update:value", newList); | ||||
this.$emit("input", newList); | this.$emit("input", newList); | ||||
this.$emit("change"); | |||||
this.$emit("change",newList); | |||||
this.$emit("add"); | this.$emit("add"); | ||||
}, | }, | ||||
}); | }); | ||||
}, | }, | ||||
uploadImage(){ | |||||
// 单图上传 多图没写 | |||||
return new Promise(async (reslove,reject)=>{ | |||||
if(this.imgList.length){ | |||||
var postData = { | |||||
Base64Url: await this.imgToBase64(this.imgList[0].url) | |||||
} | |||||
this.HTTP_POST('StuInfoFresh/savePhoto', postData, '图片上传失败!').then((data) => { | |||||
if (data) { | |||||
reslove([{ | |||||
url:data.Url, | |||||
id:data.AnnexesFileId | |||||
}]) | |||||
}else{ | |||||
reject('图片上传失败!') | |||||
} | |||||
}) | |||||
}else{ | |||||
reslove("") | |||||
} | |||||
}) | |||||
}, | |||||
imgToBase64(url){ | |||||
return new Promise((resolve,reject)=>{ | |||||
var canvas = document.createElement('canvas'), | |||||
ctx = canvas.getContext('2d'), | |||||
img = new Image; | |||||
img.crossOrigin = 'Anonymous'; | |||||
img.onload = function () { | |||||
canvas.height = img.height; | |||||
canvas.width = img.width; | |||||
ctx.drawImage(img, 0, 0); | |||||
var dataURL = canvas.toDataURL('image/png'); | |||||
canvas = null; | |||||
resolve(dataURL) | |||||
}; | |||||
img.src = url; | |||||
}) | |||||
}, | |||||
validate(array){ | validate(array){ | ||||
let type = array.every(item=>{ | let type = array.every(item=>{ | ||||
return item.type && item.type.substring(0,6) == "image/" | return item.type && item.type.substring(0,6) == "image/" | ||||
@@ -107,9 +156,40 @@ export default { | |||||
current: this.imgList[index], | current: this.imgList[index], | ||||
}); | }); | ||||
}, | }, | ||||
// previewFile() { | |||||
// var file = document.querySelector('input[type=file]').files[0]; | |||||
// var reader = new FileReader(); | |||||
// // fileReader.readAsDataURL(blob); | |||||
// // fileReader.onerror = () => { | |||||
// // reject(new Error('blobToBase64 error')); | |||||
// // }; | |||||
// // var encodedData = window.btoa("Hello, world"); | |||||
// reader.onloadend = function () { | |||||
// //$('#PhotoImg').attr('src', reader.result); | |||||
// var postData = { | |||||
// Base64Url: reader.result | |||||
// } | |||||
// this.HTTP_POST(config.webapi + "StuInfoFresh/savePhoto", postData, (data) => { | |||||
// if (data) { | |||||
// $('#Photo').val(data.AnnexesFileId); | |||||
// $('#PhotoImg').attr('src', config.web + data.Url); | |||||
// } else { | |||||
// learun.layer.toast('采集照片信息失败!'); | |||||
// } | |||||
// }); | |||||
// } | |||||
// if (file) { | |||||
// reader.readAsDataURL(file); | |||||
// } | |||||
// }, | |||||
}, | }, | ||||
created() { | created() { | ||||
this.imgList = JSON.parse(JSON.stringify(this.value)) | |||||
this.imgList = JSON.parse(JSON.stringify(this.value.map(item=>{ | |||||
item.isUploaded = true | |||||
return item | |||||
}))) | |||||
// [{url:"",id:""}] | |||||
} | } | ||||
}; | }; | ||||
</script> | </script> |
@@ -22,11 +22,12 @@ export default { | |||||
// ], | // ], | ||||
"apiHost": [ | "apiHost": [ | ||||
// "http://localhost:31173/" | // "http://localhost:31173/" | ||||
"http://192.168.10.58:31173/" | |||||
"http://192.168.10.58:8012/" | |||||
], | ], | ||||
// 开发环境下自动填充登录账号密码,与接口地址一一对应,只在开发环境下显示 | // 开发环境下自动填充登录账号密码,与接口地址一一对应,只在开发环境下显示 | ||||
"devAccount": [ | "devAccount": [ | ||||
{ username: "21364200000400266", password: "www.qj.com" } | |||||
// 20201130230 | |||||
{ username: "420528200606205026", password: "www.qj.com" } | |||||
], | ], | ||||
//是否分布式部署 指WebApi与Web不在一台服务器 | //是否分布式部署 指WebApi与Web不在一台服务器 | ||||
"isDistributed":true, | "isDistributed":true, | ||||
@@ -998,6 +998,12 @@ | |||||
"style": { | "style": { | ||||
"navigationBarTitleText": "会议扫码签到" | "navigationBarTitleText": "会议扫码签到" | ||||
} | } | ||||
}, | |||||
{ | |||||
"path": "pages/MealCardRunTab/list", | |||||
"style": { | |||||
"navigationBarTitleText": "一卡通流水" | |||||
} | |||||
} | } | ||||
@@ -0,0 +1,239 @@ | |||||
<template> | |||||
<view class="page"> | |||||
<view class="mainpage" :class="sideOpen ? 'show' : ''" style="padding-top: 40px;"> | |||||
<!-- <l-customlist-banner></l-customlist-banner> --> | |||||
<!-- <view class="records"></view> --> | |||||
<!-- 顶部条目/分页信息栏 --> | |||||
<l-customlist-banner @buttonClick="sideOpen = true">共 {{ records }} 条数据</l-customlist-banner> | |||||
<l-scroll-list v-if="ready" @pullDown="pullDown" @toBottom="fetchList()" ref="data"> | |||||
<l-customlist :tips="loadState" showTips> | |||||
<l-list> | |||||
<l-list-item v-for="(item, ind) in data" :key="item.Id"> | |||||
<view style="flex: 1;color: #303133;font-size: 14px;padding: 8px 0;"> | |||||
<view class="wrap1">{{item.bigGroup}}</view> | |||||
<view style="color: #909399;font-size: 12px;"> | |||||
<view> | |||||
{{item.flowtype||"--"}} | |||||
</view> | |||||
<view>{{item.occurTime||"--"}}</view> | |||||
</view> | |||||
</view> | |||||
<view style="color: #303133;font-weight: 700;font-size: 18px;"> | |||||
{{item.flowamount}} | |||||
</view> | |||||
</l-list-item> | |||||
</l-list> | |||||
</l-customlist> | |||||
</l-scroll-list> | |||||
</view> | |||||
<!-- 侧边栏,用于设置查询条件 --> | |||||
<scroll-view :class="sideOpen ? 'show' : ''" class="sidepage" scroll-y> | |||||
<view v-if="ready" class="padding"> | |||||
<l-customlist-sidepage-datefilter | |||||
v-model="dateRange" | |||||
@change="searchChange" | |||||
title="按时间日期查询: " | |||||
ref="datefilter" | |||||
class="margin-bottom" | |||||
/> | |||||
<!-- <l-input | |||||
v-model="queryData.LibraryCard" | |||||
@change="searchChange" | |||||
title ="借书证" | |||||
placeholder="按借书证查询" | |||||
/> --> | |||||
<!-- 重置查询条件按钮 --> | |||||
<view class="padding-tb"> | |||||
<l-button @click="reset" line="orange" class="block" block>重置查询条件</l-button> | |||||
</view> | |||||
</view> | |||||
</scroll-view> | |||||
<!-- 关闭侧边抽屉按钮 --> | |||||
<view @click="sideOpen = false" :class="sideOpen ? 'show' : ''" class="sideclose"> | |||||
<l-icon type="pullright" color="blue" /> | |||||
</view> | |||||
</view> | |||||
</template> | |||||
<script> | |||||
import pickBy from 'lodash/pickBy' | |||||
import mapValues from 'lodash/mapValues' | |||||
export default { | |||||
data() { | |||||
return { | |||||
dateRange:null, | |||||
weekChina: ['一', '二', '三', '四', '五', '六', '日'], | |||||
user: null, | |||||
data: [], | |||||
total: 1, | |||||
records: 0, | |||||
ready: false, | |||||
page: 1, | |||||
rows: 10, | |||||
multipleData: { | |||||
IsPhone:"0" , | |||||
accountName:"", | |||||
startTime:undefined, | |||||
endTime:undefined, | |||||
}, | |||||
sideOpen: false, | |||||
loadState: '向下翻以加载更多', | |||||
isReset:false, | |||||
// tips: '加载中...', | |||||
}; | |||||
}, | |||||
onUnload() { | |||||
this.OFF('askList'); | |||||
}, | |||||
methods: { | |||||
async init() { | |||||
this.ON('askList', this.refreshList); | |||||
// 拉取加载列表和数据源 | |||||
Promise.all([() => {}]); | |||||
var _this = this; | |||||
this.user = await this.GET_GLOBAL('loginUser'); | |||||
this.multipleData.accountName = this.user.realName | |||||
this.defaultQueryData = this.COPY(this.multipleData) | |||||
this.fetchList(); | |||||
this.ready = true; | |||||
}, | |||||
// 拉取列表 | |||||
async fetchList() { | |||||
if(!this.multipleData.accountName)return | |||||
if (this.page > this.total)return | |||||
let _this = this; | |||||
let _postParam = { | |||||
pagination: { | |||||
rows: _this.rows, | |||||
page: _this.page | |||||
}, | |||||
queryJson: JSON.stringify(_this.multipleData) | |||||
}; | |||||
_this.LOADING('加载数据中…') | |||||
_this.HTTP_GET('/Learun/adms/MealCardRunTab/getlist', _postParam, '加载数据时出错').then(res => { | |||||
_this.HIDE_LOADING(); | |||||
console.log(res); | |||||
this.data = this.data.concat(res.rows); | |||||
_this.total = res.total; | |||||
_this.records = res.records; | |||||
this.page = res.page + 1; | |||||
this.loadState = res.page >= res.total ? '已加载所有数据' : '向下翻以加载更多'; | |||||
// console.log(_this.$refs.data.$el) | |||||
// console.log(_this.$refs.data.$el.getElementsByClassName("customlist")) | |||||
// console.log(_this.data); | |||||
}); | |||||
}, | |||||
// 列表下拉 | |||||
pullDown() { | |||||
this.refreshList().then(() => { | |||||
this.$refs.data.stopPullDown(); | |||||
}); | |||||
}, | |||||
async refreshList() { | |||||
this.page = 1; | |||||
this.total = 1; | |||||
this.data = []; | |||||
this.fetchList(); | |||||
}, | |||||
// 设置搜索条件 | |||||
async searchChange() { | |||||
if(this.isReset)return | |||||
const result = {} | |||||
// 时间查询相关参数 | |||||
if (this.dateRange) { | |||||
this.multipleData.StartTime = this.dateRange.start | |||||
this.multipleData.EndTime = this.dateRange.end | |||||
} else{ | |||||
} | |||||
// console.log(this.dateRange,"==========") | |||||
this.searchData = result | |||||
await this.refreshList() | |||||
}, | |||||
// 点击「清空查询条件」按钮 | |||||
reset() { | |||||
this.isReset = true | |||||
this.$refs.datefilter.changeDateRange('all') | |||||
this.multipleData = this.COPY(this.defaultQueryData) | |||||
this.isReset = false | |||||
this.searchChange() | |||||
}, | |||||
}, | |||||
computed: { | |||||
}, | |||||
created() { | |||||
this.init(); | |||||
} | |||||
}; | |||||
</script> | |||||
<style lang="less" scoped> | |||||
@import '~@/common/css/sidepage.less'; | |||||
@import '~@/common/css/customlist.less'; | |||||
.page { | |||||
background-color: #fff; | |||||
} | |||||
.page-content { | |||||
margin-top: 39px; | |||||
} | |||||
.records { | |||||
color: #8f8f94; | |||||
background: #ffffff; | |||||
padding: 10px 12px; | |||||
width: 100%; | |||||
vertical-align: middle; | |||||
border-bottom: 0.5px solid #ddd; | |||||
position: fixed; | |||||
top: var(--window-top); | |||||
z-index: 1024; | |||||
border-bottom: 0.5px solid #ddd; | |||||
height: 40px; | |||||
width: 100%; | |||||
box-shadow: 0 0.5px 3px rgba(0, 0, 0, 0.1); | |||||
// background: #f1f1f1; | |||||
} | |||||
.pageBox { | |||||
// margin-top: 34px; | |||||
padding: 5px 15px; | |||||
line-height: 24px; | |||||
border-bottom: 5px solid #f5f5f5; | |||||
} | |||||
.delbtn { | |||||
position: absolute; | |||||
right: 15px; | |||||
bottom: 7px; | |||||
padding: 3px 10px; | |||||
background: #dd524d; | |||||
color: #fff; | |||||
border-radius: 3px; | |||||
} | |||||
.wrap1>span{ | |||||
// width: 100%; | |||||
text-overflow: ellipsis; | |||||
overflow: hidden; | |||||
white-space: nowrap; | |||||
} | |||||
</style> |
@@ -197,7 +197,7 @@ export default { | |||||
// 获取列表分组 | // 获取列表分组 | ||||
groupList() { | groupList() { | ||||
const typeTable = mapValues(keyBy(Object.values(this.GET_GLOBAL('dataDictionary').function), 'value'), 'text') | |||||
const typeTable = mapValues(keyBy(Object.values(this.GET_GLOBAL('dataDictionary')?this.GET_GLOBAL('dataDictionary').function:()=>{}), 'value'), 'text') | |||||
return mapKeys( | return mapKeys( | ||||
groupBy(this.allList.filter(item => item.F_Name.includes(this.searchText)), 'F_Type'), | groupBy(this.allList.filter(item => item.F_Name.includes(this.searchText)), 'F_Type'), | ||||
@@ -18,6 +18,8 @@ | |||||
</view> | </view> | ||||
<view class="welT" style="padding-top: 10px;">采集照片信息</view> | <view class="welT" style="padding-top: 10px;">采集照片信息</view> | ||||
<l-upload | <l-upload | ||||
v-if="uploadVisiable" | |||||
ref="upload" | |||||
:number="1" | :number="1" | ||||
:value.sync="photo" | :value.sync="photo" | ||||
/> | /> | ||||
@@ -73,6 +75,7 @@ export default { | |||||
data() { | data() { | ||||
return { | return { | ||||
photo:[], | photo:[], | ||||
uploadVisiable:true, | |||||
imgSrc: '', | imgSrc: '', | ||||
scheme: { | scheme: { | ||||
PartyFaceNo: { | PartyFaceNo: { | ||||
@@ -134,21 +137,26 @@ export default { | |||||
_this.LOADING('加载数据…'); | _this.LOADING('加载数据…'); | ||||
_this.HTTP_GET('StuInfoFresh/stuInfoFreshEntity', _this.userInfo.account, '加载数据时出错').then(res => { | _this.HTTP_GET('StuInfoFresh/stuInfoFreshEntity', _this.userInfo.account, '加载数据时出错').then(res => { | ||||
this.HIDE_LOADING(); | this.HIDE_LOADING(); | ||||
console.log(res,"==="); | |||||
_this.StuInfoFreshEntity = _this.COPY(res.StuInfoFreshEntity)||{}; | _this.StuInfoFreshEntity = _this.COPY(res.StuInfoFreshEntity)||{}; | ||||
_this.queryData.StuInfoFreshFamilyEntities = _this.COPY(res.StuInfoFreshFamilyList); | _this.queryData.StuInfoFreshFamilyEntities = _this.COPY(res.StuInfoFreshFamilyList); | ||||
_this.queryData.StuInfoFreshEmergePeopleEntities = _this.COPY(res.StuInfoFreshEmergePeopleList); | _this.queryData.StuInfoFreshEmergePeopleEntities = _this.COPY(res.StuInfoFreshEmergePeopleList); | ||||
_this.queryData.ID = res.StuInfoFreshEntity.ID; | _this.queryData.ID = res.StuInfoFreshEntity.ID; | ||||
_this.queryData.Photo = res.StuInfoFreshEntity.Photo; | _this.queryData.Photo = res.StuInfoFreshEntity.Photo; | ||||
_this.photo = [{url:res.StuInfoFreshEntity.Photo}]; | |||||
_this.refreshComponent() | |||||
_this.queryData.telephone = res.StuInfoFreshEntity.telephone; | _this.queryData.telephone = res.StuInfoFreshEntity.telephone; | ||||
_this.queryData.FamilyAddress = res.StuInfoFreshEntity.FamilyAddress; | _this.queryData.FamilyAddress = res.StuInfoFreshEntity.FamilyAddress; | ||||
_this.queryData.RegionNo = res.StuInfoFreshEntity.RegionNo; | _this.queryData.RegionNo = res.StuInfoFreshEntity.RegionNo; | ||||
_this.imgSrc = this.API.slice(0,-1) + res.Url; | |||||
// _this.imgSrc = this.API.slice(0,-1) + res.Url; | |||||
}); | }); | ||||
}, | }, | ||||
tapBtn() { | |||||
console.log(this.queryData) | |||||
async tapBtn() { | |||||
this.LOADING('正在提交数据…'); | this.LOADING('正在提交数据…'); | ||||
let res = await this.$refs["upload"].uploadImage() | |||||
if(res){ | |||||
this.queryData.Photo = res[0]["AnnexesFileId"]; | |||||
} | |||||
console.log(this.queryData) | |||||
this.HTTP_GET('StuInfoFresh/saveStuInfoFresh', this.queryData, '加载数据时出错').then(res => { | this.HTTP_GET('StuInfoFresh/saveStuInfoFresh', this.queryData, '加载数据时出错').then(res => { | ||||
this.HIDE_LOADING(); | this.HIDE_LOADING(); | ||||
// console.log(res); | // console.log(res); | ||||
@@ -165,7 +173,14 @@ export default { | |||||
del(str, num) { | del(str, num) { | ||||
this.queryData[str].splice(num, 1) | this.queryData[str].splice(num, 1) | ||||
}, | }, | ||||
refreshComponent(){ | |||||
this.uploadVisiable = false | |||||
this.$nextTick(()=>{ | |||||
this.uploadVisiable = true | |||||
}) | |||||
}, | |||||
// 显示列表中的标题项 | // 显示列表中的标题项 | ||||
displayListItem(item, field) { | displayListItem(item, field) { | ||||
const fieldItem = this.scheme[field]; | const fieldItem = this.scheme[field]; | ||||