🛠重构：项目初始化

common/token.js

@@ -1,15 +0,0 @@
-const token = '';
-
-const setToken=function(value){
-    this.token = value;
-}
-
-export default {
-	// token,
-	// setToken,
-	
-	globalToken : '',
-	setGlobalToken(value){
-		this.globalToken = value
-	}
-}

components/mx-compress/mx-compress.vue

@@ -0,0 +1,317 @@
+<template>
+    <view class="mx-compress-container">
+        <!-- #ifndef H5 -->
+        <canvas :style="{width: W + 'px', height: H + 'px', visibility: 'hidden'}" style="left:-9000px;top:-9000px;" class="canvas" canvas-id="canvas"></canvas>
+        <!-- #endif -->
+    </view>
+</template>
+
+<script>
+    export default {
+        data() {
+            return {
+                W: '',
+                H: '',
+                canvas: null,
+                ctx: null,
+                maxLongSize: 1280,          //长边最大长度
+                quality: 0.8,               //压缩质量，0.1-1.0
+                base64: false,              //是否base64
+                waitDrawTime: 1500,         //等待绘图完成时间，用于解决微信小程序真机调试时图片压缩不完整
+                showLoading: '正在压缩..',   //提示信息
+                mask: true
+            }
+        },
+        methods: {
+            async compress(args, options = {}) {
+                return new Promise(async (resolve, reject) => {
+                    let files;
+                    if (arguments[0].tempFiles || arguments[0].tempFilePaths) {
+                        files = arguments[0].tempFilePaths || arguments[0].tempFiles;
+                    };
+                    if (arguments[0].files) {
+                        files = arguments[0].files;
+                    }
+                    if (!files instanceof Array) {
+                        reject('数据格式错误');
+                    }
+                    if (!files.length) {
+                        reject('数据不能为空');
+                    }
+                    this.maxLongSize = options.maxLongSize || 1280;
+                    this.quality = options.quality || 0.8;
+                    this.base64 = options.base64 || false;
+                    this.waitDrawTime = options.waitDrawTime || 1500;
+                    this.showLoading = options.showLoading === true ? '正在压缩..' : typeof options.showLoading === 'string' ? options.showLoading : false;
+                    this.mask = options.mask || true;
+                    if (this.showLoading) {
+                        uni.showLoading({
+                            title: this.showLoading,
+                            mask: this.mask,
+                        })
+                    }
+                    try {
+                        const result = await this.doCompress(files);
+                        resolve(result);
+                        uni.hideLoading();
+                    } catch (error) {
+                        reject(error);
+                        uni.hideLoading();
+                    }
+                })
+            },
+            async doCompress(files) {
+                // #ifdef H5
+                if (typeof files[0] === 'object') {
+                    let result = await this.toBase64H5(files);
+                    return await this.compressImageH5(result);
+                }
+                if (typeof files[0] === 'string') {
+                    let result = files.map(item => {
+                        return {
+                            base64: item
+                        }
+                    });
+                    return await this.compressImageH5(result);
+                }
+                return [];
+                // #endif
+
+                // #ifndef H5
+                if (typeof files[0] === 'string') {
+                    const result = await this.getImgInfoWX(files);
+                    return await this.compressImageWX(result);
+                }
+                if (typeof files[0] === 'object') {
+                    files = files.map(item => {
+                        return item.path
+                    });
+                    const result = await this.getImgInfoWX(files);
+                    return await this.compressImageWX(result);
+                }
+                return [];
+                // #endif
+                return [];
+            },
+            compressImageH5(base64Result) {
+                let result = [];
+                return new Promise(async (resolve, reject) => {
+                    for (let i = 0; i < base64Result.length; i++) {
+                        let res = await this.compressResultH5(base64Result[i]);
+                        result.push(res);
+                        if (result.length === base64Result.length) {
+                            resolve(result);
+                            this.canvas = null;
+                        }
+                    }
+                })
+            },
+            compressResultH5(base64Item) {
+                return new Promise((resolve, reject) => {
+                    let image = new Image();
+                    image.src = base64Item.base64;
+                    image.addEventListener('load', () => {
+                        let oriWidth = image.naturalWidth
+                        let oriHeight = image.naturalHeight
+
+                        //不需要压缩尺寸
+                        if (oriWidth < this.maxLongSize && oriHeight < this.maxLongSize) {
+                            this.W = oriWidth
+                            this.H = oriHeight
+                        }
+                        //需要压缩尺寸
+                        else {
+                            if (oriWidth > oriHeight) {
+                                this.W = this.maxLongSize
+                                this.H = Math.trunc(this.maxLongSize * oriHeight / oriWidth)
+                            } else {
+                                this.H = this.maxLongSize
+                                this.W = Math.trunc(this.maxLongSize * oriWidth / oriHeight)
+                            }
+                        }
+
+                        if (!this.canvas) {
+                            this.canvas = document.createElement('canvas');
+                        }
+                        this.canvas.width = this.W;
+                        this.canvas.height = this.H;
+                        const ctx = this.canvas.getContext('2d');
+                        ctx.clearRect(0, 0, this.W, this.H);
+                        ctx.drawImage(image, 0, 0, this.W, this.H);
+                        const compressImg = this.canvas.toDataURL('image/jpeg', this.quality);
+                        let file = this._dataURLtoFile(compressImg, base64Item.filename);
+                        if (this.base64) {
+                            resolve({
+                                base64: compressImg,
+                                file,
+                                width: this.W,
+                                height: this.H
+                            });
+                        } else {
+                            resolve({
+                                file,
+                                width: this.W,
+                                height: htis.H
+                            });
+                        }
+                        image = null;
+                    })
+                })
+            },
+            getImgInfoWX(tempFilePaths) {
+                let result = [];
+                return new Promise((resolve, reject) => {
+                    for (let i = 0; i < tempFilePaths.length; i++) {
+                        uni.getImageInfo({
+                            src: tempFilePaths[i],
+                            success: (info) => {
+                                result.push({
+                                    filePath: tempFilePaths[i],
+                                    fileInfo: info
+                                });
+                                if (result.length === tempFilePaths.length) {
+                                    resolve(result);
+                                }
+                            }
+                        });
+                    }
+                })
+            },
+            compressImageWX(tempFiles) {
+                let result = [];
+                return new Promise(async (resolve, reject) => {
+                    for (let i = 0; i < tempFiles.length; i++) {
+                        let res = await this.compressResultWX(tempFiles[i]);
+                        result.push(res);
+                        if (result.length === tempFiles.length) {
+                            resolve(result);
+                            this.ctx = null;
+                        }
+                    }
+                })
+            },
+            compressResultWX(tempFile) {
+                return new Promise((resolve, reject) => {
+                    let oriWidth = tempFile.fileInfo.width;
+                    let oriHeight = tempFile.fileInfo.height;
+                    let filePath = tempFile.filePath
+
+                    //不需要压缩
+                    if (oriWidth < this.maxLongSize && oriHeight < this.maxLongSize) {
+                        if (this.base64) {
+                            let base64 = uni.getFileSystemManager().readFileSync(filePath, 'base64');
+                            base64 = `data:image/jpeg;base64,${base64}`
+                            resolve({
+                                file: filePath,
+                                base64,
+                                width: oriWidth,
+                                height: oriHeight
+                            });
+                        } else {
+                            resolve({
+                                file: filePath,
+                                width: oriWidth,
+                                height: oriHeight
+                            });
+                        }
+
+                        return
+                    }
+
+                    if (oriWidth > oriHeight) {
+                        this.W = this.maxLongSize
+                        this.H = Math.trunc(this.maxLongSize * oriHeight / oriWidth)
+                    } else {
+                        this.H = this.maxLongSize
+                        this.W = Math.trunc(this.maxLongSize * oriWidth / oriHeight)
+                    }
+
+                    if (!this.ctx) {
+                        this.ctx = uni.createCanvasContext('canvas', this);
+                    }
+                    this.ctx.clearRect(0, 0, this.W, this.H);
+                    this.ctx.drawImage(filePath, 0, 0, this.W, this.H);
+                    this.ctx.draw(false, setTimeout(() => {
+                        uni.canvasToTempFilePath({
+                            x: 0,
+                            y: 0,
+                            width: this.W,
+                            height: this.H,
+                            destWidth: this.W,
+                            destHeight: this.H,
+                            canvasId: 'canvas',
+                            quality: this.quality,
+                            fileType: 'jpg',
+                            success: (res) => {
+                                let newFilePath = res.tempFilePath;
+                                if (this.base64) {
+                                    let base64 = uni.getFileSystemManager().readFileSync(newFilePath, 'base64');
+                                    base64 = `data:image/jpeg;base64,${base64}`
+                                    resolve({
+                                        file: newFilePath,
+                                        base64,
+                                        width: this.W,
+                                        height: this.H
+                                    });
+                                } else {
+                                    resolve({
+                                        file: newFilePath,
+                                        width: this.W,
+                                        height: this.H
+                                    });
+                                }
+                            }
+                        }, this)
+                    }, this.waitDrawTime)); //等待几秒确保绘图完成（用于解决微信小程序真机调试压缩图片不完整的不完美方案）
+                })
+            },
+            toBase64H5(file) {
+                return new Promise((resolve, reject) => {
+                    let result = [];
+                    for (let i = 0; i < file.length; i++) {
+                        let reader = new FileReader();
+                        let base64Result;
+                        reader.addEventListener('load', (e) => {
+                            base64Result = reader.result || e.target.result;
+                            let filename = file[i].name.slice(0, file[i].name.lastIndexOf('.'));
+                            result.push({
+                                base64: base64Result,
+                                filename
+                            });
+                            reader = null;
+                            if (result.length === file.length) {
+                                resolve(result);
+                            }
+                        });
+                        reader.readAsDataURL(file[i]);
+                    }
+                })
+            },
+            _dataURLtoFile(dataurl, filename) {
+                let arr = dataurl.split(',');
+                let mime = arr[0].match(/:(.*?);/)[1],
+                    bstr = atob(arr[1]),
+                    n = bstr.length,
+                    u8arr = new Uint8Array(n);
+                while (n--) {
+                    u8arr[n] = bstr.charCodeAt(n);
+                }
+                return new File([u8arr], filename, {
+                    type: mime
+                });
+            }
+        }
+    }
+</script>
+
+<style scoped>
+    .mx-compress-container {
+        width: 0;
+        height: 0;
+        margin: 0;
+        padding: 0;
+        overflow: hidden;
+        position: absolute;
+        z-index: -100000;
+    }
+</style>

