Commit 2861b3c2 authored by 李星剑's avatar 李星剑

fix:面料建模

parent 67440c41
......@@ -4,7 +4,9 @@
// #ifdef H5
export const BASE_URL = process.env.NODE_ENV === 'development' ? '/dev':'/prod-api/'
// #endif
// #ifdef MP-WEIXIN
export const BASE_URL = "http://octopus-dev.textile-saas.huansi.net/dev-api/"
// #endif
// #ifdef APP-PLUS
export const BASE_URL = "http://octopus-dev.textile-saas.huansi.net/dev-api/"
// export const BASE_URL = "http://10.10.10.31/"
......
......@@ -16,5 +16,9 @@ export default {
url: "/gdep-enterprise/supplier/getSupplierList",
method: "get"
},
upload:{
url: "/gdep-system/virtualfile/uploadFile",
method: "post"
}
}
}
\ No newline at end of file
}
......@@ -5,7 +5,7 @@ import base from './apiList/base.js'
import user from './apiList/user.js'
import auth from './apiList/auth.js'
import color from './apiList/colors.js'
// import orderTicket from './apiList/orderTicket.js'
import orderTicket from './apiList/orderTicket.js'
// 建模任务表接口
import modeling from './apiList/modeling.js'
// 建模品类表接口
......@@ -23,7 +23,7 @@ export default {
...user,
...auth,
...color,
// ...orderTicket,
...orderTicket,
...modeling,
...plm,
...modelingTaskCategory,
......
......@@ -6,6 +6,15 @@
"pages": [
//pages数组中第一项表示应用启动页,参考:https://uniapp.dcloud.io/collocation/pages
//品牌商首页
{
"path": "pages/user/login/login",
"style": {
"navigationBarTitleText": "模拟登录",
"navigationBarTextStyle": "white",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
},
{
"path": "pages/home/tenantSelection",
"style": {
......@@ -20,15 +29,7 @@
}
}
},
{
"path": "pages/user/login/login",
"style": {
"navigationBarTitleText": "模拟登录",
"navigationBarTextStyle": "white",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
},
{
"path": "pages/home/index",
"style": {
......@@ -221,95 +222,6 @@
}
}
},
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首页",
"enablePullDownRefresh": false
}
},
{
"path": "pages/designCommissioned/listSelectToAdd",
"style": {
"navigationBarTitleText": "选择面料新增内容",
"navigationBarTextStyle": "white",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
},
{
"path": "pages/designCommissioned/list",
"style": {
"navigationBarTitleText": "款式委托选款列表",
"navigationBarTextStyle": "white",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
},
{
"path": "pages/designCommissioned/addItem",
"style": {
"navigationBarTitleText": "完善信息",
"navigationBarTextStyle": "white",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
},
{
"path": "pages/designCommissioned/item",
"style": {
"navigationBarTitleText": "委托详情",
"navigationBarTextStyle": "white",
"enablePullDownRefresh": false,
"navigationStyle": "custom"
}
},
{
"path": "pages/user/register/stepSelectType",
"style": {
"navigationBarTitleText": "完善信息",
// "navigationBarTextStyle": "white",
"enablePullDownRefresh": false,
"mp-alipay": {
"transparentTitle": "always",
"titlePenetrate": "YES",
"allowsBounceVertical": "NO"
}
}
},
{
"path": "pages/user/register/perfectInformation",
"style": {
"navigationBarTitleText": "完善信息",
// "navigationBarTextStyle": "white",
"enablePullDownRefresh": false,
"mp-alipay": {
"transparentTitle": "always",
"titlePenetrate": "YES",
"allowsBounceVertical": "NO"
}
}
},
{
"path": "pages/user/register/success",
"style": {
"navigationBarTitleText": "完善信息",
// "navigationBarTextStyle": "white",
"enablePullDownRefresh": false,
"mp-alipay": {
"transparentTitle": "always",
"titlePenetrate": "YES",
"allowsBounceVertical": "NO"
}
}
},
{
"path": "pages/index/index",
"style": {
"navigationBarTitleText": "首页",
"enablePullDownRefresh": false
}
},
{
"path": "pages/designCommissioned/listSelectToAdd",
"style": {
......
......@@ -24,21 +24,21 @@
<view class="color_fff btn u-p-l-10 u-p-r-10" @click="sampleConfirm">寄样确认</view>
</view>
<!-- 具体内容 我的面料 -->
<view class="home_con u-m-t-20">
<view class="home_con_tit">
<view>
<span class="u-font-32">我的面料</span>
<span style="line-height: 0;" class="u-m-l-10 color_000 u-font-24">MY FABRIC</span>
</view>
<view class="u-font-24 color_d5aa7a" @click="seeFabric">查看更多</view>
</view>
<view class="home_con_fabric">
<view class="home_con_content u-m-t-24" @click="detailFabric(item)" v-for="item in fiabricList">
<image class="hs-img" src="../../static/images/home/1@2x.png" mode=""></image>
<view class="home_con_content_font ov_hiden">{{ item.materialName }}</view>
</view>
</view>
</view>
<!-- <view class="home_con u-m-t-20">-->
<!-- <view class="home_con_tit">-->
<!-- <view>-->
<!-- <span class="u-font-32">我的面料</span>-->
<!-- <span style="line-height: 0;" class="u-m-l-10 color_000 u-font-24">MY FABRIC</span>-->
<!-- </view>-->
<!-- <view class="u-font-24 color_d5aa7a" @click="seeFabric">查看更多</view>-->
<!-- </view>-->
<!-- <view class="home_con_fabric">-->
<!-- <view class="home_con_content u-m-t-24" @click="detailFabric(item)" v-for="item in fiabricList">-->
<!-- <image class="hs-img" src="../../static/images/home/1@2x.png" mode=""></image>-->
<!-- <view class="home_con_content_font ov_hiden">{{ item.materialName }}</view>-->
<!-- </view>-->
<!-- </view>-->
<!-- </view>-->
<!-- 具体内容 我的订单 -->
<view class="home_con u-m-t-20">
<view class="home_con_tit">
......
<template>
<view>
<view class="r-canvas-component"
:style="{
width:canvas_width/scale+'px',
height:canvas_height/scale+'px'
}"
:class="{'hidden':hidden}">
<canvas class="r-canvas" v-if="canvas_id"
:canvas-id="canvas_id" :id="canvas_id"
:style="{width:canvas_width+'px',height:canvas_height+'px','transform': `scale(${r_canvas_scale})`}"></canvas>
</view>
</view>
</template>
<script>
import canvas from "./canvas"
export default {
name: "e-canvas",
mixins: [canvas],
onLoad(){
}
}
</script>
<style scoped>
.r-canvas{
transform-origin: 0 0;
}
.r-canvas-component{
overflow: hidden;
}
.r-canvas-component.hidden{
position: fixed;
}
</style>
<template>
<view>
首页
<button @click="changeUserType">切换用户</button>
<!-- <canvas-->
<!-- canvas-id="canvas"-->
<!-- :style="{-->
<!-- width: 549+'px',-->
<!-- height: 849+'px',-->
<!-- 'transform': `scale(${1})`-->
<!-- }">-->
<!-- </canvas>-->
<!-- <canvas canvas-id="myCanvas"></canvas>-->
<button @click="clear">清除</button>
<button @click="setI">设置</button>
<button @click="exportPng">导出</button>
<e-canvas ref="rCanvas" ></e-canvas>
</view>
</template>
<script>
import ECanvas from "./e-canvas";
import mergeImages from "./mergeImages";
export default {
name: "index",
components: {ECanvas},
data(){
return{
index: 0
}
},
methods:{
changeUserType(){
this.$Router.push({
path: '/pages/user/register?redirect=1'
downLoadNetworkFile(url){
return new Promise((resolve,reject)=>{
uni.downloadFile({
url,
success:(res)=>{
if(res.statusCode == 200){
resolve(res.tempFilePath)
}else{
reject("Download Image Fail:102")
}
},
fail:(err)=>{
reject("Download Image Fail:101")
}
})
})
},
urlToBase64(config){
return new Promise(async (resolve,reject)=>{
if (typeof window != 'undefined') {
await this.downLoadNetworkFile(config.url).then(res=>{ // two function
resolve(res)
}).catch(err=>{
reject(err)
})
}else if (typeof plus != 'undefined') {
plus.io.resolveLocalFileSystemURL(config.url,(obj)=>{
obj.file((file)=>{
let fileReader = new plus.io.FileReader()
fileReader.onload = (res)=>{
resolve(res.target.result)
}
fileReader.onerror = (err)=>{
reject(err)
}
fileReader.readAsDataURL(file)
}, (err)=>{
reject(err)
})
},(err)=>{
reject(err)
})
}else if(typeof wx != 'undefined'){
wx.getFileSystemManager().readFile({
filePath: config.url,
encoding: 'base64',
success: function(res) {
resolve('data:image/png;base64,' + res.data)
},
fail: function(error) {
reject(error)
}
})
}
})
},
exportPng(){
uni.canvasToTempFilePath({
canvasId: "canvas",
quality: 1,
// x: 100,
// y: 200,
width: 549,
fileType:'jpg',
height: 849,
// destWidth: 100,
// destHeight: 100,
success: (res)=>{
this.urlToBase64({
url: res.tempFilePath
}).then(i =>{
console.log(i)
})
console.log('res',res.tempFilePath)
},
fail:(err)=>{
console.log(JSON.stringify(err)|| "Failed to generate poster:101")
}
},this)
},
async setImg(){
let sources = [
'https://huansi-gdep-dev.oss-cn-hangzhou.aliyuncs.com/020141d6-840d-48f8-9b4d-bb3905583d05',
'https://huansi-gdep-dev.oss-cn-hangzhou.aliyuncs.com/d691790d-ccf7-4e29-a9ac-69a8c058cb82',
'https://huansi-gdep-dev.oss-cn-hangzhou.aliyuncs.com/8965770b-d673-4285-b472-6c4c1be662d9',
]
let images = [
await this.downLoadNetworkFile(sources[1]),
await this.downLoadNetworkFile(sources[2]),
await this.downLoadNetworkFile(sources[0]),
"../../static/images/brank/lightxin.png",
"../../static/images/brank/thumb.png"
];
const ctx = uni.createCanvasContext("canvas",this),
ww = 549, hh = 849;
ctx.drawImage(images[0], 0, 0, ww, hh)
ctx.drawImage(images[1], 0, 0, ww, hh)
ctx.drawImage(images[2], 0, 0, ww, hh)
// ctx.drawImage(images[1], 30, hh - 87, 50, 50);
// ctx.drawImage(images[2], ww - 90, hh - 92, 60, 60);
ctx.draw();
},
getBaseUrl(){
// #ifdef H5
return process.env.NODE_ENV === 'development' ? '/images/': ''
// #endif
// #ifdef APP-PLUS
return this.$IMG_URL;
// #endif
},
async setI(){
let baseUrl = this.getBaseUrl();
let sources = [
`${baseUrl}020141d6-840d-48f8-9b4d-bb3905583d05`,
`${baseUrl}d691790d-ccf7-4e29-a9ac-69a8c058cb82`,
`${baseUrl}8965770b-d673-4285-b472-6c4c1be662d9`,
`${baseUrl}c24c2d77-2a53-4782-bec3-c66185a0ce10`,
]
let images = [
await this.downLoadNetworkFile(sources[1]),
await this.downLoadNetworkFile(sources[2]),
await this.downLoadNetworkFile(sources[0]),
await this.downLoadNetworkFile(sources[3]),
]
await this.$refs.rCanvas.mergeImageByImg(images[0],images[1])
},
async clear(){
await this.$refs.rCanvas.clearCanvas()
}
},
onReady(){
this.$nextTick(async ()=>{
// const context = uni.createCanvasContext('myCanvas')
//
// uni.downloadFile({
// url: 'https://bjetxgzv.cdn.bspapp.com/VKCEYUGU-uni-app-doc/d8590190-4f28-11eb-b680-7980c8a877b8.png',
// success: function (res) {
// context.save()
// context.beginPath()
// context.arc(96, 96, 48, 0, 2 * Math.PI)
// context.clip()
// context.drawImage(res.tempFilePath, 48, 48)
// context.restore()
// context.draw()
// }
// })
const ctx = uni.createCanvasContext("canvas",this)
// // 初始化
await this.$refs.rCanvas.init({
canvas_id: "rCanvas"
})
let baseUrl = this.getBaseUrl();
let sources = [
`${baseUrl}020141d6-840d-48f8-9b4d-bb3905583d05`,
`${baseUrl}d691790d-ccf7-4e29-a9ac-69a8c058cb82`,
`${baseUrl}8965770b-d673-4285-b472-6c4c1be662d9`,
`${baseUrl}c24c2d77-2a53-4782-bec3-c66185a0ce10`,
// '${baseUrl}020141d6-840d-48f8-9b4d-bb3905583d05',
// '${baseUrl}020141d6-840d-48f8-9b4d-bb3905583d05',
// 'https://huansi-gdep-dev.oss-cn-hangzhou.aliyuncs.com/d691790d-ccf7-4e29-a9ac-69a8c058cb82',
// 'https://huansi-gdep-dev.oss-cn-hangzhou.aliyuncs.com/8965770b-d673-4285-b472-6c4c1be662d9',
// // 上色用 图
// 'https://huansi-gdep-dev.oss-cn-hangzhou.aliyuncs.com/c24c2d77-2a53-4782-bec3-c66185a0ce10',
]
let images = [
await this.downLoadNetworkFile(sources[1]),
await this.downLoadNetworkFile(sources[2]),
await this.downLoadNetworkFile(sources[0]),
await this.downLoadNetworkFile(sources[3]),
]
// images.forEach((image) =>{
// let ww = 549, hh = 849;
// ctx.drawImage(image, 0, 0, ww, hh)
// })
// ctx.draw();
// await this.$refs.rCanvas.mergeImages(sources);
await this.$refs.rCanvas.mergeImageByImg(images[0],images[3])
})
}
}
</script>
......
<template>
<view>
<view class="r-canvas-component" :style="{width:canvas_width/scale+'px',height:canvas_height/scale+'px'}" :class="{'hidden':hidden}">
<canvas class="r-canvas" v-if="canvas_id" :canvas-id="canvas_id" :id="canvas_id" :style="{width:canvas_width+'px',height:canvas_height+'px','transform': `scale(${r_canvas_scale})`}"></canvas>
</view>
</view>
</template>
<script>
import canvas from "../mixins/canvas"
export default {
name: "e-canvas",
mixins: [canvas]
}
</script>
<style scoped>
.r-canvas{
transform-origin: 0 0;
}
.r-canvas-component{
overflow: hidden;
}
.r-canvas-component.hidden{
position: fixed;
top: -5000upx;
}
</style>
......@@ -16,13 +16,19 @@
<view class="u-relative">
<!-- <u-image height="750rpx" :src="`${$IMG_URL}${detail.originalImageCode}`"></u-image>-->
<view>
<!-- <image :src="`${$IMG_URL}${detail.originalImageCode}`" mode="heightFix" class="height-750rpx"></image>-->
<!--新增 初始化的时候显示 部位编辑的时候不显示-->
<e-canvas ref="eCanvas" v-show="!isPartEdit && isEditMode"></e-canvas>
<!--调试-->
<!--<e-canvas ref="eCanvasHelp" ></e-canvas>-->
<e-canvas ref="eCanvasHelp" style="position: fixed;top: -100000px;"></e-canvas>
<!--部位编辑的时候显示 -->
<image
v-show="isPartEdit || !isEditMode"
:style="{
'--src': `url(${$IMG_URL}${detail.originalImageCode})`,
'--src': `url(${activeBgPic})`,
'--transform': `rotate(${angle}deg)`,
}"
src="`${$IMG_URL}${detail.originalImageCode}`"
:src="`${activePartPicCode}`"
mode="heightFix"
class="height-750rpx view"
></image>
......@@ -225,7 +231,9 @@
</view>
</view>
</view>
<!-- #ifdef APP-PLUS -->
<!-- #endif -->
<view id="footer" class="footer">
<view class="footer-btn">
<view
......@@ -256,11 +264,16 @@ import dom from "@/mixins/dom";
import step from "./mixins/step";
import material from "./mixins/material";
import ECanvas from "../index/e-canvas";
// 单一部位 材质合成
// 合成主体
export default {
name: "createMaterial",
components: {ECanvas},
mixins: [dom, step, material],
data() {
return {
imgMergeTasks: [],
keyword: "",
isEdit: false,
......@@ -290,9 +303,32 @@ export default {
materialId: "",
activePartIndex: -1,
submitData: [],
// 是否部位编辑状态
isPartEdit: false,
};
},
computed: {
activePartPicCode(){
if(!this.isEditMode){
return this.$IMG_URL + this.detail.effectPictureCode
}
let data = this.activePartIndex === -1 ?
this.$IMG_URL + this.detail.originalImageCode :
this.$IMG_URL + this.parts[this.activePartIndex].pictureCode;
// debugger;
// let item = this.imgMergeTasks.length > 0 && this.activePartIndex > -1?
// this.imgMergeTasks.find((item) =>
// item.part.id === this.parts[this.activePartIndex].id
// )?.base64Code : '';
// console.log(item)
return data;
},
// 图片合成 底图
activeBgPic(){
return this.activeColor.fileCode ? this.$IMG_URL + this.activeColor.fileCode : "";
},
// 部位
parts() {
return (this.detail.styleLibraryPictureVOList || []).sort((a, b) => {
......@@ -336,9 +372,6 @@ export default {
selectColorList() {
// 如果部位是主体 且 存在信息则回填老的数据
if (this.mainPart.length !== 0) {
console.log(
this.mainPart[0].materialColoursList
)
return this.mainPart[0].materialColoursList.map((item) => {
return {
...item,
......@@ -375,18 +408,141 @@ export default {
},
},
created() {
onLoad() {
let { id, materialId } = this.$Route.query;
this.materialId = materialId;
this.getItem(id);
this.id = id;
this.getList();
this.getColors();
this.getMaterialItem(materialId);
this.getMaterialList();
},
onReady() {
this.$nextTick(async ()=>{
await this.getItem(this.id);
let canvas = this.$refs.eCanvas;
await canvas.init({
canvas_id: "eCanvas",
canvas_width: 375,
canvas_height: 375,
})
await this.$refs['eCanvasHelp'].init({
canvas_id: "eCanvasHelp",
canvas_width: 375,
canvas_height: 375,
})
let BASE_URL = this.getBaseUrl();
let sources = [`${BASE_URL}${this.detail.originalImageCode}`].concat(
this.parts.map((item) => `${BASE_URL}${item.pictureCode}`)
);
await canvas.mergeImages(sources);
this.isPartEdit = false;
this.initImageTasks(this.parts)
})
},
methods: {
getBaseUrl(){
// #ifdef H5
return process.env.NODE_ENV === 'development' ? '/images/': ''
// #endif
// #ifdef APP-PLUS
return this.$IMG_URL;
// #endif
},
// todo
uploadImg(base64) {
return new Promise((resolve, reject) => {
uni.request({
url: this.$API_URL +'/gdep-system/virtualfile/uploadFileBase64',
data: {
file: base64,
fileName: '11'
},
method:'POST',
header: {
// 'Content-Type': "application/x-www-form-urlencoded", //自定义请求头信息
'Authorization-Basic': 'Basic c3dvcmQ6c3dvcmRfc2VjcmV0',
"blade-auth": "Bearer " + uni.getStorageSync('token')
},
success: (res) =>{
resolve(res.data.data)
console.log(res)
},
fail: (error) =>{
reject(error);
console.log(error)
}
})
})
},
base64ToBlob(urlData, type) {
let arr = urlData.split(',');
let mime = arr[0].match(/:(.*?);/)[1] || type;
// 去掉url的头,并转化为byte
let bytes = window.atob(arr[1]);
// 处理异常,将ascii码小于0的转换为大于0
let ab = new ArrayBuffer(bytes.length);
// 生成视图(直接针对内存):8位无符号整数,长度1个字节
let ia = new Uint8Array(ab);
for (let i = 0; i < bytes.length; i++) {
ia[i] = bytes.charCodeAt(i);
}
return new Blob([ab], {
type: mime
});
},
// 最后提交前的图片整合
imagesMerge(){
return new Promise((resolve, reject) => {
mergeImages(
this.imgMergeTasks.map((item) => item.base64Code)
).then(res => {
resolve(res)
})
})
},
initImageTasks(parts){
let baseUrl = this.getBaseUrl();
parts.forEach((part) =>{
this.imgMergeTasks.push({
base64Code: `${baseUrl}${part.pictureCode}`,
id: part.id,
part
})
})
},
// 保存临时的图片用来预览
async createImgMergeTask(part,color,callback){
uni.showLoading({
mask: true
})
let index = this.imgMergeTasks.findIndex((item) => part.id === item.part.id);
let BASE_URL = this.getBaseUrl();
let canvas = this.$refs['eCanvasHelp'];
await canvas.clearCanvas();
await canvas.mergeImageByImg(`${BASE_URL}${part.pictureCode}`,`${BASE_URL}${color.fileCode}`);
let base64 = await canvas.exportImg();
let item = {
part,
color,
base64Code: base64
}
if(index === -1){
this.imgMergeTasks.push(item)
}else{
this.imgMergeTasks.splice(index,1,item)
}
if(callback){
callback();
}
uni.hideLoading()
},
filterPartActive(part) {
let data = this.submitData.filter(
(item) => !item.isDeleted && part.id === item.styleLibraryPictureId
......@@ -420,6 +576,8 @@ export default {
styleLibraryPictureId: activePart.id,
styleLibrayId: activePart.styleLibrayId,
});
this.createImgMergeTask(this.parts[this.activePartIndex],color,this.toggleCanvasEditCallback)
// if()
// $data.push({
// materialColoursList: colors,
......@@ -430,11 +588,21 @@ export default {
// styleLibrayId: activePart.styleLibrayId,
// })
},
// 更改内容以后 刷新画布 重新绘制
async toggleCanvasEditCallback(){
let canvas = this.$refs['eCanvas'];
await canvas.clearCanvas();
let BASE_URL = this.getBaseUrl();
let sources = [`${BASE_URL}${this.detail.originalImageCode}`].concat(
this.imgMergeTasks.map((item) => item.base64Code)
);
await canvas.mergeImages(sources);
},
//
setMaterialItem() {
if (this.activePartIndex === 0) {
this.materialDetail = this.selectedMaterialItem;
this.colorSelect(this.activeColor, this.selectedMaterialItemColors);
this.colorSelect(this.activeColor, this.selectedMaterialItemColors,this.toggleCanvasEditCallback);
} else {
this.ontherPartTrigger(
this.activeColor,
......@@ -443,6 +611,8 @@ export default {
}
this.activeColor = {};
this.isEdit = false;
this.isPartEdit = false;
},
cancelMaterialItem() {
this.isEdit = false;
......@@ -457,17 +627,27 @@ export default {
pageReload() {
this.$Router.replace({
path: "/pages/material/createMaterial",
query: this.$Route.query,
query: {
...this.$Route.query,
materialId: this.materialDetail.id
},
});
},
// 加入待上架
submit() {
async submit() {
let data = {
styleLibraryMaterialDTOList: this.submitData,
styleOrderId: this.detail.styleOrderId,
styleLibraryId: this.detail.id,
};
this.$http("stylelibraryorder.addToShelves", data).then((res) => {
uni.showLoading({
mask: true
})
let base64 = await this.$refs['eCanvas'].exportImg();
let res = await this.uploadImg(base64);
// console.log(data)
// return;
this.$http("stylelibraryorder.addToShelves", Object.assign({},data,{fileCode: res.fileCode})).then((res) => {
let { code, msg } = res;
if (code === 200) {
this.pageReload();
......@@ -476,7 +656,9 @@ export default {
title: msg,
});
}
});
}).then(() =>{
uni.hideLoading()
})
},
// 取消上架
cancel() {
......@@ -544,6 +726,7 @@ export default {
styleLibrayId: this.parts[0].styleLibrayId,
});
}
this.createImgMergeTask(this.parts[0],color,this.toggleCanvasEditCallback)
this.clearColor(color);
},
clearColor(color) {
......@@ -606,7 +789,7 @@ export default {
},
// 上一款 下一款
routerPush(isNext) {
this.$Router.push({
this.$Router.replace({
path: "/pages/material/createMaterial",
query: {
materialId: this.materialId,
......@@ -619,6 +802,7 @@ export default {
this.loadStatus = "loading";
this.$http("stylelibraryorder.page", {
styleTag: this.keyword,
isFilter: true,
status: 0,
materialTagIdList,
size: 999,
......@@ -634,33 +818,37 @@ export default {
}
});
},
getItem(id) {
this.$http("stylelibraryorder.details", id).then((res) => {
let { code, data } = res;
if (code === 200) {
// 过滤出数据
this.detail = data;
let parts = (data.styleLibraryPictureVOList || []).sort((a, b) => {
return a.isMainBodyPart - b.isMainBodyPart < -1;
});
// 获取详情
getItem(id) {
return new Promise((resolve,reject) =>{
this.$http("stylelibraryorder.details", id).then((res) => {
let { code, data } = res;
if (code === 200) {
// 过滤出数据
let selectedList = parts.reduce((res, item) => {
let selectItem = item["styleLibraryMaterialVOList"].map(($i) => {
return {
...$i,
isMainBodyPart: item.isMainBodyPart,
materialColoursList: item.materialInfo.materialColoursList,
};
this.detail = data;
let parts = (data.styleLibraryPictureVOList || []).sort((a, b) => {
return a.isMainBodyPart - b.isMainBodyPart < -1;
});
return res.concat(selectItem);
}, []);
this.submitData = selectedList;
// console.log(selectedList)
}
});
},
this.submitData = parts.reduce((res, item) => {
let selectItem = item["styleLibraryMaterialVOList"].map(($i) => {
return {
...$i,
isMainBodyPart: item.isMainBodyPart,
materialColoursList: item.materialInfo.materialColoursList,
};
});
return res.concat(selectItem);
}, []);
}
resolve()
});
})
},
// 获取颜色
getColors() {
this.$http("colour.selectColour", { color: "" }).then((res) => {
......@@ -680,6 +868,7 @@ export default {
this.activePartIndex = index;
this.isEdit = true;
this.isPartEdit = true;
},
},
};
......
export default {
data(){
return {
system_info:{}, //system info
canvas_width:0, //canvas width px
canvas_height:0, //canvas height px
ctx:null, //canvas object
canvas_id:null, //canvas id
hidden:false, //Whether to hide canvas
scale:1, //canvas scale
r_canvas_scale:1,
if_ctx:true
}
},
methods:{
/**
* Compatibility px
* @param {Object} size
*/
compatibilitySize(size) {
let canvasSize = (parseFloat(size) / 750) * this.system_info.windowWidth
canvasSize = parseFloat(canvasSize * 2)
return canvasSize
},
/**
* Restore compatibility px
* @param {Object} size
*/
resetCompatibilitySize(size) {
return (parseFloat(size / 2) / this.system_info.windowWidth) * 750
},
init(config){
return new Promise(async (resolve,reject)=>{
if(!config.canvas_id){
reject("Canvas ID cannot be empty, please refer to the usage example")
return;
}
this.hidden = config.hidden
this.canvas_id = config.canvas_id
let system_info = await uni.getSystemInfoSync()
this.system_info = system_info
this.scale = config.scale && parseFloat(config.scale)>0?parseInt(config.scale):1
this.canvas_width = (config.canvas_width ? this.compatibilitySize(config.canvas_width) : system_info.windowWidth) * this.scale
this.canvas_height = (config.canvas_height ? this.compatibilitySize(config.canvas_height) : system_info.windowHeight) * this.scale,
this.r_canvas_scale = 1/this.scale
this.ctx = uni.createCanvasContext(this.canvas_id,this)
// this.setCanvasConfig({
// global_alpha:config.global_alpha?parseFloat(config.global_alpha):1,
// backgroundColor:config.background_color?config.background_color:"#fff"
// })
resolve()
})
},
clearCanvas(){
return new Promise(async (resolve,reject)=>{
if(!this.ctx){
reject("canvas is not initialized:101")
return
}else{
this.ctx.clearRect(0,0,parseFloat(this.canvas_width)*this.scale,parseFloat(this.canvas_height)*this.scale)
await this.draw()
resolve()
}
})
},
draw(){
}
}
}
......@@ -24,46 +24,49 @@
</view>
</view>
<!-- 列表 确定-->
<view class="body bg-fff u-p-r-30 u-p-b-30 u-p-l-30" :style="{ bottom: footerHeight+ 'px', top: headerHeight + 'px' }">
<view v-for="(item, index) in list" :key="item.id"
@click="$Router.push({
<scroll-view class="body bg-fff u-p-r-30 u-p-b-30 u-p-l-30"
:scroll-y="true"
@scrolltolower="loadMore"
:style="{ bottom: footerHeight+ 'px', top: headerHeight + 'px' }">
<view v-for="(item, index) in list" :key="item.id"
@click="$Router.push({
path: '/pages/material/createMaterial',
query:{
materialId: $Route.query.materialId,
id: item.id
}
})"
class="u-flex u-m-b-20">
<view class="item item--round u-flex ">
<view class="item-img u-relative">
<image :src="`${$IMG_URL}${item.effectPictureCode}`" mode="fit" style="width:100%; height: 100%"></image>
<u-image width="100rpx" height="100rpx" v-if="item.putawayStatus === 1"
class="item--status"
mode="widthFix"
src="@/static/images/material/status.png">
</u-image>
</view>
<view class="u-flex-1 u-p-l-20 u-p-r-30 u-border-left">
<view class="item-title u-flex ">
<view class="u-flex-1 u-line-1 u-font-32 u-p-t-20 u-p-b-8">{{item.category}}</view>
<u-icon size="24" color="#000" name="arrow-right"></u-icon>
class="u-flex u-m-b-20">
<view class="item item--round u-flex ">
<view class="item-img u-relative">
<image :src="`${$IMG_URL}${item.effectPictureCode}`" mode="fit" style="width:100%; height: 100%"></image>
<u-image width="100rpx" height="100rpx" v-if="item.putawayStatus === 1"
class="item--status"
mode="widthFix"
src="@/static/images/material/status.png">
</u-image>
</view>
<view class="item-desc u-font-24">{{ item.styleCode }}</view>
<view class="item-tags u-p-b-24">
<view class="item-tag u-font-20"
:key="tag.id"
v-for="tag in item.styleLibraryTagVOList">
{{ tag.materialTagName }}
<view class="u-flex-1 u-p-l-20 u-p-r-30 u-border-left">
<view class="item-title u-flex ">
<view class="u-flex-1 u-line-1 u-font-32 u-p-t-20 u-p-b-8">{{item.category}}</view>
<u-icon size="24" color="#000" name="arrow-right"></u-icon>
</view>
<view class="item-desc u-font-24">{{ item.styleCode }}</view>
<view class="item-tags u-p-b-24">
<view class="item-tag u-font-20"
:key="tag.id"
v-for="tag in item.styleLibraryTagVOList">
{{ tag.materialTagName }}
</view>
</view>
</view>
</view>
</view>
</view>
<!-- 加载更多 -->
<u-loadmore v-if="!isEmpty" height="80rpx" :status="loadStatus" icon-type="flower" color="#ccc" />
<!-- 缺省页 -->
<hs-empty v-if="isEmpty" tipText="没有数据"></hs-empty>
</view>
<!-- 加载更多 -->
<u-loadmore v-if="!isEmpty" height="80rpx" :status="loadStatus" icon-type="flower" color="#ccc" />
<!-- 缺省页 -->
<hs-empty v-if="isEmpty" tipText="没有数据"></hs-empty>
</scroll-view>
<u-popup v-model="popupShow" mode="bottom" height="100%">
<view class="u-relative">
<!--选款-->
......@@ -143,9 +146,17 @@ export default {
})
}
},
methods:{
// 触底加载更多
loadMore() {
if (this.pageOptions.current < this.pageOptions.pages) {
this.pageOptions.current += 1;
this.getList([],false);
}
},
popupConfirm(){
this.getList(this.tagIds);
this.getList(this.tagIds,true);
this.popupShow = false;
},
triggerClickTag({materialLabelId}){
......@@ -156,13 +167,6 @@ export default {
this.tagIds.push(materialLabelId)
}
},
// 触底加载更多
onReachBottom() {
if (this.pageOptions.current < this.pageOptions.pages) {
this.pageOptions.current += 1;
this.getData();
}
},
search(){
this.pageOptions = {
current: 1,
......@@ -170,10 +174,11 @@ export default {
}
this.getList();
},
getList(materialTagIdList = []){
getList(materialTagIdList = [],isReload = false){
this.loadStatus = 'loading';
this.$http('stylelibraryorder.page', {
styleTag: this.keyword,
isFilter: true,
status: 0,
materialTagIdList,
...this.pageOptions
......@@ -181,11 +186,11 @@ export default {
let { code, data } = res;
if (code === 200) {
if(Object.keys(data).length > 0){
this.list = data.records;
this.list = isReload ? data.records:this.list.concat(data.records);
this.pageOptions.pages = data.total;
this.loadStatus = this.list.length < data.total ? 'loadmore' : 'nomore';
}else{
this.list = []
// this.list = []
this.loadStatus = 'nomore';
}
}
......@@ -272,7 +277,7 @@ $main-color: #fff;
right: 0;
bottom: 0;
top: 0;
overflow-y: auto;
//overflow-y: auto;
}
.title{
......
......@@ -192,14 +192,21 @@
</view>
</view>
<view class="right u-flex-1 color--tree-children">
<view class="tree-item u-flex"
<view class="tree-item grid-content"
@click="selectColor(item)"
v-for="(item) in activeColorTree">
<u-checkbox
class="display-inline-block u-m-r-10"
v-model="item.checked"
></u-checkbox>
<view class="tree-level-text">
{{ item.colour }}
<view class="tree-level-text display-inline-block">
<text class="u-m-r-40 float-left">{{ item.colour }}</text>
<view class="float-left">
<u-image :src="`${$IMG_URL}${item.fileCode}`" shape="circle"
width="30rpx" height="30rpx"
></u-image>
</view>
<view class="u-line-1 float-left">{{ item.pantoneEncode}}</view>
</view>
</view>
</view>
......@@ -475,8 +482,8 @@ export default {
}
}
}
this.detail.modelingTaskMaterialColourList = list.filter((item) => item.id && checked.indexOf(item.id) > -1);
console.log(list)
this.detail.modelingTaskMaterialColourList = list.filter((item) => item.id);
// this.detail.modelingTaskMaterialColourList = list.filter((item) => item.id && checked.indexOf(item.id) > -1);
},
// 颜色库选择 点击时间 存一份选中状态 在确定的时候过滤
selectColor(colorItem){
......@@ -627,6 +634,19 @@ export default {
},
submit(type){
let {modelingTaskPictureDTOList, ...onther} = this.detail;
console.log(this.detail.modelingTaskMaterialColourList)
console.log(
Object.assign({},
onther,
{
designAgencyColourQuantity: this.designAgencyColourQuantity,
operationType:type,
modelingTaskPictureDTOList: modelingTaskPictureDTOList.concat(this.delModelingTaskPictureDTOList)}
)
)
return
this.$http("modeling.submit",Object.assign({},
onther,
{
......@@ -665,7 +685,6 @@ export default {
for (let i = 0; i < item.value; i++) {
res.push(this.getDefaultColor())
}
// console.log(target)
// console.log(res)
this.detail.modelingTaskColourDTOList = target.filter((item) => item.id).concat(res)
this.clearColors();
......@@ -787,6 +806,12 @@ export default {
content: '*';
margin-right: 4px;
}
.grid-content{
display: grid;
grid-template-columns: min-content max-content minmax(min-content, 1fr);
}
.float-left{
float: left;
margin-right: 10rpx;
......
......@@ -75,16 +75,16 @@
<view class="line"></view>
品牌{{ index + 1 }}
</view>
<text class="button--delete" @click.stop.self="delBrandRow(item)">删除</text>
<text class="button--delete" @click.stop="delBrandRow(item)">删除</text>
</view>
<view @click="InfoCollapseChange(index)">
{{
brandActive === index ? "收起":"展开"
infoActive === index ? "收起":"展开"
}}
</view>
</view>
<view class="collapse-body" :style="[{
height: brandActive === index ? 'auto' : '0'
height: infoActive === index ? 'auto' : '0'
}]">
<u-form labelWidth="100" labelPosition="top" >
<u-form-item label="品牌名称" :style="style">
......
......@@ -52,21 +52,15 @@ export default {
}
},
created() {
this.orderId = this.$Router.currentRoute.query.id;
},
onShow() {
onLoad() {
this.orderId = this.$Router.currentRoute.query.id;
if(this.ticker){
clearInterval(this.ticker);
}else {
this.ticker = setInterval(this.checkStatus, 1000);
}
//
// this.$once("hooks:onHide", () =>{
// clearInterval(this.ticker);
// })
},
onHide(){
onUnload(){
clearInterval(this.ticker);
}
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment