JING 8 months ago
commit a6590a6d4b
  1. 5
      config/api.js
  2. 26
      config/unit.js
  3. 17
      pages.json
  4. 14
      pagesA/merge/face_1.vue
  5. 195
      pagesA/merge/idcard.vue
  6. 71
      pagesA/merge/success.vue
  7. 94
      pagesA/merge/this.scss
  8. 8
      pagesA/photo/components/photo_header.vue
  9. 9
      pagesA/photo/face.vue
  10. BIN
      static/img/common/idcard_1.png

@ -281,5 +281,10 @@ var api = {
const app_config = uni.getStorageSync('app_config');
return app_config.public_url + url;
},
getOssurl(){
const app_config = uni.getStorageSync('app_config');
return app_config.public_url;
},
}
module.exports = api;

@ -4,17 +4,23 @@ var unit ={
getImgInfo:function(filePath){
function getInfo(resolve, reject) {
uni.getImageInfo({
src: filePath,
success: function (image) {
resolve(image);
},
fail: (res) => {
reject(res);
},
});
try {
uni.getImageInfo({
src: filePath,
success: function (image) {
resolve(image);
},
fail: (res) => {
reject(res);
},
});
return new Promise(getInfo);
} catch (error) {
console.log(error)
}
}
return new Promise(getInfo);
},
compressImg:function(filePath, config = {}){

@ -139,8 +139,25 @@
"navigationBarTitleText" : "上传图片",
"navigationStyle": "custom"
}
},
{
"path" : "merge/idcard",
"style" :
{
"navigationBarTitleText" : "二寸证件照",
"navigationStyle": "custom"
}
},
{
"path" : "merge/success",
"style" :
{
"navigationBarTitleText" : "",
"navigationStyle": "custom"
}
}
]
}],
"globalStyle": {

@ -47,7 +47,7 @@
<view class="photo_main_face_4 photo_full_blue_btn" v-if="uploadFiles.length >=5" @tap="subFace()">
提交制作 0/30
提交制作
</view>
<view class="photo_main_face_5" v-if="errorFiles.length > 0">以下照片不合格请重新上传</view>
@ -127,7 +127,7 @@
var _this = this;
_this.checkAuth();
this.setSuccessFiles();
console.log('~~~~~~~~~~~~~~~~~~')
},
methods: {
@ -242,10 +242,18 @@
let filePath = edetail;
let _date = new Date();
let ext_name = filePath.substr(filePath.lastIndexOf('.'));
if (ext_name !== 'png' && ext_name !== 'jpg' && ext_name !== 'jpeg') {
_this.$com.showError('请上传 png / jpg / jpeg 格式的图片');
return false;
}
let address = _date.getFullYear() + '' + (_date.getMonth() + 1) + '' + _date.getDate();
let fileName = address + _date.getTime() + ext_name;
const img_info = await unit.getImgInfo(filePath);
if(typeof(img_info) == 'undefined' || !img_info){
this.$com.showError('图片格式错误!请重试!');
return false;
}
let {
width,
height

@ -0,0 +1,195 @@
<template>
<view>
<view class="content photo_back">
<custom_navbar :title="navbar_title" @getNavHeight="getNavHeight" :theme="theme" />
<view class="photo_main" :style="'margin-top:'+margin_top+'px'" style="width: 100%;margin-left: 0;">
<view class="idcard_1_over">
<view class="idcard_1">
<image :src="selectedImg" />
</view>
</view>
<view class="idcard_2">
<view class="idcard_2_1">
<u-tabs @click="changeTab()" :current="this_tab" :list="list1" lineWidth="30"
lineColor="#5A8FFF" :activeStyle="{
color: '#5A8FFF',
fontWeight: 'bold',
transform: 'scale(1.05)'
}" :inactiveStyle="{
color: '#999999',
transform: 'scale(1)'
}"></u-tabs>
</view>
<view class="idcard_2_2">
<scroll-view class="idcard_2_2_1" enable-flex="true" scroll-x="true"
scroll-with-animation="true">
<view style="overflow: hidden;" class="idcard_2_2_1_one" v-for="(item,key) in tem_list"
:key="key" @tap="selectThis(key)">
<view class="idcard_2_2_1_one_1">
<image :src="root_path+item.image" />
</view>
<view class="idcard_2_2_1_one_2" :style="key != selectedIndex ? 'display:none' : ''">
<view class="idcard_2_2_1_one_2_1">
<image src="/static/img/common/idcard_1.png" />
</view>
</view>
</view>
</scroll-view>
</view>
<view class="idcard_2_3 photo_full_blue_btn" @tap="saveBtn()">
保存
</view>
<view class="idcard_2_4">剩余生成次数 <text style="color: #7A74F0;margin-left: 8rpx;margin-right: 8rpx;">
0 </text> / 30 </view>
</view>
</view>
</view>
<u-popup :show="show_2" mode="center" bgColor="transparent" :round="12">
<view class="show_readme_div" style="height: 500rpx;">
<view class="show_readme_div_1">
请选择保存格式
</view>
<view class="show_readme_div_2">
<view class="show_readme_div_3" style="width: 100%;margin-left: 0;margin-top: 10rpx;">
PNG格式
</view>
</view>
<view class="show_readme_div_2">
<view class="show_readme_div_3" style="width: 100%;margin-left: 0;margin-top: 10rpx;background:#F3F2F8;color:#999999">
JPG格式
</view>
</view>
<view class="show_readme_div_line">
<view class="show_readme_div_4" style="width: 220rpx;" @tap="this.show_2 = false">
取消
</view>
<view class="show_readme_div_3" style="width: 220rpx;" @tap="goUrl('/pagesA/merge/success')">
确认
</view>
</view>
</view>
</u-popup>
</view>
</template>
<script>
import custom_navbar from "../photo/components/photo_header.vue";
export default {
components: {
custom_navbar
},
data() {
return {
navbar_title: '二寸证件照',
theme: "white1",
margin_top: 10,
selectedImg: '',
selectedIndex: 0,
this_tab: 0,
root_path: '',
show_2: false,
list1: [{
id: 2,
name: '女装'
},
{
id: 1,
name: '男装'
},
],
tem_list: []
}
},
mounted() {
},
onLoad() {
this.changeTab();
this.root_path = this.$api.getOssurl();
},
onShow() {
},
methods: {
getNavHeight(e) {
this.margin_top += e;
},
selectThis(index) {
this.selectedImg = this.$api.getOssurl() + this.tem_list[index].image;
this.selectedIndex = index;
},
changeTab(e) {
if (typeof(e) != 'undefined' && e.index) {
this.this_tab = e.index;
} else {
this.this_tab = 0;
}
let data = {};
data.template_type = this.list1[this.this_tab].id;
let _this = this;
this.$api.get('/api/specs/template_list', data, function(res) {
if (res.length > 0) {
_this.tem_list = res;
_this.selectThis(0)
} else {
_this.tem_list = [];
}
});
},
saveBtn() {
this.show_2 = true;
},
goUrl(url){
this.show_2 = false;
uni.navigateTo({
url:url
})
}
},
}
</script>
<style lang="scss" scoped>
@import './this.scss';
.photo_back {
background-color: #fff;
}
</style>

@ -0,0 +1,71 @@
<template>
<view>
<view class="content ">
<custom_navbar :title="navbar_title" @getNavHeight="getNavHeight" :theme="theme" />
<view class="photo_main_face" :style="'margin-top:-'+margin_top+'px'">
<view class="photo_main_face_head"></view>
<view class="photo_success_1">
<image src="/static/img/common/photo_c1.png"/>
</view>
<view class="photo_success_2">生成已提交</view>
<view class="photo_success_3">
<view>目前排队人数较多请耐心等待</view>
<view>可去<text>我的</text>页面查看生成结果</view>
</view>
<view class="photo_success_4">
<image src="/static/img/common/photo_c2.png"/>
</view>
</view>
</view>
</view>
</template>
<script>
import custom_navbar from "../photo/components/photo_header.vue";
export default {
components: {
custom_navbar
},
data() {
return {
navbar_title: '',
theme: "blue",
margin_top: 0,
}
},
mounted() {
},
onPageScroll(e) {
if (e.scrollTop > 50) {
this.theme = 'white';
} else {
this.theme = 'blue';
}
},
methods: {
getNavHeight(e) {
this.margin_top += e;
}
}
}
</script>
<style lang="scss" scoped>
@import '../photo/this.scss';
</style>

@ -230,4 +230,98 @@ image{
}
// ----------------idcard
.idcard_1_over{
overflow: hidden;
width: 100%;
background-color: #F5F6FB;
}
.idcard_1{
width: 516rpx;
height: 720rpx;
margin: 100rpx auto;
}
.idcard_2{
width: 100%;
background-color: #fff;
border-top-left-radius: 24rpx;
border-top-right-radius: 24rpx;
.idcard_2_1{
overflow: hidden;
margin: 40rpx auto;
margin-left: 20rpx;
}
.idcard_2_2{
width: 725rpx;
height: 120rpx;
margin-left: 24rpx;
.idcard_2_2_1{
width: 100%;
height: 100%;
white-space: nowrap;
.idcard_2_2_1_one{
width: 104rpx;
height: 120rpx;
border-radius: 8rpx;
margin-right: 20rpx;
display: inline-block;
.idcard_2_2_1_one_1{
width: 100%;
height: 100%;
border-radius: 8rpx;
image{
border-radius: 8rpx;
}
}
.idcard_2_2_1_one_2{
margin-top: -120rpx;
margin-left: 0rpx;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
position: relative;
// opacity: 0.5;
display: flex;
justify-content: center;
align-items: center;
border-radius: 8rpx;
.idcard_2_2_1_one_2_1{
width: 40rpx;
height: 40rpx;
}
}
}
}
}
.idcard_2_3{
width: 702rpx;
height: 80rpx;
margin: 30rpx auto;
}
.idcard_2_4{
width: 702rpx;
height:30rpx;
display: flex;
justify-content: center;
align-items: center;
font-size: 24rpx;
color: #555555;
margin-left: 24rpx;
}
}

@ -45,7 +45,9 @@ export default {
case 'white':
this.thisBack = '#E3E8FE';
break;
case 'white1':
this.thisBack = '#fff';
break;
default :
this.thisBack = 'transparent';
@ -65,7 +67,9 @@ export default {
case 'white':
this.thisBack = '#E3E8FE';
break;
case 'white1':
this.thisBack = '#fff';
break;
default :
this.thisBack = 'transparent';

@ -240,10 +240,17 @@
let filePath = edetail;
let _date = new Date();
let ext_name = filePath.substr(filePath.lastIndexOf('.'));
if (ext_name !== 'png' && ext_name !== 'jpg' && ext_name !== 'jpeg') {
_this.$com.showError('请上传 png / jpg / jpeg 格式的图片');
return false;
}
let address = _date.getFullYear() + '' + (_date.getMonth() + 1) + '' + _date.getDate();
let fileName = address + _date.getTime() + ext_name;
const img_info = await unit.getImgInfo(filePath);
if(typeof(img_info) == 'undefined' || !img_info){
this.$com.showError('图片格式错误!请重试!');
return false;
}
let {
width,
height

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.6 KiB

Loading…
Cancel
Save