manifest.json

@@ -1,5 +1,5 @@
 {
-    "name" : "lttc-miniprogram-yzcj-zlfk",
+    "name" : "uniapp-yzcj",
     "appid" : "__UNI__B8260A0",
     "description" : "",
     "versionName" : "ColorUi for UniApp 2.1.4",
@@ -48,14 +48,18 @@
     /* 快应用特有相关 */
     "mp-weixin" : {
         /* 小程序特有相关 */
-        "appid" : "",
+        "appid" : "wxc5aaaa60316759ea",
         "setting" : {
             "urlCheck" : false,
             "es6" : true
         }
     },
     "h5" : {
-        "title" : "ColorUi for UniApp",
-        "domain" : "demo.color-ui.com"
+        "title" : "uniapp-yzcj",
+        "domain" : "yzcj.h5.lttc.cn",
+        "router" : {
+            "mode" : "history",
+            "base" : ""
+        }
     }
 }

pages.json

@@ -1,205 +1,61 @@
 {
 	"pages": [
 		//pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
-		// {
-		// 	"path": "pages/index/index",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/layout",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/background",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/text",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/icon",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/button",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/design",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/tag",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/avatar",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/progress",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/shadow",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/basics/loading",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/component/bar",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/component/nav",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/component/list",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/component/card",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/component/form",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/component/timeline",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/component/chat",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/component/swiper",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/component/modal",
-		// 	"style": {}
-		// },
-		// {
-		// 	"path": "pages/component/steps",
-		// 	"style": {}
-		// }, {
-		// 	"path": "pages/plugin/indexes",
-		// 	"style": {}
-		// }, {
-		// 	"path": "pages/plugin/animation",
-		// 	"style": {}
-		// }, {
-		// 	"path": "pages/plugin/drawer",
-		// 	"style": {}
-		// }, {
-		// 	"path": "pages/plugin/verticalnav",
-		// 	"style": {}
-		// }
-	    // ,
 		{
-		    "path" : "pages/login/login",
-		    "style" :                                                                                    
-		    {
-		        "navigationBarTitleText": "",
-		        "enablePullDownRefresh": false
-		    }
-		    
-		},{
-		    "path" : "pages/menu/menu",
-		    "style" :                                                                                    
-		    {
-				"navigationStyle":"default",
-		        "navigationBarTitleText": "应用广场",
-				"app-plus":{
-					"titleNView":{
-						"buttons":[
-							{
-								//设置导航栏右边的按钮
-								"index":"0",
-								"color":"#FFFFFF",
-								"text":"退出登录",
-								"type":"none",
-								"fontSize":"15",
-								"fontWeight":"normal"
-							}
-						]
+			"path": "pages/login/login",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+
+		}, {
+			"path": "pages/menu/menu",
+			"style": {
+				"navigationStyle": "default",
+				"navigationBarTitleText": "应用广场",
+				"app-plus": {
+					"titleNView": {
+						"buttons": [{
+							//设置导航栏右边的按钮
+							"color": "#FFFFFF",
+							"text": "退出登录",
+							"type": "none",
+							"fontSize": "15",
+							"fontWeight": "normal"
+						}]
 					}
 				},
-		        "enablePullDownRefresh": false
-		    }
-		    
-		},{
-            "path" : "pages/billlist/billlist",
-            "style" :                                                                                    
-            {
-				"navigationStyle":"default",
+				"enablePullDownRefresh": false
+			}
+
+		}, {
+			"path": "pages/billlist/billlist",
+			"style": {
+				"navigationStyle": "default",
 				"navigationBarTitleText": "质量反馈单据列表",
-				"app-plus":{
-					"titleNView":{
-						//"type":"transparent"
-						"backgroundImage":"static/BasicsBg.png",//"linear-gradient(to top left, #0081ff, #1cbbb4)"
-						"buttons":[
-							{
-								"color":"#FFFFFF",
-								"type":"back"
-							}
-						]
+				"app-plus": {
+					"titleNView": {
+						"backgroundImage": "static/BasicsBg.png"
 					}
 				},
-                "enablePullDownRefresh": false
-            }
-            
-        }
-        ,{
-            "path" : "pages/detail/detail",
-            "style" :                                                                                    
-            {
+				"enablePullDownRefresh": false
+			}
+		}, {
+			"path": "pages/detail/detail",
+			"style": {
 				//navigationStyle属性值为custom时没有导航栏，为default时有
 				//在本文件 globalStyle 属性里设置为custom无导航栏，在单个页面中设置有导航栏
-				"navigationStyle":"default",  
-                "navigationBarTitleText": "质量反馈明细",
-				"app-plus":{ //APP端扩展设置
-					"titleNView":{ //原生导航栏配置参数
-						"type":"default", //有用
-						"autoBackButton": false,
-						"backgroundImage":"linear-gradient(to top left, #0081ff, #1cbbb4)",
-						//  "searchInput": {
-						//     "backgroundColor": "#fff",
-						//     "borderRadius": "6px", //输入框圆角
-						//     "placeholder": "请输入搜索内容",
-						//     "disabled": true //disable时点击输入框不置焦，可以跳到新页面搜索
-						// }, //有用
-						//"backgroundColor":"#FFFFFF", //导航栏背景色
-						"buttons":[
-							{
-								"color":"#ffffff",
-								"type":"back"
-								// "backgroundColor":"#000000",
-								// "text":"ss", "\ue63c"
-								// "title":"ss"
-							}
-						]
-						// "backButton":{
-						// 	"color":"#000000",
-						// 	"background":"#ff0000" //当xxx时生效
-						// 	// "badgeText":"角标",
-						// 	// "color":"#000000",
-						// 	// "colorPressed":"#007AFF",
-						// 	// "title":"返回",
-						// 	// "fontSize":"32px"
-						// }
+				"navigationStyle": "default",
+				"navigationBarTitleText": "质量反馈明细",
+				"app-plus": { //APP端扩展设置
+					"titleNView": { //原生导航栏配置参数
+						"backgroundImage": "linear-gradient(to top left, #0081ff, #1cbbb4)"
 					}
 				},
-                "enablePullDownRefresh": false
-            }
-        }
-    ],
+				"enablePullDownRefresh": false
+			}
+		}
+	],
 	"globalStyle": {
 		"mp-alipay": {
 			/* 支付宝小程序特有相关 */
@@ -212,13 +68,12 @@
 		"navigationBarTextStyle": "white"
 	},
 	"usingComponts": true,
-		"condition": { //模式配置，仅开发期间生效
+	"condition": { //模式配置，仅开发期间生效
 		"current": 0, //当前激活的模式(list 的索引项)
 		"list": [{
-				"name": "表单", //模式名称
-				"path": "", //TODO：“pages/login/login”  "pages/component/xxx", //启动页面
-				"query": "" //启动参数
-			}
-		]
+			"name": "表单", //模式名称
+			"path": "", //TODO：“pages/login/login”  "pages/component/xxx", //启动页面
+			"query": "" //启动参数
+		}]
 	}
-}
+}

pages/billlist/billlist.vue

@@ -7,10 +7,10 @@
 
 			<view class="fkrq-range" @click="dateRange">
 				<view class="padding-sm">{{range[0]}}</view>
-				<view class="padding-sm">--</view>
+				<view class="padding-sm">至</view>
 				<view class="padding-sm">{{range[1]}}</view>
 			</view>
-			<mx-date-picker :show="showPicker" type="range" :value="value" @confirm="confirmDate" @cancel="cancelDate">
+			<mx-date-picker :show="showPicker" type="range" format="yyyy-mm-dd" :value="value" @confirm="confirmDate" @cancel="cancelDate">
 			</mx-date-picker>
 		</view>
 
@@ -25,25 +25,19 @@
 
 		<view class="padding-sm text-center querybtn margin-top-sm">
 			<button class="btnflex round bg-blue" @click="search(0)">查询</button>
-			<button class="btnflex round bg-blue" v-if="isAllowSearchAll" @click="search(1)">查询全部</button>
+			<button class="btnflex round bg-blue" v-if="isAllowQueryAll" @click="search(1)">查询全部</button>
 		</view>
 
 		<view class="margin-top-sm">
-			<uni-search-bar class="search" v-model="searchValue" placeholder="请输入显示字段的值..." :radius="100"
-				@confirm="searchBarEnter" @cancel="searchBarCancel"></uni-search-bar>
+			<uni-search-bar class="search" v-model="searchValue" placeholder="面料编码" :radius="100" @confirm="searchBarEnter" @cancel="searchBarCancel"></uni-search-bar>
 		</view>
 
 		<view>
 			<view class="example-body">
-				<uni-pagination :current="current" :total="total" :pageSize="pageSize" :show-icon="true"
-					@change="change" />
+				<uni-pagination :current="current" :total="total" :pageSize="pageSize" :show-icon="true" @change="change" />
 			</view>
 			<uni-list>
-				<uni-list-item v-for="(bill,index) in list"
-					v-if="index >= (current-1)*pageSize && index < current*pageSize" :title="'面料编码：'+bill.ynDyeFabCode"
-					:clickable="isAllowUpload" :showArrow="isAllowUpload" @click="toDetailPage(bill)"
-					:note="'反馈日期：'+bill.fkrq+'\n反馈类型：'+bill.fklx+'\n通报标记：'+bill.fktbbj+'\n客户名称：'+bill.khmc+'\n统计米：'+bill.tjslm+'\n颜色米：'+bill.tjsly+'\n反馈原因：'+bill.fkyy+'\n反馈人：'+bill.fkr+'\n验装结论：'+bill.yzgccljl+'\n品管最终结论：'+bill.pgbzzcljl"
-					:thumb="bill.isUploaded ? uploadedImg : ununploadedImg" thumbSize="sm">
+				<uni-list-item v-for="(bill,index) in list" v-if="index >= (current-1)*pageSize && index < current*pageSize" :title="'面料编码：'+bill.ynDyeFabCode" :note="getNote(bill)" :show-badge="bill.imgCount>0" :badge-text="bill.imgCount+''" :showArrow="true" clickable @click="toDetailPage(bill)">
 				</uni-list-item>
 			</uni-list>
 		</view>
@@ -51,27 +45,21 @@
 </template>
 
 <script>
-	//引入已经定义的公共模块，用来获取和设置userkey/token
-	import token from '../../common/token.js'
-
 	export default {
 		data() {
 			return {
 				showPicker: false,
-				range: [],
-				value: '',
-				startDate: '',
-				endDate: '',
-				isAllowUpload: true,
-				isAllowSearchAll: false,
-				uploadedImg: 'http://img-cdn-tc.dcloud.net.cn/uploads/nav_menu/11.jpg',
-				ununploadedImg: 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-f184e7c3-1912-41b2-b81f-435d1b37c7b4/5a7f902b-21a7-4822-884f-925219eacc4b.png',
+				range: [], //页面显示的反馈日期范围
+				value: [], //反馈日期的控件值
+				isQueyAll: 0, //是否查询全部，0：查询个人单据；1：查询全部单据，默认为0，即查询个人单据
+				isAllowEdit: false,
+				isAllowQueryAll: false,
 				list: [],
 				allBills: [],
 				searchValue: '',
-				fklx: '',
+				fklx: ['YS', 'WG', 'JH'],
 				fklxs: [{
-						"value": "YS", 
+						"value": "YS",
 						"text": "颜色"
 					},
 					{
@@ -88,202 +76,187 @@
 				pageSize: 5,
 			}
 		},
-		mounted() {
-			//隐藏导航栏自带的返回按钮
-			var a = document.getElementsByClassName('uni-page-head-hd')[0];
-			console.log('隐藏导航栏自带的返回按钮：' + a);
-			a.style.display = "none";
-		},
-		onLoad() {
-			console.log('BillList页面onload()');
-			console.log('获取全局token' + token.globalToken);
+		onLoad(param) {
 
-			//加载页面时，获取默认的日期范围
-			var date = new Date();
-			var currYear = date.getFullYear();
-			var currMonth = date.getMonth() + 1; //getMonth() 返回0-11
-			if (currMonth < 10) {
-				currMonth = '0' + currMonth
-			}
-			var currDay = date.getDate(); //getDay()获取星期几
-			if (currDay < 10) {
-				currDay = '0' + currDay
-			}
-			this.startDate = this.endDate = currYear + "/" + currMonth + "/" + currDay; //默认查询当天的单据
-			this.range = [this.startDate, this.endDate];
-			console.log('onLoad：' + this.startDate + '//' + this.endDate + '//' + token.globalToken);
+			//若加载页面时未提供参数，则默认查询个人反馈单据；否则，根据参数查询相应反馈单据
+			if (Object.keys(param).length > 0) {
+				var paramData = JSON.parse(param.paramData);
+				this.isQueyAll = paramData.isQueryAll;
+				this.value = this.range = paramData.dateRange;
+				this.fklx = paramData.fklx;
+			} else {
 
-			//访问网络获取权限
-			uni.request({
-				url: 'http://10.20.71.214:9090/yzcj/zlfkcl/checkPermission',
-				header: {
-					'token': token.globalToken
-				},
+				//加载页面时，设置默认的日期范围
+				var currDate = new Date();
+				var currYear = currDate.getFullYear();
+				var currMonth = currDate.getMonth() + 1; //getMonth() 返回0-11
+				if (currMonth < 10) {
+					currMonth = '0' + currMonth
+				}
+				var currDay = currDate.getDate(); //getDate()：获取一月的某一天；getDay()：获取星期几
+				if (currDay < 10) {
+					currDay = '0' + currDay
+				}
+				var defalutDate = currYear + "-" + currMonth + "-" + currDay;
+				this.value = this.range = [defalutDate, defalutDate]; //默认查询当天的单据
+			}
 
-				success: (res) => {
-					console.log('访问网络检查权限成功' + JSON.stringify(res.data));
+			//添加请求拦截器
+			var vm = this
+			uni.getStorage({
+				key: 'token',
+				success: function(res) {
+					//请求拦截器
+					uni.addInterceptor('request', {
+						invoke(args) {
+							args.header = {
+								'token': res.data
+							}
+						}
+					})
 
-					console.log('获取权限成功');
-					this.isAllowSearchAll = res.data.isAdmin;
-					this.isAllowUpload = res.data.isAllowUpload;
-					console.log("isAllowSearchAll " + this.isAllowSearchAll + ' isAllowUpload ' + this
-						.isAllowUpload);
+					//访问网络获取权限
+					uni.request({
+						url: 'https://api.lttc.cn/mes/yzcj/qualityFeedback/checkPermission',
+						success: (res) => {
+							if (res.data.code == 0) {
+								vm.isAllowQueryAll = res.data.data.QueryAll;
+								vm.isAllowEdit = res.data.data.EditRight;
 
-					//默认获取当前日期的全部反馈类型的数据
-					console.log('调用函数 访问网络 获取单据');
-					this.search();
+								//根据反馈日期、反馈类型及是否查询全部获取反馈单据
+								vm.search(vm.isQueyAll);
+							} else {
+								//弹出提示
+								uni.showToast({
+									title: '获取权限失败！原因是：' + res.data.msg,
+									icon: 'none'
+								})
+							}
+						},
+						fail: (res) => {
+							uni.showToast({
+								title: '访问网络检查权限失败！原因是：' + res.errMsg,
+								icon: 'none'
+							})
+						}
+					});
 				},
-				fail: (res) => {
-					console.log('访问失败' + res.errMsg);
-					uni.showToast({
-						title: '访问网络检查权限失败：' + res.errMsg,
-						icon: 'none'
+				fail() {
+					//从缓存中未获取到token失败时跳转登录界面
+					uni.navigateTo({
+						url: '../login/login?isback=1'
 					})
-				},
-				complete: (res) => {
-					console.log('访问网络结束');
-				},
+				}
 			});
 		},
-		onNavigationBarButtonTap(e) {
-			console.log("返回按钮!!!!!" + e);
-			console.log("跳转到菜单页");
+		onBackPress(e) {
+			//返回菜单页面
 			uni.navigateTo({
-				url: "/pages/menu/menu"
-			});
-			return true;
+				url: '../menu/menu'
+			})
+			return true
 		},
 		methods: {
 			dateRange() {
-				//设置反馈日期的起始日期
-				console.log('设置起始日期');
-				this.showPicker = true;
-				this.value = this['range'];
-				console.log(this.value);
+				this.showPicker = true; //显示日期选择控件
+				this.value = this.range;
 			},
 			confirmDate(e) {
-				console.log('确认日期');
-				this.showPicker = false;
-				this.range = e.value;
+				this.showPicker = false; //隐藏日期选择控件
+				this.value = this.range = e.value;
 			},
 			cancelDate() {
-				console.log('取消修改日期');
-				this.showPicker = false;
-			},
-			ed(e) {
-				console.log('ed()函数执行');
-				this.showPicker = false;
-				console.log(this.showPicker);
-				if (e) {
-					this.range = e.value;
-					//选择的值
-					console.log('value => ' + e.value);
-					//原始的Date对象
-					console.log('date => ' + e.date);
-				}
-			},
-
-			bindStartDate(e) {
-				console.log('开始日期：修改后的值' + e.detail.value);
-				this.startDate = e.detail.value;
+				this.showPicker = false; //隐藏日期选择控件
 			},
-			bindEndDate(e) {
-				console.log('结束日期：修改后的值' + e.detail.value);
-				this.endDate = e.detail.value;
+			//获取列表项的note属性值
+			getNote(bill) {
+				return '反馈日期：' + bill.fkrq + '\n反馈类型：' + bill.fklx + '\n通报标记：' + bill.fktbbj + '\n客户名称：' + bill.khmc + '\n统计米：' + bill.tjslm + '\n颜色米：' + bill.tjsly + '\n反馈原因：' + bill.fkyy + '\n反馈人：' + bill.fkr + '\n验装结论：' + bill.yzgccljl + '\n品管最终结论：' + bill.pgbzzcljl
 			},
 			search(isAll) {
-				console.log('开始查询');
-				console.log(this.startDate + '//' + this.endDate + '//' + this.fklx);
+				//记录是查询个人反馈单据还是查询全部反馈单据
+				this.isQueyAll = isAll
+
+				//拼接反馈类型
+				var fklxStr = ''
+				for (let v of this.fklx) {
+					fklxStr += v + ','
+				}
+				fklxStr = fklxStr.length > 0 ? fklxStr.substring(0, fklxStr.length - 1) : fklxStr
 
+				//访问网络获取反馈单据列表
 				uni.request({
-					url: 'http://10.20.71.214:9090/yzcj/zlfkcl/getData',
+					url: 'https://api.lttc.cn/mes/yzcj/qualityFeedback/getData',
 					data: {
-						startDate: this.startDate,
-						endDate: this.endDate,
-						fklx: this.fklx,
-						isSearchAll: isAll,
-					},
-					header: {
-						'token': token.globalToken
+						startDate: this.value[0],
+						endDate: this.value[1],
+						fklx: fklxStr,
+						isSearchAll: this.isQueyAll,
 					},
-
 					success: (res) => {
-						console.log('获取单据成功');
-						console.log(res.statusCode);
-						this.list = this.allBills = res.data;
-						console.log('单据条数为' + this.list.length);
-						this.total = this.list.length;
-						uni.showToast({
-							title:'查询成功！'
-						})
+						//获取数据成功后，界面绑定数据
+						if (res.data.code == 0) {
+							this.list = this.allBills = res.data.data;
+							this.total = this.list.length;
+							this.current = 1;
+						} else {
+							//弹出提示
+							uni.showToast({
+								title: '获取质量反馈单据列表失败！原因是：' + res.data.msg,
+								icon: 'none'
+							})
+						}
 					},
 					fail: (res) => {
-						console.log('访问网络获取单据列表失败' + res.errMsg);
 						uni.showToast({
-							title: '访问网络获取单据列表失败：' + res.errMsg,
+							title: '访问网络获取质量反馈单据列表失败！原因是：' + res.errMsg,
 							icon: 'none'
 						})
-					},
-					complete: (res) => {
-						console.log('访问网络结束');
-					},
+					}
 				});
 			},
 			searchBarEnter() {
-				console.log('搜索内容：' + this.searchValue);
-				if (this.searchValue == '' && this.allBills.length > 1) {
-					console.log('此时搜索框为空');
+				//若列表单据为空时，直接返回
+				if (this.allBills.length == 0) return
+
+				//未设置过滤条件时，列表显示全部数据
+				if (this.searchValue == '') {
 					this.list = this.allBills;
+					this.total = this.list.length;
+					this.current = 1;
 					return;
 				}
 
-				//搜索this.list
-				this.allBills = this.list;
-				console.log('单据条数' + this.allBills.length);
+				//根据面料编码模糊查询
 				this.list = this.allBills.filter(item => {
-					//支持模糊查询
-					let isYnDyeFabCode = item.ynDyeFabCode.indexOf(this.searchValue) > -1;
-					let isFkrq = item.fkrq.indexOf(this.searchValue) > -1;
-					let isFklx = item.fklx.indexOf(this.searchValue) > -1;
-					let isFktbbj = (item.fktbbj + '').indexOf(this.searchValue) > -1;
-					let isKhmc = item.khmc.indexOf(this.searchValue) > -1;
-					let isTjslm = (item.tjslm + '').indexOf(this.searchValue) > -1;
-					let isTjsly = (item.tjsly + '').indexOf(this.searchValue) > -1;
-					let isFkyy = item.fkyy.indexOf(this.searchValue) > -1;
-					let isFkr = item.fkr.indexOf(this.searchValue) > -1;
-					let isYzgccljl = item.yzgccljl == null ? false : item.yzgccljl.indexOf(this.searchValue) > -1;
-					let isPgbzzcljl = item.pgbzzcljl == null ? false : item.pgbzzcljl.indexOf(this.searchValue) > -
-						1;
-					return isYnDyeFabCode || isFkrq || isFklx || isFktbbj || isKhmc || isTjslm || isTjsly ||
-						isFkyy || isFkr || isYzgccljl || isPgbzzcljl;
+					return item.ynDyeFabCode.indexOf(this.searchValue) > -1;
 				});
 
 				this.total = this.list.length;
 				this.current = 1;
-				console.log('total:' + this.total);
 			},
 			searchBarCancel() {
-				console.log('搜索框取消');
-				if (this.allBills.length > 1) {
-					console.log('当allBills有数据时');
+				//列表数据已过滤时，若取消过滤，则列表展示全部单据
+				if (this.allBills.length > 0) {
 					this.list = this.allBills;
 					this.total = this.list.length;
 					this.current = 1;
-					return;
 				}
 			},
 			toDetailPage(bill) {
-				//点击的单据作为函数参数传入，将本条单据转变为JSON字符串：
-				console.log('明细数据');
-				let billJson = JSON.stringify(bill);
-
-				//将单据字符串传递给明细页面
+				//点击列表中某一单据，跳转至明细页面查询单据详情
+				let billData = JSON.stringify(bill);
+				var json = {
+					"isQueryAll": this.isQueyAll,
+					"dateRange": this.value,
+					"fklx": this.fklx
+				}
+				let paramData = JSON.stringify(json)
 				uni.navigateTo({
-					url: '../detail/detail?billJson=' + billJson
+					url: '../detail/detail?billData=' + billData + '&isAllowEdit=' + this.isAllowEdit + '&paramData=' + paramData
 				});
 			},
 			change(e) {
-				console.log(e)
+				//切换单据列表的当前页面
 				this.current = e.current;
 			},
 		}
@@ -321,4 +294,4 @@
 		height: 80upx;
 		margin: 5upx;
 	}
-</style>
+</style>

pages/detail/detail.vue

@@ -1,257 +1,221 @@
 <template>
 	<view>
+		<!-- 单据明细 -->
 		<view class="margin-top">
 			<scroll-view :scroll-y="true" :show-scrollbar="true">
 				<view class="scroll-list">
 					<view class="list-item">
 						<text class="text-gray item-title">工作中心</text>
-						<text class="item-content">{{workCenterGuid}}</text>
+						<text class="item-content">{{billDetail.workCenterGuid||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">客户合同号</text>
-						<text class="item-content">{{khhth}}</text>
+						<text class="item-content">{{billDetail.khhth}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">客户名称</text>
-						<text class="item-content">{{khmc}}</text>
+						<text class="item-content">{{billDetail.khmc}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">加工指导书编号</text>
-						<text class="item-content">{{jgzdsbh}}</text>
+						<text class="item-content">{{billDetail.jgzdsbh}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">销售物流号</text>
-						<text class="item-content">{{xswlh}}</text>
+						<text class="item-content">{{billDetail.xswlh}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">面料编码</text>
-						<text class="item-content">{{ynDyeFabCode}}</text>
+						<text class="item-content">{{billDetail.ynDyeFabCode}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">合同交期</text>
-						<text class="item-content">{{htjq}}</text>
+						<text class="item-content">{{billDetail.htjq}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">合同数量</text>
-						<text class="item-content">{{htsl}}</text>
+						<text class="item-content">{{billDetail.htsl}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">计量单位</text>
-						<text class="item-content">{{jldw}}</text>
+						<text class="item-content">{{billDetail.jldw}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">反馈初始结论</text>
-						<text class="item-content">{{fkcsjl}}</text>
+						<text class="item-content">{{billDetail.fkcsjl||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">反馈人</text>
-						<text class="item-content">{{fkr}}</text>
+						<text class="item-content">{{billDetail.fkr}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">反馈时间</text>
-						<text class="item-content">{{fksj}}</text>
+						<text class="item-content">{{billDetail.fksj}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">反馈次数</text>
-						<text class="item-content">{{fkcs}}</text>
+						<text class="item-content">{{billDetail.fkcs}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">反馈原因</text>
-						<text class="item-content">{{fkyy}}</text>
+						<text class="item-content">{{billDetail.fkyy}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">验装工厂处理结论</text>
-						<text class="item-content">{{yzgccljl}}</text>
+						<text class="item-content">{{billDetail.yzgccljl||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">验装工厂处理意见</text>
-						<text class="item-content">{{yzgcclyj}}</text>
+						<text class="item-content">{{billDetail.yzgcclyj||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">验装工厂处理人</text>
-						<text class="item-content">{{yzgcclr}}</text>
+						<text class="item-content">{{billDetail.yzgcclr||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">验装工厂处理时间</text>
-						<text class="item-content">{{yzgcclsj}}</text>
+						<text class="item-content">{{billDetail.yzgcclsj||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">验装工厂备注</text>
-						<text class="item-content">{{yzgcbz}}</text>
+						<text class="item-content">{{billDetail.yzgcbz||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">品管部最终处理结论</text>
-						<text class="item-content">{{pgbzzcljl}}</text>
+						<text class="item-content">{{billDetail.pgbzzcljl||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">品管部最终处理意见</text>
-						<text class="item-content">{{pgbzzclyj}}</text>
+						<text class="item-content">{{billDetail.pgbzzclyj||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">品管部最终处理人</text>
-						<text class="item-content">{{pgbzzclr}}</text>
+						<text class="item-content">{{billDetail.pgbzzclr||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">品管部最终处理时间</text>
-						<text class="item-content">{{pgbzzclsj}}</text>
+						<text class="item-content">{{billDetail.pgbzzclsj||''}}</text>
 					</view>
 					<view class="list-item">
 						<text class="text-gray item-title">返工部门</text>
-						<text class="item-content">{{fgbm}}</text>
+						<text class="item-content">{{billDetail.fgbm||''}}</text>
 					</view>
 				</view>
 			</scroll-view>
 		</view>
-
+		<!-- 图片上传 -->
 		<view class="margin-top">
 			<view class="cu-bar bg-white">
 				<view class="action">
 					图片上传
 				</view>
-				<view class="action">
-					{{imgLinks.length}}/9
-				</view>
 			</view>
 			<view class="cu-form-group">
 				<view class="grid col-4 grid-square flex-sub">
-					<view class="bg-img" v-for="(item,index) in imgLinks" :key="index" @tap="ViewImage"
-						:data-url="imgLinks[index]">
-						<image :src="imgLinks[index]" mode="aspectFill"></image>
+					<view class="bg-img" v-for="(item,index) in imgList" @tap="ViewImage" :data-url="item.url">
+						<image :src="item.url" mode="aspectFill"></image>
 						<view class="cu-tag bg-red" @tap.stop="DelImg" :data-index="index">
 							<text class='cuIcon-close'></text>
 						</view>
 					</view>
-					<view class="solids" @tap="ChooseImage" v-if="imgLinks.length<9">
+					<view class="solids" @tap="ChooseImage" v-if="imgList.length<9">
 						<text class='cuIcon-cameraadd'></text>
 					</view>
 				</view>
 			</view>
 		</view>
-
-		<view>
-			<view class="padding margin-tb-sm text-center">
-				<button class="cu-btn block round bg-blue lg" @click="upload">提交</button>
-			</view>
+		<!-- 保存 -->
+		<view class="padding margin-tb-sm text-center" v-show="isAllowEdit=='true'">
+			<button class="cu-btn block round bg-blue lg" @click="upload">保存</button>
 		</view>
+
+		<mx-compress ref="mxCompress" />
 	</view>
 </template>
 
 <script>
-	//引入已经定义的公共模块，用来获取和设置userkey/token
-	import token from '../../common/token.js'
+	//导入图片压缩组件
+	import mxCompress from '../../components/mx-compress/mx-compress.vue';
 
 	export default {
+		components: {
+			mxCompress //注册组件
+		},
 		data() {
 			return {
-				orgFrameGuid: '',
-				workCenterGuid: '',
-				khhth: '',
-				khmc: '',
-				jgzdsbh: '',
-				xswlh: '',
-				ynDyeFabCode: '',
-				htjq: '',
-				htsl: '',
-				jldw: '',
-				fkcsjl: '',
-				fkr: '',
-				fksj: '',
-				fkcs: '',
-				fkyy: '',
-				yzgccljl: '',
-				yzgcclyj: '',
-				yzgcclr: '',
-				yzgcclsj: '',
-				yzgcbz: '',
-				pgbzzcljl: '',
-				pgbzzclyj: '',
-				pgbzzclr: '',
-				pgbzzclsj: '',
-				fgbm: '',
-				imgLinks: [],
-				imgNames: [],
-				toUploadNames: [],
-				uploadedImgNames: [], 
+				billDetail: {}, //单据明细
+				isAllowEdit: '', //是否允许保存
+				paramData: '', //单据列表页面获取数据参数
+				imgList: [] //反馈图片列表
 			}
 		},
-		mounted() {
-			//隐藏导航栏自带的返回按钮
-			var a = document.getElementsByClassName('uni-page-head-hd')[0];
-			console.log(a); 
-			a.style.display = "none";
-		},
 		onLoad(param) {
-			console.log('明细页面获取全局token：' + token.globalToken);
-			console.log('onLoad：传递的单据' + param.billJson);
-			let bill = JSON.parse(param.billJson);
-
-			//给明细界面赋值
-			this.orgFrameGuid = bill.orgFrameGuid;
-			this.workCenterGuid = bill.workCenterGuid;
-			this.khhth = bill.khhth;
-			this.khmc = bill.khmc;
-			this.jgzdsbh = bill.jgzdsbh;
-			this.xswlh = bill.xswlh;
-			this.ynDyeFabCode = bill.ynDyeFabCode;
-			this.htjq = bill.htjq;
-			this.htsl = bill.htsl;
-			this.jldw = bill.jldw;
-			this.fkcsjl = bill.fkcsjl;
-			this.fkr = bill.fkr;
-			this.fksj = bill.fksj;
-			this.fkcs = bill.fkcs;
-			this.fkyy = bill.fkyy;
-			this.yzgccljl = bill.yzgccljl;
-			this.yzgcclyj = bill.yzgcclyj;
-			this.yzgcclr = bill.yzgcclr;
-			this.yzgcclsj = bill.yzgcclsj;
-			this.yzgcbz = bill.yzgcbz;
-			this.pgbzzcljl = bill.pgbzzcljl;
-			this.pgbzzclyj = bill.pgbzzclyj;
-			this.pgbzzclr = bill.pgbzzclr;
-			this.pgbzzclsj = bill.pgbzzclsj;
-			this.fgbm = bill.fgbm;
+			//若加载页面时未提供参数值，则直接返回
+			if (Object.keys(param).length == 0) return
+
+			//给明细界面赋值、设置提交按钮是否可用以及记录单据列表页面是否查询全部单据
+			this.billDetail = JSON.parse(param.billData)
+			this.isAllowEdit = param.isAllowEdit
+			this.paramData=param.paramData
+
+			//添加请求拦截器
+			var vm = this
+			uni.getStorage({
+				key: 'token',
+				success: function(res) {
+					//请求拦截器
+					uni.addInterceptor('request', {
+						invoke(args) {
+							args.header = {
+								'token': res.data
+							}
+						}
+					})
 
-			//获取已经上传的图片
-			uni.request({
-				url: 'http://10.20.71.214:9090/yzcj/zlfkcl/getImage',
-				data: {
-					orgFrameGuid: this.orgFrameGuid,
-					jgzdsbh: this.jgzdsbh,
-					xswlh: this.xswlh,
-					fkcs: this.fkcs,
-				},
+					//获取已经上传的图片
+					uni.request({
+						url: 'https://api.lttc.cn/mes/yzcj/qualityFeedback/getImgList',
+						data: {
+							orgFrameGuid: vm.billDetail.orgFrameGuid,
+							jgzdsbh: vm.billDetail.jgzdsbh,
+							xswlh: vm.billDetail.xswlh,
+							fkcs: vm.billDetail.fkcs,
+						},
 
-				success: (res) => {
-					console.log('获取已上传图片成功' );
-					console.log('返回的已上传的图片信息'+JSON.stringify(res));
-					
-					//显示已上传的图片
-					this.imgLinks = res.data.imgUrls;
-					this.imgNames = res.data.imgNames;
-					
-					//记录已上传的图片
-					this.uploadedImgNames =JSON.stringify(res.data.imgNames) ;
-					console.log('获取服务器图片后：已上传的文件链接：' + JSON.stringify(this.imgLinks) + '//已上传的文件名：' + JSON.stringify(this.uploadedImgNames));
-				},
-				fail: (res) => {
-					console.log('获取已上传的图片失败：' + res.errMsg);
-					uni.showToast({
-						title: '获取已上传的图片失败：' + res.errMsg,
-						icon: 'none'
+						success: (res) => {
+							if (res.data.code == 0) {
+								//根据图片src链接显示已上传的图片
+								vm.imgList = res.data.data;
+							} else {
+								uni.showToast({
+									title: '获取反馈图片列表失败！原因是：' + res.data.msg,
+									icon: 'none'
+								})
+							}
+						},
+						fail: (res) => {
+							uni.showToast({
+								title: '访问网络获取反馈图片列表失败！原因是：' + res.errMsg,
+								icon: 'none'
+							})
+						}
 					})
 				},
-				complete: (res) => {
-					console.log('访问网络获取图片结束');
+				fail() {
+					//从缓存中未获取到token失败时跳转登录界面
+					uni.navigateTo({
+						url: '../login/login?isback=1'
+					})
 				}
-			})
+			});
 		},
-		onNavigationBarButtonTap(e) {
-			console.log("返回按钮!!!!!" + e);
-			console.log("跳转到单据列表");
+		onBackPress(e) {
+			//返回上一页面，即单据列表页
 			uni.navigateTo({
-				url: "/pages/billlist/billlist"
-			});
+				url: '../billlist/billlist?paramData=' + this.paramData
+			})
+			//返回值为 true 时，才表示不执行默认的返回，自行处理此时的业务逻辑
+			return true
 		},
 		methods: {
 			ChooseImage() {
@@ -259,277 +223,155 @@
 					count: 9,
 					sizeType: ['original', 'compressed'],
 					sourceType: ['camera', 'album'],
+					success: async (res) => {
+						try {
+							// 调用组件的compress方法开始压缩，返回值是压缩的结果，结果为数组，每一项是一个对象
+							// {
+							// 	file:'在H5中为File格式的图片数据，在小程序中为图片临时路径',
+							// 	base64:'在H5和小程序中都是base64格式数据，只有当指定base64为true时才有'
+							// }
+							let result = await this.$refs.mxCompress.compress(res, {
+								base64: true, // 是否也返回base64格式，默认false，既不返回base64格式图片数据，反之亦然
+								maxLongSize: 1920, //最长尺寸
+								quality: 0.8, // 压缩质量（0-1），默认为0.8，值越小压缩质量越大
+								showLoading: true, // 是否显示loading提示，也可以传入一个字符串（相当于loading时的title），默认为true，
+								mask: true // 当showLoading为true时，是否显示遮罩层，默认为true
+							});
 
-					success: (res) => {
-						//选择图片后：res.tempFilePaths 存放图片的blob网址
-						console.log('选择图片后：' + res.tempFiles[0].size + 'Byte//文件名：' + res.tempFiles[0].name + '//' + res.tempFiles[0].type + '//' + res.tempFiles[0].path);
-						
-						//选择图片后，添加到 imgLinks 中
-						if (this.imgLinks.length != 0) {
-							//如果存在上传过的图片，则保留已上传图片，添加新选择的图片
-							console.log('imgLinks有图片');
-							this.imgLinks = this.imgLinks.concat(res.tempFilePaths);
-						} else {
-							this.imgLinks = res.tempFilePaths;
-						}
-						console.log('显示的图片：已上传的和已选择的链接：' + this.imgLinks);
+							//循环添加压缩后的图片
+							for (let item of result) {
+								//H5端：根据压缩后图片的base64格式数据来上传图片					
+								//#ifdef H5
+								let imgSrc = item.base64;
+								//#endif
+								//小程序端：根据压缩后图片的临时路径来上传图片
+								//#ifdef MP-WEIXIN
+								let imgSrc = item.file;
+								//#endif
+
+								this.imgList.push({
+									"url": imgSrc,
+									"status": 0
+								})
+							}
 
-						//选择图片后，添加到 imgNames 中
-						for (var i = 0; i < res.tempFiles.length; i++) {
-							this.imgNames.push(res.tempFiles[i].name); //已上传到服务器的文件名和新选择的文件名
+						} catch (error) {
+							uni.showToast({
+								title: '图片压缩出现异常！原因是：' + error,
+								icon: 'none'
+							})
 						}
-						console.log('已选择图片的名称：' + this.imgNames);
-						console.log('选择图片后已上传文件：'+this.uploadedImgNames);
 					}
 				});
 			},
 			ViewImage(e) {
+				//获取当前单据上传的所有图片的url地址
+				var imgUrls = []
+				for (let item of this.imgList) {
+					imgUrls.push(item.url)
+				}
+
 				//预览图片
 				uni.previewImage({
-					urls: this.imgLinks,
+					urls: imgUrls,
 					current: e.currentTarget.dataset.url,
 				});
 			},
 			DelImg(e) {
-				uni.showModal({
-					title: '提示',
-					content: '确定要删除这张面料图片吗？',
-					cancelText: '保留',
-					confirmText: '删除',
-
-					success: res => {
-						if (res.confirm) {
-							//要删除的文件名
-							console.log('询问删除时索引'+e.currentTarget.dataset.index);
-							console.log('文件名：'+this.imgNames);
-							console.log('文件链接'+this.imgLinks);
-							let deleteName = this.imgNames[e.currentTarget.dataset.index];
-							console.log('要删除的图片名' + deleteName);
-							console.log('删除前临时网址数组' + this.imgLinks);
-							console.log('删除前图片名数组' + this.imgNames);
-
-							//判断是否是服务器已经上穿过的图片
-							if (this.uploadedImgNames.indexOf(deleteName) > 0) {
-								//已上传的图片不允许删除并提示
-								uni.showToast({
-									title: '图片\"' + deleteName + '\"已上传到服务器，不允许删除！',
-									icon: 'none'
-								});
-								return;
-							} 
-							else {
-								//没上传的图片直接删除
-								this.imgLinks.splice(e.currentTarget.dataset.index, 1)
-								console.log('删除后图片临时网址数组' + this.imgLinks);
-								this.imgNames.splice(e.currentTarget.dataset.index, 1)
-								console.log('删除后的图片名数组' + JSON.stringify(this.imgNames));
-							}
-						}
-					}
-				})
-			},
-			upload() {
-				//当前没有图片，直接返回
-				if (this.imgLinks.length == 0) {
-					return;
-				}
-
-				//检查文件是否为图片
-				var illegalFiles = ''; //未知类型的
-				var otherFiles = ''; //非图片的
-				var uploadedFiles = ''; //已上传的
-				var uploadedList = [];
-				var sameNames = '';
-				var sameNameList = [];
-				console.log('提交后，开始检查文件之前，已上传的文件名：'+this.uploadedImgNames);
-				for (var i = 0; i < this.imgNames.length; i++) {
-					console.log('循环' + i);
-
-					//检查文件是否合法
-					var fileName = this.imgNames[i];
-					var dotIndex = fileName.lastIndexOf('.');
-					if (dotIndex == -1) {
-						illegalFiles += fileName + '，'
-						continue;
-					}
-
-					//检查是否为图片文件
-					var extension = fileName.substring(dotIndex + 1, fileName.length);
-					var fileTypes = ['jpg', 'jpeg', 'png', 'bmp'];
-					if (fileTypes.indexOf(extension) == -1) {
-						otherFiles += fileName + '，'
-						console.log('非图片文件' + otherFiles);
-						continue;
-					}
-
-					//判断是否已经上传过
-					if (this.uploadedImgNames.indexOf(fileName) != -1) {
-						console.log('已上传图片' + this.uploadedImgNames+'//文件名'+fileName);
-						uploadedFiles += fileName + '，';
-						
-						if(uploadedList.indexOf(fileName) == -1){
-							uploadedList.push(fileName);
-						}
-						else{
-							sameNames += fileName + ',';
-							sameNameList.push(fileName);
-						}
-						
-						continue;
-					}
-
-					//要上传的图片名
-					this.toUploadNames.push(fileName);
-					console.log('添加文件'+fileName);
-				}
-
-				//如果文件不符合要求，显示提示
-				let hint = ''
-				if (illegalFiles.length > 0) {
-					illegalFiles = illegalFiles.substring(0, illegalFiles.length - 1); //删除最后一个逗号
-					hint += '文件[' + illegalFiles + ']类型未知，不允许上传！\n'
-				}
-				if (otherFiles.length > 0) {
-					otherFiles = otherFiles.substring(0, otherFiles.length - 1); //删除最后一个逗号
-					hint += '文件[' + otherFiles + ']不是常见的图片文件，不允许上传！\n'
-				}
-				
-				//如果存在不合法文件，提示并返回
-				console.log('提示' + hint);
-				if (hint.length > 0) {
-					uni.showToast({
-						title: hint
-					});
-					return;
-				}
-
-				//若存在与已上传图片同名的图片
-				if (sameNameList.length > 0) {
-					sameNames = sameNames.substring(0, sameNames.length - 1); //删除最后一个逗号
-
-					//询问后做不同处理
+				//根据图片状态删除图片，若未上传至服务器，则直接删除，否则需删除服务器的图片
+				var img = this.imgList[e.currentTarget.dataset.index]
+				if (img.status == 0) {
+					//界面删除图片
+					this.imgList.splice(e.currentTarget.dataset.index, 1)
+				} else {
+					//图片已上传至服务器，询问用户是否确定删除
 					uni.showModal({
 						title: '提示',
-						content: '已上传过同名文件[' + sameNames + ']，是否重命名并上传？',
-						confirmText: '重命名',
-						cancelText: '取消',
-
-						success: res => {
-							//根据选择的是重命名还是取消，处理 this.toUploadNames
-							if (res.confirm) {
-								//将重复的文件区分开
-								for (let j = 0; j < sameNameList.length; j++) {
-									//文件名后面加“_1”
-									fileName = sameNameList[j];
-									console.log('原重复文件名' + fileName);
-									fileName = fileName.substring(0, dotIndex) + '_1' + fileName.substring(dotIndex, fileName.length);
-									console.log('重命名之后的文件名' + fileName);
-									//拼接到 pathStr 中
-									this.toUploadNames.push(fileName);
-								}
-							} 
-							else if (res.cancel) {
-								//如果不重命名，则直接返回
-								return;
-							}
-						}
-					})
-				} 
-				else {
-					//没有重复文件，直接进行后续操作
-					console.log('没有重复文件');
-				}
-				
-				//判断有没有等待上传的图片
-				if (this.toUploadNames.length == 0) {
-					uni.showToast({
-						title: '没有选择图片或选择的图片均已上传，请重新选择图片！',
-						icon:'none'
-					});
-					return;
-				}
-				console.log('等待上传的图片名：' + this.toUploadNames);
-				
-				//选择之后，访问网络上传图片
-				this.uploadFile();
-			},
-			uploadFile() {
-				//上传文件到服务器
-				console.log('要上传的文件名：' + this.toUploadNames);
-				console.log('要上传的文件链接：' + this.imgLinks);
-
-				//一次性上传多个文件不适用于网页和小程序，所以还是采用循环+每次上传一个文件
-				let uploadNames = this.toUploadNames;
-				uploadNames.forEach((filename) => {
-					uni.uploadFile({
-						url: 'http://10.20.71.214:9090/yzcj/zlfkcl/uploadFile',
-						fileType: 'image',
-						filePath: filename, //文件名
-
-						success: (res) => {
-							if (res.statusCode == 200) {
-								console.log('访问网络上传文件成功：');
-								//this.uploadRes = true;
-								console.log('准备插入的图片信息:' + filename +  '//' + this.orgFrameGuid);
+						content: '此图片已上传至服务器，确定要删除这张面料图片吗？',
+						cancelText: '保留',
+						confirmText: '删除',
+						success: result => {
+							if (result.confirm) {
+								//访问网络删除已上传的图片
 								uni.request({
-									url: 'http://10.20.71.214:9090/yzcj/zlfkcl/uploadData',
+									url: 'https://api.lttc.cn/mes/yzcj/qualityFeedback/deleteImg',
 									data: {
-										orgFrameGuid: this.orgFrameGuid,
-										jgzdsbh: this.jgzdsbh,
-										xswlh: this.xswlh,
-										fkcs: this.fkcs,
-										path: filename,
+										"imgId": img.id
 									},
-
 									success: (res) => {
-										console.log('插入图片路径结果' + JSON.stringify(res.data));
-
-										if (res.data.code != -1) {
-											//输出信息
-											var uploadedBills = res.data;
-											for (var i = 0; i < res.data.length; i++) {
-												this.uploadedImgs.push(res.data[i].path);
-											}
-											console.log('uploadedImgs：' + JSON.stringify(
-												this.uploadedImgs));
+										if (res.data.code == 0) {
+											//数据库删除图片记录成功后，界面删除图片
+											this.imgList.splice(e.currentTarget.dataset.index, 1);
 										} else {
 											uni.showToast({
-												title: '上传图片失败！',
+												title: '删除反馈图片失败！原因是：' + res.data.msg,
 												icon: 'none'
-											});
+											})
 										}
 									},
 									fail: (res) => {
-										console.log('访问网络插入图片路径失败：' + res.errMsg);
 										uni.showToast({
-											title: '访问网络插入图片路径失败：' +
-												res.errMsg,
+											title: '访问网络删除图片失败！原因是：' + res.errMsg,
 											icon: 'none'
-										});
-									},
-									complete() {
-										console.log('访问网络插入图片路径结束');
+										})
 									}
 								})
+							}
+						}
+					})
+
+				}
+			},
+			upload() {
+				//获取需要上传到服务器的图片列表
+				var uploadImgs = this.imgList.filter(function(item) {
+					return item.status == 0
+				})
+
+				//若没有需要上传的图片，则直接返回
+				if (uploadImgs.length == 0) return
+
+				//循环上传图片
+				for (let file of uploadImgs) {
+					//访问网络上传图片
+					uni.uploadFile({
+						url: 'https://api.lttc.cn/mes/yzcj/qualityFeedback/uploadFile',
+						name: "file",
+						filePath: file.url,
+						formData: {
+							"orgFrameGuid": this.billDetail.orgFrameGuid,
+							"jgzdsbh": this.billDetail.jgzdsbh,
+							"xswlh": this.billDetail.xswlh,
+							"fkcs": this.billDetail.fkcs
+						},
+						success: (res) => {
+							let jsonData = JSON.parse(res.data);
+							if (jsonData.code == 0) {
+								//上传图片成功后，更新图片Id和状态
+								file.id = jsonData.data.guid;
+								file.status = 1;
 
+								//提示保存成功
+								uni.showToast({
+									title: '保存成功',
+									icon: 'success'
+								})
 							} else {
-								console.log('访问网络上传文件失败：' + res.errMsg);
+								//上传图片失败，弹框提示
+								uni.showToast({
+									title: '上传反馈图片失败！原因是：' + jsonData.msg,
+									icon: 'none'
+								})
 							}
 						},
 						fail: (res) => {
-							console.log('访问网络上传图片失败：' + JSON.stringify(res));
-							this.uploadRes = false;
 							uni.showToast({
-								title: '访问网络上传图片失败：' + res.errMsg,
+								title: '访问网络上传反馈图片失败！原因是：' + res.errMsg,
 								icon: 'none'
-							});
-						},
-						complete: (res) => {
-							console.log('上传图片文件结束');
-
+							})
 						}
-					})
-				});
+					});
+				}
 			}
 		}
 	}
@@ -542,7 +384,6 @@
 		flex-wrap: nowrap;
 		justify-content: space-between;
 		align-items: stretch;
-
 		height: 750rpx;
 	}
 
@@ -574,4 +415,4 @@
 		width: 60%;
 		line-height: 50upx;
 	}
-</style>
+</style>

pages/login/login.vue

@@ -10,16 +10,13 @@
 				<input placeholder="请输入用户名" v-model="username" v-on:input="valuechanging"></input>
 			</view>
 			<view class="cu-form-group">
-				<view class="title">密码</view
-				<input v-if="isshowpwd" placeholder="请输入密码" type="text" v-model="password"
-					v-on:input="valuechanging" @confirm="login"></input>
-				<input v-if="!isshowpwd" placeholder="请输入密码" type="password" v-model="password"
-					v-on:input="valuechanging" @confirm="login"></input>
-				<text class="text-blue" :class="isshowpwd ? 'cuIcon-attentionfill' : 'cuIcon-attentionforbidfill'"
-					@click="changePassword"></text>
+				<view class="title">密码</view>
+				<input v-if="isshowpwd" placeholder="请输入密码" type="text" v-model="password" v-on:input="valuechanging" @confirm="login"></input>
+				<input v-if="!isshowpwd" placeholder="请输入密码" type="password" v-model="password" v-on:input="valuechanging" @confirm="login"></input>
+				<text class="text-blue" :class="isshowpwd ? 'cuIcon-attentionfill' : 'cuIcon-attentionforbidfill'" @click="changePassword"></text>
 			</view>
 		</view>
-		
+
 		<view class="margin-top padding">
 			<button class="round loginBtn" :disabled="isnull" @click="login">登录</button>
 		</view>
@@ -27,9 +24,6 @@
 </template>
 
 <script>
-	//引入已经定义的公共模块，用来获取和设置userkey/token
-	import token from '../../common/token.js'
-	
 	export default {
 		data() {
 			return {
@@ -37,9 +31,25 @@
 				username: '',
 				password: '',
 				isshowpwd: false,
-				isnull: true
+				isnull: true,
+				isback: false
 			}
 		},
+		onLoad(param) {
+
+			///获取是否返回上级页面
+			if (Object.keys(param).length > 0 && param.isback == 1) this.isback = true
+
+			uni.getStorage({
+				key: 'token',
+				success: function(res) {
+					//若用户已登录，则无需重复登录，跳转到菜单页面
+					uni.redirectTo({
+						url: '../menu/menu'
+					})
+				}
+			});
+		},
 		methods: {
 			changePassword() {
 				//显示/隐藏密码
@@ -55,8 +65,11 @@
 			},
 			login() {
 				//判断用户名密码是否为空（设置了在输入密码按回车键的时候执行登录）
-				if(this.username == "" || this.password == ""){
-					console.log('用户名或密码为空');
+				if (this.username == "" || this.password == "") {
+					uni.showToast({
+						title: '用户名或密码为空！',
+						icon: 'none'
+					})
 					return;
 				}
 
@@ -68,36 +81,51 @@
 						"password": this.password
 					},
 					method: 'POST',
-
 					success: (res) => {
 						if (res.data.code == 0) {
-							console.log("登录成功：" + JSON.stringify(res.data.data));
-							
-							//设置全局token
-							token.globalToken = res.data.data.userKey;
-							console.log('全局token：'+token.globalToken);
-							
-							//跳转到菜单页面
-							uni.navigateTo({
-								url: '../menu/menu'
-							})
+							//登录成功后，将用户的userKey存储缓存(键:token,值:userKey)
+							var vm = this
+							uni.setStorage({
+								key: 'token',
+								data: res.data.data.userKey,
+								success: function() {
+
+									////判断是否跳回原网页
+									if (vm.isback) {
+										uni.navigateBack({
+											delta: 1,
+										})
+										return;
+									}
+
+									//登录成功后，跳转到菜单页面
+									uni.redirectTo({
+										url: '../menu/menu'
+									})
+								},
+								fail() {
+									//用户UserKey存储缓存失败时提示
+									uni.showToast({
+										title: '登录成功，但调用接口缓存token失败！',
+										icon: 'none'
+									})
+								}
+							});
 						} else {
-							//登录失败清空密码，
-							console.log('登录失败结果' + JSON.stringify(res));
+							//登录失败清空密码
 							this.password = '';
 							this.isnull = true;
-							
+
 							//弹出提示
 							uni.showToast({
-								title: '登录失败！' + res.data.msg,
+								title: '登录失败！原因是：' + res.data.msg,
 								icon: 'none'
 							})
 						}
 					},
 					fail: (res) => {
-						console.log('访问网络失败结果' + JSON.stringify(res));
 						uni.showToast({
-							title: '访问网络失败！' + res.errMsg,
+							title: '访问网络登录失败！原因是：' + res.errMsg,
 							icon: 'none'
 						})
 					}

pages/menu/menu.vue

@@ -1,7 +1,7 @@
 <template>
 	<view>
 		<view class="margin-top grid col-3 padding-sm">
-			<view class="padding-sm" v-for="(item,index) in ColorList" :key="index">
+			<view class="padding-sm" v-for="(item,index) in colorList" :key="index">
 				<view class="padding radius text-center shadow-blur" :class="'bg-' + item.name" @click="onItemClick(item)">
 					<view class="text-lg">{{item.title}}</view>
 				</view>
@@ -11,110 +11,68 @@
 </template>
 
 <script>
-	//引入已经定义的公共模块，用来获取和设置userkey/token
-	import token from '../../common/token.js'
-	
 	export default {
 		data() {
 			return {
-				ColorList: [{
-						title: '质量反馈处理',
-						name: 'red',
-						event: 'navigateToBilllist',
-					},
-					{
-						title: '查看质量反馈单据',
-						name: 'orange',
-					},
-					{
-						title: '质量反馈处理',
-						name: 'yellow',
-					},
-					{
-						title: '橄榄',
-						name: 'olive',
-					},
-					{
-						title: '森绿',
-						name: 'green',
-					},
-					{
-						title: '天青',
-						name: 'cyan',
-					},
-					{
-						title: '海蓝',
-						name: 'blue',
-					},
-					{
-						title: '姹紫',
-						name: 'purple',
-					},
-					{
-						title: '木槿',
-						name: 'mauve',
-					},
-					{
-						title: '桃粉',
-						name: 'pink',
-					},
-					{
-						title: '棕褐',
-						name: 'brown',
-					},
-					{
-						title: '玄灰',
-						name: 'grey',
-					},
-					{
-						title: '草灰',
-						name: 'gray',
-					},
-					{
-						title: '墨黑',
-						name: 'black',
-					},
-					{
-						title: '雅白',
-						name: 'white',
-					},
-				]
+				colorList: [{
+					title: '质量反馈',
+					name: 'red',
+					event: 'toList',
+				}]
 			}
 		},
+		mounted() {
+			//#ifdef MP-WEIXIN
+			wx.hideHomeButton() //隐藏微信小程序的返回主页按钮
+			//#endif
+		},
 		onLoad() {
-			console.log('菜单页onload()');
-			console.log('获取全局token'+token.globalToken);
+			uni.getStorage({
+				key: 'token',
+				fail() {
+					//从缓存中未获取到token失败时跳转登录界面
+					uni.redirectTo({
+						url: '../login/login'
+					})
+				}
+			});
 		},
 		onNavigationBarButtonTap(e) {
-			console.log("导航栏按钮：" + JSON.stringify(e));
-			if (e.index == 0) {
-				console.log('退出登录按钮');
-				//清空token
-				token.globalToken = '';
-				
-				uni.navigateTo({
-					url: '../login/login'
-				})
-			}
-		},
-		onBackPress(e){
-			console.log('菜单页返回按钮');
-			return true;
+			//若不是点击退出登录按钮，则直接返回
+			if (e.index != 0) return
+
+			//清空token缓存
+			uni.removeStorage({
+				key: 'token',
+				success: function(res) {
+					//清空token缓存后，跳转至登录界面
+					uni.redirectTo({
+						url: '../login/login'
+					})
+				},
+				fail() {
+					//从清空token缓存失败时提示
+					uni.showToast({
+						title: '退出登录失败，原因是：未能清空token缓存！',
+						icon: 'none'
+					})
+				}
+			});
 		},
 		methods: {
 			onItemClick(e) {
-				console.log('点击菜单页的某一项了');
-				console.log(JSON.stringify(e));
 				if (e.event == undefined) {
-					console.log('没设置点击事件');
-				} 
-				else {
-					console.log('设置的事件' + e.event);
+					uni.showToast({
+						title: '当前菜单项未设置点击事件！',
+						icon: 'none'
+					})
+				} else {
+					//触发菜单项的点击事件
 					this[e.event]();
 				}
 			},
-			navigateToBilllist() {
-				console.log('跳转到单据列表');
+			toList() {
+				//跳转值质量反馈列表页面
 				uni.navigateTo({
 					url: "../billlist/billlist"
 				});
@@ -124,5 +82,5 @@
 </script>
 
 <style>
-	
-</style>
+
+</style>