diff --git a/.gitignore b/.gitignore
index 2e3b1001a99009b37173672a5a67934f1f9b585a..a51fa9fe2e3b24608adc574cb424b2ea8191e7d7 100644
--- a/.gitignore
+++ b/.gitignore
@@ -23,3 +23,5 @@ yarn-error.log*
 *.njsproj
 *.sln
 *.sw*
+/App.vue
+/manifest.json
diff --git a/App.vue b/App.vue
index 641f16061956a4b2a0842c149ffb00c7b79bf6bd..adf8ed581d3ced2dcafdc2f45378912af660c854 100644
--- a/App.vue
+++ b/App.vue
@@ -1,22 +1,49 @@
 <script>
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
+		data() {
+			return {
+				msgNum:''
+			};
+		},
+		computed: {
+			...mapState(['token','userinfo','login'])
+		},
 		onLaunch: function() {
+			let that = this;
 			console.log('App Launch')
+			//先使用这个作为登录判断
+			const res = uni.getStorageSync('reader');
+			if(res!=""){
+				console.log(res)
+				that.setUserInfo(res.reader);
+				that.setToken(res.token);
+				console.log(this.token)
+				uni.reLaunch({
+					url: '/pages/main/main'
+				});
+				//消息数量
+				that.queryMessageNum()
+			}
 		},
-		methods:{
+		methods: {
+			...mapMutations(['setUserInfo','setToken']),
 			//同步请求
-			myRequest: function(params){
-				return new Promise((resolve, reject)=>{
+			myRequest: function(params) {
+				return new Promise((resolve, reject) => {
 					var that = this;
-					if(!params.name||params.name =="URL"){
+					if (!params.name || params.name == "URL") {
 						var url = that.globalData.URL + params.url
-					}else{
+					} else {
 						var url = that.globalData.Link + params.url;
 					}
 					if (!params.type) {
 						params.type = 'GET';
 					}
-					if (params.type == 'GET') {
+					if (params.type == 'GET' || params.headerType) {
 						var headerType = 'application/json'
 					} else {
 						var headerType = 'application/x-www-form-urlencoded'
@@ -24,7 +51,11 @@
 					if (params.setUpUrl == false) {
 						url = params.url;
 					}
+					if(that.token == undefined || that.token==""){
+						that.token = uni.getStorageSync("token");
+					}
 					console.log("+++url:" + url);
+					console.log("+++that.token:" + that.token);
 					uni.request({
 						url: url,
 						data: params.data,
@@ -47,21 +78,20 @@
 							reject(err)
 						}
 					});
-				}
-				)
+				})
 			},
 			//异步请求
 			request: function(params) {
 				var that = this;
-				if(!params.name || params.name =="URL"){
+				if (!params.name || params.name == "URL") {
 					var url = that.globalData.URL + params.url;
-				}else{
+				} else {
 					var url = that.globalData.Link + params.url;
 				}
 				if (!params.type) {
 					params.type = 'GET';
 				}
-			
+
 				if (params.type == 'GET') {
 					var headerType = 'application/json'
 				} else {
@@ -77,7 +107,7 @@
 					method: params.type,
 					header: {
 						'content-type': headerType,
-						Authorization: that.token
+						'Authorization': that.token
 					},
 					success: function(res) {
 						//返回成功信息
@@ -88,20 +118,47 @@
 						console.log("发起请求失败！！")
 					}
 				});
-			}
+			},
+			async queryMessageNum() {
+				var that = this;
+				let rid = parseInt(that.userinfo.readerId)
+				var params = {
+					url:"systemMessage/queryMessageNum",
+					type: "GET",
+					data: {
+						readerId:rid
+					},
+				};
+				const res = await that.myRequest(params);
+				console.log("系统消息数量：",res)
+				that.msgNum = res
+				if(res>0){
+					//显示红点
+					//uni.showTabBarRedDot({index:3})
+					uni.setTabBarBadge({
+					  index: 3,
+					  text: String(res)
+					})
+				}else{
+					//隐藏红点
+					uni.removeTabBarBadge({index: 3})
+				}
+			},
 		},
-		
+
 		globalData: {
 			userInfo: {},
-			URL: "http://192.168.43.56:8000/api/",
+			URL: "https://jxsbbx.gzmu.edu.cn/shuyi/api/",
 			currentTab: 0,
-			Link: "http://192.168.43.56:8000/",
+			Link: "https://jxsbbx.gzmu.edu.cn/shuyi/",
 		},
+
 	}
 </script>
 
 <style lang="scss">
 	/*每个页面公共css */
+	@import "/static/style/qiun.css";
 	@import "uview-ui/index.scss";
 
 	.c-link {
diff --git a/api/index.js b/api/index.js
index 85b6eae5281bb551d3151bf60f3fd7e0a006ace0..542f2f2500ad0b54f0f7ae7a64107ff6d1324230 100644
--- a/api/index.js
+++ b/api/index.js
@@ -1,16 +1,15 @@
 import request from "./requestConfig.js"
+import config from "../config";
 
 export {home} from "./mock"
-
+const baseURL =  config.URL.apiServer
 //根据图书id获取图书相关信息
-export const getBookByBookId = (params)=>request.get("http://localhost:8000/api/demo/info",params)
+export const getBookByBookId = (params)=>request.get(baseURL+"demo/info",params)
 //借书
-export const realBook = (params)=>request.get("http://localhost:8000/api/demo/borrow",params)
-
+export const realBook = (params)=>request.get(baseURL+"demo/borrow",params)
 //借还记录查询
-export const BorrowedRecord = (params)=>request.get("http://localhost:8000/api/demo/borrowList",params)
-
+export const BorrowedRecord = (params)=>request.get(baseURL+"demo/borrowList",params)
 //确认付款
-export const payment = (params)=>request.get("http://localhost:8000/api/demo/pay",params)
+export const payment = (params)=>request.get(baseURL+"demo/pay",params)
 //签收
-export const signFor = (params)=>request.get("http://localhost:8000/api/demo/signFor",params)
+export const signFor = (params)=>request.get(baseURL+"demo/signFor",params)
diff --git a/api/requestConfig.js b/api/requestConfig.js
index 79c839f11301fe160fe7017ffd9ff5b8f370150d..b7aa29e574543d399bfb30c080fbef29d501f47f 100644
--- a/api/requestConfig.js
+++ b/api/requestConfig.js
@@ -1,8 +1,8 @@
 import uni_request from './request.js'
-
+import config from "../config"
 const request = uni_request({ // 有效配置项只有三个
-    baseURL: 'http://xxxxxxxx.com:80', //baseURL
-    timeout: 12345, // 超时时间，单位毫秒。默认 60 秒
+    baseURL: config.URL.apiServer, //baseURL
+    timeout: 60*60, // 超时时间，单位毫秒。默认 60 秒
     header: {'x-custom-header': 'x-custom-header'}, // 设置请求头，建议放在请求拦截器中
     statusCode: [200, 401] // 服务器相应状态码为 200/401 时，网络请求不会 reject。也就是不会被 catch 到。如响应 401 时可以在响应拦截后 await 刷新 token + await 重新请求 + return response。即可实现无痛刷新。
 })
diff --git a/common/u-charts.js b/common/u-charts.js
new file mode 100644
index 0000000000000000000000000000000000000000..f81b3a58a28cb9ea776fe677d367b02bc80ec0f0
--- /dev/null
+++ b/common/u-charts.js
@@ -0,0 +1,5664 @@
+/*
+ * uCharts v1.9.5.20201214
+ * uni-app平台高性能跨全端图表，支持H5、APP、小程序（微信/支付宝/百度/头条/QQ/360）
+ * Copyright (c) 2019 QIUN秋云 https://www.ucharts.cn All rights reserved.
+ * Licensed ( http://www.apache.org/licenses/LICENSE-2.0 )
+ * 
+ * uCharts官方网站
+ * https://www.uCharts.cn
+ * 
+ * 开源地址:
+ * https://gitee.com/uCharts/uCharts
+ * 
+ * uni-app插件市场地址：
+ * http://ext.dcloud.net.cn/plugin?id=271
+ * 
+ */
+
+'use strict';
+
+var config = {
+  yAxisWidth: 15,
+  yAxisSplit: 5,
+  xAxisHeight: 15,
+  xAxisLineHeight: 15,
+  legendHeight: 15,
+  yAxisTitleWidth: 15,
+  padding: [10, 10, 10, 10],
+  pixelRatio: 1,
+  rotate: false,
+  columePadding: 3,
+  fontSize: 13,
+  //dataPointShape: ['diamond', 'circle', 'triangle', 'rect'],
+  dataPointShape: ['circle', 'circle', 'circle', 'circle'],
+  colors: ['#1890ff', '#2fc25b', '#facc14', '#f04864', '#8543e0', '#90ed7d'],
+  pieChartLinePadding: 15,
+  pieChartTextPadding: 5,
+  xAxisTextPadding: 3,
+  titleColor: '#333333',
+  titleFontSize: 20,
+  subtitleColor: '#999999',
+  subtitleFontSize: 15,
+  toolTipPadding: 3,
+  toolTipBackground: '#000000',
+  toolTipOpacity: 0.7,
+  toolTipLineHeight: 20,
+  radarLabelTextMargin: 15,
+  gaugeLabelTextMargin: 15
+};
+
+let assign = function (target, ...varArgs) {
+    if (target == null) {
+        throw new TypeError('Cannot convert undefined or null to object');
+    }
+    if (!varArgs || varArgs.length <= 0) {
+        return target;
+    }
+    // 深度合并对象
+    function deepAssign(obj1, obj2) {
+        for (let key in obj2) {
+            obj1[key] = obj1[key] && obj1[key].toString() === "[object Object]" ?
+                deepAssign(obj1[key], obj2[key]) : obj1[key] = obj2[key];
+        }
+        return obj1;
+    }
+
+    varArgs.forEach(val => {
+        target = deepAssign(target, val);
+    });
+    return target;
+};
+
+var util = {
+  toFixed: function toFixed(num, limit) {
+    limit = limit || 2;
+    if (this.isFloat(num)) {
+      num = num.toFixed(limit);
+    }
+    return num;
+  },
+  isFloat: function isFloat(num) {
+    return num % 1 !== 0;
+  },
+  approximatelyEqual: function approximatelyEqual(num1, num2) {
+    return Math.abs(num1 - num2) < 1e-10;
+  },
+  isSameSign: function isSameSign(num1, num2) {
+    return Math.abs(num1) === num1 && Math.abs(num2) === num2 || Math.abs(num1) !== num1 && Math.abs(num2) !== num2;
+  },
+  isSameXCoordinateArea: function isSameXCoordinateArea(p1, p2) {
+    return this.isSameSign(p1.x, p2.x);
+  },
+  isCollision: function isCollision(obj1, obj2) {
+    obj1.end = {};
+    obj1.end.x = obj1.start.x + obj1.width;
+    obj1.end.y = obj1.start.y - obj1.height;
+    obj2.end = {};
+    obj2.end.x = obj2.start.x + obj2.width;
+    obj2.end.y = obj2.start.y - obj2.height;
+    var flag = obj2.start.x > obj1.end.x || obj2.end.x < obj1.start.x || obj2.end.y > obj1.start.y || obj2.start.y < obj1.end.y;
+    return !flag;
+  }
+};
+
+//兼容H5点击事件
+function getH5Offset(e) {
+  e.mp = {
+    changedTouches: []
+  };
+  e.mp.changedTouches.push({
+    x: e.offsetX,
+    y: e.offsetY
+  });
+  return e;
+}
+
+// hex 转 rgba
+function hexToRgb(hexValue, opc) {
+  var rgx = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
+  var hex = hexValue.replace(rgx, function(m, r, g, b) {
+    return r + r + g + g + b + b;
+  });
+  var rgb = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
+  var r = parseInt(rgb[1], 16);
+  var g = parseInt(rgb[2], 16);
+  var b = parseInt(rgb[3], 16);
+  return 'rgba(' + r + ',' + g + ',' + b + ',' + opc + ')';
+}
+
+function findRange(num, type, limit) {
+  if (isNaN(num)) {
+    throw new Error('[uCharts] unvalid series data!');
+  }
+  limit = limit || 10;
+  type = type ? type : 'upper';
+  var multiple = 1;
+  while (limit < 1) {
+    limit *= 10;
+    multiple *= 10;
+  }
+  if (type === 'upper') {
+    num = Math.ceil(num * multiple);
+  } else {
+    num = Math.floor(num * multiple);
+  }
+  while (num % limit !== 0) {
+    if (type === 'upper') {
+      num++;
+    } else {
+      num--;
+    }
+  }
+  return num / multiple;
+}
+
+function calCandleMA(dayArr, nameArr, colorArr, kdata) {
+  let seriesTemp = [];
+  for (let k = 0; k < dayArr.length; k++) {
+    let seriesItem = {
+      data: [],
+      name: nameArr[k],
+      color: colorArr[k]
+    };
+    for (let i = 0, len = kdata.length; i < len; i++) {
+      if (i < dayArr[k]) {
+        seriesItem.data.push(null);
+        continue;
+      }
+      let sum = 0;
+      for (let j = 0; j < dayArr[k]; j++) {
+        sum += kdata[i - j][1];
+      }
+      seriesItem.data.push(+(sum / dayArr[k]).toFixed(3));
+    }
+    seriesTemp.push(seriesItem);
+  }
+  return seriesTemp;
+}
+
+function calValidDistance(self,distance, chartData, config, opts) {
+  var dataChartAreaWidth = opts.width - opts.area[1] - opts.area[3];
+  var dataChartWidth = chartData.eachSpacing * (opts.chartData.xAxisData.xAxisPoints.length-1);
+  var validDistance = distance;
+  if (distance >= 0) {
+    validDistance = 0;
+		self.event.trigger('scrollLeft');
+  } else if (Math.abs(distance) >= dataChartWidth - dataChartAreaWidth) {
+    validDistance = dataChartAreaWidth - dataChartWidth;
+		self.event.trigger('scrollRight');
+  }
+  return validDistance;
+}
+
+function isInAngleRange(angle, startAngle, endAngle) {
+  function adjust(angle) {
+    while (angle < 0) {
+      angle += 2 * Math.PI;
+    }
+    while (angle > 2 * Math.PI) {
+      angle -= 2 * Math.PI;
+    }
+    return angle;
+  }
+  angle = adjust(angle);
+  startAngle = adjust(startAngle);
+  endAngle = adjust(endAngle);
+  if (startAngle > endAngle) {
+    endAngle += 2 * Math.PI;
+    if (angle < startAngle) {
+      angle += 2 * Math.PI;
+    }
+  }
+  return angle >= startAngle && angle <= endAngle;
+}
+
+function calRotateTranslate(x, y, h) {
+  var xv = x;
+  var yv = h - y;
+  var transX = xv + (h - yv - xv) / Math.sqrt(2);
+  transX *= -1;
+  var transY = (h - yv) * (Math.sqrt(2) - 1) - (h - yv - xv) / Math.sqrt(2);
+  return {
+    transX: transX,
+    transY: transY
+  };
+}
+
+function createCurveControlPoints(points, i) {
+
+  function isNotMiddlePoint(points, i) {
+    if (points[i - 1] && points[i + 1]) {
+      return points[i].y >= Math.max(points[i - 1].y, points[i + 1].y) || points[i].y <= Math.min(points[i - 1].y,points[i + 1].y);
+    } else {
+      return false;
+    }
+  }
+	function isNotMiddlePointX(points, i) {
+	  if (points[i - 1] && points[i + 1]) {
+	    return points[i].x >= Math.max(points[i - 1].x, points[i + 1].x) || points[i].x <= Math.min(points[i - 1].x,points[i + 1].x);
+	  } else {
+	    return false;
+	  }
+	}
+  var a = 0.2;
+  var b = 0.2;
+  var pAx = null;
+  var pAy = null;
+  var pBx = null;
+  var pBy = null;
+  if (i < 1) {
+    pAx = points[0].x + (points[1].x - points[0].x) * a;
+    pAy = points[0].y + (points[1].y - points[0].y) * a;
+  } else {
+    pAx = points[i].x + (points[i + 1].x - points[i - 1].x) * a;
+    pAy = points[i].y + (points[i + 1].y - points[i - 1].y) * a;
+  }
+
+  if (i > points.length - 3) {
+    var last = points.length - 1;
+    pBx = points[last].x - (points[last].x - points[last - 1].x) * b;
+    pBy = points[last].y - (points[last].y - points[last - 1].y) * b;
+  } else {
+    pBx = points[i + 1].x - (points[i + 2].x - points[i].x) * b;
+    pBy = points[i + 1].y - (points[i + 2].y - points[i].y) * b;
+  }
+  if (isNotMiddlePoint(points, i + 1)) {
+    pBy = points[i + 1].y;
+  }
+  if (isNotMiddlePoint(points, i)) {
+    pAy = points[i].y;
+  }
+	if (isNotMiddlePointX(points, i + 1)) {
+	  pBx = points[i + 1].x;
+	}
+	if (isNotMiddlePointX(points, i)) {
+	  pAx = points[i].x;
+	}
+	if (pAy >= Math.max(points[i].y, points[i + 1].y) || pAy <= Math.min(points[i].y, points[i + 1].y)) {
+	pAy = points[i].y;
+	}
+	if (pBy >= Math.max(points[i].y, points[i + 1].y) || pBy <= Math.min(points[i].y, points[i + 1].y)) {
+	pBy = points[i + 1].y;
+	}
+	if (pAx >= Math.max(points[i].x, points[i + 1].x) || pAx <= Math.min(points[i].x, points[i + 1].x)) {
+	pAx = points[i].x;
+	}
+	if (pBx >= Math.max(points[i].x, points[i + 1].x) || pBx <= Math.min(points[i].x, points[i + 1].x)) {
+	pBx = points[i + 1].x;
+	}
+  return {
+    ctrA: {
+      x: pAx,
+      y: pAy
+    },
+    ctrB: {
+      x: pBx,
+      y: pBy
+    }
+  };
+}
+
+function convertCoordinateOrigin(x, y, center) {
+  return {
+    x: center.x + x,
+    y: center.y - y
+  };
+}
+
+function avoidCollision(obj, target) {
+  if (target) {
+    // is collision test
+    while (util.isCollision(obj, target)) {
+      if (obj.start.x > 0) {
+        obj.start.y--;
+      } else if (obj.start.x < 0) {
+        obj.start.y++;
+      } else {
+        if (obj.start.y > 0) {
+          obj.start.y++;
+        } else {
+          obj.start.y--;
+        }
+      }
+    }
+  }
+  return obj;
+}
+
+function fillSeries(series, opts, config) {
+  var index = 0;
+  return series.map(function(item) {
+    if (!item.color) {
+      item.color = config.colors[index];
+      index = (index + 1) % config.colors.length;
+    }
+    if (!item.index) {
+      item.index = 0;
+    }
+    if (!item.type) {
+      item.type = opts.type;
+    }
+    if (typeof item.show == "undefined") {
+      item.show = true;
+    }
+    if (!item.type) {
+      item.type = opts.type;
+    }
+    if (!item.pointShape) {
+      item.pointShape = "circle";
+    }
+    if (!item.legendShape) {
+      switch (item.type) {
+        case 'line':
+          item.legendShape = "line";
+          break;
+        case 'column':
+          item.legendShape = "rect";
+          break;
+        case 'area':
+          item.legendShape = "triangle";
+          break;
+        default:
+          item.legendShape = "circle";
+      }
+    }
+    return item;
+  });
+}
+
+function getDataRange(minData, maxData) {
+  var limit = 0;
+  var range = maxData - minData;
+  if (range >= 10000) {
+    limit = 1000;
+  } else if (range >= 1000) {
+    limit = 100;
+  } else if (range >= 100) {
+    limit = 10;
+  } else if (range >= 10) {
+    limit = 5;
+  } else if (range >= 1) {
+    limit = 1;
+  } else if (range >= 0.1) {
+    limit = 0.1;
+  } else if (range >= 0.01) {
+    limit = 0.01;
+  } else if (range >= 0.001) {
+    limit = 0.001;
+  } else if (range >= 0.0001) {
+    limit = 0.0001;
+  } else if (range >= 0.00001) {
+    limit = 0.00001;
+  } else {
+    limit = 0.000001;
+  }
+  return {
+    minRange: findRange(minData, 'lower', limit),
+    maxRange: findRange(maxData, 'upper', limit)
+  };
+}
+
+function measureText(text) {
+  var fontSize = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : config.fontSize;
+  text = String(text);
+  var text = text.split('');
+  var width = 0;
+  for (let i = 0; i < text.length; i++) {
+    let item = text[i];
+    if (/[a-zA-Z]/.test(item)) {
+      width += 7;
+    } else if (/[0-9]/.test(item)) {
+      width += 5.5;
+    } else if (/\./.test(item)) {
+      width += 2.7;
+    } else if (/-/.test(item)) {
+      width += 3.25;
+    } else if (/[\u4e00-\u9fa5]/.test(item)) {
+      width += 10;
+    } else if (/\(|\)/.test(item)) {
+      width += 3.73;
+    } else if (/\s/.test(item)) {
+      width += 2.5;
+    } else if (/%/.test(item)) {
+      width += 8;
+    } else {
+      width += 10;
+    }
+  }
+  return width * fontSize / 10;
+}
+
+function dataCombine(series) {
+  return series.reduce(function(a, b) {
+    return (a.data ? a.data : a).concat(b.data);
+  }, []);
+}
+
+function dataCombineStack(series, len) {
+  var sum = new Array(len);
+  for (var j = 0; j < sum.length; j++) {
+    sum[j] = 0;
+  }
+  for (var i = 0; i < series.length; i++) {
+    for (var j = 0; j < sum.length; j++) {
+      sum[j] += series[i].data[j];
+    }
+  }
+  return series.reduce(function(a, b) {
+    return (a.data ? a.data : a).concat(b.data).concat(sum);
+  }, []);
+}
+
+function getTouches(touches, opts, e) {
+  let x, y;
+  if (touches.clientX) {
+    if (opts.rotate) {
+      y = opts.height - touches.clientX * opts.pixelRatio;
+      x = (touches.pageY - e.currentTarget.offsetTop - (opts.height / opts.pixelRatio / 2) * (opts.pixelRatio - 1)) * opts.pixelRatio;
+    } else {
+      x = touches.clientX * opts.pixelRatio;
+      y = (touches.pageY - e.currentTarget.offsetTop - (opts.height / opts.pixelRatio / 2) * (opts.pixelRatio - 1)) * opts.pixelRatio;
+    }
+  } else {
+    if (opts.rotate) {
+      y = opts.height - touches.x * opts.pixelRatio;
+      x = touches.y * opts.pixelRatio;
+    } else {
+      x = touches.x * opts.pixelRatio;
+      y = touches.y * opts.pixelRatio;
+    }
+  }
+  return {
+    x: x,
+    y: y
+  }
+}
+
+function getSeriesDataItem(series, index) {
+  var data = [];
+  for (let i = 0; i < series.length; i++) {
+    let item = series[i];
+    if (item.data[index] !== null && typeof item.data[index] !== 'undefined' && item.show) {
+      let seriesItem = {};
+      seriesItem.color = item.color;
+      seriesItem.type = item.type;
+      seriesItem.style = item.style;
+      seriesItem.pointShape = item.pointShape;
+      seriesItem.disableLegend = item.disableLegend;
+      seriesItem.name = item.name;
+      seriesItem.show = item.show;
+      seriesItem.data = item.format ? item.format(item.data[index]) : item.data[index];
+      data.push(seriesItem);
+    }
+  }
+  return data;
+}
+
+function getMaxTextListLength(list) {
+  var lengthList = list.map(function(item) {
+    return measureText(item);
+  });
+  return Math.max.apply(null, lengthList);
+}
+
+function getRadarCoordinateSeries(length) {
+  var eachAngle = 2 * Math.PI / length;
+  var CoordinateSeries = [];
+  for (var i = 0; i < length; i++) {
+    CoordinateSeries.push(eachAngle * i);
+  }
+
+  return CoordinateSeries.map(function(item) {
+    return -1 * item + Math.PI / 2;
+  });
+}
+
+function getToolTipData(seriesData, calPoints, index, categories) {
+  var option = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
+
+  var textList = seriesData.map(function(item) {
+		let titleText=[];
+		if(categories){
+			titleText=categories;
+		}else{
+			titleText=item.data;
+		}
+    return {
+      text: option.format ? option.format(item, titleText[index]) : item.name + ': ' + item.data,
+      color: item.color
+    };
+  });
+  var validCalPoints = [];
+  var offset = {
+    x: 0,
+    y: 0
+  };
+  for (let i = 0; i < calPoints.length; i++) {
+    let points = calPoints[i];
+    if (typeof points[index] !== 'undefined' && points[index] !== null) {
+      validCalPoints.push(points[index]);
+    }
+  }
+  for (let i = 0; i < validCalPoints.length; i++) {
+    let item = validCalPoints[i];
+    offset.x = Math.round(item.x);
+    offset.y += item.y;
+  }
+  offset.y /= validCalPoints.length;
+  return {
+    textList: textList,
+    offset: offset
+  };
+}
+
+function getMixToolTipData(seriesData, calPoints, index, categories) {
+  var option = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : {};
+  var textList = seriesData.map(function(item) {
+    return {
+      text: option.format ? option.format(item, categories[index]) : item.name + ': ' + item.data,
+      color: item.color,
+      disableLegend: item.disableLegend ? true : false
+    };
+  });
+  textList = textList.filter(function(item) {
+    if (item.disableLegend !== true) {
+      return item;
+    }
+  });
+  var validCalPoints = [];
+  var offset = {
+    x: 0,
+    y: 0
+  };
+  for (let i = 0; i < calPoints.length; i++) {
+    let points = calPoints[i];
+    if (typeof points[index] !== 'undefined' && points[index] !== null) {
+      validCalPoints.push(points[index]);
+    }
+  }
+  for (let i = 0; i < validCalPoints.length; i++) {
+    let item = validCalPoints[i];
+    offset.x = Math.round(item.x);
+    offset.y += item.y;
+  }
+  offset.y /= validCalPoints.length;
+  return {
+    textList: textList,
+    offset: offset
+  };
+}
+
+function getCandleToolTipData(series, seriesData, calPoints, index, categories, extra) {
+  var option = arguments.length > 6 && arguments[6] !== undefined ? arguments[6] : {};
+  let upColor = extra.color.upFill;
+  let downColor = extra.color.downFill;
+  //颜色顺序为开盘，收盘，最低，最高
+  let color = [upColor, upColor, downColor, upColor];
+  var textList = [];
+  let text0 = {
+    text: categories[index],
+    color: null
+  };
+  textList.push(text0);
+  seriesData.map(function(item) {
+    if (index == 0) {
+      if(item.data[1] - item.data[0] < 0){
+      	color[1] = downColor;
+      }else{
+      	color[1] = upColor;
+      }
+    } else {
+      if (item.data[0] < series[index - 1][1]) {
+        color[0] = downColor;
+      }
+      if (item.data[1] < item.data[0]) {
+        color[1] = downColor;
+      }
+      if (item.data[2] > series[index - 1][1]) {
+        color[2] = upColor;
+      }
+      if (item.data[3] < series[index - 1][1]) {
+        color[3] = downColor;
+      }
+    }
+    let text1 = {
+      text: '开盘：' + item.data[0],
+      color: color[0]
+    };
+    let text2 = {
+      text: '收盘：' + item.data[1],
+      color: color[1]
+    };
+    let text3 = {
+      text: '最低：' + item.data[2],
+      color: color[2]
+    };
+    let text4 = {
+      text: '最高：' + item.data[3],
+      color: color[3]
+    };
+    textList.push(text1, text2, text3, text4);
+  });
+  var validCalPoints = [];
+  var offset = {
+    x: 0,
+    y: 0
+  };
+  for (let i = 0; i < calPoints.length; i++) {
+    let points = calPoints[i];
+    if (typeof points[index] !== 'undefined' && points[index] !== null) {
+      validCalPoints.push(points[index]);
+    }
+  }
+  offset.x = Math.round(validCalPoints[0][0].x);
+  return {
+    textList: textList,
+    offset: offset
+  };
+}
+
+function filterSeries(series) {
+  let tempSeries = [];
+  for (let i = 0; i < series.length; i++) {
+    if (series[i].show == true) {
+      tempSeries.push(series[i])
+    }
+  }
+  return tempSeries;
+}
+
+function findCurrentIndex(currentPoints, calPoints, opts, config) {
+  var offset = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 0;
+  var currentIndex = -1;
+  var spacing = opts.chartData.eachSpacing/2;
+	let xAxisPoints=[];
+	if(calPoints.length>0){
+		for(let i=1;i<opts.chartData.xAxisPoints.length;i++){
+				xAxisPoints.push(opts.chartData.xAxisPoints[i]-spacing)
+		}
+		if((opts.type=='line' || opts.type=='area') && opts.xAxis.boundaryGap=='justify'){
+		  spacing = opts.chartData.eachSpacing/2;
+		}
+		if(!opts.categories){
+			spacing=0
+		}
+		if (isInExactChartArea(currentPoints, opts, config)) {
+		  xAxisPoints.forEach(function(item, index) {
+		    if (currentPoints.x + offset + spacing > item) {
+		      currentIndex = index;
+		    }
+		  });
+		}
+	}
+  return currentIndex;
+}
+
+function findLegendIndex(currentPoints, legendData, opts) {
+  let currentIndex = -1;
+  if (isInExactLegendArea(currentPoints, legendData.area)) {
+    let points = legendData.points;
+    let index = -1;
+    for (let i = 0, len = points.length; i < len; i++) {
+      let item = points[i];
+      for (let j = 0; j < item.length; j++) {
+        index += 1;
+        let area = item[j]['area'];
+        if (currentPoints.x > area[0] && currentPoints.x < area[2] && currentPoints.y > area[1] && currentPoints.y < area[3]) {
+          currentIndex = index;
+          break;
+        }
+      }
+    }
+    return currentIndex;
+  }
+  return currentIndex;
+}
+
+function isInExactLegendArea(currentPoints, area) {
+  return currentPoints.x > area.start.x && currentPoints.x < area.end.x && currentPoints.y > area.start.y &&
+    currentPoints.y < area.end.y;
+}
+
+function isInExactChartArea(currentPoints, opts, config) {
+  return currentPoints.x <= opts.width - opts.area[1] + 10 && currentPoints.x >= opts.area[3] -10 && currentPoints.y >= opts.area[0] && currentPoints.y <= opts.height - opts.area[2];
+}
+
+function findRadarChartCurrentIndex(currentPoints, radarData, count) {
+  var eachAngleArea = 2 * Math.PI / count;
+  var currentIndex = -1;
+  if (isInExactPieChartArea(currentPoints, radarData.center, radarData.radius)) {
+    var fixAngle = function fixAngle(angle) {
+      if (angle < 0) {
+        angle += 2 * Math.PI;
+      }
+      if (angle > 2 * Math.PI) {
+        angle -= 2 * Math.PI;
+      }
+      return angle;
+    };
+
+    var angle = Math.atan2(radarData.center.y - currentPoints.y, currentPoints.x - radarData.center.x);
+    angle = -1 * angle;
+    if (angle < 0) {
+      angle += 2 * Math.PI;
+    }
+
+    var angleList = radarData.angleList.map(function(item) {
+      item = fixAngle(-1 * item);
+
+      return item;
+    });
+
+    angleList.forEach(function(item, index) {
+      var rangeStart = fixAngle(item - eachAngleArea / 2);
+      var rangeEnd = fixAngle(item + eachAngleArea / 2);
+      if (rangeEnd < rangeStart) {
+        rangeEnd += 2 * Math.PI;
+      }
+      if (angle >= rangeStart && angle <= rangeEnd || angle + 2 * Math.PI >= rangeStart && angle + 2 * Math.PI <=
+        rangeEnd) {
+        currentIndex = index;
+      }
+    });
+  }
+
+  return currentIndex;
+}
+
+function findFunnelChartCurrentIndex(currentPoints, funnelData) {
+  var currentIndex = -1;
+  for (var i = 0, len = funnelData.series.length; i < len; i++) {
+    var item = funnelData.series[i];
+    if (currentPoints.x > item.funnelArea[0] && currentPoints.x < item.funnelArea[2] && currentPoints.y > item.funnelArea[1] && currentPoints.y < item.funnelArea[3]) {
+      currentIndex = i;
+      break;
+    }
+  }
+  return currentIndex;
+}
+
+function findWordChartCurrentIndex(currentPoints, wordData) {
+  var currentIndex = -1;
+  for (var i = 0, len = wordData.length; i < len; i++) {
+    var item = wordData[i];
+    if (currentPoints.x > item.area[0] && currentPoints.x < item.area[2] && currentPoints.y > item.area[1] && currentPoints.y < item.area[3]) {
+      currentIndex = i;
+      break;
+    }
+  }
+  return currentIndex;
+}
+
+function findMapChartCurrentIndex(currentPoints, opts) {
+  var currentIndex = -1;
+  var cData=opts.chartData.mapData;
+  var data=opts.series;
+  var tmp=pointToCoordinate(currentPoints.y, currentPoints.x,cData.bounds,cData.scale,cData.xoffset,cData.yoffset);
+  var poi=[tmp.x, tmp.y];
+  for (var i = 0, len = data.length; i < len; i++) {
+    var item = data[i].geometry.coordinates;
+    if(isPoiWithinPoly(poi,item)){
+      currentIndex = i;
+      break;
+    }
+  }
+  return currentIndex;
+}
+
+function findPieChartCurrentIndex(currentPoints, pieData) {
+  var currentIndex = -1;
+  if (isInExactPieChartArea(currentPoints, pieData.center, pieData.radius)) {
+    var angle = Math.atan2(pieData.center.y - currentPoints.y, currentPoints.x - pieData.center.x);
+    angle = -angle;
+    for (var i = 0, len = pieData.series.length; i < len; i++) {
+      var item = pieData.series[i];
+      if (isInAngleRange(angle, item._start_, item._start_ + item._proportion_ * 2 * Math.PI)) {
+        currentIndex = i;
+        break;
+      }
+    }
+  }
+
+  return currentIndex;
+}
+
+function isInExactPieChartArea(currentPoints, center, radius) {
+  return Math.pow(currentPoints.x - center.x, 2) + Math.pow(currentPoints.y - center.y, 2) <= Math.pow(radius, 2);
+}
+
+function splitPoints(points) {
+  var newPoints = [];
+  var items = [];
+  points.forEach(function(item, index) {
+    if (item !== null) {
+      items.push(item);
+    } else {
+      if (items.length) {
+        newPoints.push(items);
+      }
+      items = [];
+    }
+  });
+  if (items.length) {
+    newPoints.push(items);
+  }
+
+  return newPoints;
+}
+
+function calLegendData(series, opts, config, chartData) {
+  let legendData = {
+    area: {
+      start: {
+        x: 0,
+        y: 0
+      },
+      end: {
+        x: 0,
+        y: 0
+      },
+      width: 0,
+      height: 0,
+      wholeWidth: 0,
+      wholeHeight: 0
+    },
+    points: [],
+    widthArr: [],
+    heightArr: []
+  };
+  if (opts.legend.show === false) {
+    chartData.legendData = legendData;
+    return legendData;
+  }
+
+  let padding = opts.legend.padding;
+  let margin = opts.legend.margin;
+  let fontSize = opts.legend.fontSize;
+  let shapeWidth = 15 * opts.pixelRatio;
+  let shapeRight = 5 * opts.pixelRatio;
+  let lineHeight = Math.max(opts.legend.lineHeight * opts.pixelRatio, fontSize);
+  if (opts.legend.position == 'top' || opts.legend.position == 'bottom') {
+    let legendList = [];
+    let widthCount = 0;
+    let widthCountArr = [];
+    let currentRow = [];
+    for (let i = 0; i < series.length; i++) {
+      let item = series[i];
+      let itemWidth = shapeWidth + shapeRight + measureText(item.name || 'undefined', fontSize) + opts.legend.itemGap;
+      if (widthCount + itemWidth > opts.width - opts.padding[1] - opts.padding[3]) {
+        legendList.push(currentRow);
+        widthCountArr.push(widthCount - opts.legend.itemGap);
+        widthCount = itemWidth;
+        currentRow = [item];
+      } else {
+        widthCount += itemWidth;
+        currentRow.push(item);
+      }
+    }
+    if (currentRow.length) {
+      legendList.push(currentRow);
+      widthCountArr.push(widthCount - opts.legend.itemGap);
+      legendData.widthArr = widthCountArr;
+      let legendWidth = Math.max.apply(null, widthCountArr);
+      switch (opts.legend.float) {
+        case 'left':
+          legendData.area.start.x = opts.padding[3];
+          legendData.area.end.x = opts.padding[3] + 2 * padding;
+          break;
+        case 'right':
+          legendData.area.start.x = opts.width - opts.padding[1] - legendWidth - 2 * padding;
+          legendData.area.end.x = opts.width - opts.padding[1];
+          break;
+        default:
+          legendData.area.start.x = (opts.width - legendWidth) / 2 - padding;
+          legendData.area.end.x = (opts.width + legendWidth) / 2 + padding;
+      }
+      legendData.area.width = legendWidth + 2 * padding;
+      legendData.area.wholeWidth = legendWidth + 2 * padding;
+      legendData.area.height = legendList.length * lineHeight + 2 * padding;
+      legendData.area.wholeHeight = legendList.length * lineHeight + 2 * padding + 2 * margin;
+      legendData.points = legendList;
+    }
+  } else {
+    let len = series.length;
+    let maxHeight = opts.height - opts.padding[0] - opts.padding[2] - 2 * margin - 2 * padding;
+    let maxLength = Math.min(Math.floor(maxHeight / lineHeight), len);
+    legendData.area.height = maxLength * lineHeight + padding * 2;
+    legendData.area.wholeHeight = maxLength * lineHeight + padding * 2;
+    switch (opts.legend.float) {
+      case 'top':
+        legendData.area.start.y = opts.padding[0] + margin;
+        legendData.area.end.y = opts.padding[0] + margin + legendData.area.height;
+        break;
+      case 'bottom':
+        legendData.area.start.y = opts.height - opts.padding[2] - margin - legendData.area.height;
+        legendData.area.end.y = opts.height - opts.padding[2] - margin;
+        break;
+      default:
+        legendData.area.start.y = (opts.height - legendData.area.height) / 2;
+        legendData.area.end.y = (opts.height + legendData.area.height) / 2;
+    }
+    let lineNum = len % maxLength === 0 ? len / maxLength : Math.floor((len / maxLength) + 1);
+    let currentRow = [];
+    for (let i = 0; i < lineNum; i++) {
+      let temp = series.slice(i * maxLength, i * maxLength + maxLength);
+      currentRow.push(temp);
+    }
+
+    legendData.points = currentRow;
+
+    if (currentRow.length) {
+      for (let i = 0; i < currentRow.length; i++) {
+        let item = currentRow[i];
+        let maxWidth = 0;
+        for (let j = 0; j < item.length; j++) {
+          let itemWidth = shapeWidth + shapeRight + measureText(item[j].name || 'undefined', fontSize) + opts.legend.itemGap;
+          if (itemWidth > maxWidth) {
+            maxWidth = itemWidth;
+          }
+        }
+        legendData.widthArr.push(maxWidth);
+        legendData.heightArr.push(item.length * lineHeight + padding * 2);
+      }
+      let legendWidth = 0
+      for (let i = 0; i < legendData.widthArr.length; i++) {
+        legendWidth += legendData.widthArr[i];
+      }
+      legendData.area.width = legendWidth - opts.legend.itemGap + 2 * padding;
+      legendData.area.wholeWidth = legendData.area.width + padding;
+    }
+  }
+
+  switch (opts.legend.position) {
+    case 'top':
+      legendData.area.start.y = opts.padding[0] + margin;
+      legendData.area.end.y = opts.padding[0] + margin + legendData.area.height;
+      break;
+    case 'bottom':
+      legendData.area.start.y = opts.height - opts.padding[2] - legendData.area.height - margin;
+      legendData.area.end.y = opts.height - opts.padding[2] - margin;
+      break;
+    case 'left':
+      legendData.area.start.x = opts.padding[3];
+      legendData.area.end.x = opts.padding[3] + legendData.area.width;
+      break;
+    case 'right':
+      legendData.area.start.x = opts.width - opts.padding[1] - legendData.area.width;
+      legendData.area.end.x = opts.width - opts.padding[1];
+      break;
+  }
+  chartData.legendData = legendData;
+  return legendData;
+}
+
+function calCategoriesData(categories, opts, config, eachSpacing) {
+  var result = {
+    angle: 0,
+    xAxisHeight: config.xAxisHeight
+  };
+  var categoriesTextLenth = categories.map(function(item) {
+    return measureText(item,opts.xAxis.fontSize||config.fontSize);
+  });
+  var maxTextLength = Math.max.apply(this, categoriesTextLenth);
+
+  if (opts.xAxis.rotateLabel == true && maxTextLength + 2 * config.xAxisTextPadding > eachSpacing) {
+    result.angle = 45 * Math.PI / 180;
+    result.xAxisHeight = 2 * config.xAxisTextPadding + maxTextLength * Math.sin(result.angle);
+  }
+  return result;
+}
+
+function getXAxisTextList(series, opts, config) {
+  var index = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : -1;
+  var data = dataCombine(series);
+  var sorted = [];
+  // remove null from data
+  data = data.filter(function(item) {
+    //return item !== null;
+    if (typeof item === 'object' && item !== null) {
+      if (item.constructor.toString().indexOf('Array')>-1) {
+        return item !== null;
+      } else {
+        return item.value !== null;
+      }
+    } else {
+      return item !== null;
+    }
+  });
+  data.map(function(item) {
+    if (typeof item === 'object') {
+      if (item.constructor.toString().indexOf('Array')>-1) {
+				if(opts.type=='candle'){
+					item.map(function(subitem) {
+					  sorted.push(subitem);
+					})
+				}else{
+					sorted.push(item[0]);
+				}
+      } else {
+        sorted.push(item.value);
+      }
+    } else {
+      sorted.push(item);
+    }
+  })
+	
+  var minData = 0;
+  var maxData = 0;
+  if (sorted.length > 0) {
+    minData = Math.min.apply(this, sorted);
+    maxData = Math.max.apply(this, sorted);
+  }
+  //为了兼容v1.9.0之前的项目
+  if(index>-1){
+    if (typeof opts.xAxis.data[index].min === 'number') {
+      minData = Math.min(opts.xAxis.data[index].min, minData);
+    }
+    if (typeof opts.xAxis.data[index].max === 'number') {
+      maxData = Math.max(opts.xAxis.data[index].max, maxData);
+    }
+  }else{
+    if (typeof opts.xAxis.min === 'number') {
+      minData = Math.min(opts.xAxis.min, minData);
+    }
+    if (typeof opts.xAxis.max === 'number') {
+      maxData = Math.max(opts.xAxis.max, maxData);
+    }
+  }
+  
+
+  if (minData === maxData) {
+    var rangeSpan = maxData || 10;
+    maxData += rangeSpan;
+  }
+
+  //var dataRange = getDataRange(minData, maxData);
+  var minRange = minData;
+  var maxRange = maxData;
+
+  var range = [];
+  var eachRange = (maxRange - minRange) / opts.xAxis.splitNumber;
+
+  for (var i = 0; i <= opts.xAxis.splitNumber; i++) {
+    range.push(minRange + eachRange * i);
+  }
+  return range;
+}
+
+function calXAxisData(series, opts, config){
+    var result = {
+        angle: 0,
+        xAxisHeight: config.xAxisHeight
+    };
+
+    result.ranges = getXAxisTextList(series, opts, config);
+    result.rangesFormat = result.ranges.map(function(item){
+        item = opts.xAxis.format? opts.xAxis.format(item):util.toFixed(item, 2);
+        return item;
+    });
+		
+    var xAxisScaleValues = result.ranges.map(function (item) {
+        // 如果刻度值是浮点数,则保留两位小数
+        item = util.toFixed(item, 2);
+        // 若有自定义格式则调用自定义的格式化函数
+        item = opts.xAxis.format ? opts.xAxis.format(Number(item)) : item;
+        return item;
+    });
+
+    result = Object.assign(result,getXAxisPoints(xAxisScaleValues, opts, config));
+    // 计算X轴刻度的属性譬如每个刻度的间隔,刻度的起始点\结束点以及总长
+    var eachSpacing = result.eachSpacing;
+
+    var textLength = xAxisScaleValues.map(function (item) {
+        return measureText(item);
+    });
+    
+    // get max length of categories text
+    var maxTextLength = Math.max.apply(this, textLength);
+
+    // 如果刻度值文本内容过长,则将其逆时针旋转45°
+    if (maxTextLength + 2 * config.xAxisTextPadding > eachSpacing) {
+        result.angle = 45 * Math.PI / 180;
+        result.xAxisHeight = 2 * config.xAxisTextPadding + maxTextLength * Math.sin(result.angle);
+    }
+
+    if (opts.xAxis.disabled === true) {
+        result.xAxisHeight = 0;
+    }
+
+    return result;
+}
+
+function getRadarDataPoints(angleList, center, radius, series, opts) {
+  var process = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 1;
+
+  var radarOption = opts.extra.radar || {};
+  radarOption.max = radarOption.max || 0;
+  var maxData = Math.max(radarOption.max, Math.max.apply(null, dataCombine(series)));
+
+  var data = [];
+  for (let i = 0; i < series.length; i++) {
+    let each = series[i];
+    let listItem = {};
+    listItem.color = each.color;
+		listItem.legendShape = each.legendShape;
+		listItem.pointShape = each.pointShape;
+    listItem.data = [];
+    each.data.forEach(function(item, index) {
+      let tmp = {};
+      tmp.angle = angleList[index];
+
+      tmp.proportion = item / maxData;
+      tmp.position = convertCoordinateOrigin(radius * tmp.proportion * process * Math.cos(tmp.angle), radius * tmp.proportion *
+        process * Math.sin(tmp.angle), center);
+      listItem.data.push(tmp);
+    });
+
+    data.push(listItem);
+  }
+
+  return data;
+}
+
+function getPieDataPoints(series, radius) {
+  var process = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
+
+  var count = 0;
+  var _start_ = 0;
+  for (let i = 0; i < series.length; i++) {
+    let item = series[i];
+    item.data = item.data === null ? 0 : item.data;
+    count += item.data;
+  }
+  for (let i = 0; i < series.length; i++) {
+    let item = series[i];
+    item.data = item.data === null ? 0 : item.data;
+    if (count === 0) {
+      item._proportion_ = 1 / series.length * process;
+    } else {
+      item._proportion_ = item.data / count * process;
+    }
+    item._radius_ = radius;
+  }
+  for (let i = 0; i < series.length; i++) {
+    let item = series[i];
+    item._start_ = _start_;
+    _start_ += 2 * item._proportion_ * Math.PI;
+  }
+
+  return series;
+}
+
+function getFunnelDataPoints(series, radius) {
+  var process = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
+  series = series.sort(function(a,b){return parseInt(b.data)-parseInt(a.data);});
+  for (let i = 0; i < series.length; i++) {
+    series[i].radius = series[i].data/series[0].data*radius*process;
+    series[i]._proportion_ = series[i].data/series[0].data;
+  }
+  return series.reverse();
+}
+
+function getRoseDataPoints(series, type, minRadius, radius) {
+  var process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  var count = 0;
+  var _start_ = 0;
+
+  var dataArr = [];
+  for (let i = 0; i < series.length; i++) {
+    let item = series[i];
+    item.data = item.data === null ? 0 : item.data;
+    count += item.data;
+    dataArr.push(item.data);
+  }
+  
+  var minData = Math.min.apply(null, dataArr);
+  var maxData = Math.max.apply(null, dataArr);
+  var radiusLength = radius - minRadius;
+  
+  for (let i = 0; i < series.length; i++) {
+    let item = series[i];
+    item.data = item.data === null ? 0 : item.data;
+    if (count === 0 || type == 'area') {
+      item._proportion_ = item.data / count * process;
+      item._rose_proportion_ = 1 / series.length * process;
+    } else {
+      item._proportion_ = item.data / count * process;
+      item._rose_proportion_ = item.data / count * process;
+    }
+    item._radius_ = minRadius + radiusLength * ((item.data - minData) / (maxData - minData));
+  }
+  for (let i = 0; i < series.length; i++) {
+    let item = series[i];
+    item._start_ = _start_;
+    _start_ += 2 * item._rose_proportion_ * Math.PI;
+  }
+
+  return series;
+}
+
+function getArcbarDataPoints(series, arcbarOption) {
+  var process = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : 1;
+  if (process == 1) {
+    process = 0.999999;
+  }
+  for (let i = 0; i < series.length; i++) {
+    let item = series[i];
+    item.data = item.data === null ? 0 : item.data;
+    let totalAngle;
+    if (arcbarOption.type == 'circle') {
+      totalAngle = 2;
+    } else {
+			if (arcbarOption.endAngle < arcbarOption.startAngle) {
+			  totalAngle = 2 + arcbarOption.endAngle - arcbarOption.startAngle;
+			} else{
+			  totalAngle = arcbarOption.startAngle - arcbarOption.endAngle;
+			}
+    }
+    item._proportion_ = totalAngle * item.data * process + arcbarOption.startAngle;
+    if (item._proportion_ >= 2) {
+      item._proportion_ = item._proportion_ % 2;
+    }
+  }
+  return series;
+}
+
+function getGaugeAxisPoints(categories, startAngle, endAngle) {
+  let totalAngle = startAngle - endAngle + 1;
+  let tempStartAngle = startAngle;
+  for (let i = 0; i < categories.length; i++) {
+    categories[i].value = categories[i].value === null ? 0 : categories[i].value;
+    categories[i]._startAngle_ = tempStartAngle;
+    categories[i]._endAngle_ = totalAngle * categories[i].value + startAngle;
+    if (categories[i]._endAngle_ >= 2) {
+      categories[i]._endAngle_ = categories[i]._endAngle_ % 2;
+    }
+    tempStartAngle = categories[i]._endAngle_;
+  }
+  return categories;
+}
+
+function getGaugeDataPoints(series, categories, gaugeOption) {
+  let process = arguments.length > 3 && arguments[3] !== undefined ? arguments[3] : 1;
+  for (let i = 0; i < series.length; i++) {
+    let item = series[i];
+    item.data = item.data === null ? 0 : item.data;
+    if (gaugeOption.pointer.color == 'auto') {
+      for (let i = 0; i < categories.length; i++) {
+        if (item.data <= categories[i].value) {
+          item.color = categories[i].color;
+          break;
+        }
+      }
+    } else {
+      item.color = gaugeOption.pointer.color;
+    }
+    let totalAngle = gaugeOption.startAngle - gaugeOption.endAngle + 1;
+    item._endAngle_ = totalAngle * item.data + gaugeOption.startAngle;
+    item._oldAngle_ = gaugeOption.oldAngle;
+    if (gaugeOption.oldAngle < gaugeOption.endAngle) {
+      item._oldAngle_ += 2;
+    }
+    if (item.data >= gaugeOption.oldData) {
+      item._proportion_ = (item._endAngle_ - item._oldAngle_) * process + gaugeOption.oldAngle;
+    } else {
+      item._proportion_ = item._oldAngle_ - (item._oldAngle_ - item._endAngle_) * process;
+    }
+    if (item._proportion_ >= 2) {
+      item._proportion_ = item._proportion_ % 2;
+    }
+  }
+  return series;
+}
+
+function getPieTextMaxLength(series) {
+  series = getPieDataPoints(series);
+  let maxLength = 0;
+  for (let i = 0; i < series.length; i++) {
+    let item = series[i];
+    let text = item.format ? item.format(+item._proportion_.toFixed(2)) : util.toFixed(item._proportion_ * 100) + '%';
+    maxLength = Math.max(maxLength, measureText(text));
+  }
+
+  return maxLength;
+}
+
+function fixColumeData(points, eachSpacing, columnLen, index, config, opts) {
+  return points.map(function(item) {
+    if (item === null) {
+      return null;
+    }
+    item.width = Math.ceil((eachSpacing - 2 * config.columePadding) / columnLen);
+
+    if (opts.extra.column && opts.extra.column.width && +opts.extra.column.width > 0) {
+      item.width = Math.min(item.width, +opts.extra.column.width);
+    }
+    if (item.width <= 0) {
+      item.width = 1;
+    }
+    item.x += (index + 0.5 - columnLen / 2) * item.width;
+    return item;
+  });
+}
+
+function fixColumeMeterData(points, eachSpacing, columnLen, index, config, opts, border) {
+  return points.map(function(item) {
+    if (item === null) {
+      return null;
+    }
+    item.width = Math.ceil((eachSpacing - 2 * config.columePadding) / 2);
+
+    if (opts.extra.column && opts.extra.column.width && +opts.extra.column.width > 0) {
+      item.width = Math.min(item.width, +opts.extra.column.width);
+    }
+
+    if (index > 0) {
+      item.width -= 2 * border;
+    }
+    return item;
+  });
+}
+
+function fixColumeStackData(points, eachSpacing, columnLen, index, config, opts, series) {
+
+  return points.map(function(item, indexn) {
+
+    if (item === null) {
+      return null;
+    }
+    item.width = Math.ceil((eachSpacing - 2 * config.columePadding) / 2);
+
+    if (opts.extra.column && opts.extra.column.width && +opts.extra.column.width > 0) {
+      item.width = Math.min(item.width, +opts.extra.column.width);
+    }
+    return item;
+  });
+}
+
+function getXAxisPoints(categories, opts, config) {
+  var spacingValid = opts.width - opts.area[1] - opts.area[3];
+  var dataCount = opts.enableScroll ? Math.min(opts.xAxis.itemCount, categories.length) : categories.length;
+  if((opts.type=='line' || opts.type=='area') && dataCount>1 && opts.xAxis.boundaryGap=='justify'){
+    dataCount -=1;
+  }
+  var eachSpacing = spacingValid / dataCount;
+
+  var xAxisPoints = [];
+  var startX = opts.area[3];
+  var endX = opts.width - opts.area[1];
+  categories.forEach(function(item, index) {
+    xAxisPoints.push(startX + index * eachSpacing);
+  });
+  if(opts.xAxis.boundaryGap !=='justify'){
+    if (opts.enableScroll === true) {
+      xAxisPoints.push(startX + categories.length * eachSpacing);
+    } else {
+      xAxisPoints.push(endX);
+    }
+  }
+  return {
+    xAxisPoints: xAxisPoints,
+    startX: startX,
+    endX: endX,
+    eachSpacing: eachSpacing
+  };
+}
+
+function getCandleDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config) {
+  var process = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 1;
+  var points = [];
+  var validHeight = opts.height - opts.area[0] - opts.area[2];
+  data.forEach(function(item, index) {
+    if (item === null) {
+      points.push(null);
+    } else {
+      var cPoints = [];
+      item.forEach(function(items, indexs) {
+        var point = {};
+        point.x = xAxisPoints[index] + Math.round(eachSpacing / 2);
+        var value = items.value || items;
+        var height = validHeight * (value - minRange) / (maxRange - minRange);
+        height *= process;
+        point.y = opts.height - Math.round(height) - opts.area[2];
+        cPoints.push(point);
+      });
+      points.push(cPoints);
+    }
+  });
+
+  return points;
+}
+
+function getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config) {
+  var process = arguments.length > 7 && arguments[7] !== undefined ? arguments[7] : 1;
+  var boundaryGap='center';
+  if (opts.type == 'line'||opts.type == 'area'){
+    boundaryGap=opts.xAxis.boundaryGap;
+  }
+  var points = [];
+  var validHeight = opts.height - opts.area[0] - opts.area[2];
+	var validWidth = opts.width - opts.area[1] - opts.area[3];
+  data.forEach(function(item, index) {
+    if (item === null) {
+      points.push(null);
+    } else {
+      var point = {};
+      point.color = item.color;
+      point.x = xAxisPoints[index];
+      var value = item;
+      if (typeof item === 'object' && item !== null) {
+				if (item.constructor.toString().indexOf('Array')>-1) {
+					let xranges,xminRange,xmaxRange;
+					xranges = [].concat(opts.chartData.xAxisData.ranges);
+					xminRange = xranges.shift();
+					xmaxRange = xranges.pop();
+				  value = item[1];
+					point.x = opts.area[3]+ validWidth * (item[0] - xminRange) / (xmaxRange - xminRange);
+				} else {
+				  value = item.value;
+				}
+      }
+			if(boundaryGap=='center'){
+			  point.x += Math.round(eachSpacing / 2);
+			}
+      var height = validHeight * (value - minRange) / (maxRange - minRange);
+      height *= process;
+      point.y = opts.height - Math.round(height) - opts.area[2];
+      points.push(point);
+    }
+  });
+
+  return points;
+}
+
+function getStackDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, seriesIndex, stackSeries) {
+  var process = arguments.length > 9 && arguments[9] !== undefined ? arguments[9] : 1;
+  var points = [];
+  var validHeight = opts.height - opts.area[0] - opts.area[2];
+
+  data.forEach(function(item, index) {
+    if (item === null) {
+      points.push(null);
+    } else {
+      var point = {};
+      point.color = item.color;
+      point.x = xAxisPoints[index] + Math.round(eachSpacing / 2);
+
+      if (seriesIndex > 0) {
+        var value = 0;
+        for (let i = 0; i <= seriesIndex; i++) {
+          value += stackSeries[i].data[index];
+        }
+        var value0 = value - item;
+        var height = validHeight * (value - minRange) / (maxRange - minRange);
+        var height0 = validHeight * (value0 - minRange) / (maxRange - minRange);
+      } else {
+        var value = item;
+        var height = validHeight * (value - minRange) / (maxRange - minRange);
+        var height0 = 0;
+      }
+      var heightc = height0;
+      height *= process;
+      heightc *= process;
+      point.y = opts.height - Math.round(height) - opts.area[2];
+      point.y0 = opts.height - Math.round(heightc) - opts.area[2];
+      points.push(point);
+    }
+  });
+
+  return points;
+}
+
+function getYAxisTextList(series, opts, config, stack) {
+  var index = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : -1;
+  var data;
+  if (stack == 'stack') {
+    data = dataCombineStack(series, opts.categories.length);
+  } else {
+    data = dataCombine(series);
+  }
+  var sorted = [];
+  // remove null from data
+  data = data.filter(function(item) {
+    //return item !== null;
+    if (typeof item === 'object' && item !== null) {
+      if (item.constructor.toString().indexOf('Array')>-1) {
+        return item !== null;
+      } else {
+        return item.value !== null;
+      }
+    } else {
+      return item !== null;
+    }
+  });
+  data.map(function(item) {
+    if (typeof item === 'object') {
+      if (item.constructor.toString().indexOf('Array')>-1) {
+				if(opts.type=='candle'){
+					item.map(function(subitem) {
+					  sorted.push(subitem);
+					})
+				}else{
+					sorted.push(item[1]);
+				}
+      } else {
+        sorted.push(item.value);
+      }
+    } else {
+      sorted.push(item);
+    }
+  })
+	
+  var minData = 0;
+  var maxData = 0;
+  if (sorted.length > 0) {
+    minData = Math.min.apply(this, sorted);
+    maxData = Math.max.apply(this, sorted);
+  }
+  //为了兼容v1.9.0之前的项目
+  if(index>-1){
+    if (typeof opts.yAxis.data[index].min === 'number') {
+      minData = Math.min(opts.yAxis.data[index].min, minData);
+    }
+    if (typeof opts.yAxis.data[index].max === 'number') {
+      maxData = Math.max(opts.yAxis.data[index].max, maxData);
+    }
+  }else{
+    if (typeof opts.yAxis.min === 'number') {
+      minData = Math.min(opts.yAxis.min, minData);
+    }
+    if (typeof opts.yAxis.max === 'number') {
+      maxData = Math.max(opts.yAxis.max, maxData);
+    }
+  }
+  
+
+  if (minData === maxData) {
+    var rangeSpan = maxData || 10;
+    maxData += rangeSpan;
+  }
+
+  var dataRange = getDataRange(minData, maxData);
+  var minRange = dataRange.minRange;
+  var maxRange = dataRange.maxRange;
+
+  var range = [];
+  var eachRange = (maxRange - minRange) / opts.yAxis.splitNumber;
+
+  for (var i = 0; i <= opts.yAxis.splitNumber; i++) {
+    range.push(minRange + eachRange * i);
+  }
+  return range.reverse();
+}
+
+function calYAxisData(series, opts, config) {
+  //堆叠图重算Y轴
+  var columnstyle = assign({}, {
+    type: ""
+  }, opts.extra.column);
+  //如果是多Y轴，重新计算
+  var YLength = opts.yAxis.data.length;
+  var newSeries=new Array(YLength);
+  if(YLength>0){
+    for(let i=0;i<YLength;i++){
+      newSeries[i]=[];
+      for(let j=0;j<series.length;j++){
+        if(series[j].index == i){
+          newSeries[i].push(series[j]);
+        }
+      }
+    }
+    var rangesArr =new Array(YLength);
+    var rangesFormatArr = new Array(YLength);
+    var yAxisWidthArr =new Array(YLength);
+		
+    for(let i=0;i<YLength;i++){
+      let yData = opts.yAxis.data[i];
+			//如果总开关不显示，强制每个Y轴为不显示
+			if(opts.yAxis.disabled == true){
+				yData.disabled = true;
+			}
+			rangesArr[i]=getYAxisTextList(newSeries[i], opts, config, columnstyle.type,i);
+			let yAxisFontSizes = yData.fontSize || config.fontSize;
+			yAxisWidthArr[i] = {position:yData.position?yData.position:'left',width:0};
+			rangesFormatArr[i]= rangesArr[i].map(function(items) {
+				items = util.toFixed(items, 6);
+				items = yData.format ? yData.format(Number(items)) : items;
+				yAxisWidthArr[i].width = Math.max(yAxisWidthArr[i].width, measureText(items, yAxisFontSizes) + 5);
+				return items;
+			});
+			let calibration= yData.calibration? 4*opts.pixelRatio : 0 ;
+			yAxisWidthArr[i].width += calibration +3*opts.pixelRatio;
+      if (yData.disabled === true) {
+        yAxisWidthArr[i].width=0;
+      }
+    }
+    
+  }else{
+    var rangesArr =new Array(1);
+    var rangesFormatArr = new Array(1);
+    var yAxisWidthArr =new Array(1);
+		rangesArr[0] = getYAxisTextList(series, opts, config, columnstyle.type);
+		yAxisWidthArr[0] = {position:'left',width:0};
+		var yAxisFontSize = opts.yAxis.fontSize || config.fontSize;
+		rangesFormatArr[0] = rangesArr[0].map(function(item) {
+			item = util.toFixed(item, 6);
+			item = opts.yAxis.format ? opts.yAxis.format(Number(item)) : item;
+			yAxisWidthArr[0].width = Math.max(yAxisWidthArr[0].width, measureText(item, yAxisFontSize) + 5);
+			return item;
+		});
+		yAxisWidthArr[0].width += 3*opts.pixelRatio;
+		if (opts.yAxis.disabled === true) {
+		  yAxisWidthArr[0] = {position:'left',width:0};
+		  opts.yAxis.data[0]={disabled:true};
+		}else{
+			opts.yAxis.data[0]={disabled:false,position:'left',max:opts.yAxis.max,min:opts.yAxis.min,format:opts.yAxis.format};
+		}
+    
+  }
+
+  return {
+    rangesFormat: rangesFormatArr,
+    ranges: rangesArr,
+    yAxisWidth: yAxisWidthArr
+  };
+  
+}
+
+function calTooltipYAxisData(point, series, opts, config, eachSpacing) {
+  let ranges = [].concat(opts.chartData.yAxisData.ranges);
+  let spacingValid = opts.height - opts.area[0] - opts.area[2];
+  let minAxis = opts.area[0];
+  let items=[];
+  for(let i=0;i<ranges.length;i++){
+    let maxVal = ranges[i].shift();
+    let minVal = ranges[i].pop();
+    let item = maxVal - (maxVal - minVal) * (point - minAxis) / spacingValid;
+    item = opts.yAxis.data[i].format ? opts.yAxis.data[i].format(Number(item)) : item.toFixed(0);
+    items.push(String(item))
+  }
+  return items;
+}
+
+function calMarkLineData(points, opts) {
+  let minRange, maxRange;
+  let spacingValid = opts.height - opts.area[0] - opts.area[2];
+  for (let i = 0; i < points.length; i++) {
+    points[i].yAxisIndex = points[i].yAxisIndex ? points[i].yAxisIndex:0;
+    let range = [].concat(opts.chartData.yAxisData.ranges[points[i].yAxisIndex]);
+    minRange = range.pop();
+    maxRange = range.shift();
+    let height = spacingValid * (points[i].value - minRange) / (maxRange - minRange);
+    points[i].y = opts.height - Math.round(height) - opts.area[2];
+  }
+  return points;
+}
+
+function contextRotate(context, opts) {
+  if (opts.rotateLock !== true) {
+    context.translate(opts.height, 0);
+    context.rotate(90 * Math.PI / 180);
+  } else if (opts._rotate_ !== true) {
+    context.translate(opts.height, 0);
+    context.rotate(90 * Math.PI / 180);
+    opts._rotate_ = true;
+  }
+}
+
+function drawPointShape(points, color, shape, context, opts) {
+  context.beginPath();
+	if(opts.dataPointShapeType == 'hollow'){
+		context.setStrokeStyle(color);
+		context.setFillStyle(opts.background);
+		context.setLineWidth(2 * opts.pixelRatio);
+	}else{
+		context.setStrokeStyle("#ffffff");
+		context.setFillStyle(color);
+		context.setLineWidth(1 * opts.pixelRatio);
+	}
+  if (shape === 'diamond') {
+    points.forEach(function(item, index) {
+      if (item !== null) {
+        context.moveTo(item.x, item.y - 4.5);
+        context.lineTo(item.x - 4.5, item.y);
+        context.lineTo(item.x, item.y + 4.5);
+        context.lineTo(item.x + 4.5, item.y);
+        context.lineTo(item.x, item.y - 4.5);
+      }
+    });
+  } else if (shape === 'circle') {
+    points.forEach(function(item, index) {
+      if (item !== null) {
+        context.moveTo(item.x + 2.5 * opts.pixelRatio, item.y);
+        context.arc(item.x, item.y, 3 * opts.pixelRatio, 0, 2 * Math.PI, false);
+      }
+    });
+  } else if (shape === 'rect') {
+    points.forEach(function(item, index) {
+      if (item !== null) {
+        context.moveTo(item.x - 3.5, item.y - 3.5);
+        context.rect(item.x - 3.5, item.y - 3.5, 7, 7);
+      }
+    });
+  } else if (shape === 'triangle') {
+    points.forEach(function(item, index) {
+      if (item !== null) {
+        context.moveTo(item.x, item.y - 4.5);
+        context.lineTo(item.x - 4.5, item.y + 4.5);
+        context.lineTo(item.x + 4.5, item.y + 4.5);
+        context.lineTo(item.x, item.y - 4.5);
+      }
+    });
+  }
+  context.closePath();
+  context.fill();
+  context.stroke();
+}
+
+function drawRingTitle(opts, config, context, center) {
+  var titlefontSize = opts.title.fontSize || config.titleFontSize;
+  var subtitlefontSize = opts.subtitle.fontSize || config.subtitleFontSize;
+  var title = opts.title.name || '';
+  var subtitle = opts.subtitle.name || '';
+  var titleFontColor = opts.title.color || config.titleColor;
+  var subtitleFontColor = opts.subtitle.color || config.subtitleColor;
+  var titleHeight = title ? titlefontSize : 0;
+  var subtitleHeight = subtitle ? subtitlefontSize : 0;
+  var margin = 5;
+
+  if (subtitle) {
+    var textWidth = measureText(subtitle, subtitlefontSize);
+    var startX = center.x - textWidth / 2 + (opts.subtitle.offsetX || 0);
+    var startY = center.y + subtitlefontSize / 2 + (opts.subtitle.offsetY || 0);
+    if (title) {
+      startY += (titleHeight + margin) / 2;
+    }
+    context.beginPath();
+    context.setFontSize(subtitlefontSize);
+    context.setFillStyle(subtitleFontColor);
+    context.fillText(subtitle, startX, startY);
+    context.closePath();
+    context.stroke();
+  }
+  if (title) {
+    var _textWidth = measureText(title, titlefontSize);
+    var _startX = center.x - _textWidth / 2 + (opts.title.offsetX || 0);
+    var _startY = center.y + titlefontSize / 2 + (opts.title.offsetY || 0);
+    if (subtitle) {
+      _startY -= (subtitleHeight + margin) / 2;
+    }
+    context.beginPath();
+    context.setFontSize(titlefontSize);
+    context.setFillStyle(titleFontColor);
+    context.fillText(title, _startX, _startY);
+    context.closePath();
+    context.stroke();
+  }
+}
+
+function drawPointText(points, series, config, context) {
+  // 绘制数据文案
+  var data = series.data;
+  points.forEach(function(item, index) {
+    if (item !== null) {
+      //var formatVal = series.format ? series.format(data[index]) : data[index];
+      context.beginPath();
+      context.setFontSize(series.textSize || config.fontSize);
+      context.setFillStyle(series.textColor || '#666666');
+      var value = data[index]
+      if (typeof data[index] === 'object' && data[index] !== null) {
+				if (data[index].constructor == Array) {
+					value = data[index][1];
+				}else{
+					value = data[index].value
+				}
+      }
+      var formatVal = series.format ? series.format(value) : value;
+      context.fillText(String(formatVal), item.x - measureText(formatVal, series.textSize || config.fontSize) / 2, item.y -4);
+      context.closePath();
+      context.stroke();
+    }
+  });
+
+}
+
+function drawGaugeLabel(gaugeOption, radius, centerPosition, opts, config, context) {
+  radius -= gaugeOption.width / 2 + config.gaugeLabelTextMargin;
+
+  let totalAngle = gaugeOption.startAngle - gaugeOption.endAngle + 1;
+  let splitAngle = totalAngle / gaugeOption.splitLine.splitNumber;
+  let totalNumber = gaugeOption.endNumber - gaugeOption.startNumber;
+  let splitNumber = totalNumber / gaugeOption.splitLine.splitNumber;
+  let nowAngle = gaugeOption.startAngle;
+  let nowNumber = gaugeOption.startNumber;
+  for (let i = 0; i < gaugeOption.splitLine.splitNumber + 1; i++) {
+    var pos = {
+      x: radius * Math.cos(nowAngle * Math.PI),
+      y: radius * Math.sin(nowAngle * Math.PI)
+    };
+    var labelText = gaugeOption.labelFormat ? gaugeOption.labelFormat(nowNumber) : nowNumber;
+    pos.x += centerPosition.x - measureText(labelText) / 2;
+    pos.y += centerPosition.y;
+    var startX = pos.x;
+    var startY = pos.y;
+    context.beginPath();
+    context.setFontSize(config.fontSize);
+    context.setFillStyle(gaugeOption.labelColor || '#666666');
+    context.fillText(labelText, startX, startY + config.fontSize / 2);
+    context.closePath();
+    context.stroke();
+
+    nowAngle += splitAngle;
+    if (nowAngle >= 2) {
+      nowAngle = nowAngle % 2;
+    }
+    nowNumber += splitNumber;
+  }
+
+}
+
+function drawRadarLabel(angleList, radius, centerPosition, opts, config, context) {
+  var radarOption = opts.extra.radar || {};
+  radius += config.radarLabelTextMargin;
+
+  angleList.forEach(function(angle, index) {
+    var pos = {
+      x: radius * Math.cos(angle),
+      y: radius * Math.sin(angle)
+    };
+    var posRelativeCanvas = convertCoordinateOrigin(pos.x, pos.y, centerPosition);
+    var startX = posRelativeCanvas.x;
+    var startY = posRelativeCanvas.y;
+    if (util.approximatelyEqual(pos.x, 0)) {
+      startX -= measureText(opts.categories[index] || '') / 2;
+    } else if (pos.x < 0) {
+      startX -= measureText(opts.categories[index] || '');
+    }
+    context.beginPath();
+    context.setFontSize(config.fontSize);
+    context.setFillStyle(radarOption.labelColor || '#666666');
+    context.fillText(opts.categories[index] || '', startX, startY + config.fontSize / 2);
+    context.closePath();
+    context.stroke();
+  });
+
+}
+
+function drawPieText(series, opts, config, context, radius, center) {
+  var lineRadius = config.pieChartLinePadding;
+  var textObjectCollection = [];
+  var lastTextObject = null;
+
+  var seriesConvert = series.map(function(item) {
+    var text = item.format ? item.format(+item._proportion_.toFixed(2)) : util.toFixed(item._proportion_.toFixed(4) * 100) +'%';
+    if(item._rose_proportion_) item._proportion_=item._rose_proportion_;
+    var arc = 2 * Math.PI - (item._start_ + 2 * Math.PI * item._proportion_ / 2);
+    var color = item.color;
+    var radius = item._radius_;
+    return {
+      arc: arc,
+      text: text,
+      color: color,
+      radius: radius,
+      textColor: item.textColor,
+      textSize: item.textSize,
+    };
+  });
+  for (let i = 0; i < seriesConvert.length; i++) {
+    let item = seriesConvert[i];
+    // line end
+    let orginX1 = Math.cos(item.arc) * (item.radius + lineRadius);
+    let orginY1 = Math.sin(item.arc) * (item.radius + lineRadius);
+
+    // line start
+    let orginX2 = Math.cos(item.arc) * item.radius;
+    let orginY2 = Math.sin(item.arc) * item.radius;
+
+    // text start
+    let orginX3 = orginX1 >= 0 ? orginX1 + config.pieChartTextPadding : orginX1 - config.pieChartTextPadding;
+    let orginY3 = orginY1;
+    let textWidth = measureText(item.text,item.textSize||config.fontSize);
+    let startY = orginY3;
+
+    if (lastTextObject && util.isSameXCoordinateArea(lastTextObject.start, {
+        x: orginX3
+      })) {
+      if (orginX3 > 0) {
+        startY = Math.min(orginY3, lastTextObject.start.y);
+      } else if (orginX1 < 0) {
+        startY = Math.max(orginY3, lastTextObject.start.y);
+      } else {
+        if (orginY3 > 0) {
+          startY = Math.max(orginY3, lastTextObject.start.y);
+        } else {
+          startY = Math.min(orginY3, lastTextObject.start.y);
+        }
+      }
+    }
+    if (orginX3 < 0) {
+      orginX3 -= textWidth;
+    }
+
+    let textObject = {
+      lineStart: {
+        x: orginX2,
+        y: orginY2
+      },
+      lineEnd: {
+        x: orginX1,
+        y: orginY1
+      },
+      start: {
+        x: orginX3,
+        y: startY
+      },
+      width: textWidth,
+      height: config.fontSize,
+      text: item.text,
+      color: item.color,
+      textColor: item.textColor,
+      textSize: item.textSize
+    };
+    lastTextObject = avoidCollision(textObject, lastTextObject);
+    textObjectCollection.push(lastTextObject);
+  }
+
+  for (let i = 0; i < textObjectCollection.length; i++) {
+    let item = textObjectCollection[i];
+    let lineStartPoistion = convertCoordinateOrigin(item.lineStart.x, item.lineStart.y, center);
+    let lineEndPoistion = convertCoordinateOrigin(item.lineEnd.x, item.lineEnd.y, center);
+    let textPosition = convertCoordinateOrigin(item.start.x, item.start.y, center);
+    context.setLineWidth(1 * opts.pixelRatio);
+    context.setFontSize(config.fontSize);
+    context.beginPath();
+    context.setStrokeStyle(item.color);
+    context.setFillStyle(item.color);
+    context.moveTo(lineStartPoistion.x, lineStartPoistion.y);
+    let curveStartX = item.start.x < 0 ? textPosition.x + item.width : textPosition.x;
+    let textStartX = item.start.x < 0 ? textPosition.x - 5 : textPosition.x + 5;
+    context.quadraticCurveTo(lineEndPoistion.x, lineEndPoistion.y, curveStartX, textPosition.y);
+    context.moveTo(lineStartPoistion.x, lineStartPoistion.y);
+    context.stroke();
+    context.closePath();
+    context.beginPath();
+    context.moveTo(textPosition.x + item.width, textPosition.y);
+    context.arc(curveStartX, textPosition.y, 2, 0, 2 * Math.PI);
+    context.closePath();
+    context.fill();
+    context.beginPath();
+    context.setFontSize(item.textSize || config.fontSize);
+    context.setFillStyle(item.textColor || '#666666');
+    context.fillText(item.text, textStartX, textPosition.y + 3);
+    context.closePath();
+    context.stroke();
+    context.closePath();
+  }
+}
+
+function drawToolTipSplitLine(offsetX, opts, config, context) {
+  var toolTipOption = opts.extra.tooltip || {};
+  toolTipOption.gridType = toolTipOption.gridType == undefined ? 'solid' : toolTipOption.gridType;
+  toolTipOption.dashLength = toolTipOption.dashLength == undefined ? 4 : toolTipOption.dashLength;
+  var startY = opts.area[0];
+  var endY = opts.height - opts.area[2];
+
+  if (toolTipOption.gridType == 'dash') {
+    context.setLineDash([toolTipOption.dashLength, toolTipOption.dashLength]);
+  }
+  context.setStrokeStyle(toolTipOption.gridColor || '#cccccc');
+  context.setLineWidth(1 * opts.pixelRatio);
+  context.beginPath();
+  context.moveTo(offsetX, startY);
+  context.lineTo(offsetX, endY);
+  context.stroke();
+  context.setLineDash([]);
+
+  if (toolTipOption.xAxisLabel) {
+    let labelText = opts.categories[opts.tooltip.index];
+    context.setFontSize(config.fontSize);
+    let textWidth = measureText(labelText, config.fontSize);
+
+    let textX = offsetX - 0.5 * textWidth;
+    let textY = endY;
+    context.beginPath();
+    context.setFillStyle(hexToRgb(toolTipOption.labelBgColor || config.toolTipBackground, toolTipOption.labelBgOpacity || config.toolTipOpacity));
+    context.setStrokeStyle(toolTipOption.labelBgColor || config.toolTipBackground);
+    context.setLineWidth(1 * opts.pixelRatio);
+    context.rect(textX - config.toolTipPadding, textY, textWidth + 2 * config.toolTipPadding, config.fontSize + 2 * config.toolTipPadding);
+    context.closePath();
+    context.stroke();
+    context.fill();
+
+    context.beginPath();
+    context.setFontSize(config.fontSize);
+    context.setFillStyle(toolTipOption.labelFontColor || config.fontColor);
+    context.fillText(String(labelText), textX, textY + config.toolTipPadding + config.fontSize);
+    context.closePath();
+    context.stroke();
+  }
+}
+
+function drawMarkLine(opts, config, context) {
+  let markLineOption = assign({}, {
+    type: 'solid',
+    dashLength: 4,
+    data: []
+  }, opts.extra.markLine);
+  let startX = opts.area[3];
+  let endX = opts.width - opts.area[1];
+  let points = calMarkLineData(markLineOption.data, opts);
+
+  for (let i = 0; i < points.length; i++) {
+    let item = assign({}, {
+      lineColor: '#DE4A42',
+      showLabel: false,
+      labelFontColor: '#666666',
+      labelBgColor: '#DFE8FF',
+      labelBgOpacity: 0.8,
+      yAxisIndex: 0
+    }, points[i]);
+
+    if (markLineOption.type == 'dash') {
+      context.setLineDash([markLineOption.dashLength, markLineOption.dashLength]);
+    }
+    context.setStrokeStyle(item.lineColor);
+    context.setLineWidth(1 * opts.pixelRatio);
+    context.beginPath();
+    context.moveTo(startX, item.y);
+    context.lineTo(endX, item.y);
+    context.stroke();
+    context.setLineDash([]);
+    if (item.showLabel) {
+      let labelText = opts.yAxis.format ? opts.yAxis.format(Number(item.value)) : item.value;
+      context.setFontSize(config.fontSize);
+      let textWidth = measureText(labelText, config.fontSize);
+      let bgStartX = opts.padding[3] + config.yAxisTitleWidth - config.toolTipPadding;
+      let bgEndX = Math.max(opts.area[3], textWidth + config.toolTipPadding * 2);
+      let bgWidth = bgEndX - bgStartX;
+
+      let textX = bgStartX + (bgWidth - textWidth) / 2;
+      let textY = item.y;
+      context.setFillStyle(hexToRgb(item.labelBgColor, item.labelBgOpacity));
+      context.setStrokeStyle(item.labelBgColor);
+      context.setLineWidth(1 * opts.pixelRatio);
+      context.beginPath();
+      context.rect(bgStartX, textY - 0.5 * config.fontSize - config.toolTipPadding, bgWidth, config.fontSize + 2 * config.toolTipPadding);
+      context.closePath();
+      context.stroke();
+      context.fill();
+
+      context.beginPath();
+      context.setFontSize(config.fontSize);
+      context.setFillStyle(item.labelFontColor);
+      context.fillText(String(labelText), textX, textY + 0.5 * config.fontSize);
+      context.stroke();
+    }
+  }
+}
+
+function drawToolTipHorizentalLine(opts, config, context, eachSpacing, xAxisPoints) {
+  var toolTipOption = assign({}, {
+    gridType: 'solid',
+    dashLength: 4
+  }, opts.extra.tooltip);
+
+  var startX = opts.area[3];
+  var endX = opts.width - opts.area[1];
+
+  if (toolTipOption.gridType == 'dash') {
+    context.setLineDash([toolTipOption.dashLength, toolTipOption.dashLength]);
+  }
+  context.setStrokeStyle(toolTipOption.gridColor || '#cccccc');
+  context.setLineWidth(1 * opts.pixelRatio);
+  context.beginPath();
+  context.moveTo(startX, opts.tooltip.offset.y);
+  context.lineTo(endX, opts.tooltip.offset.y);
+  context.stroke();
+  context.setLineDash([]);
+
+  if (toolTipOption.yAxisLabel) {
+    let labelText = calTooltipYAxisData(opts.tooltip.offset.y, opts.series, opts, config, eachSpacing);
+    let widthArr = opts.chartData.yAxisData.yAxisWidth;
+    let tStartLeft=opts.area[3];
+    let tStartRight=opts.width-opts.area[1];
+    for(let i=0;i<labelText.length;i++){
+      context.setFontSize(config.fontSize);
+      let textWidth = measureText(labelText[i], config.fontSize);
+      let bgStartX,bgEndX,bgWidth;
+      if(widthArr[i].position == 'left'){
+        bgStartX = tStartLeft - widthArr[i].width;
+        bgEndX = Math.max(bgStartX, bgStartX + textWidth + config.toolTipPadding * 2);
+      }else{
+        bgStartX = tStartRight;
+        bgEndX = Math.max(bgStartX + widthArr[i].width, bgStartX + textWidth + config.toolTipPadding * 2);
+      }
+      bgWidth = bgEndX - bgStartX;
+      
+      let textX = bgStartX + (bgWidth - textWidth) / 2;
+      let textY = opts.tooltip.offset.y;
+      context.beginPath();
+      context.setFillStyle(hexToRgb(toolTipOption.labelBgColor || config.toolTipBackground, toolTipOption.labelBgOpacity || config.toolTipOpacity));
+      context.setStrokeStyle(toolTipOption.labelBgColor || config.toolTipBackground);
+      context.setLineWidth(1 * opts.pixelRatio);
+      context.rect(bgStartX, textY - 0.5 * config.fontSize - config.toolTipPadding, bgWidth, config.fontSize + 2 * config.toolTipPadding);
+      context.closePath();
+      context.stroke();
+      context.fill();
+      
+      context.beginPath();
+      context.setFontSize(config.fontSize);
+      context.setFillStyle(toolTipOption.labelFontColor || config.fontColor);
+      context.fillText(labelText[i], textX, textY + 0.5 * config.fontSize);
+      context.closePath();
+      context.stroke();
+      if(widthArr[i].position == 'left'){
+        tStartLeft -=(widthArr[i].width + opts.yAxis.padding);
+      }else{
+        tStartRight +=widthArr[i].width+ opts.yAxis.padding;
+      }
+    }
+  }
+}
+
+function drawToolTipSplitArea(offsetX, opts, config, context, eachSpacing) {
+  var toolTipOption = assign({}, {
+    activeBgColor: '#000000',
+    activeBgOpacity: 0.08
+  }, opts.extra.tooltip);
+  var startY = opts.area[0];
+  var endY = opts.height - opts.area[2];
+  context.beginPath();
+  context.setFillStyle(hexToRgb(toolTipOption.activeBgColor, toolTipOption.activeBgOpacity));
+  context.rect(offsetX - eachSpacing / 2, startY, eachSpacing, endY - startY);
+  context.closePath();
+  context.fill();
+}
+
+function drawToolTip(textList, offset, opts, config, context, eachSpacing, xAxisPoints) {
+  var toolTipOption = assign({}, {
+		showBox:true,
+    bgColor: '#000000',
+    bgOpacity: 0.7,
+    fontColor: '#FFFFFF'
+  }, opts.extra.tooltip);
+  var legendWidth = 4 * opts.pixelRatio;
+  var legendMarginRight = 5 * opts.pixelRatio;
+  var arrowWidth = 8 * opts.pixelRatio;
+  var isOverRightBorder = false;
+  if (opts.type == 'line' || opts.type == 'area' || opts.type == 'candle' || opts.type == 'mix') {
+    drawToolTipSplitLine(opts.tooltip.offset.x, opts, config, context);
+  }
+
+  offset = assign({
+    x: 0,
+    y: 0
+  }, offset);
+  offset.y -= 8 * opts.pixelRatio;
+  var textWidth = textList.map(function(item) {
+    return measureText(item.text, config.fontSize);
+  });
+  var toolTipWidth = legendWidth + legendMarginRight + 4 * config.toolTipPadding + Math.max.apply(null, textWidth);
+  var toolTipHeight = 2 * config.toolTipPadding + textList.length * config.toolTipLineHeight;
+
+	if(toolTipOption.showBox == false){ return }
+  // if beyond the right border
+  if (offset.x - Math.abs(opts._scrollDistance_) + arrowWidth + toolTipWidth > opts.width) {
+    isOverRightBorder = true;
+  }
+  if (toolTipHeight + offset.y > opts.height) {
+    offset.y = opts.height - toolTipHeight;
+  }
+  // draw background rect
+  context.beginPath();
+  context.setFillStyle(hexToRgb(toolTipOption.bgColor || config.toolTipBackground, toolTipOption.bgOpacity || config.toolTipOpacity));
+  if (isOverRightBorder) {
+    context.moveTo(offset.x, offset.y + 10 * opts.pixelRatio);
+    context.lineTo(offset.x - arrowWidth, offset.y + 10 * opts.pixelRatio - 5 * opts.pixelRatio);
+    context.lineTo(offset.x - arrowWidth, offset.y);
+    context.lineTo(offset.x - arrowWidth - Math.round(toolTipWidth), offset.y);
+    context.lineTo(offset.x - arrowWidth - Math.round(toolTipWidth), offset.y + toolTipHeight);
+    context.lineTo(offset.x - arrowWidth, offset.y + toolTipHeight);
+    context.lineTo(offset.x - arrowWidth, offset.y + 10 * opts.pixelRatio + 5 * opts.pixelRatio);
+    context.lineTo(offset.x, offset.y + 10 * opts.pixelRatio);
+  } else {
+    context.moveTo(offset.x, offset.y + 10 * opts.pixelRatio);
+    context.lineTo(offset.x + arrowWidth, offset.y + 10 * opts.pixelRatio - 5 * opts.pixelRatio);
+    context.lineTo(offset.x + arrowWidth, offset.y);
+    context.lineTo(offset.x + arrowWidth + Math.round(toolTipWidth), offset.y);
+    context.lineTo(offset.x + arrowWidth + Math.round(toolTipWidth), offset.y + toolTipHeight);
+    context.lineTo(offset.x + arrowWidth, offset.y + toolTipHeight);
+    context.lineTo(offset.x + arrowWidth, offset.y + 10 * opts.pixelRatio + 5 * opts.pixelRatio);
+    context.lineTo(offset.x, offset.y + 10 * opts.pixelRatio);
+  }
+
+  context.closePath();
+  context.fill();
+
+  // draw legend
+  textList.forEach(function(item, index) {
+    if (item.color !== null) {
+      context.beginPath();
+      context.setFillStyle(item.color);
+      var startX = offset.x + arrowWidth + 2 * config.toolTipPadding;
+      var startY = offset.y + (config.toolTipLineHeight - config.fontSize) / 2 + config.toolTipLineHeight * index +
+        config.toolTipPadding + 1;
+      if (isOverRightBorder) {
+        startX = offset.x - toolTipWidth - arrowWidth + 2 * config.toolTipPadding;
+      }
+      context.fillRect(startX, startY, legendWidth, config.fontSize);
+      context.closePath();
+    }
+  });
+
+  // draw text list
+
+  textList.forEach(function(item, index) {
+    var startX = offset.x + arrowWidth + 2 * config.toolTipPadding + legendWidth + legendMarginRight;
+    if (isOverRightBorder) {
+      startX = offset.x - toolTipWidth - arrowWidth + 2 * config.toolTipPadding + +legendWidth + legendMarginRight;
+    }
+    var startY = offset.y + (config.toolTipLineHeight - config.fontSize) / 2 + config.toolTipLineHeight * index +
+      config.toolTipPadding;
+    context.beginPath();
+    context.setFontSize(config.fontSize);
+    context.setFillStyle(toolTipOption.fontColor);
+    context.fillText(item.text, startX, startY + config.fontSize);
+    context.closePath();
+    context.stroke();
+  });
+}
+
+function drawYAxisTitle(title, opts, config, context) {
+  var startX = config.xAxisHeight + (opts.height - config.xAxisHeight - measureText(title)) / 2;
+  context.save();
+  context.beginPath();
+  context.setFontSize(config.fontSize);
+  context.setFillStyle(opts.yAxis.titleFontColor || '#333333');
+  context.translate(0, opts.height);
+  context.rotate(-90 * Math.PI / 180);
+  context.fillText(title, startX, opts.padding[3] + 0.5 * config.fontSize);
+  context.closePath();
+  context.stroke();
+  context.restore();
+}
+
+function drawColumnDataPoints(series, opts, config, context) {
+  let process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  let xAxisData = opts.chartData.xAxisData,
+    xAxisPoints = xAxisData.xAxisPoints,
+    eachSpacing = xAxisData.eachSpacing;
+  let columnOption = assign({}, {
+    type: 'group',
+    width: eachSpacing / 2,
+    meter: {
+      border: 4,
+      fillColor: '#FFFFFF'
+    }
+  }, opts.extra.column);
+  
+  let calPoints = [];
+  context.save();
+	
+	let leftNum=-2;
+	let rightNum=xAxisPoints.length+2;
+	
+  if (opts._scrollDistance_ && opts._scrollDistance_ !== 0 && opts.enableScroll === true) {
+    context.translate(opts._scrollDistance_, 0);
+		leftNum=Math.floor(-opts._scrollDistance_/eachSpacing)-2;
+		rightNum=leftNum+opts.xAxis.itemCount+4;
+  }
+  if (opts.tooltip && opts.tooltip.textList && opts.tooltip.textList.length && process === 1) {
+    drawToolTipSplitArea(opts.tooltip.offset.x, opts, config, context, eachSpacing);
+  }
+	
+  series.forEach(function(eachSeries, seriesIndex) {
+    let ranges,minRange,maxRange;
+    ranges = [].concat(opts.chartData.yAxisData.ranges[eachSeries.index]);
+    minRange = ranges.pop();
+    maxRange = ranges.shift();
+    
+    var data = eachSeries.data;
+    switch (columnOption.type) {
+      case 'group':
+        var points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+        var tooltipPoints = getStackDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, seriesIndex, series, process);
+        calPoints.push(tooltipPoints);
+        points = fixColumeData(points, eachSpacing, series.length, seriesIndex, config, opts);
+				for(let i=0;i<points.length;i++){
+					let item=points[i];
+          if (item !== null && i>leftNum && i<rightNum) {
+            context.beginPath();
+            context.setStrokeStyle(item.color || eachSeries.color);
+            context.setLineWidth(1)
+            context.setFillStyle(item.color || eachSeries.color);
+            var startX = item.x - item.width / 2;
+            var height = opts.height - item.y - opts.area[2];
+            context.moveTo(startX, item.y);
+            context.lineTo(startX+item.width-2,item.y);
+            context.lineTo(startX+item.width-2,opts.height - opts.area[2]);
+            context.lineTo(startX,opts.height - opts.area[2]);
+            context.lineTo(startX,item.y);
+            context.closePath();
+            context.stroke();
+            context.fill();
+          }
+        };
+        break;
+      case 'stack':
+        // 绘制堆叠数据图
+        var points = getStackDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, seriesIndex, series, process);
+        calPoints.push(points);
+        points = fixColumeStackData(points, eachSpacing, series.length, seriesIndex, config, opts, series);
+
+        for(let i=0;i<points.length;i++){
+        	let item=points[i];
+          if (item !== null && i>leftNum && i<rightNum) {
+            context.beginPath();
+            context.setFillStyle(item.color || eachSeries.color);
+            var startX = item.x - item.width / 2 + 1;
+            var height = opts.height - item.y - opts.area[2];
+            var height0 = opts.height - item.y0 - opts.area[2];
+            if (seriesIndex > 0) {
+              height -= height0;
+            }
+            context.moveTo(startX, item.y);
+            context.fillRect(startX, item.y, item.width - 2, height);
+            context.closePath();
+            context.fill();
+          }
+        };
+        break;
+      case 'meter':
+        // 绘制温度计数据图
+        var points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+        calPoints.push(points);
+        points = fixColumeMeterData(points, eachSpacing, series.length, seriesIndex, config, opts, columnOption.meter.border);
+        if (seriesIndex == 0) {
+          for(let i=0;i<points.length;i++){
+          	let item=points[i];
+            if (item !== null && i>leftNum && i<rightNum) {
+              //画背景颜色
+              context.beginPath();
+              context.setFillStyle(columnOption.meter.fillColor);
+              var startX = item.x - item.width / 2;
+              var height = opts.height - item.y - opts.area[2];
+              context.moveTo(startX, item.y);
+              context.fillRect(startX, item.y, item.width, height);
+              context.closePath();
+              context.fill();
+              //画边框线
+              if (columnOption.meter.border > 0) {
+                context.beginPath();
+                context.setStrokeStyle(eachSeries.color);
+                context.setLineWidth(columnOption.meter.border * opts.pixelRatio);
+                context.moveTo(startX + columnOption.meter.border * 0.5, item.y + height);
+                context.lineTo(startX + columnOption.meter.border * 0.5, item.y + columnOption.meter.border * 0.5);
+                context.lineTo(startX + item.width - columnOption.meter.border * 0.5, item.y + columnOption.meter.border * 0.5);
+                context.lineTo(startX + item.width - columnOption.meter.border * 0.5, item.y + height);
+                context.stroke();
+              }
+            }
+          };
+        } else {
+          for(let i=0;i<points.length;i++){
+          	let item=points[i];
+            if (item !== null && i>leftNum && i<rightNum) {
+              context.beginPath();
+              context.setFillStyle(item.color || eachSeries.color);
+              var startX = item.x - item.width / 2;
+              var height = opts.height - item.y - opts.area[2];
+              context.moveTo(startX, item.y);
+              context.fillRect(startX, item.y, item.width, height);
+              context.closePath();
+              context.fill();
+            }
+          };
+        }
+        break;
+    }
+  });
+
+  if (opts.dataLabel !== false && process === 1) {
+    series.forEach(function(eachSeries, seriesIndex) {
+      let ranges,minRange,maxRange;
+        ranges = [].concat(opts.chartData.yAxisData.ranges[eachSeries.index]);
+        minRange = ranges.pop();
+        maxRange = ranges.shift();
+      var data = eachSeries.data;
+      switch (columnOption.type) {
+        case 'group':
+          var points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+          points = fixColumeData(points, eachSpacing, series.length, seriesIndex, config, opts);
+          drawPointText(points, eachSeries, config, context);
+          break;
+        case 'stack':
+          var points = getStackDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, seriesIndex, series, process);
+          drawPointText(points, eachSeries, config, context);
+          break;
+        case 'meter':
+          var points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+          drawPointText(points, eachSeries, config, context);
+          break;
+      }
+    });
+  }
+
+  context.restore();
+
+  return {
+    xAxisPoints: xAxisPoints,
+    calPoints: calPoints,
+    eachSpacing: eachSpacing
+  };
+}
+
+function drawCandleDataPoints(series, seriesMA, opts, config, context) {
+  var process = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 1;
+  var candleOption = assign({}, {
+    color: {},
+    average: {}
+  }, opts.extra.candle);
+  candleOption.color = assign({}, {
+    upLine: '#f04864',
+    upFill: '#f04864',
+    downLine: '#2fc25b',
+    downFill: '#2fc25b'
+  }, candleOption.color);
+  candleOption.average = assign({}, {
+    show: false,
+    name: [],
+    day: [],
+    color: config.colors
+  }, candleOption.average);
+  opts.extra.candle = candleOption;
+
+  let xAxisData = opts.chartData.xAxisData,
+    xAxisPoints = xAxisData.xAxisPoints,
+    eachSpacing = xAxisData.eachSpacing;
+
+  let calPoints = [];
+
+  context.save();
+	
+	let leftNum=-2;
+	let rightNum=xAxisPoints.length+2;
+	let leftSpace=0;
+	let rightSpace=opts.width+eachSpacing;
+	
+  if (opts._scrollDistance_ && opts._scrollDistance_ !== 0 && opts.enableScroll === true) {
+    context.translate(opts._scrollDistance_, 0);
+		leftNum=Math.floor(-opts._scrollDistance_/eachSpacing)-2;
+		rightNum=leftNum+opts.xAxis.itemCount+4;
+		leftSpace=-opts._scrollDistance_-eachSpacing+opts.area[3];
+		rightSpace=leftSpace+(opts.xAxis.itemCount+4)*eachSpacing;
+  }
+
+  //画均线
+  if (candleOption.average.show || seriesMA) { //Merge pull request !12 from 邱贵翔
+    seriesMA.forEach(function(eachSeries, seriesIndex) {
+      let ranges,minRange,maxRange;
+      ranges = [].concat(opts.chartData.yAxisData.ranges[eachSeries.index]);
+      minRange = ranges.pop();
+      maxRange = ranges.shift();
+
+      var data = eachSeries.data;
+      var points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+      var splitPointList = splitPoints(points);
+			
+			for(let i=0;i<splitPointList.length;i++){
+				let points=splitPointList[i];
+				context.beginPath();
+				context.setStrokeStyle(eachSeries.color);
+				context.setLineWidth(1);
+				if (points.length === 1) {
+					context.moveTo(points[0].x, points[0].y);
+					context.arc(points[0].x, points[0].y, 1, 0, 2 * Math.PI);
+				} else {
+					context.moveTo(points[0].x, points[0].y);
+					let startPoint=0;
+					for(let j=0;j<points.length;j++){
+						let item=points[j];
+						if(startPoint==0 && item.x > leftSpace){
+							context.moveTo(item.x, item.y);
+							startPoint=1;
+						}
+						if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+							var ctrlPoint = createCurveControlPoints(points, j - 1);
+							context.bezierCurveTo(ctrlPoint.ctrA.x, ctrlPoint.ctrA.y, ctrlPoint.ctrB.x, ctrlPoint.ctrB.y,item.x, item.y);
+						}
+					}
+					context.moveTo(points[0].x, points[0].y);
+				}
+				context.closePath();
+				context.stroke();
+      }
+    });
+  }
+  //画K线
+  series.forEach(function(eachSeries, seriesIndex) {
+    let ranges,minRange,maxRange;
+    ranges = [].concat(opts.chartData.yAxisData.ranges[eachSeries.index]);
+    minRange = ranges.pop();
+    maxRange = ranges.shift();
+    var data = eachSeries.data;
+    var points = getCandleDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+    calPoints.push(points);
+    var splitPointList = splitPoints(points);
+
+		for(let i=0;i<splitPointList[0].length;i++){
+			if(i>leftNum && i<rightNum){
+				let item=splitPointList[0][i];
+				context.beginPath();
+				//如果上涨
+				if (data[i][1] - data[i][0] > 0) {
+					context.setStrokeStyle(candleOption.color.upLine);
+					context.setFillStyle(candleOption.color.upFill);
+					context.setLineWidth(1 * opts.pixelRatio);
+					context.moveTo(item[3].x, item[3].y); //顶点
+					context.lineTo(item[1].x, item[1].y); //收盘中间点
+					context.lineTo(item[1].x - eachSpacing / 4, item[1].y); //收盘左侧点
+					context.lineTo(item[0].x - eachSpacing / 4, item[0].y); //开盘左侧点
+					context.lineTo(item[0].x, item[0].y); //开盘中间点
+					context.lineTo(item[2].x, item[2].y); //底点
+					context.lineTo(item[0].x, item[0].y); //开盘中间点
+					context.lineTo(item[0].x + eachSpacing / 4, item[0].y); //开盘右侧点
+					context.lineTo(item[1].x + eachSpacing / 4, item[1].y); //收盘右侧点
+					context.lineTo(item[1].x, item[1].y); //收盘中间点
+					context.moveTo(item[3].x, item[3].y); //顶点
+				} else {
+					context.setStrokeStyle(candleOption.color.downLine);
+					context.setFillStyle(candleOption.color.downFill);
+					context.setLineWidth(1 * opts.pixelRatio);
+					context.moveTo(item[3].x, item[3].y); //顶点
+					context.lineTo(item[0].x, item[0].y); //开盘中间点
+					context.lineTo(item[0].x - eachSpacing / 4, item[0].y); //开盘左侧点
+					context.lineTo(item[1].x - eachSpacing / 4, item[1].y); //收盘左侧点
+					context.lineTo(item[1].x, item[1].y); //收盘中间点
+					context.lineTo(item[2].x, item[2].y); //底点
+					context.lineTo(item[1].x, item[1].y); //收盘中间点
+					context.lineTo(item[1].x + eachSpacing / 4, item[1].y); //收盘右侧点
+					context.lineTo(item[0].x + eachSpacing / 4, item[0].y); //开盘右侧点
+					context.lineTo(item[0].x, item[0].y); //开盘中间点
+					context.moveTo(item[3].x, item[3].y); //顶点
+				}
+				context.closePath();
+				context.fill();
+				context.stroke();
+			}
+    }
+  });
+
+  context.restore();
+
+  return {
+    xAxisPoints: xAxisPoints,
+    calPoints: calPoints,
+    eachSpacing: eachSpacing
+  };
+}
+
+function drawAreaDataPoints(series, opts, config, context) {
+  var process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  var areaOption = assign({},{
+    type: 'straight',
+    opacity: 0.2,
+    addLine: false,
+    width: 2,
+		gradient:false
+  },opts.extra.area);
+
+  let xAxisData = opts.chartData.xAxisData,
+    xAxisPoints = xAxisData.xAxisPoints,
+    eachSpacing = xAxisData.eachSpacing;
+
+  let endY = opts.height - opts.area[2];
+  let calPoints = [];
+
+  context.save();
+	let leftSpace=0;
+	let rightSpace=opts.width+eachSpacing;
+  if (opts._scrollDistance_ && opts._scrollDistance_ !== 0 && opts.enableScroll === true) {
+    context.translate(opts._scrollDistance_, 0);
+		leftSpace=-opts._scrollDistance_-eachSpacing+opts.area[3];
+		rightSpace=leftSpace+(opts.xAxis.itemCount+4)*eachSpacing;
+  }
+
+  series.forEach(function(eachSeries, seriesIndex) {
+    let ranges,minRange,maxRange;
+    ranges = [].concat(opts.chartData.yAxisData.ranges[eachSeries.index]);
+    minRange = ranges.pop();
+    maxRange = ranges.shift();
+    let data = eachSeries.data;
+    let points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+    calPoints.push(points);
+
+    let splitPointList = splitPoints(points);
+    for (let i = 0; i < splitPointList.length; i++) {
+      let points = splitPointList[i];
+      // 绘制区域数
+      context.beginPath();
+      context.setStrokeStyle(hexToRgb(eachSeries.color, areaOption.opacity));
+			if(areaOption.gradient){
+				let gradient = context.createLinearGradient(0, opts.area[0], 0, opts.height-opts.area[2]);
+				gradient.addColorStop('0', hexToRgb(eachSeries.color, areaOption.opacity));
+				gradient.addColorStop('1.0',hexToRgb("#FFFFFF", 0.1));
+				context.setFillStyle(gradient);
+			}else{
+				context.setFillStyle(hexToRgb(eachSeries.color, areaOption.opacity));
+			}
+      context.setLineWidth(areaOption.width * opts.pixelRatio);
+      if (points.length > 1) {
+        let firstPoint = points[0];
+        let lastPoint = points[points.length - 1];
+        context.moveTo(firstPoint.x, firstPoint.y);
+				let startPoint=0;
+        if (areaOption.type === 'curve') {
+					for(let j=0;j<points.length;j++){
+						let item=points[j];
+						if(startPoint==0 && item.x > leftSpace){
+							context.moveTo(item.x, item.y);
+							startPoint=1;
+						}
+            if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+              let ctrlPoint = createCurveControlPoints(points, j - 1);
+              context.bezierCurveTo(ctrlPoint.ctrA.x, ctrlPoint.ctrA.y, ctrlPoint.ctrB.x, ctrlPoint.ctrB.y,item.x, item.y);
+            }
+          };
+        } else {
+					for(let j=0;j<points.length;j++){
+						let item=points[j];
+						if(startPoint==0 && item.x > leftSpace){
+							context.moveTo(item.x, item.y);
+							startPoint=1;
+						}
+					  if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+              context.lineTo(item.x, item.y);
+            }
+          };
+        }
+
+        context.lineTo(lastPoint.x, endY);
+        context.lineTo(firstPoint.x, endY);
+        context.lineTo(firstPoint.x, firstPoint.y);
+      } else {
+        let item = points[0];
+        context.moveTo(item.x - eachSpacing / 2, item.y);
+        context.lineTo(item.x + eachSpacing / 2, item.y);
+        context.lineTo(item.x + eachSpacing / 2, endY);
+        context.lineTo(item.x - eachSpacing / 2, endY);
+        context.moveTo(item.x - eachSpacing / 2, item.y);
+      }
+      context.closePath();
+      context.fill();
+
+      //画连线
+      if (areaOption.addLine) {
+				if (eachSeries.lineType == 'dash') {
+					let dashLength = eachSeries.dashLength?eachSeries.dashLength:8;
+					dashLength *= opts.pixelRatio;
+				  context.setLineDash([dashLength, dashLength]);
+				}
+        context.beginPath();
+        context.setStrokeStyle(eachSeries.color);
+        context.setLineWidth(areaOption.width * opts.pixelRatio);
+        if (points.length === 1) {
+          context.moveTo(points[0].x, points[0].y);
+          context.arc(points[0].x, points[0].y, 1, 0, 2 * Math.PI);
+        } else {
+          context.moveTo(points[0].x, points[0].y);
+					let startPoint=0;
+          if (areaOption.type === 'curve') {
+            for(let j=0;j<points.length;j++){
+            	let item=points[j];
+            	if(startPoint==0 && item.x > leftSpace){
+            		context.moveTo(item.x, item.y);
+            		startPoint=1;
+            	}
+              if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+                let ctrlPoint = createCurveControlPoints(points, j - 1);
+                context.bezierCurveTo(ctrlPoint.ctrA.x, ctrlPoint.ctrA.y, ctrlPoint.ctrB.x, ctrlPoint.ctrB.y,item.x,item.y);
+              }
+            };
+          } else {
+            for(let j=0;j<points.length;j++){
+            	let item=points[j];
+            	if(startPoint==0 && item.x > leftSpace){
+            		context.moveTo(item.x, item.y);
+            		startPoint=1;
+            	}
+              if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+                context.lineTo(item.x, item.y);
+              }
+            };
+          }
+          context.moveTo(points[0].x, points[0].y);
+        }
+        context.stroke();
+				context.setLineDash([]);
+      }
+    }
+
+    //画点
+    if (opts.dataPointShape !== false) {
+      drawPointShape(points, eachSeries.color, eachSeries.pointShape, context, opts);
+    }
+
+  });
+
+  if (opts.dataLabel !== false && process === 1) {
+    series.forEach(function(eachSeries, seriesIndex) {
+      let ranges,minRange,maxRange;
+      ranges = [].concat(opts.chartData.yAxisData.ranges[eachSeries.index]);
+      minRange = ranges.pop();
+      maxRange = ranges.shift();
+      var data = eachSeries.data;
+      var points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+      drawPointText(points, eachSeries, config, context);
+    });
+  }
+
+  context.restore();
+
+  return {
+    xAxisPoints: xAxisPoints,
+    calPoints: calPoints,
+    eachSpacing: eachSpacing
+  };
+}
+
+function drawLineDataPoints(series, opts, config, context) {
+  var process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  var lineOption = assign({},{
+		type: 'straight',
+		width: 2
+	},opts.extra.line);
+	lineOption.width *=opts.pixelRatio;
+	
+  let xAxisData = opts.chartData.xAxisData,
+    xAxisPoints = xAxisData.xAxisPoints,
+    eachSpacing = xAxisData.eachSpacing;
+  var calPoints = [];
+
+  context.save();
+	let leftSpace=0;
+	let rightSpace=opts.width+eachSpacing;
+  if (opts._scrollDistance_ && opts._scrollDistance_ !== 0 && opts.enableScroll === true) {
+    context.translate(opts._scrollDistance_, 0);
+		leftSpace=-opts._scrollDistance_-eachSpacing+opts.area[3];
+		rightSpace=leftSpace+(opts.xAxis.itemCount+4)*eachSpacing;
+  }
+
+  series.forEach(function(eachSeries, seriesIndex) {
+    let ranges,minRange,maxRange;
+    ranges = [].concat(opts.chartData.yAxisData.ranges[eachSeries.index]);
+    minRange = ranges.pop();
+    maxRange = ranges.shift();
+    var data = eachSeries.data;
+    var points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+    calPoints.push(points);
+    var splitPointList = splitPoints(points);
+		
+		if (eachSeries.lineType == 'dash') {
+			let dashLength = eachSeries.dashLength?eachSeries.dashLength:8;
+			dashLength *= opts.pixelRatio;
+		  context.setLineDash([dashLength, dashLength]);
+		}
+		context.beginPath();
+		context.setStrokeStyle(eachSeries.color);
+		context.setLineWidth(lineOption.width);
+		
+    splitPointList.forEach(function(points, index) {
+			
+      if (points.length === 1) {
+        context.moveTo(points[0].x, points[0].y);
+        context.arc(points[0].x, points[0].y, 1, 0, 2 * Math.PI);
+      } else {
+        context.moveTo(points[0].x, points[0].y);
+				let startPoint=0;
+        if (lineOption.type === 'curve') {
+          for(let j=0;j<points.length;j++){
+          	let item=points[j];
+          	if(startPoint==0 && item.x > leftSpace){
+          		context.moveTo(item.x, item.y);
+          		startPoint=1;
+          	}
+            if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+              var ctrlPoint = createCurveControlPoints(points, j - 1);
+              context.bezierCurveTo(ctrlPoint.ctrA.x, ctrlPoint.ctrA.y, ctrlPoint.ctrB.x, ctrlPoint.ctrB.y,item.x, item.y);
+            }
+          };
+        } else {
+          for(let j=0;j<points.length;j++){
+          	let item=points[j];
+          	if(startPoint==0 && item.x > leftSpace){
+          		context.moveTo(item.x, item.y);
+          		startPoint=1;
+          	}
+            if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+              context.lineTo(item.x, item.y);
+            }
+          };
+        }
+        context.moveTo(points[0].x, points[0].y);
+      }
+      
+    });
+		
+		context.stroke();
+		context.setLineDash([]);
+		
+    if (opts.dataPointShape !== false) {
+      drawPointShape(points, eachSeries.color, eachSeries.pointShape, context, opts);
+    }
+  });
+
+  if (opts.dataLabel !== false && process === 1) {
+    series.forEach(function(eachSeries, seriesIndex) {
+      let ranges,minRange,maxRange;
+      ranges = [].concat(opts.chartData.yAxisData.ranges[eachSeries.index]);
+      minRange = ranges.pop();
+      maxRange = ranges.shift();
+      var data = eachSeries.data;
+      var points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+      drawPointText(points, eachSeries, config, context);
+    });
+  }
+
+  context.restore();
+
+  return {
+    xAxisPoints: xAxisPoints,
+    calPoints: calPoints,
+    eachSpacing: eachSpacing
+  };
+}
+
+function drawMixDataPoints(series, opts, config, context) {
+  let process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  
+  let xAxisData = opts.chartData.xAxisData,
+    xAxisPoints = xAxisData.xAxisPoints,
+    eachSpacing = xAxisData.eachSpacing;
+
+  let endY = opts.height - opts.area[2];
+  let calPoints = [];
+
+  var columnIndex = 0;
+  var columnLength = 0;
+  series.forEach(function(eachSeries, seriesIndex) {
+    if (eachSeries.type == 'column') {
+      columnLength += 1;
+    }
+  });
+  context.save();
+	let leftNum=-2;
+	let rightNum=xAxisPoints.length+2;
+	let leftSpace=0;
+	let rightSpace=opts.width+eachSpacing;
+  if (opts._scrollDistance_ && opts._scrollDistance_ !== 0 && opts.enableScroll === true) {
+    context.translate(opts._scrollDistance_, 0);
+		leftNum=Math.floor(-opts._scrollDistance_/eachSpacing)-2;
+		rightNum=leftNum+opts.xAxis.itemCount+4;
+		leftSpace=-opts._scrollDistance_-eachSpacing+opts.area[3];
+		rightSpace=leftSpace+(opts.xAxis.itemCount+4)*eachSpacing;
+  }
+
+  series.forEach(function(eachSeries, seriesIndex) {
+    let ranges,minRange,maxRange;
+    
+		ranges = [].concat(opts.chartData.yAxisData.ranges[eachSeries.index]);
+		minRange = ranges.pop();
+		maxRange = ranges.shift();
+
+    var data = eachSeries.data;
+    var points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+    calPoints.push(points);
+
+    // 绘制柱状数据图
+    if (eachSeries.type == 'column') {
+      points = fixColumeData(points, eachSpacing, columnLength, columnIndex, config, opts);
+      for(let i=0;i<points.length;i++){
+      	let item=points[i];
+        if (item !== null && i>leftNum && i<rightNum) {
+          context.beginPath();
+          context.setStrokeStyle(item.color || eachSeries.color);
+          context.setLineWidth(1)
+          context.setFillStyle(item.color || eachSeries.color);
+          var startX = item.x - item.width / 2;
+          var height = opts.height - item.y - opts.area[2];
+          context.moveTo(startX, item.y);
+          context.moveTo(startX, item.y);
+          context.lineTo(startX+item.width-2,item.y);
+          context.lineTo(startX+item.width-2,opts.height - opts.area[2]);
+          context.lineTo(startX,opts.height - opts.area[2]);
+          context.lineTo(startX,item.y);
+          context.closePath();
+          context.stroke();
+          context.fill();
+          context.closePath();
+          context.fill();
+        }
+      }
+      columnIndex += 1;
+    }
+
+    //绘制区域图数据
+
+    if (eachSeries.type == 'area') {
+      let splitPointList = splitPoints(points);
+      for (let i = 0; i < splitPointList.length; i++) {
+        let points = splitPointList[i];
+        // 绘制区域数据
+        context.beginPath();
+        context.setStrokeStyle(eachSeries.color);
+        context.setFillStyle(hexToRgb(eachSeries.color, 0.2));
+        context.setLineWidth(2 * opts.pixelRatio);
+        if (points.length > 1) {
+          var firstPoint = points[0];
+          let lastPoint = points[points.length - 1];
+          context.moveTo(firstPoint.x, firstPoint.y);
+					let startPoint=0;
+          if (eachSeries.style === 'curve') {
+            for(let j=0;j<points.length;j++){
+            	let item=points[j];
+            	if(startPoint==0 && item.x > leftSpace){
+            		context.moveTo(item.x, item.y);
+            		startPoint=1;
+            	}
+              if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+                var ctrlPoint = createCurveControlPoints(points, j - 1);
+                context.bezierCurveTo(ctrlPoint.ctrA.x, ctrlPoint.ctrA.y, ctrlPoint.ctrB.x, ctrlPoint.ctrB.y, item.x, item.y);
+              }
+            };
+          } else {
+            for(let j=0;j<points.length;j++){
+            	let item=points[j];
+            	if(startPoint==0 && item.x > leftSpace){
+            		context.moveTo(item.x, item.y);
+            		startPoint=1;
+            	}
+              if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+                context.lineTo(item.x, item.y);
+              }
+            };
+          }
+          context.lineTo(lastPoint.x, endY);
+          context.lineTo(firstPoint.x, endY);
+          context.lineTo(firstPoint.x, firstPoint.y);
+        } else {
+          let item = points[0];
+          context.moveTo(item.x - eachSpacing / 2, item.y);
+          context.lineTo(item.x + eachSpacing / 2, item.y);
+          context.lineTo(item.x + eachSpacing / 2, endY);
+          context.lineTo(item.x - eachSpacing / 2, endY);
+          context.moveTo(item.x - eachSpacing / 2, item.y);
+        }
+        context.closePath();
+        context.fill();
+      }
+    }
+
+    // 绘制折线数据图
+    if (eachSeries.type == 'line') {
+      var splitPointList = splitPoints(points);
+      splitPointList.forEach(function(points, index) {
+				if (eachSeries.lineType == 'dash') {
+					let dashLength = eachSeries.dashLength?eachSeries.dashLength:8;
+					dashLength *= opts.pixelRatio;
+				  context.setLineDash([dashLength, dashLength]);
+				}
+        context.beginPath();
+        context.setStrokeStyle(eachSeries.color);
+        context.setLineWidth(2 * opts.pixelRatio);
+        if (points.length === 1) {
+          context.moveTo(points[0].x, points[0].y);
+          context.arc(points[0].x, points[0].y, 1, 0, 2 * Math.PI);
+        } else {
+          context.moveTo(points[0].x, points[0].y);
+					let startPoint=0;
+          if (eachSeries.style == 'curve') {
+            for(let j=0;j<points.length;j++){
+            	let item=points[j];
+            	if(startPoint==0 && item.x > leftSpace){
+            		context.moveTo(item.x, item.y);
+            		startPoint=1;
+            	}
+              if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+                var ctrlPoint = createCurveControlPoints(points, j - 1);
+                context.bezierCurveTo(ctrlPoint.ctrA.x, ctrlPoint.ctrA.y, ctrlPoint.ctrB.x, ctrlPoint.ctrB.y,item.x,item.y);
+              }
+            }
+          } else {
+            for(let j=0;j<points.length;j++){
+            	let item=points[j];
+            	if(startPoint==0 && item.x > leftSpace){
+            		context.moveTo(item.x, item.y);
+            		startPoint=1;
+            	}
+              if (j > 0 && item.x > leftSpace && item.x < rightSpace) {
+                context.lineTo(item.x, item.y);
+              }
+            }
+          }
+          context.moveTo(points[0].x, points[0].y);
+        }
+        context.stroke();
+				context.setLineDash([]);
+      });
+    }
+
+    // 绘制点数据图
+    if (eachSeries.type == 'point') {
+			eachSeries.addPoint = true;
+    }
+
+    if (eachSeries.addPoint == true && eachSeries.type !== 'column' ) {
+      drawPointShape(points, eachSeries.color, eachSeries.pointShape, context, opts);
+    }
+  });
+  if (opts.dataLabel !== false && process === 1) {
+    var columnIndex = 0;
+    series.forEach(function(eachSeries, seriesIndex) {
+      let ranges,minRange,maxRange;
+      
+			ranges = [].concat(opts.chartData.yAxisData.ranges[eachSeries.index]);
+			minRange = ranges.pop();
+			maxRange = ranges.shift();
+				
+      var data = eachSeries.data;
+      var points = getDataPoints(data, minRange, maxRange, xAxisPoints, eachSpacing, opts, config, process);
+      if (eachSeries.type !== 'column') {
+        drawPointText(points, eachSeries, config, context);
+      } else {
+        points = fixColumeData(points, eachSpacing, columnLength, columnIndex, config, opts);
+        drawPointText(points, eachSeries, config, context);
+        columnIndex += 1;
+      }
+
+    });
+  }
+
+  context.restore();
+
+  return {
+    xAxisPoints: xAxisPoints,
+    calPoints: calPoints,
+    eachSpacing: eachSpacing,
+  }
+}
+
+function drawToolTipBridge(opts, config, context, process, eachSpacing, xAxisPoints) {
+  var toolTipOption = opts.extra.tooltip || {};
+  if (toolTipOption.horizentalLine && opts.tooltip && process === 1 && (opts.type == 'line' || opts.type == 'area' || opts.type == 'column' || opts.type == 'candle' || opts.type == 'mix')) {
+    drawToolTipHorizentalLine(opts, config, context, eachSpacing, xAxisPoints)
+  }
+  context.save();
+  if (opts._scrollDistance_ && opts._scrollDistance_ !== 0 && opts.enableScroll === true) {
+    context.translate(opts._scrollDistance_, 0);
+  }
+  if (opts.tooltip && opts.tooltip.textList && opts.tooltip.textList.length && process === 1) {
+    drawToolTip(opts.tooltip.textList, opts.tooltip.offset, opts, config, context, eachSpacing, xAxisPoints);
+  }
+  context.restore();
+
+}
+
+function drawXAxis(categories, opts, config, context) {
+
+  let xAxisData = opts.chartData.xAxisData,
+    xAxisPoints = xAxisData.xAxisPoints,
+    startX = xAxisData.startX,
+    endX = xAxisData.endX,
+    eachSpacing = xAxisData.eachSpacing;
+  var boundaryGap='center';
+  if (opts.type == 'line'||opts.type == 'area'){
+    boundaryGap=opts.xAxis.boundaryGap;
+  }
+  var startY = opts.height - opts.area[2];
+  var endY = opts.area[0];
+
+  //绘制滚动条
+  if (opts.enableScroll && opts.xAxis.scrollShow) {
+    var scrollY = opts.height - opts.area[2] + config.xAxisHeight;
+    var scrollScreenWidth = endX - startX;
+    var scrollTotalWidth = eachSpacing * (xAxisPoints.length - 1);
+    var scrollWidth = scrollScreenWidth * scrollScreenWidth / scrollTotalWidth;
+    var scrollLeft = 0;
+    if (opts._scrollDistance_) {
+      scrollLeft = -opts._scrollDistance_ * (scrollScreenWidth) / scrollTotalWidth;
+    }
+    context.beginPath();
+    context.setLineCap('round');
+    context.setLineWidth(6 * opts.pixelRatio);
+    context.setStrokeStyle(opts.xAxis.scrollBackgroundColor || "#EFEBEF");
+    context.moveTo(startX, scrollY);
+    context.lineTo(endX, scrollY);
+    context.stroke();
+    context.closePath();
+    context.beginPath();
+    context.setLineCap('round');
+    context.setLineWidth(6 * opts.pixelRatio);
+    context.setStrokeStyle(opts.xAxis.scrollColor || "#A6A6A6");
+    context.moveTo(startX + scrollLeft, scrollY);
+    context.lineTo(startX + scrollLeft + scrollWidth, scrollY);
+    context.stroke();
+    context.closePath();
+    context.setLineCap('butt');
+  }
+
+  context.save();
+
+  if (opts._scrollDistance_ && opts._scrollDistance_ !== 0) {
+    context.translate(opts._scrollDistance_, 0);
+  }
+	
+	//绘制X轴刻度线
+	if (opts.xAxis.calibration === true) {
+		context.setStrokeStyle(opts.xAxis.gridColor || "#cccccc");
+		context.setLineCap('butt');
+		context.setLineWidth(1 * opts.pixelRatio);
+	  xAxisPoints.forEach(function(item, index) {
+	    if (index > 0) {
+	      context.beginPath();
+	      context.moveTo(item - eachSpacing / 2, startY);
+	      context.lineTo(item - eachSpacing / 2, startY + 3 * opts.pixelRatio);
+	      context.closePath();
+	      context.stroke();
+	    }
+	  });
+	}
+	//绘制X轴网格
+  if (opts.xAxis.disableGrid !== true) {
+    context.setStrokeStyle(opts.xAxis.gridColor || "#cccccc");
+    context.setLineCap('butt');
+    context.setLineWidth(1 * opts.pixelRatio);
+    if (opts.xAxis.gridType == 'dash') {
+      context.setLineDash([opts.xAxis.dashLength, opts.xAxis.dashLength]);
+    }
+		opts.xAxis.gridEval = opts.xAxis.gridEval || 1;
+		xAxisPoints.forEach(function(item, index) {
+			if (index % opts.xAxis.gridEval == 0) {
+				context.beginPath();
+				context.moveTo(item, startY);
+				context.lineTo(item, endY);
+				context.stroke();
+			}
+		});
+    context.setLineDash([]);
+  }
+  
+
+  //绘制X轴文案
+  if (opts.xAxis.disabled !== true) {
+    // 对X轴列表做抽稀处理
+    //默认全部显示X轴标签
+    let maxXAxisListLength = categories.length;
+    //如果设置了X轴单屏数量
+    if (opts.xAxis.labelCount) {
+      //如果设置X轴密度
+      if (opts.xAxis.itemCount) {
+        maxXAxisListLength = Math.ceil(categories.length / opts.xAxis.itemCount * opts.xAxis.labelCount);
+      } else {
+        maxXAxisListLength = opts.xAxis.labelCount;
+      }
+      maxXAxisListLength -= 1;
+    }
+
+    let ratio = Math.ceil(categories.length / maxXAxisListLength);
+
+    let newCategories = [];
+    let cgLength = categories.length;
+    for (let i = 0; i < cgLength; i++) {
+      if (i % ratio !== 0) {
+        newCategories.push("");
+      } else {
+        newCategories.push(categories[i]);
+      }
+    }
+    newCategories[cgLength - 1] = categories[cgLength - 1];
+
+    var xAxisFontSize = opts.xAxis.fontSize || config.fontSize;
+    if (config._xAxisTextAngle_ === 0) {
+      newCategories.forEach(function(item, index) {
+        var offset = - measureText(String(item), xAxisFontSize) / 2;
+        if(boundaryGap == 'center'){
+          offset+=eachSpacing / 2;
+        }
+        var scrollHeight=0;
+        if(opts.xAxis.scrollShow){
+          scrollHeight=6*opts.pixelRatio;
+        }
+        context.beginPath();
+        context.setFontSize(xAxisFontSize);
+        context.setFillStyle(opts.xAxis.fontColor || '#666666');
+        context.fillText(String(item), xAxisPoints[index] + offset, startY + xAxisFontSize + (config.xAxisHeight - scrollHeight - xAxisFontSize) / 2);
+        context.closePath();
+        context.stroke();
+      });
+
+    } else {
+      newCategories.forEach(function(item, index) {
+        context.save();
+        context.beginPath();
+        context.setFontSize(xAxisFontSize);
+        context.setFillStyle(opts.xAxis.fontColor || '#666666');
+        var textWidth = measureText(String(item),xAxisFontSize);
+        var offset = - textWidth;
+        if(boundaryGap == 'center'){
+          offset+=eachSpacing / 2;
+        }
+        var _calRotateTranslate = calRotateTranslate(xAxisPoints[index] + eachSpacing / 2, startY + xAxisFontSize / 2 + 5, opts.height),
+          transX = _calRotateTranslate.transX,
+          transY = _calRotateTranslate.transY;
+
+        context.rotate(-1 * config._xAxisTextAngle_);
+        context.translate(transX, transY);
+        context.fillText(String(item), xAxisPoints[index] + offset, startY + xAxisFontSize + 5);
+        context.closePath();
+        context.stroke();
+        context.restore();
+      });
+    }
+  }
+  context.restore();
+	
+	//绘制X轴轴线
+  if(opts.xAxis.axisLine){
+    context.beginPath();
+    context.setStrokeStyle(opts.xAxis.axisLineColor);
+    context.setLineWidth(1 * opts.pixelRatio);
+    context.moveTo(startX,opts.height-opts.area[2]);
+    context.lineTo(endX,opts.height-opts.area[2]);
+    context.stroke();
+  }
+}
+
+function drawYAxisGrid(categories, opts, config, context) {
+  if (opts.yAxis.disableGrid === true) {
+    return;
+  }
+  let spacingValid = opts.height - opts.area[0] - opts.area[2];
+  let eachSpacing = spacingValid / opts.yAxis.splitNumber;
+  let startX = opts.area[3];
+  let xAxisPoints = opts.chartData.xAxisData.xAxisPoints,
+    xAxiseachSpacing = opts.chartData.xAxisData.eachSpacing;
+  let TotalWidth = xAxiseachSpacing * (xAxisPoints.length - 1);
+  let endX = startX + TotalWidth;
+
+  let points = [];
+  for (let i = 0; i < opts.yAxis.splitNumber + 1; i++) {
+    points.push(opts.height - opts.area[2] - eachSpacing * i);
+  }
+
+  context.save();
+  if (opts._scrollDistance_ && opts._scrollDistance_ !== 0) {
+    context.translate(opts._scrollDistance_, 0);
+  }
+
+  if (opts.yAxis.gridType == 'dash') {
+    context.setLineDash([opts.yAxis.dashLength, opts.yAxis.dashLength]);
+  }
+  context.setStrokeStyle(opts.yAxis.gridColor);
+  context.setLineWidth(1 * opts.pixelRatio);
+  points.forEach(function(item, index) {
+    context.beginPath();
+    context.moveTo(startX, item);
+    context.lineTo(endX, item);
+    context.stroke();
+  });
+  context.setLineDash([]);
+
+  context.restore();
+}
+
+function drawYAxis(series, opts, config, context) {
+  if (opts.yAxis.disabled === true) {
+    return;
+  }
+  var spacingValid = opts.height - opts.area[0] - opts.area[2];
+  var eachSpacing = spacingValid / opts.yAxis.splitNumber;
+  var startX = opts.area[3];
+  var endX = opts.width - opts.area[1];
+  var endY = opts.height - opts.area[2];
+  var fillEndY = endY + config.xAxisHeight;
+  if (opts.xAxis.scrollShow) {
+    fillEndY -= 3 * opts.pixelRatio;
+  }
+	if (opts.xAxis.rotateLabel){
+		fillEndY = opts.height - opts.area[2]+3;
+	}
+  // set YAxis background
+  context.beginPath();
+  context.setFillStyle(opts.background || '#ffffff');
+  if (opts._scrollDistance_ < 0) {
+    context.fillRect(0, 0, startX, fillEndY);
+  }
+  if(opts.enableScroll == true){
+    context.fillRect(endX, 0, opts.width, fillEndY);
+  }
+  context.closePath();
+  context.stroke();
+
+  var points = [];
+  for (let i = 0; i <= opts.yAxis.splitNumber; i++) {
+    points.push(opts.area[0] + eachSpacing * i);
+  }
+
+  let tStartLeft=opts.area[3];
+  let tStartRight=opts.width-opts.area[1];
+
+  for (let i = 0; i < opts.yAxis.data.length; i++) {
+    let yData = opts.yAxis.data[i];
+    if(yData.disabled !== true){
+      let rangesFormat = opts.chartData.yAxisData.rangesFormat[i];
+      let yAxisFontSize = yData.fontSize || config.fontSize;
+      let yAxisWidth = opts.chartData.yAxisData.yAxisWidth[i];
+      //画Y轴刻度及文案
+      rangesFormat.forEach(function(item, index) {
+        var pos = points[index] ? points[index] : endY;
+        context.beginPath();
+        context.setFontSize(yAxisFontSize);
+        context.setLineWidth(1*opts.pixelRatio);
+        context.setStrokeStyle(yData.axisLineColor||'#cccccc');
+        context.setFillStyle(yData.fontColor|| '#666666');
+        if(yAxisWidth.position=='left'){
+          context.fillText(String(item), tStartLeft - yAxisWidth.width , pos + yAxisFontSize / 2);
+          //画刻度线
+          if(yData.calibration==true){
+            context.moveTo(tStartLeft,pos);
+            context.lineTo(tStartLeft - 3*opts.pixelRatio,pos);
+          }
+        }else{
+          context.fillText(String(item), tStartRight + 4*opts.pixelRatio, pos + yAxisFontSize / 2);
+          //画刻度线
+          if(yData.calibration==true){
+            context.moveTo(tStartRight,pos);
+            context.lineTo(tStartRight + 3*opts.pixelRatio,pos);
+          }
+        }
+        context.closePath();
+        context.stroke();
+      });
+      //画Y轴轴线
+      if (yData.axisLine!==false) {
+        context.beginPath();
+        context.setStrokeStyle(yData.axisLineColor||'#cccccc');
+        context.setLineWidth(1 * opts.pixelRatio);
+        if(yAxisWidth.position=='left'){
+          context.moveTo(tStartLeft,opts.height-opts.area[2]);
+          context.lineTo(tStartLeft,opts.area[0]);
+        }else{
+          context.moveTo(tStartRight,opts.height-opts.area[2]);
+          context.lineTo(tStartRight,opts.area[0]);
+        }
+        context.stroke();
+      }
+			
+      //画Y轴标题
+      if (opts.yAxis.showTitle) {
+				
+        let titleFontSize = yData.titleFontSize || config.fontSize;
+        let title = yData.title;
+        context.beginPath();
+        context.setFontSize(titleFontSize);
+        context.setFillStyle(yData.titleFontColor || '#666666');
+        if(yAxisWidth.position=='left'){
+          context.fillText(title, tStartLeft - measureText(title,titleFontSize)/2, opts.area[0]-10*opts.pixelRatio);
+        }else{
+          context.fillText(title,tStartRight - measureText(title,titleFontSize)/2, opts.area[0]-10*opts.pixelRatio);
+        }
+        context.closePath();
+        context.stroke();
+      }
+      if(yAxisWidth.position=='left'){
+        tStartLeft -=(yAxisWidth.width + opts.yAxis.padding);
+      }else{
+        tStartRight +=yAxisWidth.width+ opts.yAxis.padding;
+      }
+    }
+  }
+}
+
+function drawLegend(series, opts, config, context, chartData) {
+  if (opts.legend.show === false) {
+    return;
+  }
+  let legendData = chartData.legendData;
+  let legendList = legendData.points;
+  let legendArea = legendData.area;
+  let padding = opts.legend.padding;
+  let fontSize = opts.legend.fontSize;
+  let shapeWidth = 15 * opts.pixelRatio;
+  let shapeRight = 5 * opts.pixelRatio;
+  let itemGap = opts.legend.itemGap;
+  let lineHeight = Math.max(opts.legend.lineHeight * opts.pixelRatio, fontSize);
+
+  //画背景及边框
+  context.beginPath();
+  context.setLineWidth(opts.legend.borderWidth);
+  context.setStrokeStyle(opts.legend.borderColor);
+  context.setFillStyle(opts.legend.backgroundColor);
+  context.moveTo(legendArea.start.x, legendArea.start.y);
+  context.rect(legendArea.start.x, legendArea.start.y, legendArea.width, legendArea.height);
+  context.closePath();
+  context.fill();
+  context.stroke();
+
+  legendList.forEach(function(itemList, listIndex) {
+    let width = 0;
+    let height = 0;
+    width = legendData.widthArr[listIndex];
+    height = legendData.heightArr[listIndex];
+    let startX = 0;
+    let startY = 0;
+    if (opts.legend.position == 'top' || opts.legend.position == 'bottom') {
+      startX = legendArea.start.x + (legendArea.width - width) / 2;
+      startY = legendArea.start.y + padding + listIndex * lineHeight;
+    } else {
+      if (listIndex == 0) {
+        width = 0;
+      } else {
+        width = legendData.widthArr[listIndex - 1];
+      }
+      startX = legendArea.start.x + padding + width;
+      startY = legendArea.start.y + padding + (legendArea.height - height) / 2;
+    }
+
+    context.setFontSize(config.fontSize);
+    for (let i = 0; i < itemList.length; i++) {
+      let item = itemList[i];
+      item.area = [0, 0, 0, 0];
+      item.area[0] = startX;
+      item.area[1] = startY;
+      item.area[3] = startY + lineHeight;
+      context.beginPath();
+      context.setLineWidth(1 * opts.pixelRatio);
+      context.setStrokeStyle(item.show ? item.color : opts.legend.hiddenColor);
+      context.setFillStyle(item.show ? item.color : opts.legend.hiddenColor);
+      switch (item.legendShape) {
+        case 'line':
+          context.moveTo(startX, startY + 0.5 * lineHeight - 2 * opts.pixelRatio);
+          context.fillRect(startX, startY + 0.5 * lineHeight - 2 * opts.pixelRatio, 15 * opts.pixelRatio, 4 * opts.pixelRatio);
+          break;
+        case 'triangle':
+          context.moveTo(startX + 7.5 * opts.pixelRatio, startY + 0.5 * lineHeight - 5 * opts.pixelRatio);
+          context.lineTo(startX + 2.5 * opts.pixelRatio, startY + 0.5 * lineHeight + 5 * opts.pixelRatio);
+          context.lineTo(startX + 12.5 * opts.pixelRatio, startY + 0.5 * lineHeight + 5 * opts.pixelRatio);
+          context.lineTo(startX + 7.5 * opts.pixelRatio, startY + 0.5 * lineHeight - 5 * opts.pixelRatio);
+          break;
+        case 'diamond':
+          context.moveTo(startX + 7.5 * opts.pixelRatio, startY + 0.5 * lineHeight - 5 * opts.pixelRatio);
+          context.lineTo(startX + 2.5 * opts.pixelRatio, startY + 0.5 * lineHeight);
+          context.lineTo(startX + 7.5 * opts.pixelRatio, startY + 0.5 * lineHeight + 5 * opts.pixelRatio);
+          context.lineTo(startX + 12.5 * opts.pixelRatio, startY + 0.5 * lineHeight);
+          context.lineTo(startX + 7.5 * opts.pixelRatio, startY + 0.5 * lineHeight - 5 * opts.pixelRatio);
+          break;
+        case 'circle':
+          context.moveTo(startX + 7.5 * opts.pixelRatio, startY + 0.5 * lineHeight);
+          context.arc(startX + 7.5 * opts.pixelRatio, startY + 0.5 * lineHeight, 5 * opts.pixelRatio, 0, 2 * Math.PI);
+          break;
+        case 'rect':
+          context.moveTo(startX, startY + 0.5 * lineHeight - 5 * opts.pixelRatio);
+          context.fillRect(startX, startY + 0.5 * lineHeight - 5 * opts.pixelRatio, 15 * opts.pixelRatio, 10 * opts.pixelRatio);
+          break;
+        default:
+          context.moveTo(startX, startY + 0.5 * lineHeight - 5 * opts.pixelRatio);
+          context.fillRect(startX, startY + 0.5 * lineHeight - 5 * opts.pixelRatio, 15 * opts.pixelRatio, 10 * opts.pixelRatio);
+      }
+      context.closePath();
+      context.fill();
+      context.stroke();
+
+      startX += shapeWidth + shapeRight;
+      let fontTrans = 0.5 * lineHeight + 0.5 * fontSize - 2;
+      context.beginPath();
+      context.setFontSize(fontSize);
+      context.setFillStyle(item.show ? opts.legend.fontColor : opts.legend.hiddenColor);
+      context.fillText(item.name, startX, startY + fontTrans);
+      context.closePath();
+      context.stroke();
+      if (opts.legend.position == 'top' || opts.legend.position == 'bottom') {
+        startX += measureText(item.name, fontSize) + itemGap;
+        item.area[2] = startX;
+      } else {
+        item.area[2] = startX + measureText(item.name, fontSize) + itemGap;;
+        startX -= shapeWidth + shapeRight;
+        startY += lineHeight;
+      }
+    }
+  });
+}
+
+function drawPieDataPoints(series, opts, config, context) {
+  var process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  var pieOption = assign({}, {
+    activeOpacity: 0.5,
+    activeRadius: 10 * opts.pixelRatio,
+    offsetAngle: 0,
+    labelWidth: 15 * opts.pixelRatio,
+    ringWidth: 0,
+    border:false,
+    borderWidth:2,
+    borderColor:'#FFFFFF'
+  }, opts.extra.pie);
+  var centerPosition = {
+    x: opts.area[3] + (opts.width - opts.area[1] - opts.area[3]) / 2,
+    y: opts.area[0] + (opts.height - opts.area[0] - opts.area[2]) / 2
+  };
+  if (config.pieChartLinePadding == 0) {
+    config.pieChartLinePadding = pieOption.activeRadius;
+  }
+
+  var radius = Math.min((opts.width - opts.area[1] - opts.area[3]) / 2 - config.pieChartLinePadding - config.pieChartTextPadding - config._pieTextMaxLength_, (opts.height - opts.area[0] - opts.area[2]) / 2 - config.pieChartLinePadding - config.pieChartTextPadding);
+
+  series = getPieDataPoints(series, radius, process);
+
+  var activeRadius = pieOption.activeRadius;
+
+  series = series.map(function(eachSeries) {
+    eachSeries._start_ += (pieOption.offsetAngle) * Math.PI / 180;
+    return eachSeries;
+  });
+  series.forEach(function(eachSeries, seriesIndex) {
+    if (opts.tooltip) {
+      if (opts.tooltip.index == seriesIndex) {
+        context.beginPath();
+        context.setFillStyle(hexToRgb(eachSeries.color, opts.extra.pie.activeOpacity || 0.5));
+        context.moveTo(centerPosition.x, centerPosition.y);
+        context.arc(centerPosition.x, centerPosition.y, eachSeries._radius_ + activeRadius, eachSeries._start_,
+          eachSeries._start_ + 2 *
+          eachSeries._proportion_ * Math.PI);
+        context.closePath();
+        context.fill();
+      }
+    }
+    context.beginPath();
+    context.setLineWidth(pieOption.borderWidth * opts.pixelRatio);
+    context.lineJoin = "round";
+    context.setStrokeStyle(pieOption.borderColor);
+    context.setFillStyle(eachSeries.color);
+    context.moveTo(centerPosition.x, centerPosition.y);
+    context.arc(centerPosition.x, centerPosition.y, eachSeries._radius_, eachSeries._start_, eachSeries._start_ + 2 * eachSeries._proportion_ * Math.PI);
+    context.closePath();
+    context.fill();
+    if (pieOption.border == true) {
+      context.stroke();
+    }
+  });
+
+  if (opts.type === 'ring') {
+    var innerPieWidth = radius * 0.6;
+    if (typeof opts.extra.pie.ringWidth === 'number' && opts.extra.pie.ringWidth > 0) {
+      innerPieWidth = Math.max(0, radius - opts.extra.pie.ringWidth);
+    }
+    context.beginPath();
+    context.setFillStyle(opts.background || '#ffffff');
+    context.moveTo(centerPosition.x, centerPosition.y);
+    context.arc(centerPosition.x, centerPosition.y, innerPieWidth, 0, 2 * Math.PI);
+    context.closePath();
+    context.fill();
+  }
+
+  if (opts.dataLabel !== false && process === 1) {
+    var valid = false;
+    for (var i = 0, len = series.length; i < len; i++) {
+      if (series[i].data > 0) {
+        valid = true;
+        break;
+      }
+    }
+
+    if (valid) {
+      drawPieText(series, opts, config, context, radius, centerPosition);
+    }
+  }
+
+  if (process === 1 && opts.type === 'ring') {
+    drawRingTitle(opts, config, context, centerPosition);
+  }
+
+  return {
+    center: centerPosition,
+    radius: radius,
+    series: series
+  };
+}
+
+function drawRoseDataPoints(series, opts, config, context) {
+  var process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  var roseOption = assign({}, {
+    type: 'area',
+    activeOpacity: 0.5,
+    activeRadius: 10 * opts.pixelRatio,
+    offsetAngle: 0,
+    labelWidth: 15 * opts.pixelRatio,
+    border:false,
+    borderWidth:2,
+    borderColor:'#FFFFFF'
+  }, opts.extra.rose);
+  if (config.pieChartLinePadding == 0) {
+    config.pieChartLinePadding = roseOption.activeRadius;
+  }
+  var centerPosition = {
+    x: opts.area[3] + (opts.width - opts.area[1] - opts.area[3]) / 2,
+    y: opts.area[0] + (opts.height - opts.area[0] - opts.area[2]) / 2
+  };
+   var radius = Math.min((opts.width - opts.area[1] - opts.area[3]) / 2 - config.pieChartLinePadding - config.pieChartTextPadding - config._pieTextMaxLength_, (opts.height - opts.area[0] - opts.area[2]) / 2 - config.pieChartLinePadding - config.pieChartTextPadding);
+  var minRadius = roseOption.minRadius || radius * 0.5;
+
+  series = getRoseDataPoints(series, roseOption.type, minRadius, radius, process);
+
+  var activeRadius = roseOption.activeRadius;
+
+  series = series.map(function(eachSeries) {
+    eachSeries._start_ += (roseOption.offsetAngle || 0) * Math.PI / 180;
+    return eachSeries;
+  });
+
+  series.forEach(function(eachSeries, seriesIndex) {
+    if (opts.tooltip) {
+      if (opts.tooltip.index == seriesIndex) {
+        context.beginPath();
+        context.setFillStyle(hexToRgb(eachSeries.color, roseOption.activeOpacity || 0.5));
+        context.moveTo(centerPosition.x, centerPosition.y);
+        context.arc(centerPosition.x, centerPosition.y, activeRadius + eachSeries._radius_, eachSeries._start_,
+          eachSeries._start_ + 2 * eachSeries._rose_proportion_ * Math.PI);
+        context.closePath();
+        context.fill();
+      }
+    }
+    context.beginPath();
+    context.setLineWidth(roseOption.borderWidth * opts.pixelRatio);
+    context.lineJoin = "round";
+    context.setStrokeStyle(roseOption.borderColor);
+    context.setFillStyle(eachSeries.color);
+    context.moveTo(centerPosition.x, centerPosition.y);
+    context.arc(centerPosition.x, centerPosition.y, eachSeries._radius_, eachSeries._start_, eachSeries._start_ + 2 *
+      eachSeries._rose_proportion_ * Math.PI);
+    context.closePath();
+    context.fill();
+    if (roseOption.border == true) {
+      context.stroke();
+    }
+  });
+
+  if (opts.dataLabel !== false && process === 1) {
+    var valid = false;
+    for (var i = 0, len = series.length; i < len; i++) {
+      if (series[i].data > 0) {
+        valid = true;
+        break;
+      }
+    }
+
+    if (valid) {
+      drawPieText(series, opts, config, context, radius, centerPosition);
+    }
+  }
+
+  return {
+    center: centerPosition,
+    radius: radius,
+    series: series
+  };
+}
+
+function drawArcbarDataPoints(series, opts, config, context) {
+  var process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  var arcbarOption = assign({}, {
+    startAngle: 0.75,
+    endAngle: 0.25,
+    type: 'default',
+    width: 12 * opts.pixelRatio,
+		gap:2 * opts.pixelRatio
+  }, opts.extra.arcbar);
+
+  series = getArcbarDataPoints(series, arcbarOption, process);
+	
+  var centerPosition;
+	if(arcbarOption.center){
+		centerPosition=arcbarOption.center;
+	}else{
+		centerPosition= {
+		  x: opts.width / 2,
+		  y: opts.height / 2
+		};
+	}
+	
+  var radius;
+	if(arcbarOption.radius){
+		radius=arcbarOption.radius;
+	}else{
+		radius = Math.min(centerPosition.x, centerPosition.y);
+		radius -= 5 * opts.pixelRatio;
+		radius -= arcbarOption.width / 2;
+	}
+	
+  for (let i = 0; i < series.length; i++) {
+    let eachSeries = series[i];
+		//背景颜色
+		context.setLineWidth(arcbarOption.width);
+		context.setStrokeStyle(arcbarOption.backgroundColor || '#E9E9E9');
+		context.setLineCap('round');
+		context.beginPath();
+		if (arcbarOption.type == 'default') {
+		  context.arc(centerPosition.x, centerPosition.y, radius-(arcbarOption.width+arcbarOption.gap)*i, arcbarOption.startAngle * Math.PI, arcbarOption.endAngle * Math.PI, false);
+		} else {
+		  context.arc(centerPosition.x, centerPosition.y, radius-(arcbarOption.width+arcbarOption.gap)*i, 0, 2 * Math.PI, false);
+		}
+		context.stroke();
+		//进度条
+    context.setLineWidth(arcbarOption.width);
+    context.setStrokeStyle(eachSeries.color);
+    context.setLineCap('round');
+    context.beginPath();
+    context.arc(centerPosition.x, centerPosition.y, radius-(arcbarOption.width+arcbarOption.gap)*i, arcbarOption.startAngle * Math.PI, eachSeries._proportion_ * Math.PI, false);
+    context.stroke();
+  }
+
+  drawRingTitle(opts, config, context, centerPosition);
+
+  return {
+    center: centerPosition,
+    radius: radius,
+    series: series
+  };
+}
+
+function drawGaugeDataPoints(categories, series, opts, config, context) {
+  var process = arguments.length > 5 && arguments[5] !== undefined ? arguments[5] : 1;
+  var gaugeOption = assign({}, {
+		type:'default',
+    startAngle: 0.75,
+    endAngle: 0.25,
+    width: 15,
+    splitLine: {
+      fixRadius: 0,
+      splitNumber: 10,
+      width: 15,
+      color: '#FFFFFF',
+      childNumber: 5,
+      childWidth: 5
+    },
+    pointer: {
+      width: 15,
+      color: 'auto'
+    }
+  }, opts.extra.gauge);
+
+  if (gaugeOption.oldAngle == undefined) {
+    gaugeOption.oldAngle = gaugeOption.startAngle;
+  }
+  if (gaugeOption.oldData == undefined) {
+    gaugeOption.oldData = 0;
+  }
+  categories = getGaugeAxisPoints(categories, gaugeOption.startAngle, gaugeOption.endAngle);
+
+  var centerPosition = {
+    x: opts.width / 2,
+    y: opts.height / 2
+  };
+  var radius = Math.min(centerPosition.x, centerPosition.y);
+  radius -= 5 * opts.pixelRatio;
+  radius -= gaugeOption.width / 2;
+  var innerRadius = radius - gaugeOption.width;
+	var totalAngle=0;
+	
+	//判断仪表盘的样式：default百度样式，progress新样式
+	if(gaugeOption.type == 'progress'){
+		
+		//## 第一步画中心圆形背景和进度条背景
+		//中心圆形背景
+		var pieRadius = radius - gaugeOption.width*3;
+		context.beginPath();
+		let gradient = context.createLinearGradient(centerPosition.x, centerPosition.y-pieRadius, centerPosition.x , centerPosition.y+pieRadius);
+		//配置渐变填充（起点：中心点向上减半径；结束点中心点向下加半径）
+		gradient.addColorStop('0', hexToRgb(series[0].color, 0.3));
+		gradient.addColorStop('1.0',hexToRgb("#FFFFFF", 0.1));
+		context.setFillStyle(gradient);
+		context.arc(centerPosition.x, centerPosition.y, pieRadius, 0, 2*Math.PI, false);
+		context.fill();
+		//画进度条背景
+		context.setLineWidth(gaugeOption.width);
+		context.setStrokeStyle(hexToRgb(series[0].color, 0.3));
+		context.setLineCap('round');
+		context.beginPath();
+		context.arc(centerPosition.x, centerPosition.y, innerRadius , gaugeOption.startAngle * Math.PI, gaugeOption.endAngle *Math.PI, false);
+		context.stroke();
+		
+		//## 第二步画刻度线
+		totalAngle = gaugeOption.startAngle - gaugeOption.endAngle + 1;
+		let splitAngle = totalAngle / gaugeOption.splitLine.splitNumber;
+		let childAngle = totalAngle / gaugeOption.splitLine.splitNumber / gaugeOption.splitLine.childNumber;
+		let startX = -radius - gaugeOption.width * 0.5 - gaugeOption.splitLine.fixRadius;
+		let endX = -radius - gaugeOption.width - gaugeOption.splitLine.fixRadius + gaugeOption.splitLine.width;
+		context.save();
+		context.translate(centerPosition.x, centerPosition.y);
+		context.rotate((gaugeOption.startAngle - 1) * Math.PI);
+		let len = gaugeOption.splitLine.splitNumber * gaugeOption.splitLine.childNumber + 1;
+		let proc = series[0].data * process;
+		for (let i = 0; i < len; i++) {
+		  context.beginPath();
+			//刻度线随进度变色
+			if(proc>(i/len)){
+				context.setStrokeStyle(hexToRgb(series[0].color, 1));
+			}else{
+				context.setStrokeStyle(hexToRgb(series[0].color, 0.3));
+			}
+		  context.setLineWidth(3 * opts.pixelRatio);
+		  context.moveTo(startX, 0);
+		  context.lineTo(endX, 0);
+		  context.stroke();
+		  context.rotate(childAngle * Math.PI);
+		}
+		context.restore();
+		
+		//## 第三步画进度条
+		series = getArcbarDataPoints(series, gaugeOption, process);
+		context.setLineWidth(gaugeOption.width);
+		context.setStrokeStyle(series[0].color);
+		context.setLineCap('round');
+		context.beginPath();
+		context.arc(centerPosition.x, centerPosition.y, innerRadius , gaugeOption.startAngle * Math.PI, series[0]._proportion_ *Math.PI, false);
+		context.stroke();
+		
+		//## 第四步画指针
+		let pointerRadius = radius - gaugeOption.width*2.5;
+		context.save();
+		context.translate(centerPosition.x, centerPosition.y);
+		context.rotate((series[0]._proportion_ - 1) * Math.PI);
+		context.beginPath();
+		context.setLineWidth(gaugeOption.width/3);
+		let gradient3 = context.createLinearGradient(0, -pointerRadius*0.6, 0 , pointerRadius*0.6);
+		gradient3.addColorStop('0', hexToRgb('#FFFFFF', 0));
+		gradient3.addColorStop('0.5', hexToRgb(series[0].color, 1));
+		gradient3.addColorStop('1.0', hexToRgb('#FFFFFF', 0));
+		context.setStrokeStyle(gradient3);
+		context.arc(0, 0, pointerRadius , 0.85* Math.PI, 1.15 * Math.PI, false);
+		context.stroke();
+		context.beginPath();
+		context.setLineWidth(1);
+		context.setStrokeStyle(series[0].color);
+		context.setFillStyle(series[0].color);
+		context.moveTo(-pointerRadius-gaugeOption.width/3/2,-4);
+		context.lineTo(-pointerRadius-gaugeOption.width/3/2-4,0);
+		context.lineTo(-pointerRadius-gaugeOption.width/3/2,4);
+		context.lineTo(-pointerRadius-gaugeOption.width/3/2,-4);
+		context.stroke();
+		context.fill();
+		context.restore();
+		
+	//default百度样式
+	}else{
+		//画背景
+		context.setLineWidth(gaugeOption.width);
+		context.setLineCap('butt');
+		for (let i = 0; i < categories.length; i++) {
+		  let eachCategories = categories[i];
+		  context.beginPath();
+		  context.setStrokeStyle(eachCategories.color);
+		  context.arc(centerPosition.x, centerPosition.y, radius, eachCategories._startAngle_ * Math.PI, eachCategories._endAngle_ *Math.PI, false);
+		  context.stroke();
+		}
+		context.save();
+		
+		//画刻度线
+		totalAngle = gaugeOption.startAngle - gaugeOption.endAngle + 1;
+		let splitAngle = totalAngle / gaugeOption.splitLine.splitNumber;
+		let childAngle = totalAngle / gaugeOption.splitLine.splitNumber / gaugeOption.splitLine.childNumber;
+		let startX = -radius - gaugeOption.width * 0.5 - gaugeOption.splitLine.fixRadius;
+		let endX = -radius - gaugeOption.width * 0.5 - gaugeOption.splitLine.fixRadius + gaugeOption.splitLine.width;
+		let childendX = -radius - gaugeOption.width * 0.5 - gaugeOption.splitLine.fixRadius + gaugeOption.splitLine.childWidth;
+		
+		context.translate(centerPosition.x, centerPosition.y);
+		context.rotate((gaugeOption.startAngle - 1) * Math.PI);
+		
+		for (let i = 0; i < gaugeOption.splitLine.splitNumber + 1; i++) {
+		  context.beginPath();
+		  context.setStrokeStyle(gaugeOption.splitLine.color);
+		  context.setLineWidth(2 * opts.pixelRatio);
+		  context.moveTo(startX, 0);
+		  context.lineTo(endX, 0);
+		  context.stroke();
+		  context.rotate(splitAngle * Math.PI);
+		}
+		context.restore();
+		
+		context.save();
+		context.translate(centerPosition.x, centerPosition.y);
+		context.rotate((gaugeOption.startAngle - 1) * Math.PI);
+		
+		for (let i = 0; i < gaugeOption.splitLine.splitNumber * gaugeOption.splitLine.childNumber + 1; i++) {
+		  context.beginPath();
+		  context.setStrokeStyle(gaugeOption.splitLine.color);
+		  context.setLineWidth(1 * opts.pixelRatio);
+		  context.moveTo(startX, 0);
+		  context.lineTo(childendX, 0);
+		  context.stroke();
+		  context.rotate(childAngle * Math.PI);
+		}
+		context.restore();
+		
+		//画指针
+		series = getGaugeDataPoints(series, categories, gaugeOption, process);
+		
+		for (let i = 0; i < series.length; i++) {
+		  let eachSeries = series[i];
+		  context.save();
+		  context.translate(centerPosition.x, centerPosition.y);
+		  context.rotate((eachSeries._proportion_ - 1) * Math.PI);
+		  context.beginPath();
+		  context.setFillStyle(eachSeries.color);
+		  context.moveTo(gaugeOption.pointer.width, 0);
+		  context.lineTo(0, -gaugeOption.pointer.width / 2);
+		  context.lineTo(-innerRadius, 0);
+		  context.lineTo(0, gaugeOption.pointer.width / 2);
+		  context.lineTo(gaugeOption.pointer.width, 0);
+		  context.closePath();
+		  context.fill();
+		  context.beginPath();
+		  context.setFillStyle('#FFFFFF');
+		  context.arc(0, 0, gaugeOption.pointer.width / 6, 0, 2 * Math.PI, false);
+		  context.fill();
+		  context.restore();
+		}
+		
+		if (opts.dataLabel !== false) {
+		  drawGaugeLabel(gaugeOption, radius, centerPosition, opts, config, context);
+		}
+	}
+	
+	//画仪表盘标题，副标题
+  drawRingTitle(opts, config, context, centerPosition);
+
+  if (process === 1 && opts.type === 'gauge') {
+    opts.extra.gauge.oldAngle = series[0]._proportion_;
+    opts.extra.gauge.oldData = series[0].data;
+  }
+  return {
+    center: centerPosition,
+    radius: radius,
+    innerRadius: innerRadius,
+    categories: categories,
+    totalAngle: totalAngle
+  };
+}
+
+function drawRadarDataPoints(series, opts, config, context) {
+  var process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  var radarOption = assign({},{
+    gridColor: '#cccccc',
+    labelColor: '#666666',
+    opacity: 0.2,
+		gridCount:3
+  },opts.extra.radar);
+  
+  var coordinateAngle = getRadarCoordinateSeries(opts.categories.length);
+  
+  var centerPosition = {
+    x: opts.area[3] + (opts.width - opts.area[1] - opts.area[3]) / 2,
+    y: opts.area[0] + (opts.height - opts.area[0] - opts.area[2]) / 2
+  };
+
+  var radius = Math.min(centerPosition.x - (getMaxTextListLength(opts.categories) + config.radarLabelTextMargin),
+    centerPosition.y - config.radarLabelTextMargin);
+  //TODO逻辑不对
+  radius -= opts.padding[1];
+
+  // draw grid
+  context.beginPath();
+  context.setLineWidth(1 * opts.pixelRatio);
+  context.setStrokeStyle(radarOption.gridColor);
+  coordinateAngle.forEach(function(angle) {
+    var pos = convertCoordinateOrigin(radius * Math.cos(angle), radius * Math.sin(angle), centerPosition);
+    context.moveTo(centerPosition.x, centerPosition.y);
+    context.lineTo(pos.x, pos.y);
+  });
+  context.stroke();
+  context.closePath();
+  // draw split line grid
+
+  var _loop = function _loop(i) {
+    var startPos = {};
+    context.beginPath();
+    context.setLineWidth(1 * opts.pixelRatio);
+    context.setStrokeStyle(radarOption.gridColor);
+    coordinateAngle.forEach(function(angle, index) {
+      var pos = convertCoordinateOrigin(radius / radarOption.gridCount * i * Math.cos(angle), radius / radarOption.gridCount * i * Math.sin(angle), centerPosition);
+      if (index === 0) {
+        startPos = pos;
+        context.moveTo(pos.x, pos.y);
+      } else {
+        context.lineTo(pos.x, pos.y);
+      }
+    });
+    context.lineTo(startPos.x, startPos.y);
+    context.stroke();
+    context.closePath();
+  };
+
+  for (var i = 1; i <= radarOption.gridCount; i++) {
+    _loop(i);
+  }
+
+  var radarDataPoints = getRadarDataPoints(coordinateAngle, centerPosition, radius, series, opts, process);
+
+  radarDataPoints.forEach(function(eachSeries, seriesIndex) {
+    // 绘制区域数据
+    context.beginPath();
+    context.setFillStyle(hexToRgb(eachSeries.color, radarOption.opacity));
+    eachSeries.data.forEach(function(item, index) {
+      if (index === 0) {
+        context.moveTo(item.position.x, item.position.y);
+      } else {
+        context.lineTo(item.position.x, item.position.y);
+      }
+    });
+    context.closePath();
+    context.fill();
+
+    if (opts.dataPointShape !== false) {
+      var points = eachSeries.data.map(function(item) {
+        return item.position;
+      });
+      drawPointShape(points, eachSeries.color, eachSeries.pointShape, context, opts);
+    }
+  });
+  // draw label text
+  drawRadarLabel(coordinateAngle, radius, centerPosition, opts, config, context);
+
+  return {
+    center: centerPosition,
+    radius: radius,
+    angleList: coordinateAngle
+  };
+}
+
+function normalInt(min, max, iter) {
+    iter = iter==0?1:iter;
+    var arr = [];
+    for (var i = 0; i < iter; i++) {
+        arr[i] = Math.random();
+    };
+    return  Math.floor(arr.reduce(function(i,j){return i+j})/iter*(max-min))+min;  
+};
+
+function collisionNew(area,points,width,height){
+    var isIn=false;
+    for(let i=0;i<points.length;i++){
+      if(points[i].area){
+        if(area[3]<points[i].area[1]||area[0]>points[i].area[2]||area[1]>points[i].area[3]||area[2]<points[i].area[0]){
+          if(area[0]<0 || area[1]<0 || area[2]>width || area[3]>height){
+            isIn=true;
+            break;
+          }else{
+            isIn=false;
+          }
+        }else{
+          isIn=true;
+          break;
+        }
+      }
+    }
+    return isIn;
+};
+
+function getBoundingBox(data) {
+  var bounds = {}, coords;
+  bounds.xMin = 180;
+  bounds.xMax = 0;
+  bounds.yMin = 90;
+  bounds.yMax = 0
+  for (var i = 0; i < data.length; i++) {
+      var coorda = data[i].geometry.coordinates
+      for (var k = 0; k < coorda.length; k++) {
+          coords = coorda[k];
+          if (coords.length == 1) {
+              coords = coords[0]
+          }
+          for (var j = 0; j < coords.length; j++) {
+              var longitude = coords[j][0];
+              var latitude = coords[j][1];
+              var point = {
+                  x: longitude, 
+                  y: latitude 
+              }
+              bounds.xMin = bounds.xMin < point.x ? bounds.xMin : point.x;
+              bounds.xMax = bounds.xMax > point.x ? bounds.xMax : point.x;
+              bounds.yMin = bounds.yMin < point.y ? bounds.yMin : point.y;
+              bounds.yMax = bounds.yMax > point.y ? bounds.yMax : point.y;
+          }
+      }
+  }
+  return bounds;
+}
+
+function coordinateToPoint(latitude, longitude,bounds,scale,xoffset,yoffset) {
+  return {
+      x: (longitude - bounds.xMin) * scale+xoffset,
+      y: (bounds.yMax - latitude) * scale+yoffset
+  };
+}
+
+function pointToCoordinate(pointY, pointX,bounds,scale,xoffset,yoffset) {
+  return {
+      x: (pointX-xoffset)/scale+bounds.xMin,
+      y: bounds.yMax - (pointY-yoffset)/scale
+  };
+}
+
+function isRayIntersectsSegment(poi,s_poi,e_poi){
+      if (s_poi[1]==e_poi[1]){return false;} 
+      if (s_poi[1]>poi[1] && e_poi[1]>poi[1]){return false;}
+      if (s_poi[1]<poi[1] && e_poi[1]<poi[1]){return false;}
+      if (s_poi[1]==poi[1] && e_poi[1]>poi[1]){return false;}
+      if (e_poi[1]==poi[1] && s_poi[1]>poi[1]){return false;}
+      if (s_poi[0]<poi[0] && e_poi[1]<poi[1]){return false;}
+      let xseg=e_poi[0]-(e_poi[0]-s_poi[0])*(e_poi[1]-poi[1])/(e_poi[1]-s_poi[1]); 
+      if (xseg<poi[0]){
+        return false;
+      }else{
+        return true;
+      }
+} 
+
+function isPoiWithinPoly(poi,poly){
+  let sinsc=0;
+  for (let i=0;i<poly.length;i++){
+    let epoly=poly[i][0];
+    if (poly.length == 1) {
+      epoly = poly[i][0]
+    }
+    for(let j=0;j<epoly.length-1;j++){
+      let s_poi=epoly[j];
+      let e_poi=epoly[j+1];
+      if (isRayIntersectsSegment(poi,s_poi,e_poi)){
+        sinsc+=1;
+      }
+    }
+  }
+  
+  if(sinsc%2==1){
+    return true;
+  }else{
+    return false;
+  }
+}
+
+
+function drawMapDataPoints(series, opts, config, context) {
+  var mapOption=assign({},{
+    border:true,
+    borderWidth:1,
+    borderColor:'#666666',
+    fillOpacity:0.6,
+    activeBorderColor:'#f04864',
+    activeFillColor:'#facc14',
+    activeFillOpacity:1
+  },opts.extra.map);
+  var coords, point;
+  var data = series;
+  var bounds= getBoundingBox(data);
+  var xScale = opts.width / Math.abs(bounds.xMax - bounds.xMin);
+  var yScale = opts.height / Math.abs(bounds.yMax - bounds.yMin);
+  var scale = xScale < yScale ? xScale : yScale;
+  var xoffset=opts.width/2-Math.abs(bounds.xMax - bounds.xMin)/2*scale;
+  var yoffset=opts.height/2-Math.abs(bounds.yMax - bounds.yMin)/2*scale;
+  context.beginPath();
+  context.clearRect(0, 0, opts.width, opts.height);
+  context.setFillStyle(opts.background||'#FFFFFF');
+  context.rect(0,0,opts.width,opts.height);
+  context.fill();
+  for (var i = 0; i < data.length; i++) {
+    context.beginPath();
+    context.setLineWidth(mapOption.borderWidth * opts.pixelRatio);
+    context.setStrokeStyle(mapOption.borderColor);
+    context.setFillStyle(hexToRgb(series[i].color, mapOption.fillOpacity));
+    if (opts.tooltip) {
+      if (opts.tooltip.index == i ) {
+        context.setStrokeStyle(mapOption.activeBorderColor);
+        context.setFillStyle(hexToRgb(mapOption.activeFillColor, mapOption.activeFillOpacity));
+      }
+    }
+    var coorda = data[i].geometry.coordinates
+    for (var k = 0; k < coorda.length; k++) {
+      coords = coorda[k];
+      if (coords.length == 1) {
+        coords = coords[0]
+      }
+      for (var j = 0; j < coords.length; j++) {
+        point = coordinateToPoint(coords[j][1], coords[j][0],bounds,scale,xoffset,yoffset)
+        if (j === 0) {
+          context.beginPath();
+          context.moveTo(point.x, point.y);
+        } else {
+          context.lineTo(point.x, point.y);
+        }
+      }
+      context.fill();
+      if(mapOption.border == true){
+        context.stroke();
+      }
+    }
+    if(opts.dataLabel == true){
+      var centerPoint = data[i].properties.centroid;
+      if(centerPoint){
+        point = coordinateToPoint(centerPoint[1], centerPoint[0],bounds,scale,xoffset,yoffset);
+        let fontSize=data[i].textSize||config.fontSize;
+        let text=data[i].properties.name;
+        context.beginPath();
+        context.setFontSize(fontSize)
+        context.setFillStyle(data[i].textColor||'#666666')
+        context.fillText(text, point.x-measureText(text,fontSize)/2, point.y+fontSize/2);
+        context.closePath();
+        context.stroke();
+      }
+    }
+  }
+  opts.chartData.mapData={
+    bounds:bounds,
+    scale:scale,
+    xoffset:xoffset,
+    yoffset:yoffset
+  }
+  drawToolTipBridge(opts, config, context,1);
+  context.draw();
+}
+
+function getWordCloudPoint(opts,type){
+  let points = opts.series.sort(function(a,b){return parseInt(b.textSize)-parseInt(a.textSize);});
+  switch (type) {
+    case 'normal':
+      for (let i = 0; i < points.length; i++) {
+        let text = points[i].name;
+        let tHeight = points[i].textSize;
+        let tWidth = measureText(text,tHeight);
+        let x,y;
+        let area;
+        let breaknum=0;
+        while(true) {
+            breaknum++;
+            x = normalInt(-opts.width/2, opts.width/2,5) - tWidth/2;
+            y = normalInt(-opts.height/2, opts.height/2,5) + tHeight/2;
+            area=[x-5+opts.width/2,y-5-tHeight+opts.height/2,x+tWidth+5+opts.width/2,y+5+opts.height/2];
+            let isCollision = collisionNew(area,points,opts.width,opts.height);
+            if (!isCollision) break;
+            if (breaknum==1000){
+              area=[-100,-100,-100,-100];
+              break;
+            }
+        };
+        points[i].area=area;
+      }
+    break;
+    case 'vertical':
+      function Spin(){
+        //获取均匀随机值，是否旋转，旋转的概率为（1-0.5）
+        if (Math.random()>0.7) {
+            return true;
+        }else {return false};
+      };
+      for (let i = 0; i < points.length; i++) { 
+        let text = points[i].name;
+        let tHeight = points[i].textSize;
+        let tWidth = measureText(text,tHeight);
+        let isSpin = Spin(); 
+        let x,y,area,areav;
+        let breaknum=0;
+        while(true) {
+          breaknum++;
+          let isCollision;
+          if (isSpin) {
+              x = normalInt(-opts.width/2, opts.width/2,5) - tWidth/2;
+              y = normalInt(-opts.height/2, opts.height/2,5)+tHeight/2;
+              area=[y-5-tWidth+opts.width/2,(-x-5+opts.height/2),y+5+opts.width/2,(-x+tHeight+5+opts.height/2)];
+              areav=[opts.width-(opts.width/2-opts.height/2)-(-x+tHeight+5+opts.height/2)-5,(opts.height/2-opts.width/2)+(y-5-tWidth+opts.width/2)-5,opts.width-(opts.width/2-opts.height/2)-(-x+tHeight+5+opts.height/2)+tHeight,(opts.height/2-opts.width/2)+(y-5-tWidth+opts.width/2)+tWidth+5];
+              isCollision = collisionNew(areav,points,opts.height,opts.width);
+          }else{
+            x = normalInt(-opts.width/2, opts.width/2,5) - tWidth/2;
+            y = normalInt(-opts.height/2, opts.height/2,5)+tHeight/2;
+            area=[x-5+opts.width/2,y-5-tHeight+opts.height/2,x+tWidth+5+opts.width/2,y+5+opts.height/2];
+            isCollision = collisionNew(area,points,opts.width,opts.height);
+          } 
+          if (!isCollision) break;
+          if (breaknum==1000){
+            area=[-1000,-1000,-1000,-1000];
+            break;
+          }
+        };
+        if (isSpin) {
+          points[i].area=areav;
+          points[i].areav=area;
+        }else{
+          points[i].area=area;
+        }
+        points[i].rotate=isSpin;
+      };
+    break;
+  }
+  return points;
+}
+
+
+function drawWordCloudDataPoints(series, opts, config, context) {
+  let process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  let wordOption = assign({},{
+    type: 'normal',
+    autoColors: true
+  },opts.extra.word);
+  
+  context.beginPath();
+  context.setFillStyle(opts.background||'#FFFFFF');
+  context.rect(0,0,opts.width,opts.height);
+  context.fill();
+  context.save();
+  let points = opts.chartData.wordCloudData;
+  context.translate(opts.width/2,opts.height/2);
+  
+  for(let i=0;i<points.length;i++){
+      context.save();
+      if(points[i].rotate){
+        context.rotate(90 * Math.PI / 180);
+      }
+      let text = points[i].name;
+      let tHeight = points[i].textSize;
+      let tWidth = measureText(text,tHeight);
+      context.beginPath();
+      context.setStrokeStyle(points[i].color);
+      context.setFillStyle(points[i].color);
+      context.setFontSize(tHeight);
+      if(points[i].rotate){
+        if(points[i].areav[0]>0){
+          if (opts.tooltip) {
+            if (opts.tooltip.index == i) {
+              context.strokeText(text,(points[i].areav[0]+5-opts.width/2)*process-tWidth*(1-process)/2,(points[i].areav[1]+5+tHeight-opts.height/2)*process);
+              }else{
+                context.fillText(text,(points[i].areav[0]+5-opts.width/2)*process-tWidth*(1-process)/2,(points[i].areav[1]+5+tHeight-opts.height/2)*process);
+              }
+          }else{
+            context.fillText(text,(points[i].areav[0]+5-opts.width/2)*process-tWidth*(1-process)/2,(points[i].areav[1]+5+tHeight-opts.height/2)*process);
+          } 
+        }
+      }else{
+        if(points[i].area[0]>0){
+          if (opts.tooltip) {
+            if (opts.tooltip.index == i) {
+              context.strokeText(text,(points[i].area[0]+5-opts.width/2)*process-tWidth*(1-process)/2,(points[i].area[1]+5+tHeight-opts.height/2)*process);
+            }else{
+              context.fillText(text,(points[i].area[0]+5-opts.width/2)*process-tWidth*(1-process)/2,(points[i].area[1]+5+tHeight-opts.height/2)*process);
+            }
+          }else{
+            context.fillText(text,(points[i].area[0]+5-opts.width/2)*process-tWidth*(1-process)/2,(points[i].area[1]+5+tHeight-opts.height/2)*process);
+          }
+            
+        }
+      }
+      
+      context.stroke();
+      context.restore();
+  }
+  context.restore();
+}
+
+function drawFunnelDataPoints(series, opts, config, context) {
+  let process = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 1;
+  let funnelOption = assign({},{
+    activeWidth:10,
+    activeOpacity:0.3,
+    border:false,
+    borderWidth:2,
+    borderColor:'#FFFFFF',
+    fillOpacity:1,
+    labelAlign:'right'
+  },opts.extra.funnel);
+  let eachSpacing = (opts.height - opts.area[0] - opts.area[2])/series.length;
+  let centerPosition = {
+    x: opts.area[3] + (opts.width - opts.area[1] - opts.area[3]) / 2,
+    y: opts.height-opts.area[2]
+  };
+  let activeWidth = funnelOption.activeWidth;
+  let radius = Math.min((opts.width - opts.area[1] - opts.area[3]) / 2 - activeWidth, (opts.height - opts.area[0] - opts.area[2]) / 2 - activeWidth);
+  series = getFunnelDataPoints(series, radius, process);
+  context.save();
+  context.translate(centerPosition.x,centerPosition.y);
+  for(let i=0;i<series.length;i++){
+    if(i==0){
+      if (opts.tooltip) {
+        if (opts.tooltip.index == i) {
+          context.beginPath();
+          context.setFillStyle(hexToRgb(series[i].color, funnelOption.activeOpacity));
+          context.moveTo(-activeWidth, 0);
+          context.lineTo(-series[i].radius-activeWidth, -eachSpacing);
+          context.lineTo(series[i].radius+activeWidth, -eachSpacing);
+          context.lineTo(activeWidth, 0);
+          context.lineTo(-activeWidth, 0);
+          context.closePath();
+          context.fill();
+        }
+      }
+      series[i].funnelArea=[centerPosition.x-series[i].radius,centerPosition.y-eachSpacing,centerPosition.x+series[i].radius,centerPosition.y];
+      context.beginPath();
+      context.setLineWidth(funnelOption.borderWidth * opts.pixelRatio);
+      context.setStrokeStyle(funnelOption.borderColor);
+      context.setFillStyle(hexToRgb(series[i].color, funnelOption.fillOpacity));
+      context.moveTo(0, 0);
+      context.lineTo(-series[i].radius, -eachSpacing);
+      context.lineTo(series[i].radius, -eachSpacing);
+      context.lineTo(0, 0);
+      context.closePath();
+      context.fill();
+      if(funnelOption.border == true){
+        context.stroke();
+      }
+    }else{
+      if (opts.tooltip) {
+        if (opts.tooltip.index == i) {
+          context.beginPath();
+          context.setFillStyle(hexToRgb(series[i].color, funnelOption.activeOpacity));
+          context.moveTo(0, 0);
+          context.lineTo(-series[i-1].radius-activeWidth, 0);
+          context.lineTo(-series[i].radius-activeWidth, -eachSpacing);
+          context.lineTo(series[i].radius+activeWidth, -eachSpacing);
+          context.lineTo(series[i-1].radius+activeWidth, 0);
+          context.lineTo(0, 0);
+          context.closePath();
+          context.fill();
+        }
+      }
+      series[i].funnelArea=[centerPosition.x-series[i].radius,centerPosition.y-eachSpacing*(i+1),centerPosition.x+series[i].radius,centerPosition.y-eachSpacing*i];
+      context.beginPath();
+      context.setLineWidth(funnelOption.borderWidth * opts.pixelRatio);
+      context.setStrokeStyle(funnelOption.borderColor);
+      context.setFillStyle(hexToRgb(series[i].color, funnelOption.fillOpacity));
+      context.moveTo(0, 0);
+      context.lineTo(-series[i-1].radius, 0);
+      context.lineTo(-series[i].radius, -eachSpacing);
+      context.lineTo(series[i].radius, -eachSpacing);
+      context.lineTo(series[i-1].radius, 0);
+      context.lineTo(0, 0);
+      context.closePath();
+      context.fill();
+      if(funnelOption.border == true){
+        context.stroke();
+      }
+    }
+    context.translate(0,-eachSpacing)
+  }
+  context.restore();
+  
+  if (opts.dataLabel !== false && process === 1) {
+    drawFunnelText(series, opts, context, eachSpacing, funnelOption.labelAlign, activeWidth, centerPosition);
+  }
+  
+  return {
+    center: centerPosition,
+    radius: radius,
+    series: series
+  };
+}
+
+function drawFunnelText(series, opts, context, eachSpacing, labelAlign,activeWidth, centerPosition){
+  for(let i=0;i<series.length;i++){
+    let item = series[i];
+    let startX,endX,startY,fontSize;
+    let text = item.format ? item.format(+item._proportion_.toFixed(2)) : util.toFixed(item._proportion_ * 100) +'%';
+    if(labelAlign == 'right'){
+      if(i==0){
+        startX=(item.funnelArea[2]+centerPosition.x)/2;
+      }else{
+        startX=(item.funnelArea[2]+series[i-1].funnelArea[2])/2;
+      }
+      endX=startX+activeWidth*2;
+      startY=item.funnelArea[1]+eachSpacing/2;
+      fontSize = item.textSize || opts.fontSize;
+      context.setLineWidth(1 * opts.pixelRatio);
+      context.setStrokeStyle(item.color);
+      context.setFillStyle(item.color);
+      context.beginPath();
+      context.moveTo(startX,startY );
+      context.lineTo(endX,startY);
+      context.stroke();
+      context.closePath();
+      context.beginPath();
+      context.moveTo(endX, startY);
+      context.arc(endX, startY, 2, 0, 2 * Math.PI);
+      context.closePath();
+      context.fill();
+      context.beginPath();
+      context.setFontSize(fontSize);
+      context.setFillStyle(item.textColor || '#666666');
+      context.fillText(text, endX+5, startY + fontSize/2 -2);
+      context.closePath();
+      context.stroke();
+      context.closePath();
+    }else{
+      if(i==0){
+        startX=(item.funnelArea[0]+centerPosition.x)/2;
+      }else{
+        startX=(item.funnelArea[0]+series[i-1].funnelArea[0])/2;
+      }
+      endX=startX-activeWidth*2;
+      startY=item.funnelArea[1]+eachSpacing/2;
+      fontSize = item.textSize || opts.fontSize;
+      context.setLineWidth(1 * opts.pixelRatio);
+      context.setStrokeStyle(item.color);
+      context.setFillStyle(item.color);
+      context.beginPath();
+      context.moveTo(startX,startY );
+      context.lineTo(endX,startY);
+      context.stroke();
+      context.closePath();
+      context.beginPath();
+      context.moveTo(endX, startY);
+      context.arc(endX, startY, 2, 0, 2 * Math.PI);
+      context.closePath();
+      context.fill();
+      context.beginPath();
+      context.setFontSize(fontSize);
+      context.setFillStyle(item.textColor || '#666666');
+      context.fillText(text, endX-5-measureText(text), startY + fontSize/2 -2);
+      context.closePath();
+      context.stroke();
+      context.closePath();
+    }
+    
+  }
+}
+
+
+function drawCanvas(opts, context) {
+  context.draw();
+}
+
+var Timing = {
+  easeIn: function easeIn(pos) {
+    return Math.pow(pos, 3);
+  },
+  easeOut: function easeOut(pos) {
+    return Math.pow(pos - 1, 3) + 1;
+  },
+  easeInOut: function easeInOut(pos) {
+    if ((pos /= 0.5) < 1) {
+      return 0.5 * Math.pow(pos, 3);
+    } else {
+      return 0.5 * (Math.pow(pos - 2, 3) + 2);
+    }
+  },
+  linear: function linear(pos) {
+    return pos;
+  }
+};
+
+function Animation(opts) {
+  this.isStop = false;
+  opts.duration = typeof opts.duration === 'undefined' ? 1000 : opts.duration;
+  opts.timing = opts.timing || 'linear';
+  var delay = 17;
+
+  function createAnimationFrame() {
+    if (typeof setTimeout !== 'undefined') {
+      return function(step, delay) {
+        setTimeout(function() {
+          var timeStamp = +new Date();
+          step(timeStamp);
+        }, delay);
+      };
+    } else if (typeof requestAnimationFrame !== 'undefined') {
+      return requestAnimationFrame;
+    } else {
+      return function(step) {
+        step(null);
+      };
+    }
+  };
+  var animationFrame = createAnimationFrame();
+  var startTimeStamp = null;
+  var _step = function step(timestamp) {
+    if (timestamp === null || this.isStop === true) {
+      opts.onProcess && opts.onProcess(1);
+      opts.onAnimationFinish && opts.onAnimationFinish();
+      return;
+    }
+    if (startTimeStamp === null) {
+      startTimeStamp = timestamp;
+    }
+    if (timestamp - startTimeStamp < opts.duration) {
+      var process = (timestamp - startTimeStamp) / opts.duration;
+      var timingFunction = Timing[opts.timing];
+      process = timingFunction(process);
+
+      opts.onProcess && opts.onProcess(process);
+      animationFrame(_step, delay);
+    } else {
+      opts.onProcess && opts.onProcess(1);
+      opts.onAnimationFinish && opts.onAnimationFinish();
+    }
+  };
+  _step = _step.bind(this);
+  animationFrame(_step, delay);
+}
+
+// stop animation immediately
+// and tigger onAnimationFinish
+Animation.prototype.stop = function() {
+  this.isStop = true;
+};
+
+function drawCharts(type, opts, config, context) {
+  var _this = this;
+  var series = opts.series;
+  var categories = opts.categories;
+  series = fillSeries(series, opts, config);
+  var duration = opts.animation ? opts.duration : 0;
+  _this.animationInstance && _this.animationInstance.stop();
+  var seriesMA = null;
+  if (type == 'candle') {
+    let average = assign({}, opts.extra.candle.average);
+    if (average.show) {
+      seriesMA = calCandleMA(average.day, average.name, average.color, series[0].data);
+      seriesMA = fillSeries(seriesMA, opts, config);
+      opts.seriesMA = seriesMA;
+    } else if (opts.seriesMA) {
+      seriesMA = opts.seriesMA = fillSeries(opts.seriesMA, opts, config);
+    } else {
+      seriesMA = series;
+    }
+  } else {
+    seriesMA = series;
+  }
+
+  /* 过滤掉show=false的series */
+  opts._series_ = series = filterSeries(series);
+
+  //重新计算图表区域
+
+  opts.area = new Array(4);
+  //复位绘图区域
+  for (let j = 0; j < 4; j++) {
+    opts.area[j] = opts.padding[j];
+  }
+
+  //通过计算三大区域：图例、X轴、Y轴的大小，确定绘图区域
+  var _calLegendData = calLegendData(seriesMA, opts, config, opts.chartData),
+    legendHeight = _calLegendData.area.wholeHeight,
+    legendWidth = _calLegendData.area.wholeWidth;
+    
+  switch (opts.legend.position) {
+    case 'top':
+      opts.area[0] += legendHeight;
+      break;
+    case 'bottom':
+      opts.area[2] += legendHeight;
+      break;
+    case 'left':
+      opts.area[3] += legendWidth;
+      break;
+    case 'right':
+      opts.area[1] += legendWidth;
+      break;
+  }
+
+  let _calYAxisData = {},yAxisWidth = 0;
+  if (opts.type === 'line' || opts.type === 'column' || opts.type === 'area' || opts.type === 'mix' || opts.type === 'candle') {
+    _calYAxisData = calYAxisData(series, opts, config);
+    yAxisWidth = _calYAxisData.yAxisWidth;
+    //如果显示Y轴标题
+    if(opts.yAxis.showTitle){
+      let maxTitleHeight=0;
+      for(let i=0;i<opts.yAxis.data.length;i++){
+        maxTitleHeight = Math.max(maxTitleHeight,opts.yAxis.data[i].titleFontSize?opts.yAxis.data[i].titleFontSize:config.fontSize)
+      }
+      opts.area[0] += (maxTitleHeight+6)*opts.pixelRatio;
+    }
+    let rightIndex=0,leftIndex=0;
+    //计算主绘图区域左右位置
+    for(let i=0;i<yAxisWidth.length;i++){
+      if(yAxisWidth[i].position=='left'){
+        if(leftIndex>0){
+          opts.area[3] += yAxisWidth[i].width + opts.yAxis.padding;
+        }else{
+          opts.area[3] += yAxisWidth[i].width;
+        }
+        leftIndex +=1;
+      }else{
+        if(rightIndex>0){
+          opts.area[1] += yAxisWidth[i].width + opts.yAxis.padding;
+        }else{
+          opts.area[1] += yAxisWidth[i].width;
+        }
+        rightIndex +=1;
+      }
+    }
+  }else{
+    config.yAxisWidth = yAxisWidth;
+  }
+  opts.chartData.yAxisData = _calYAxisData;
+
+  if (opts.categories && opts.categories.length) {
+    opts.chartData.xAxisData = getXAxisPoints(opts.categories, opts, config);
+    let _calCategoriesData = calCategoriesData(opts.categories, opts, config, opts.chartData.xAxisData.eachSpacing),
+      xAxisHeight = _calCategoriesData.xAxisHeight,
+      angle = _calCategoriesData.angle;
+    config.xAxisHeight = xAxisHeight;
+    config._xAxisTextAngle_ = angle;
+    opts.area[2] += xAxisHeight;
+    opts.chartData.categoriesData = _calCategoriesData;
+  }else{
+		if (opts.type === 'line' || opts.type === 'area' || opts.type === 'points') {
+			opts.chartData.xAxisData = calXAxisData(series, opts, config);
+			categories=opts.chartData.xAxisData.rangesFormat;
+			let _calCategoriesData = calCategoriesData(categories, opts, config, opts.chartData.xAxisData.eachSpacing),
+			  xAxisHeight = _calCategoriesData.xAxisHeight,
+			  angle = _calCategoriesData.angle;
+			config.xAxisHeight = xAxisHeight;
+			config._xAxisTextAngle_ = angle;
+			opts.area[2] += xAxisHeight;
+			opts.chartData.categoriesData = _calCategoriesData;
+		}else{
+			opts.chartData.xAxisData={
+				xAxisPoints: []
+			};
+		}
+	}
+  //计算右对齐偏移距离
+  if (opts.enableScroll && opts.xAxis.scrollAlign == 'right' && opts._scrollDistance_ === undefined) {
+    let offsetLeft = 0,
+      xAxisPoints = opts.chartData.xAxisData.xAxisPoints,
+      startX = opts.chartData.xAxisData.startX,
+      endX = opts.chartData.xAxisData.endX,
+      eachSpacing = opts.chartData.xAxisData.eachSpacing;
+    let totalWidth = eachSpacing * (xAxisPoints.length - 1);
+    let screenWidth = endX - startX;
+    offsetLeft = screenWidth - totalWidth;
+    _this.scrollOption = {
+      currentOffset: offsetLeft,
+      startTouchX: offsetLeft,
+      distance: 0,
+      lastMoveTime: 0
+    };
+    opts._scrollDistance_ = offsetLeft;
+  }
+
+  if (type === 'pie' || type === 'ring' || type === 'rose') {
+    config._pieTextMaxLength_ = opts.dataLabel === false ? 0 : getPieTextMaxLength(seriesMA);
+  }
+
+  switch (type) {
+    case 'word':
+      let wordOption = assign({},{
+        type: 'normal',
+        autoColors: true
+      },opts.extra.word);
+      if(opts.updateData==true || opts.updateData==undefined){
+        opts.chartData.wordCloudData=getWordCloudPoint(opts,wordOption.type);
+      }
+      this.animationInstance = new Animation({
+        timing: 'easeInOut',
+        duration: duration,
+        onProcess: function(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          drawWordCloudDataPoints(series, opts, config, context,process);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+    break;
+    case 'map':
+      context.clearRect(0, 0, opts.width, opts.height);
+      drawMapDataPoints(series, opts, config, context);
+    break;
+    case 'funnel':
+      this.animationInstance = new Animation({
+        timing: 'easeInOut',
+        duration: duration,
+        onProcess: function(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          opts.chartData.funnelData = drawFunnelDataPoints(series, opts, config, context, process);
+          drawLegend(opts.series, opts, config, context, opts.chartData);
+          drawToolTipBridge(opts, config, context, process);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+    break;
+    case 'line':
+      this.animationInstance = new Animation({
+        timing: 'easeIn',
+        duration: duration,
+        onProcess: function onProcess(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          drawYAxisGrid(categories, opts, config, context);
+          drawXAxis(categories, opts, config, context);
+          var _drawLineDataPoints = drawLineDataPoints(series, opts, config, context, process),
+            xAxisPoints = _drawLineDataPoints.xAxisPoints,
+            calPoints = _drawLineDataPoints.calPoints,
+            eachSpacing = _drawLineDataPoints.eachSpacing;
+          opts.chartData.xAxisPoints = xAxisPoints;
+          opts.chartData.calPoints = calPoints;
+          opts.chartData.eachSpacing = eachSpacing;
+          drawYAxis(series, opts, config, context);
+          if (opts.enableMarkLine !== false && process === 1) {
+            drawMarkLine(opts, config, context);
+          }
+          drawLegend(opts.series, opts, config, context, opts.chartData);
+          drawToolTipBridge(opts, config, context, process, eachSpacing, xAxisPoints);
+          drawCanvas(opts, context);
+
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+      break;
+    case 'mix':
+      this.animationInstance = new Animation({
+        timing: 'easeIn',
+        duration: duration,
+        onProcess: function onProcess(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          drawYAxisGrid(categories, opts, config, context);
+          drawXAxis(categories, opts, config, context);
+          var _drawMixDataPoints = drawMixDataPoints(series, opts, config, context, process),
+            xAxisPoints = _drawMixDataPoints.xAxisPoints,
+            calPoints = _drawMixDataPoints.calPoints,
+            eachSpacing = _drawMixDataPoints.eachSpacing;
+          opts.chartData.xAxisPoints = xAxisPoints;
+          opts.chartData.calPoints = calPoints;
+          opts.chartData.eachSpacing = eachSpacing;
+          drawYAxis(series, opts, config, context);
+          if (opts.enableMarkLine !== false && process === 1) {
+            drawMarkLine(opts, config, context);
+          }
+          drawLegend(opts.series, opts, config, context, opts.chartData);
+          drawToolTipBridge(opts, config, context, process, eachSpacing, xAxisPoints);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+      break;
+    case 'column':
+      this.animationInstance = new Animation({
+        timing: 'easeIn',
+        duration: duration,
+        onProcess: function onProcess(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          drawYAxisGrid(categories, opts, config, context);
+          drawXAxis(categories, opts, config, context);
+          var _drawColumnDataPoints = drawColumnDataPoints(series, opts, config, context, process),
+            xAxisPoints = _drawColumnDataPoints.xAxisPoints,
+            calPoints = _drawColumnDataPoints.calPoints,
+            eachSpacing = _drawColumnDataPoints.eachSpacing;
+          opts.chartData.xAxisPoints = xAxisPoints;
+          opts.chartData.calPoints = calPoints;
+          opts.chartData.eachSpacing = eachSpacing;
+          drawYAxis(series, opts, config, context);
+          if (opts.enableMarkLine !== false && process === 1) {
+            drawMarkLine(opts, config, context);
+          }
+          drawLegend(opts.series, opts, config, context, opts.chartData);
+          drawToolTipBridge(opts, config, context, process, eachSpacing, xAxisPoints);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+      break;
+    case 'area':
+      this.animationInstance = new Animation({
+        timing: 'easeIn',
+        duration: duration,
+        onProcess: function onProcess(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          drawYAxisGrid(categories, opts, config, context);
+          drawXAxis(categories, opts, config, context);
+          var _drawAreaDataPoints = drawAreaDataPoints(series, opts, config, context, process),
+            xAxisPoints = _drawAreaDataPoints.xAxisPoints,
+            calPoints = _drawAreaDataPoints.calPoints,
+            eachSpacing = _drawAreaDataPoints.eachSpacing;
+          opts.chartData.xAxisPoints = xAxisPoints;
+          opts.chartData.calPoints = calPoints;
+          opts.chartData.eachSpacing = eachSpacing;
+          drawYAxis(series, opts, config, context);
+          if (opts.enableMarkLine !== false && process === 1) {
+            drawMarkLine(opts, config, context);
+          }
+          drawLegend(opts.series, opts, config, context, opts.chartData);
+          drawToolTipBridge(opts, config, context, process, eachSpacing, xAxisPoints);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+      break;
+    case 'ring':
+    case 'pie':
+      this.animationInstance = new Animation({
+        timing: 'easeInOut',
+        duration: duration,
+        onProcess: function onProcess(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          opts.chartData.pieData = drawPieDataPoints(series, opts, config, context, process);
+          drawLegend(opts.series, opts, config, context, opts.chartData);
+          drawToolTipBridge(opts, config, context, process);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+      break;
+    case 'rose':
+      this.animationInstance = new Animation({
+        timing: 'easeInOut',
+        duration: duration,
+        onProcess: function onProcess(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          opts.chartData.pieData = drawRoseDataPoints(series, opts, config, context, process);
+          drawLegend(opts.series, opts, config, context, opts.chartData);
+          drawToolTipBridge(opts, config, context, process);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+      break;
+    case 'radar':
+      this.animationInstance = new Animation({
+        timing: 'easeInOut',
+        duration: duration,
+        onProcess: function onProcess(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          opts.chartData.radarData = drawRadarDataPoints(series, opts, config, context, process);
+          drawLegend(opts.series, opts, config, context, opts.chartData);
+          drawToolTipBridge(opts, config, context, process);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+      break;
+    case 'arcbar':
+      this.animationInstance = new Animation({
+        timing: 'easeInOut',
+        duration: duration,
+        onProcess: function onProcess(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          opts.chartData.arcbarData = drawArcbarDataPoints(series, opts, config, context, process);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+      break;
+    case 'gauge':
+      this.animationInstance = new Animation({
+        timing: 'easeInOut',
+        duration: duration,
+        onProcess: function onProcess(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          opts.chartData.gaugeData = drawGaugeDataPoints(categories, series, opts, config, context, process);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+      break;
+    case 'candle':
+      this.animationInstance = new Animation({
+        timing: 'easeIn',
+        duration: duration,
+        onProcess: function onProcess(process) {
+          context.clearRect(0, 0, opts.width, opts.height);
+          if (opts.rotate) {
+            contextRotate(context, opts);
+          }
+          drawYAxisGrid(categories, opts, config, context);
+          drawXAxis(categories, opts, config, context);
+          var _drawCandleDataPoints = drawCandleDataPoints(series, seriesMA, opts, config, context, process),
+            xAxisPoints = _drawCandleDataPoints.xAxisPoints,
+            calPoints = _drawCandleDataPoints.calPoints,
+            eachSpacing = _drawCandleDataPoints.eachSpacing;
+          opts.chartData.xAxisPoints = xAxisPoints;
+          opts.chartData.calPoints = calPoints;
+          opts.chartData.eachSpacing = eachSpacing;
+          drawYAxis(series, opts, config, context);
+          if (opts.enableMarkLine !== false && process === 1) {
+            drawMarkLine(opts, config, context);
+          }
+          if (seriesMA) {
+            drawLegend(seriesMA, opts, config, context, opts.chartData);
+          } else {
+            drawLegend(opts.series, opts, config, context, opts.chartData);
+          }
+          drawToolTipBridge(opts, config, context, process, eachSpacing, xAxisPoints);
+          drawCanvas(opts, context);
+        },
+        onAnimationFinish: function onAnimationFinish() {
+          _this.event.trigger('renderComplete');
+        }
+      });
+      break;
+  }
+}
+
+// simple event implement
+
+function Event() {
+  this.events = {};
+}
+
+Event.prototype.addEventListener = function(type, listener) {
+  this.events[type] = this.events[type] || [];
+  this.events[type].push(listener);
+};
+
+Event.prototype.trigger = function() {
+  for (var _len = arguments.length, args = Array(_len), _key = 0; _key < _len; _key++) {
+    args[_key] = arguments[_key];
+  }
+
+  var type = args[0];
+  var params = args.slice(1);
+  if (!!this.events[type]) {
+    this.events[type].forEach(function(listener) {
+      try {
+        listener.apply(null, params);
+      } catch (e) {
+        console.error(e);
+      }
+    });
+  }
+};
+
+var Charts = function Charts(opts) {
+  opts.pixelRatio = opts.pixelRatio ? opts.pixelRatio : 1;
+  opts.fontSize = opts.fontSize ? opts.fontSize * opts.pixelRatio : 13 * opts.pixelRatio;
+  opts.title = assign({}, opts.title);
+  opts.subtitle = assign({}, opts.subtitle);
+  opts.duration = opts.duration ? opts.duration : 1000;
+  opts.yAxis = assign({}, {
+    data:[],
+    showTitle:false,
+    disabled:false,
+    disableGrid:false,
+    splitNumber:5,
+    gridType: 'solid',
+    dashLength: 4 * opts.pixelRatio,
+    gridColor:'#cccccc',
+    padding:10,
+    fontColor:'#666666'
+  }, opts.yAxis);
+  opts.yAxis.dashLength *= opts.pixelRatio;
+  opts.yAxis.padding *= opts.pixelRatio;
+  opts.xAxis = assign({}, {
+    rotateLabel: false,
+    type: 'calibration',
+    gridType: 'solid',
+    dashLength: 4,
+    scrollAlign: 'left',
+    boundaryGap:'center',
+    axisLine:true,
+    axisLineColor:'#cccccc'
+  }, opts.xAxis);
+  opts.xAxis.dashLength *= opts.pixelRatio;
+  opts.legend = assign({}, {
+    show: true,
+    position: 'bottom',
+    float: 'center',
+    backgroundColor: 'rgba(0,0,0,0)',
+    borderColor: 'rgba(0,0,0,0)',
+    borderWidth: 0,
+    padding: 5,
+    margin: 5,
+    itemGap: 10,
+    fontSize: opts.fontSize,
+    lineHeight: opts.fontSize,
+    fontColor: '#333333',
+    format: {},
+    hiddenColor: '#CECECE'
+  }, opts.legend);
+  opts.legend.borderWidth = opts.legend.borderWidth * opts.pixelRatio;
+  opts.legend.itemGap = opts.legend.itemGap * opts.pixelRatio;
+  opts.legend.padding = opts.legend.padding * opts.pixelRatio;
+  opts.legend.margin = opts.legend.margin * opts.pixelRatio;
+  opts.extra = assign({}, opts.extra);
+  opts.rotate = opts.rotate ? true : false;
+  opts.animation = opts.animation ? true : false;
+	opts.rotate = opts.rotate ? true : false;
+	opts.canvas2d = opts.canvas2d ? true : false;
+
+  let config$$1 = JSON.parse(JSON.stringify(config));
+  config$$1.colors = opts.colors ? opts.colors : config$$1.colors;
+  config$$1.yAxisTitleWidth = opts.yAxis.disabled !== true && opts.yAxis.title ? config$$1.yAxisTitleWidth : 0;
+  if (opts.type == 'pie' || opts.type == 'ring') {
+    config$$1.pieChartLinePadding = opts.dataLabel === false ? 0 : opts.extra.pie.labelWidth * opts.pixelRatio || config$$1.pieChartLinePadding * opts.pixelRatio;
+  }
+  if (opts.type == 'rose') {
+    config$$1.pieChartLinePadding = opts.dataLabel === false ? 0 : opts.extra.rose.labelWidth * opts.pixelRatio || config$$1.pieChartLinePadding * opts.pixelRatio;
+  }
+  config$$1.pieChartTextPadding = opts.dataLabel === false ? 0 : config$$1.pieChartTextPadding * opts.pixelRatio;
+  config$$1.yAxisSplit = opts.yAxis.splitNumber ? opts.yAxis.splitNumber : config.yAxisSplit;
+
+  //屏幕旋转
+  config$$1.rotate = opts.rotate;
+  if (opts.rotate) {
+    let tempWidth = opts.width;
+    let tempHeight = opts.height;
+    opts.width = tempHeight;
+    opts.height = tempWidth;
+  }
+
+  //适配高分屏
+  opts.padding = opts.padding ? opts.padding : config$$1.padding;
+  for (let i = 0; i < 4; i++) {
+    opts.padding[i] *= opts.pixelRatio;
+  }
+  config$$1.yAxisWidth = config.yAxisWidth * opts.pixelRatio;
+  config$$1.xAxisHeight = config.xAxisHeight * opts.pixelRatio;
+  if (opts.enableScroll && opts.xAxis.scrollShow) {
+    config$$1.xAxisHeight += 6 * opts.pixelRatio;
+  }
+  config$$1.xAxisLineHeight = config.xAxisLineHeight * opts.pixelRatio;
+  config$$1.fontSize = opts.fontSize;
+  config$$1.titleFontSize = config.titleFontSize * opts.pixelRatio;
+  config$$1.subtitleFontSize = config.subtitleFontSize * opts.pixelRatio;
+  config$$1.toolTipPadding = config.toolTipPadding * opts.pixelRatio;
+  config$$1.toolTipLineHeight = config.toolTipLineHeight * opts.pixelRatio;
+  config$$1.columePadding = config.columePadding * opts.pixelRatio;
+  opts.$this = opts.$this ? opts.$this : this;
+  
+  this.context = opts.context ? opts.context : uni.createCanvasContext(opts.canvasId, opts.$this);
+	
+	if(opts.canvas2d){
+		this.context.setStrokeStyle = function(e){ return this.strokeStyle=e; }
+		this.context.setLineWidth = function(e){ return this.lineWidth=e; }
+		this.context.setLineCap = function(e){ return this.lineCap=e; }
+		this.context.setFontSize = function(e){ return this.font=e+"px sans-serif"; }
+		this.context.setFillStyle = function(e){ return this.fillStyle=e; }
+		this.context.draw = function(){ }
+	}
+  /* 兼容原生H5
+  this.context = document.getElementById(opts.canvasId).getContext("2d");
+  this.context.setStrokeStyle = function(e){ return this.strokeStyle=e; }
+  this.context.setLineWidth = function(e){ return this.lineWidth=e; }
+  this.context.setLineCap = function(e){ return this.lineCap=e; }
+  this.context.setFontSize = function(e){ return this.font=e+"px sans-serif"; }
+  this.context.setFillStyle = function(e){ return this.fillStyle=e; }
+  this.context.draw = function(){ }
+  */
+
+  opts.chartData = {};
+  this.event = new Event();
+  this.scrollOption = {
+    currentOffset: 0,
+    startTouchX: 0,
+    distance: 0,
+    lastMoveTime: 0
+  };
+
+  this.opts = opts;
+  this.config = config$$1;
+
+  drawCharts.call(this, opts.type, opts, config$$1, this.context);
+};
+
+Charts.prototype.updateData = function() {
+  let data = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+  this.opts = assign({}, this.opts, data);
+  this.opts.updateData = true;
+  let scrollPosition = data.scrollPosition || 'current';
+  switch (scrollPosition) {
+    case 'current':
+      this.opts._scrollDistance_ = this.scrollOption.currentOffset;
+      break;
+    case 'left':
+      this.opts._scrollDistance_ = 0;
+      this.scrollOption = {
+        currentOffset: 0,
+        startTouchX: 0,
+        distance: 0,
+        lastMoveTime: 0
+      };
+      break;
+    case 'right':
+      let _calYAxisData = calYAxisData(this.opts.series, this.opts, this.config),
+        yAxisWidth = _calYAxisData.yAxisWidth;
+      this.config.yAxisWidth = yAxisWidth;
+      let offsetLeft = 0;
+      let _getXAxisPoints0 = getXAxisPoints(this.opts.categories, this.opts, this.config),
+        xAxisPoints = _getXAxisPoints0.xAxisPoints,
+        startX = _getXAxisPoints0.startX,
+        endX = _getXAxisPoints0.endX,
+        eachSpacing = _getXAxisPoints0.eachSpacing;
+      let totalWidth = eachSpacing * (xAxisPoints.length - 1);
+      let screenWidth = endX - startX;
+      offsetLeft = screenWidth - totalWidth;
+      this.scrollOption = {
+        currentOffset: offsetLeft,
+        startTouchX: offsetLeft,
+        distance: 0,
+        lastMoveTime: 0
+      };
+      this.opts._scrollDistance_ = offsetLeft;
+      break;
+  }
+  drawCharts.call(this, this.opts.type, this.opts, this.config, this.context);
+};
+
+Charts.prototype.zoom = function() {
+  var val = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : this.opts.xAxis.itemCount;
+  if (this.opts.enableScroll !== true) {
+    console.log('请启用滚动条后使用！')
+    return;
+  }
+  //当前屏幕中间点
+  let centerPoint = Math.round(Math.abs(this.scrollOption.currentOffset) / this.opts.chartData.eachSpacing) + Math.round(
+    this.opts.xAxis.itemCount / 2);
+  this.opts.animation = false;
+  this.opts.xAxis.itemCount = val.itemCount;
+  //重新计算x轴偏移距离
+  let _calYAxisData = calYAxisData(this.opts.series, this.opts, this.config),
+    yAxisWidth = _calYAxisData.yAxisWidth;
+  this.config.yAxisWidth = yAxisWidth;
+  let offsetLeft = 0;
+  let _getXAxisPoints0 = getXAxisPoints(this.opts.categories, this.opts, this.config),
+    xAxisPoints = _getXAxisPoints0.xAxisPoints,
+    startX = _getXAxisPoints0.startX,
+    endX = _getXAxisPoints0.endX,
+    eachSpacing = _getXAxisPoints0.eachSpacing;
+  let centerLeft = eachSpacing * centerPoint;
+  let screenWidth = endX - startX;
+  let MaxLeft = screenWidth - eachSpacing * (xAxisPoints.length - 1);
+  offsetLeft = screenWidth / 2 - centerLeft;
+  if (offsetLeft > 0) {
+    offsetLeft = 0;
+  }
+  if (offsetLeft < MaxLeft) {
+    offsetLeft = MaxLeft;
+  }
+  this.scrollOption = {
+    currentOffset: offsetLeft,
+    startTouchX: offsetLeft,
+    distance: 0,
+    lastMoveTime: 0
+  };
+  this.opts._scrollDistance_ = offsetLeft;
+  drawCharts.call(this, this.opts.type, this.opts, this.config, this.context);
+};
+
+Charts.prototype.stopAnimation = function() {
+  this.animationInstance && this.animationInstance.stop();
+};
+
+Charts.prototype.addEventListener = function(type, listener) {
+  this.event.addEventListener(type, listener);
+};
+
+Charts.prototype.getCurrentDataIndex = function(e) {
+  var touches = null;
+  if (e.changedTouches) {
+    touches = e.changedTouches[0];
+  } else {
+    touches = e.mp.changedTouches[0];
+  }
+  if (touches) {
+    let _touches$ = getTouches(touches, this.opts, e);
+    if (this.opts.type === 'pie' || this.opts.type === 'ring' || this.opts.type === 'rose') {
+      return findPieChartCurrentIndex({
+        x: _touches$.x,
+        y: _touches$.y
+      }, this.opts.chartData.pieData);
+    } else if (this.opts.type === 'radar') {
+      return findRadarChartCurrentIndex({
+        x: _touches$.x,
+        y: _touches$.y
+      }, this.opts.chartData.radarData, this.opts.categories.length);
+    } else if (this.opts.type === 'funnel') {
+      return findFunnelChartCurrentIndex({
+        x: _touches$.x,
+        y: _touches$.y
+      }, this.opts.chartData.funnelData);
+    } else if (this.opts.type === 'map') {
+      return findMapChartCurrentIndex({
+        x: _touches$.x,
+        y: _touches$.y
+      }, this.opts);
+    }else if (this.opts.type === 'word') {
+      return findWordChartCurrentIndex({
+        x: _touches$.x,
+        y: _touches$.y
+      }, this.opts.chartData.wordCloudData);
+    } else {
+      return findCurrentIndex({
+        x: _touches$.x,
+        y: _touches$.y
+      }, this.opts.chartData.calPoints, this.opts, this.config, Math.abs(this.scrollOption.currentOffset));
+    }
+  }
+  return -1;
+};
+
+Charts.prototype.getLegendDataIndex = function(e) {
+  var touches = null;
+  if (e.changedTouches) {
+    touches = e.changedTouches[0];
+  } else {
+    touches = e.mp.changedTouches[0];
+  }
+  if (touches) {
+    let _touches$ = getTouches(touches, this.opts, e);
+    return findLegendIndex({
+      x: _touches$.x,
+      y: _touches$.y
+    }, this.opts.chartData.legendData);
+  }
+  return -1;
+};
+
+Charts.prototype.touchLegend = function(e) {
+  var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var touches = null;
+  if (e.changedTouches) {
+    touches = e.changedTouches[0];
+  } else {
+    touches = e.mp.changedTouches[0];
+  }
+  if (touches) {
+    var _touches$ = getTouches(touches, this.opts, e);
+    var index = this.getLegendDataIndex(e);
+    if (index >= 0) {
+      this.opts.series[index].show = !this.opts.series[index].show;
+      this.opts.animation = option.animation ? true : false;
+			this.opts._scrollDistance_= this.scrollOption.currentOffset;
+      drawCharts.call(this, this.opts.type, this.opts, this.config, this.context);
+    }
+  }
+
+};
+
+Charts.prototype.showToolTip = function(e) {
+  var option = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  var touches = null;
+  if (e.changedTouches) {
+    touches = e.changedTouches[0];
+  } else {
+    touches = e.mp.changedTouches[0];
+  }
+  if (!touches) {
+    console.log("touchError");
+  }
+  var _touches$ = getTouches(touches, this.opts, e);
+  var currentOffset = this.scrollOption.currentOffset;
+  var opts = assign({}, this.opts, {
+    _scrollDistance_: currentOffset,
+    animation: false
+  });
+  if (this.opts.type === 'line' || this.opts.type === 'area' || this.opts.type === 'column') {
+    var index = option.index==undefined? this.getCurrentDataIndex(e):option.index ;
+    if (index > -1) {
+      var seriesData = getSeriesDataItem(this.opts.series, index);
+      if (seriesData.length !== 0) {
+        var _getToolTipData = getToolTipData(seriesData, this.opts.chartData.calPoints, index, this.opts.categories,option),
+          textList = _getToolTipData.textList,
+          offset = _getToolTipData.offset;
+        offset.y = _touches$.y;
+        opts.tooltip = {
+          textList: option.textList?option.textList:textList,
+          offset: offset,
+          option: option,
+          index: index
+        };
+      }
+    }
+    drawCharts.call(this, opts.type, opts, this.config, this.context);
+  }
+  if (this.opts.type === 'mix') {
+    var index = option.index==undefined? this.getCurrentDataIndex(e):option.index ;
+    if (index > -1) {
+      var currentOffset = this.scrollOption.currentOffset;
+      var opts = assign({}, this.opts, {
+        _scrollDistance_: currentOffset,
+        animation: false
+      });
+      var seriesData = getSeriesDataItem(this.opts.series, index);
+      if (seriesData.length !== 0) {
+        var _getMixToolTipData = getMixToolTipData(seriesData, this.opts.chartData.calPoints, index, this.opts.categories,option),
+          textList = _getMixToolTipData.textList,
+          offset = _getMixToolTipData.offset;
+        offset.y = _touches$.y;
+        opts.tooltip = {
+          textList: option.textList?option.textList:textList,
+          offset: offset,
+          option: option,
+          index: index
+        };
+      }
+    }
+    drawCharts.call(this, opts.type, opts, this.config, this.context);
+  }
+  if (this.opts.type === 'candle') {
+    var index = option.index==undefined? this.getCurrentDataIndex(e):option.index ;
+    if (index > -1) {
+      var currentOffset = this.scrollOption.currentOffset;
+      var opts = assign({}, this.opts, {
+        _scrollDistance_: currentOffset,
+        animation: false
+      });
+      var seriesData = getSeriesDataItem(this.opts.series, index);
+      if (seriesData.length !== 0) {
+        var _getToolTipData = getCandleToolTipData(this.opts.series[0].data, seriesData, this.opts.chartData.calPoints,
+            index, this.opts.categories, this.opts.extra.candle, option),
+          textList = _getToolTipData.textList,
+          offset = _getToolTipData.offset;
+        offset.y = _touches$.y;
+        opts.tooltip = {
+          textList: option.textList?option.textList:textList,
+          offset: offset,
+          option: option,
+          index: index
+        };
+      }
+    }
+    drawCharts.call(this, opts.type, opts, this.config, this.context);
+  }
+  if (this.opts.type === 'pie' || this.opts.type === 'ring' || this.opts.type === 'rose'||this.opts.type === 'funnel' ) {
+    var index = option.index==undefined? this.getCurrentDataIndex(e):option.index ;
+    if (index > -1) {
+      var currentOffset = this.scrollOption.currentOffset;
+      var opts = assign({}, this.opts, {
+        _scrollDistance_: currentOffset,
+        animation: false
+      });
+      var seriesData = this.opts._series_[index];
+      var textList = [{
+        text: option.format ? option.format(seriesData) : seriesData.name + ': ' + seriesData.data,
+        color: seriesData.color
+      }];
+      var offset = {
+        x: _touches$.x,
+        y: _touches$.y
+      };
+      opts.tooltip = {
+        textList: option.textList?option.textList:textList,
+        offset: offset,
+        option: option,
+        index: index
+      };
+    }
+    drawCharts.call(this, opts.type, opts, this.config, this.context);
+  }
+  if (this.opts.type === 'map'||this.opts.type === 'word') {
+    var index = option.index==undefined? this.getCurrentDataIndex(e):option.index ;
+    if (index > -1) {
+      var currentOffset = this.scrollOption.currentOffset;
+      var opts = assign({}, this.opts, {
+        _scrollDistance_: currentOffset,
+        animation: false
+      });
+      var seriesData = this.opts._series_[index];
+      var textList = [{
+        text: option.format ? option.format(seriesData) : seriesData.properties.name ,
+        color: seriesData.color
+      }];
+      var offset = {
+        x: _touches$.x,
+        y: _touches$.y
+      };
+      opts.tooltip = {
+        textList: option.textList?option.textList:textList,
+        offset: offset,
+        option: option,
+        index: index
+      };
+    }
+    opts.updateData = false;
+    drawCharts.call(this, opts.type, opts, this.config, this.context);
+  }
+  if (this.opts.type === 'radar') {
+    var index = option.index==undefined? this.getCurrentDataIndex(e):option.index ;
+    if (index > -1) {
+      var currentOffset = this.scrollOption.currentOffset;
+      var opts = assign({}, this.opts, {
+        _scrollDistance_: currentOffset,
+        animation: false
+      });
+      var seriesData = getSeriesDataItem(this.opts.series, index);
+      if (seriesData.length !== 0) {
+        var textList = seriesData.map(function(item) {
+          return {
+            text: option.format ? option.format(item) : item.name + ': ' + item.data,
+            color: item.color
+          };
+        });
+        var offset = {
+          x: _touches$.x,
+          y: _touches$.y
+        };
+        opts.tooltip = {
+          textList: option.textList?option.textList:textList,
+          offset: offset,
+          option: option,
+          index: index
+        };
+      }
+    }
+    drawCharts.call(this, opts.type, opts, this.config, this.context);
+  }
+};
+
+Charts.prototype.translate = function(distance) {
+  this.scrollOption = {
+    currentOffset: distance,
+    startTouchX: distance,
+    distance: 0,
+    lastMoveTime: 0
+  };
+  let opts = assign({}, this.opts, {
+    _scrollDistance_: distance,
+    animation: false
+  });
+  drawCharts.call(this, this.opts.type, opts, this.config, this.context);
+};
+
+Charts.prototype.scrollStart = function(e) {
+  var touches = null;
+  if (e.changedTouches) {
+    touches = e.changedTouches[0];
+  } else {
+    touches = e.mp.changedTouches[0];
+  }
+  var _touches$ = getTouches(touches, this.opts, e);
+  if (touches && this.opts.enableScroll === true) {
+    this.scrollOption.startTouchX = _touches$.x;
+  }
+};
+
+Charts.prototype.scroll = function(e) {
+  if (this.scrollOption.lastMoveTime === 0) {
+    this.scrollOption.lastMoveTime = Date.now();
+  }
+  let Limit = this.opts.extra.touchMoveLimit || 20;
+  let currMoveTime = Date.now();
+  let duration = currMoveTime - this.scrollOption.lastMoveTime;
+  if (duration < Math.floor(1000 / Limit)) return;
+  this.scrollOption.lastMoveTime = currMoveTime;
+  var touches = null;
+  if (e.changedTouches) {
+    touches = e.changedTouches[0];
+  } else {
+    touches = e.mp.changedTouches[0];
+  }
+  if (touches && this.opts.enableScroll === true) {
+    var _touches$ = getTouches(touches, this.opts, e);
+    var _distance;
+    _distance = _touches$.x - this.scrollOption.startTouchX;
+    var currentOffset = this.scrollOption.currentOffset;
+    var validDistance = calValidDistance(this,currentOffset + _distance, this.opts.chartData, this.config, this.opts);
+    this.scrollOption.distance = _distance = validDistance - currentOffset;
+    var opts = assign({}, this.opts, {
+      _scrollDistance_: currentOffset + _distance,
+      animation: false
+    });
+    drawCharts.call(this, opts.type, opts, this.config, this.context);
+    return currentOffset + _distance;
+  }
+};
+
+Charts.prototype.scrollEnd = function(e) {
+  if (this.opts.enableScroll === true) {
+    var _scrollOption = this.scrollOption,
+      currentOffset = _scrollOption.currentOffset,
+      distance = _scrollOption.distance;
+    this.scrollOption.currentOffset = currentOffset + distance;
+    this.scrollOption.distance = 0;
+  }
+};
+if (typeof module === "object" && typeof module.exports === "object") {
+  module.exports = Charts;
+  //export default Charts;//建议使用nodejs的module导出方式，如报错请使用export方式导出
+}
diff --git a/config.js b/config.js
new file mode 100644
index 0000000000000000000000000000000000000000..daf98a47679ec715b910c5dc1d3095c7307eb12b
--- /dev/null
+++ b/config.js
@@ -0,0 +1,7 @@
+const URL = {
+    "server":"http://127.0.0.1:8000/",
+    "apiServer":"http://127.0.0.1:8000/api/",
+    "imgServer":"http://127.0.0.1:8000/upload/picture/",
+    "uploadServer":"http://127.0.0.1:8000/api/imgUpload/upload"
+}
+export default {URL}
diff --git a/data.js b/data.js
index b517393d669fefc60bc71b56ec595a963b753f71..c91738e32661ed47c08f7e6a27372f134af13888 100644
--- a/data.js
+++ b/data.js
@@ -1,35 +1,7 @@
-export default [{
+export default [
+	{
 		"name": "全部",
-		"foods": [{
-				"name": "三味书屋",
-				"key": "三味书屋",
-				"icon": "http://img.kiwifruits.cn/classify/1/2.jpg",
-				"cat": 10
-			},
-			{
-				"name": "时间很长",
-				"key": "时间很长",
-				"icon": "http://img.kiwifruits.cn/classify/1/2.jpg",
-				"cat": 10
-			},
-			{
-				"name": "三味书屋",
-				"key": "三味书屋",
-				"icon": "http://img.kiwifruits.cn/classify/1/3.jpg",
-				"cat": 10
-			},
-			{
-				"name": "时间很长",
-				"key": "时间很长",
-				"icon": "http://img.kiwifruits.cn/classify/1/2.jpg",
-				"cat": 10
-			},
-			{
-				"name": "时间很长",
-				"key": "时间很长",
-				"icon": "http://img.kiwifruits.cn/classify/1/2.jpg",
-				"cat": 10
-			},
+		"foods": [
 			{
 				"name": "时间很长",
 				"key": "时间很长",
@@ -42,15 +14,15 @@ export default [{
 				"icon": "http://img.kiwifruits.cn/classify/1/2.jpg",
 				"cat": 10
 			},
-			
-			
+
+
 		{
 			"name": "时间很长",
 			"key": "时间很长",
 			"icon": "http://img.kiwifruits.cn/classify/1/2.jpg",
 			"cat": 10
 		},
-			
+
 			{
 				"name": "时间很长",
 				"key": "时间很长",
@@ -69,9 +41,9 @@ export default [{
 						"icon": "http://img.kiwifruits.cn/classify/1/2.jpg",
 						"cat": 10
 					},
-						
-			
-			
+
+
+
 			{
 				"name": "时间很长",
 				"key": "时间很长",
@@ -80,7 +52,7 @@ export default [{
 			}
 		]
 	},
-	
+
 	{
 		"name": "我的",
 		"foods": [{
diff --git a/main.js b/main.js
index 9ebcc3f8fa295493ccc8a2da6c0ec63f61296d9f..08fde5b36f65003ce3c9149a770c0b546b2613fd 100644
--- a/main.js
+++ b/main.js
@@ -1,9 +1,8 @@
 // import Vue from 'vue'
 // import App from './App'
 import uView from "uview-ui"
-// import store from "./store"
-
-// import "./tools"
+import store from "./store"
+import tools from "./tools"
 
 // import Tabs from "./components/tabs"
 // import share from 'pages/Bdetail/share.vue'
@@ -54,8 +53,10 @@ Vue.component("tushu",tushu)
 Vue.component("chengy",chengy)
 
 Vue.use(uView)
+Vue.use(tools)
 
 const app = new Vue({
+	store,
     ...App
-}) 
+})
 app.$mount()
diff --git a/manifest.json b/manifest.json
index df9ba47f732ed9db61e71584e5cd76b0d82ad07a..e30f34b6f11994b31163cbfd6f8dff3a7824598c 100644
--- a/manifest.json
+++ b/manifest.json
@@ -1,8 +1,8 @@
 {
     "name" : "shuyi",
-    "appid" : "__UNI__CBB7E30",
+    "appid" : "__UNI__023505A",
     "description" : "",
-    "versionName" : "1.0.0",
+    "versionName" : "1.0.1",
     "versionCode" : "100",
     "transformPx" : false,
     /* 5+App特有相关 */
@@ -17,51 +17,69 @@
             "delay" : 0
         },
         /* 模块配置 */
-        "modules" : {},
+        "modules" : {
+            "Maps" : {}
+        },
         /* 应用发布信息 */
         "distribute" : {
             /* android打包配置 */
             "android" : {
                 "permissions" : [
-                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
-                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
-                    "<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>",
-                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
-                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
-                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
                     "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
-                    "<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
                     "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CALL_PHONE\"/>",
                     "<uses-permission android:name=\"android.permission.CAMERA\"/>",
-                    "<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
                     "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
                     "<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
+                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
                     "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
-                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
                     "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
-                    "<uses-permission android:name=\"android.permission.CALL_PHONE\"/>",
-                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
-                    "<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
-                    "<uses-feature android:name=\"android.hardware.camera\"/>",
-                    "<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>",
                     "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
-                ]
+                ],
+                "abiFilters" : [ "armeabi-v7a", "arm64-v8a", "x86" ]
             },
             /* ios打包配置 */
-            "ios" : {},
+            "ios" : {
+                "idfa" : false
+            },
             /* SDK配置 */
-            "sdkConfigs" : {}
+            "sdkConfigs" : {
+                "ad" : {},
+                "maps" : {
+                    "amap" : {
+                        "appkey_ios" : "29664f481fd8af0fd20a9cdc423f77fe",
+                        "appkey_android" : "29664f481fd8af0fd20a9cdc423f77fe"
+                    }
+                }
+            }
         }
     },
     /* 快应用特有相关 */
     "quickapp" : {},
     /* 小程序特有相关 */
     "mp-weixin" : {
-        "appid" : "wx63d22f0fb2f42290",
+        "appid" : "wx6f1f2ad16efb60ed",
         "setting" : {
             "urlCheck" : false
         },
-        "usingComponents" : true
+        "usingComponents" : true,
+        "permission" : {
+            "scope.userLocation" : {
+                "desc" : "你的位置信息将用于小程序位置接口的效果展示"
+            }
+        }
     },
     "mp-alipay" : {
         "usingComponents" : true
@@ -74,5 +92,14 @@
     },
     "uniStatistics" : {
         "enable" : false
+    },
+    "h5" : {
+        "sdkConfigs" : {
+            "maps" : {
+                "qqmap" : {
+                    "key" : ""
+                }
+            }
+        }
     }
 }
diff --git a/pages.json b/pages.json
index 3444b251a34300937d5838c6a33868816f79ac93..f2e80a195f697564a01426eee60d3647eb284d58 100644
--- a/pages.json
+++ b/pages.json
@@ -4,6 +4,14 @@
 		"^c-(.*)": "@/components/c-$1/index.vue"
 	},
 	"pages": [{
+			"path": "pages/login/shuyiLogin",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		}, {
 			"path": "pages/main/main",
 			"style": {
 				"navigationStyle": "custom",
@@ -11,11 +19,31 @@
 					"titleNView": false
 				}
 			}
+		}, {
+			"path": "pages/jianshu/subclass",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		}, {
+			"path": "pages/classify/classify",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
 		}, {
 			"path": "pages/myinfomation/myinfomation",
 			"style": {
 				"navigationBarTitleText": "信息管理",
-				"navigationBarBackgroundColor": "#6C40F3"
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+
 			}
 		}, {
 			"path": "pages/my/my",
@@ -30,15 +58,13 @@
 		},
 		{
 			"path": "pages/book_cart/book_cart",
-			"navigationBarTitleText": "全部分类",
-			"style": {
-				"navigationBarTitleText": "借书车"
-			}
-		}, {
-			"path": "pages/book-selection-car/book-selection-car",
 			"style": {
-				// "navigationBarBackgroundColor":"#00BFFF"
-				"navigationBarTitleText": "借书车"
+				"navigationBarTitleText": "借书车",
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+
 			}
 		},
 		{
@@ -52,6 +78,7 @@
 			"path": "pages/friend/friend",
 			"style": {
 				"navigationStyle": "custom",
+				"enablePullDownRefresh": true,
 				"app-plus": {
 					"titleNView": false
 				}
@@ -60,11 +87,11 @@
 		{
 			"path": "pages/Bdetail/Bdetail",
 			"style": {
-				"navigationBarTitleText": "书籍详情",
-				"navigationStyle": "custom",
-				"app-plus": {
-					"titleNView": false
-				}
+				"navigationBarTitleText": "图书详情"
+				// "navigationStyle": "custom",
+				// "app-plus": {
+				// 	"titleNView": false
+				// }
 			}
 		},
 		{
@@ -120,11 +147,11 @@
 		{
 			"path": "pages/sousuo/book",
 			"style": {
-				"navigationBarTitleText": "书籍分类",
-				"navigationStyle": "custom",
-				"app-plus": {
-					"titleNView": false
-				}
+				"navigationBarTitleText": "书易搜索"
+				// "navigationStyle": "custom",
+				// "app-plus": {
+				// 	"titleNView": false
+				// }
 			}
 		},
 		{
@@ -157,6 +184,16 @@
 				}
 			}
 		},
+		{
+			"path": "pages/my/read_report",
+			"style": {
+				"navigationBarTitleText": "读书报告",
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
 		{
 			"path": "pages/my/jszlist",
 			"style": {
@@ -211,14 +248,20 @@
 		}, {
 			"path": "pages/readLabel/readLabel",
 			"style": {
-				"navigationBarTitleText": "",
-				"enablePullDownRefresh": false
+				"navigationBarTitleText": "我的标签",
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
 			}
 		}, {
 			"path": "pages/readLabel/readLabelNew",
 			"style": {
-				"navigationBarTitleText": "",
-				"enablePullDownRefresh": false
+				"navigationBarTitleText": "添加标签",
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
 			}
 		}, {
 			"path": "pages/privateSpace/privateSpace",
@@ -321,23 +364,68 @@
 		}, {
 			"path": "pages/Setup/Setup",
 			"style": {
-				"navigationBarTitleText": "",
-				"enablePullDownRefresh": false
+				"navigationBarTitleText": "设置偏好",
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
 			}
 		},
 		{
 			"path": "pages/friend/friends_rank",
 			"style": {
 				"navigationBarTitleText": "好友排行",
-				"enablePullDownRefresh": false
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
 			}
 
 		}, {
 			"path": "pages/friend/friendSearch",
 			"style": {
 				"navigationBarTitleText": "搜索好友",
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+
+		},
+		{
+			"path": "uview-ui/components/u-avatar-cropper/u-avatar-cropper",
+			"style": {
+				"navigationBarTitleText": "图片裁剪",
+				"navigationBarBackgroundColor": "#000000"
+			}
+		}
+		//TODO 文件还没上传？
+		, {
+			"path": "pages/my/Uchart",
+			"style": {
+				"navigationBarTitleText": "",
 				"enablePullDownRefresh": false
 			}
+
+		}, {
+			"path": "pages/Setup/sysSet",
+			"style": {
+				"navigationBarTitleText": "设置",
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+
+		}, {
+			"path": "pages/friend/friendXQ",
+			"style": {
+				"navigationBarTitleText": "",
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
 		}
 	],
 	"subPackages": [{
@@ -346,61 +434,125 @@
 				"path": "pages/appointment/appointment",
 				"style": {
 					"navigationBarTitleText": "预约",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			},
+			{
+				"path": "pages/address/address",
+				"style": {
+					"navigationBarTitleText": "地址管理",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			},
+			{
+				"path": "pages/address/edit/edit",
+				"style": {
+					"navigationBarTitleText": "地址添加/修改",
 					"navigationBarBackgroundColor": "#6C40F3"
-
+				}
+			},
+			{
+				"path": "pages/reading/reading",
+				"style": {
+					"navigationBarTitleText": "正在阅读",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			},
+			{
+				"path": "pages/reading/opinion",
+				"style": {
+					"navigationBarTitleText": "写书评",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/appointment/abolish",
 				"style": {
 					"navigationBarTitleText": "取消预约",
-					"navigationBarBackgroundColor": "#6C40F3"
-
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/appointment/confirm",
 				"style": {
 					"navigationBarTitleText": "确认收货",
-					"navigationBarBackgroundColor": "#6C40F3"
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/appointment/contact-booking-agent",
 				"style": {
 					"navigationBarTitleText": "联系持书人",
-					"navigationBarBackgroundColor": "#6C40F3"
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			}, {
 				"path": "pages/appointment/logistics",
 				"style": {
-					// "navigationStyle": custom
-					"navigationBarTitleText": "物流查看",
-					"navigationBarBackgroundColor": "#6C40F3"
+					"navigationBarTitleText": "查看物流",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/appointment/index",
 				"style": {
-					"navigationBarTitleText": "面对面借书"
+					"navigationBarTitleText": "面对面还书",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			}, {
 				"path": "pages/components/orders",
 				"style": {
-					"navigationBarTitleText": "线上预约"
+					"navigationBarTitleText": "线上预约",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/components/trade",
 				"style": {
-					"navigationBarTitleText": "面对面交易中"
+					"navigationBarTitleText": "面对面交易中",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/components/logistic",
 				"style": {
 					"navigationBarTitleText": "物流配送中",
-					"navigationBarBackgroundColor": "#6C40F3"
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
@@ -426,65 +578,97 @@
 				"path": "pages/return-books/return-books",
 				"style": {
 					"navigationBarTitleText": "还书",
-					"navigationBarBackgroundColor": "#6C40F3"
-
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/return-books/contact-order-agent",
 				"style": {
 					"navigationBarTitleText": "联系预约人",
-					"navigationBarBackgroundColor": "#6C40F3"
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/borrow/borrow",
 				"style": {
 					"navigationBarTitleText": "借书",
-					"navigationBarBackgroundColor": "#6C40F3"
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 
 			}, {
 				"path": "pages/borrow/face_to_face",
 				"style": {
-					"navigationBarTitleText": "面对面借书"
+					"navigationBarTitleText": "面对面借书",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			}, {
 				"path": "pages/borrow_and_return/borrow_and_return",
 				"style": {
 					"navigationBarTitleText": "借还记录",
-					"enablePullDownRefresh": false
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/return/return",
 				"style": {
 					"navigationBarTitleText": "面对面还书",
-					"navigationBarBackgroundColor": "#6C40F3"
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			}, {
 				"path": "pages/borrow_and_return/borrow_and_returnXQ",
 				"style": {
 					"navigationBarTitleText": "订单详情",
-					"enablePullDownRefresh": false
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/order/order",
 				"style": {
-					"navigationBarTitleText": "确认订单"
+					"navigationBarTitleText": "确认订单",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			},
 			{
 				"path": "pages/allOrders/index",
 				"style": {
-					"navigationBarTitleText": "预约"
+					"navigationBarTitleText": "预约",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			}, {
 				"path": "pages/my_reserve/my_reserve",
 				"style": {
 					"navigationBarTitleText": "预约记录",
-					"navigationBarBackgroundColor": "#6C40F3"
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
 			}
 		]
@@ -494,207 +678,305 @@
 	}, {
 		"root": "pages_read_circle",
 		"pages": [{
-			"path": "pages/readCircle/readCircle",
-			"style": {
-				"navigationBarTitleText": "阅读圈子",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/readCircle/readCircleNew",
-			"style": {
-				"navigationBarTitleText": "新建圈子",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/readCircle/readCircleXQ",
-			"style": {
-				"navigationBarTitleText": "圈子详情",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/readCircle/readCircleNR",
-			"style": {
-				"navigationBarTitleText": "圈子详情",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/readCircle/readCicleMore",
-			"style": {
-				"navigationBarTitleText": "",
-				"enablePullDownRefresh": false
-			}
-		}, {
-			"path": "pages/readCirclepage/CircleNR_Life",
-			"style": {
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/readCirclepage/CircleNR_Right",
-			"style": {
-				"navigationBarTitleText": "圈文",
-				"enablePullDownRefresh": false
-			}
+				"path": "pages/readCircle/readCircle",
+				"style": {
+					"navigationBarTitleText": "阅读圈子",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/readCircle/readCircleNew",
+				"style": {
+					"navigationBarTitleText": "新建圈子",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/readCircle/readCircleXQ",
+				"style": {
+					"navigationBarTitleText": "圈子详情",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/readCircle/readCircleNR",
+				"style": {
+					"navigationBarTitleText": "圈子详情",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/readCircle/readCicleMore",
+				"style": {
+					"navigationBarTitleText": "",
+					"enablePullDownRefresh": false
+				}
+			}, {
+				"path": "pages/readCirclepage/CircleNR_Life",
+				"style": {
+					"navigationBarTitleText": "",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
 
-		}, {
-			"path": "pages/readCirclepage/CircleXQLife",
-			"style": {
-				"navigationBarTitleText": "圈子信息",
-				"enablePullDownRefresh": false
-			}
+			}, {
+				"path": "pages/readCirclepage/CircleNR_Right",
+				"style": {
+					"navigationBarTitleText": "圈文",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/readCirclepage/CircleXQLife",
+				"style": {
+					"navigationBarTitleText": "圈子信息",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
 
-		}, {
-			"path": "pages/readCirclepage/CircleXQRight",
-			"style": {
-				"navigationBarTitleText": "圈子成员",
-				"enablePullDownRefresh": false
-			}
+			}, {
+				"path": "pages/readCirclepage/CircleXQRight",
+				"style": {
+					"navigationBarTitleText": "圈子成员",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
 
-		}, {
-			"path": "pages/readCircle/readExperience",
-			"style": {
-				"navigationBarTitleText": "",
-				"enablePullDownRefresh": false
-			}
-		}, {
-			"path": "pages/readCirclepage/readExperDZ",
-			"style": {
-				"navigationBarTitleText": "",
-				"enablePullDownRefresh": false
-			}
+			}, {
+				"path": "pages/readCircle/readExperience",
+				"style": {
+					"navigationBarTitleText": "",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+				
+			}, {
+				"path": "pages/readCirclepage/readExperDZ",
+				"style": {
+					"navigationBarTitleText": "",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
 
-		}, {
-			"path": "pages/readCirclepage/readExperPL",
-			"style": {
-				"navigationBarTitleText": "",
-				"enablePullDownRefresh": false
-			}
-		}, {
-			"path": "pages/index/publish",
-			"style": {
-				"navigationBarTitleText": "发表",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		},
-		{
-			"path": "pages/index/MyExperience",
-			"style": {
-				"navigationBarTitleText": "我的心得",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/index/MyExper",
-			"style": {
-				"navigationBarTitleText": "我要发表",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/index/SerchExper",
-			"style": {
-				"navigationBarTitleText": "搜索心得",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/index/yifabiao",
-			"style": {
-				"navigationBarTitleText": "已发表",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/index/wuliu",
-			"style": {
-				"navigationBarTitleText": "物流设置",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		},
-		{
-			"path": "pages/personal/personal_home",
-			"style": {
-				"navigationBarTitleText": "我的主页",
-				"navigationStyle": "custom",
-				"app-plus": {
-					"titleNView": false
+			}, {
+				"path": "pages/readCirclepage/readExperPL",
+				"style": {
+					"navigationBarTitleText": "",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/index/publish",
+				"style": {
+					"navigationBarTitleText": "发表",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			},
+			{
+				"path": "pages/index/MyExperience",
+				"style": {
+					"navigationBarTitleText": "我的心得",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/index/MyExper",
+				"style": {
+					"navigationBarTitleText": "我要发表",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/index/SerchExper",
+				"style": {
+					"navigationBarTitleText": "搜索心得",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/index/yifabiao",
+				"style": {
+					"navigationBarTitleText": "已发表",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/index/wuliu",
+				"style": {
+					"navigationBarTitleText": "物流设置",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 				}
+			}, {
+				"path": "pages/index/draft",
+				"style": {
+					"navigationBarTitleText": "草稿",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
 
-			}
-		}, {
-			"path": "pages/personal/Mynotice",
-			"style": {
-				"navigationBarTitleText": "通知消息",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/personal/XiTonMessage",
-			"style": {
-				"navigationBarTitleText": "系统消息",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/personal/unChat",
-			"style": {
-				"navigationBarTitleText": "聊天页面",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/personal/Shejiao_notice",
-			"style": {
-				"navigationBarTitleText": "社交消息",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/personal/BandR_notice",
-			"style": {
-				"navigationBarTitleText": "借还消息",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/personal/serve_chat",
-			"style": {
-				"navigationBarTitleText": "书易客服",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/personal/Lib_ser_chat",
-			"style": {
-				"navigationBarTitleText": "图书馆客服",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		},
-		{
-			"path": "pages/personal-library/personal-library",
-			"style": {
-				"navigationBarTitleText": "个人图书馆",
-				"navigationBarBackgroundColor": "#FFFFFF"
-			}
-		}, {
-			"path": "pages/personal-library/shareBook",
-			"style": {
-				"navigationBarTitleText": "添加共享图书",
-				"navigationBarBackgroundColor": "#6C40F3",
-				"app-plus": {
-					"titleNView": {
-						"buttons": []
+				}
+			},
+			{
+				"path": "pages/personal/personal_home",
+				"style": {
+					"navigationBarTitleText": "我的主页",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+
+				}
+			}, {
+				"path": "pages/personal/Mynotice",
+				"style": {
+					"navigationBarTitleText": "通知消息",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+
+				}
+			}, {
+				"path": "pages/personal/XiTonMessage",
+				"style": {
+					"navigationBarTitleText": "系统消息",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+
+				}
+			}, {
+				"path": "pages/personal/unChat",
+				"style": {
+					"navigationBarTitleText": "聊天",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+
+				}
+			}, {
+				"path": "pages/personal/Shejiao_notice",
+				"style": {
+					"navigationBarTitleText": "社交消息",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+
+				}
+			}, {
+				"path": "pages/personal/BandR_notice",
+				"style": {
+					"navigationBarTitleText": "借还消息",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+
+				}
+			}, {
+				"path": "pages/personal/serve_chat",
+				"style": {
+					"navigationBarTitleText": "书易客服",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+
+				}
+			}, {
+				"path": "pages/personal/Lib_ser_chat",
+				"style": {
+					"navigationBarTitleText": "图书馆客服",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+
+				}
+			},
+			{
+				"path": "pages/personal-library/personal-library",
+				"style": {
+					"navigationBarTitleText": "个人图书馆",
+					"navigationBarBackgroundColor": "#FFFFFF"
+				}
+			}, {
+				"path": "pages/personal-library/shareBook",
+				"style": {
+					"navigationBarTitleText": "添加共享图书",
+					"navigationBarBackgroundColor": "#6C40F3",
+					"app-plus": {
+						"titleNView": {
+							"buttons": []
+						}
+					}
+				}
+			}, {
+				"path": "pages/mycollection/mycollection",
+				"style": {
+					"navigationBarTitleText": "我的收藏",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
+					}
+				}
+			}, {
+				"path": "pages/mycollection/mycollbook",
+				"style": {
+					"navigationBarTitleText": "收藏的书",
+					"navigationBarBackgroundColor": "#6C40F3"
+				}
+			}, {
+				"path": "pages/mycollection/xinjiang",
+				"style": {
+					"navigationBarTitleText": "添加图书",
+					"navigationStyle": "custom",
+					"app-plus": {
+						"titleNView": false
 					}
 				}
 			}
-		}, {
-			"path": "pages/mycollection/mycollection",
-			"style": {
-				"navigationBarTitleText": "我的收藏",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/mycollection/mycollbook",
-			"style": {
-				"navigationBarTitleText": "收藏的书",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}, {
-			"path": "pages/mycollection/xinjiang",
-			"style": {
-				"navigationBarTitleText": "添加图书",
-				"navigationBarBackgroundColor": "#6C40F3"
-			}
-		}]
+		]
 	}],
 	"globalStyle": {
 		"navigationBarTextStyle": "white",
diff --git a/pages/Bdetail/Bdetail.vue b/pages/Bdetail/Bdetail.vue
index 186126d656364ddf5ee50e535e2bbc387d8fb2b5..a5661d7692cb540c4422c1c0bb87b15075cd0c96 100644
--- a/pages/Bdetail/Bdetail.vue
+++ b/pages/Bdetail/Bdetail.vue
@@ -1,52 +1,46 @@
 <template>
 	<view>
-		<!-- 导航栏 -->
-		<view class="ta"></view>
 		<!-- 顶部部分 -->
-		<view class="head">
-			<view class="header-wrap">
-				<view class="index-header">
-					<image @click="leftClick" class="address" src="../../static/images/turn_left_two_return2x.png"></image>
-					<view class="name">图书详情</view>
-					<view class="map-wrap" @click="rightClick">
-						<image class="iconfont" src="../../static/images/detail_fenx_icon.png"></image>
-					</view>
+		<!-- <u-navbar zhead="58" height="44" title="图书详情" title-color="white" title-size="40" :background="background" back-icon-color="white"
+		 back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list">
+					<image style="height: 60rpx; width: 60rpx;margin-right: 20rpx;" src="../../static/images/detail_fenx_icon.png"></image>
 				</view>
 			</view>
-		</view>
-		<view class="blank"></view>
+		</u-navbar> -->
+		
 		<!-- 图片背景 -->
-		<view class="bg">
-			<image class="ima1" :src="bookDetail.picturePath"></image>
-			<view class="tit6">{{bookDetail.bookName}}</view>
-		</view>
-		<view class="tit">{{bookDetail.bookName}}</view>
-		<view class="table">
-			<view class="text_tex">作者：{{bookDetail.author}}</view>
-			<view class="text_tex">出版社：{{bookDetail.publisher}}</view>
-			<view class="text_tex">出版年：{{bookDetail.publisherYear}}</view>
-			<view class="text_tex">图书馆：</view>
-			<view class="text_tex">ISBN：{{bookDetail.isbn}}</view>
-			<view class="text_tex">馆藏数量：{{bookDetail.num}}</view>
-			<view class="text_tex">可借数量：{{num}}</view>
-			<view class="text_tex">书易读者：</view>
-			<view class="text_tex">索书号：{{bookDetail.classificationSymbol}}</view>
+		<view class="bag">
+			<image class="imaee1" :src="bookDetail.picturePath"></image>
+			<view class="tite6">{{bookDetail.bookName}}</view>
 		</view>
+		<view class="titee">{{bookDetail.bookName}}</view>
+			<view class="tables">
+				<view class="text_texe">作者：{{bookDetail.author}}</view>
+				<view class="text_texe">出版社：{{bookDetail.publisher}}</view>
+				<view class="text_texe">出版年：{{bookDetail.publisherYear}}</view>
+			<view class="text_texe">图书馆：{{libraryList.library.name == undefined ? "" : libraryList.library.name}}</view>				<view class="text_texe">ISBN：{{bookDetail.isbn}}</view>
+				<view class="text_texe">馆藏数量：{{bookDetail.num}}</view>
+				<!-- <view class="text_texe">可借数量、可预约数量：{{borrowNum}} 、{{reserveNum}} </view> -->
+			<view class="text_texe">可借数量：{{libraryList.canBorrowCount == undefined ? "0" :libraryList.canBorrowCount}} </view>				<view class="text_texe">书易读者：</view>
+				<view class="text_texe">索书号：{{bookDetail.classificationSymbol}}</view>
+			</view>
 		<!-- 图书简介 -->
-		<view class="jian">
-			<view class="tit2">图书简介</view>
-			<view class="text">{{bookDetail.summary}}</view>
+		<view class="jiane">
+			<view class="titee2">图书简介</view>
+			<view class="textee">{{bookDetail.summary}}</view>
 		</view>
 
 		<!-- 作者简介 -->
-		<view class="jian">
-			<view class="tit2">作者简介</view>
-			<view class="text">{{bookDetail.authorAbstract}}</view>
+		<view class="jiane">
+			<view class="titee2">作者简介</view>
+			<view class="textee">{{bookDetail.authorAbstract}}</view>
 		</view>
 
 		<!-- 类似的书 -->
-		<view class="jian2">
-			<view class="tit2">类似的书</view>
+		<view class="jiane2">
+			<view class="titee2">类似的书</view>
 			<view class="book_like">
 				<view v-for="item in bookLikeList">
 					<navigator :url="'../Bdetail/Bdetail?isbn='+item.isbn">
@@ -56,15 +50,15 @@
 			</view>
 		</view>
 
-		<view class="mar-btn"></view>
+		<view class="mar-btne"></view>
 
 		<!-- 底部 -->
-		<view class="buttom">
-      <view>
-        <button class="btn1" @click="borrowBook" style="color: #00AAFF; width: 400rpx; height: 100rpx;">借走</button>
-      </view>
+		<view class="buttomee">
+			<view>
+				<button class="btnee1" @click="borrowBook" style="color: #00AAFF; width: 400rpx; height: 100rpx;">借走</button>
+			</view>
 			<view>
-				<button class="btn2" style="color: #FFFFFF;  width: 400rpx; height: 100rpx;">收藏</button>
+				<button class="btnee2" style="color: #FFFFFF;  width: 400rpx; height: 100rpx;">收藏</button>
 			</view>
 		</view>
 
@@ -72,13 +66,19 @@
 </template>
 
 <script>
-	let app = getApp();
+	let app = getApp(); 
 	export default {
 		data() {
 			return {
+				background: {
+					background: "#6C40F3",
+				},
 				"bookDetail": {}, //数据详情
 				"bookLikeList": [], //类似的书
-				"num": 0,	//可借书的数量
+				"libraryList":[],
+				"borrowNum": 0, //可借书的数量
+				"reserveNum": 0 //可预约书的数量
+				
 			}
 		},
 		onLoad(e) {
@@ -87,22 +87,40 @@
 		},
 		methods: {
 			borrowBook: function() {
-        uni.navigateTo({
-					url: '/pages_borrow_books/pages/borrow/borrow?bookId='+this.bookDetail.bookId
-				})
+				let that = this;
+				
+				if ((that.borrowNum == 0 || that.borrowNum == undefined) && (that.reserveNum == 0 || that.reserveNum == undefined)) {
+					uni.showToast({
+						icon: 'none',
+						title: '该本书暂时没有可借、可预约的书！'
+					})
+
+				} else {
+					uni.navigateTo({
+						url: '/pages_borrow_books/pages/borrow/borrow?bookId=' + this.bookDetail.bookId
+					})
+				}
 			},
 			//根据ISBN获取图书详情
 			async getBookByISBN(e) {
-				console.log(e)
+				uni.showLoading({
+				    title: '加载中'
+				});
+				setTimeout(function () {
+				    uni.hideLoading();
+				}, 8000);
 				var that = this;
 				var params = {
 					url: "book?isbn=" + e,
 					type: 'GET'
 				}
 				const res = await app.myRequest(params);
+				console.log("book:", res);
 				that.bookDetail = res.content[0];
 				that.getBookByBook(res.content[0].classificationSymbol);
-				that.getBookNumByBookId(res.content[0].bookId);
+				//that.getBookNumByBookId(res.content[0].bookId);
+				that.getLibraryBookList(res.content[0].bookId)
+				uni.hideLoading();
 			},
 
 			//根据分类号查询类似的书
@@ -122,31 +140,25 @@
 				}
 				const res = await app.myRequest(params);
 				that.bookLikeList = res.content;
-				console.log("ffffffff:", that.bookLikeList);
+				console.log("similarity:", that.bookLikeList);
 			},
-
-			//根据booId查询可解的书
-			async getBookNumByBookId(e){
+			async getLibraryBookList(e) {
 				var that = this;
-				if(e == null || e=="" || e==undefined){
-					uni.showToast({
-						icon: 'none',
-						title: '网络链接失败！'
-					})
-				}else{
-					var params = {
-						url: "realBook/queryIsBorrowed?bookId=" + e,
-						type: 'GET',
-						data: {}
-					}
-					that.num = await app.myRequest(params);
-				}
+				await getApp().myRequest({
+					url: "book/getLibraryBookList?bookId="+e,
+					type: 'GET'
+				}).then(res => {
+					console.log(res)
+					this.libraryList = res.list[0];
+					that.borrowNum = res.list[0].canBorrowCount;
+					that.reserveNum = res.list[0].circulatingReserveCount;
+					console.log("canBorrowCount",that.borrowNum)
+					console.log("circulatingReserveCount",that.reserveNum)
+				}).catch(err => {
+					console.log("err", err);
+				})
 			},
-			// leftClick(){
-			// 	uni.reLaunch({
-			// 	    url: '../main/main'
-			// 	});
-			// },
+			
 			leftClick() {
 				uni.navigateBack({
 					delta: 1
@@ -157,66 +169,6 @@
 </script>
 
 <style lang="scss">
-	// 顶部页面
-	$color-base: #6C40F3;
-	$words-color-base: #333333;
-	$words-color-light: #999999;
-
-	.header-wrap {
-		width: 100%;
-		position: fixed;
-		top: 0;
-		z-index: 999;
-
-		.index-header {
-			display: flex;
-			height: 150rpx;
-			line-height: 110rpx;
-			padding: 0 30rpx;
-			padding-top: 40rpx;
-			background-color: $color-base;
-			font-size: 28rpx;
-			color: #fff;
-			align-items: center;
-			// justify-content: space-between;
-
-			.address {
-				// margin-left: 50upx;
-				width: 60rpx;
-				height: 60rpx;
-				font-size: 26rpx;
-				margin-top: 20rpx;
-			}
-
-			.name {
-				color: #FFFFFF;
-				width: 80%;
-				height: 60rpx;
-				font-size: 36rpx;
-				margin-top: -32rpx;
-				text-align: center;
-			}
-
-			.map-wrap {
-				.iconfont {
-					margin-top: 50rpx;
-					width: 60rpx;
-					height: 60rpx;
-					font-size: 36rpx;
-					margin-right: 5rpx;
-				}
-
-				text {
-					font-size: 26rpx;
-				}
-			}
-		}
-	}
-
-	.blank {
-		height: 150rpx;
-	}
-
 
 	.tab1 {
 		display: flex;
@@ -263,7 +215,7 @@
 		box-shadow: 2px 2px 10px #06c;
 	}
 
-	.ima1 {
+	.imaee1 {
 		margin-top: 20rpx;
 		margin-left: 260rpx;
 		width: 200rpx;
@@ -273,7 +225,7 @@
 		box-shadow: 2px 2px 10px #06c;
 	}
 
-	.bg {
+	.bag {
 		height: 400rpx;
 		width: 95%;
 		margin-top: 20rpx;
@@ -284,7 +236,7 @@
 		box-shadow: 0 0 10px #06c;
 	}
 
-	.tit {
+	.titee {
 		width: 100%;
 		margin: 20rpx 20rpx;
 		font-size: 36rpx;
@@ -297,14 +249,14 @@
 		color: #333333;
 	}
 
-	.tit6 {
+	.tite6 {
 		/* margin: 20rpx 20rpx; */
 		text-align: center;
 		font-size: 36rpx;
 		color: #333333;
 	}
 
-	.text_tex {
+	.text_texe {
 		// height: 30rpx;
 		/* margin: 10rpx 20rpx; */
 		margin-left: 20rpx;
@@ -342,19 +294,19 @@
 		margin-top: 20rpx;
 	}
 
-	.table {
+	.tables {
 		margin-top: -10rpx;
 		height: 400rpx;
 		/* border-bottom: 1rpx solid #C0C0C0; */
 	}
 
-	.jian {
+	.jiane {
 
 		width: 100%;
 		position: relative;
 		min-height: 80rpx;
 		margin-top: 17rpx;
-		/* border-bottom: 1rpx solid #C0C0C0; */
+		// border-bottom: 1rpx solid #C0C0C0; 
 	}
 
 	.jian1 {
@@ -362,12 +314,12 @@
 		/* border-bottom: 1rpx solid #C0C0C0; */
 	}
 
-	.jian2 {
+	.jiane2 {
 		height: 350rpx;
 		/* border-bottom: 1rpx solid #C0C0C0; */
 	}
 
-	.tit2 {
+	.titee2 {
 		margin: 20rpx;
 		font-size: 36rpx;
 		color: #333333;
@@ -376,7 +328,7 @@
 		word-wrap: break-word;
 	}
 
-	.text {
+	.textee {
 		margin: 20rpx 20rpx;
 		font-size: 26rpx;
 		color: #999999;
@@ -445,12 +397,12 @@
 		margin-left: 26rpx;
 	}
 
-	.mar-btn {
+	.mar-btne {
 		width: 100%;
 		height: 100rpx;
 	}
 
-	.buttom {
+	.buttomee {
 		width: 100%;
 		height: 88rpx;
 		display: flex;
@@ -462,7 +414,7 @@
 		left: 0;
 	}
 
-	.btn1 {
+	.btnee1 {
 		width: 50%;
 		margin: 0;
 		// border-radius: 0;
@@ -472,7 +424,7 @@
 		font-size: 30rpx;
 	}
 
-	.btn2 {
+	.btnee2 {
 		width: 50%;
 		margin-right: 0rpx;
 		background-color: #6C40F3;
diff --git a/pages/Bdetail/share.vue b/pages/Bdetail/share.vue
index cee06e933225a2b895c5b894a13c5630d9d7f29a..3f9762b3723111b1d66c6044ff6ffea576cfd941 100644
--- a/pages/Bdetail/share.vue
+++ b/pages/Bdetail/share.vue
@@ -1,119 +1,153 @@
 <template>
-	<view>
-		
-		<!-- 分享弹窗 -->
-		<view mode="aspectFill" @click.stop="ShowHidden=!ShowHidden">
-			<image class="im"  src="../../static/images/详情页.分享.icon.png" style="width: 50rpx; height: 50rpx;"></image>
-		</view>
-		<view class="all" v-if="ShowHidden">
-		<!-- #ifdef APP-PLUS -->
-		<view class="list">
-			<view class="td">
-				<image class="im1" src="../../static/images/wechat.png" style="width: 150rpx; height: 150rpx;"></image>
-			<view>微信</view>
-			</view>
-			<view class="td">
-				<image class="im1" src="../../static/images/circle_of_friends.png" style="width: 150rpx; height: 150rpx;"></image>
-			<view>微信朋友圈</view>
-			</view>
-			<view class="td">
-				<image class="im1" src="../../static/images/zone.png" style="width: 150rpx; height: 150rpx;"></image>
-			<view>QQ空间</view>
-			</view>
-		</view>
-		<!-- #endif -->
-		<!-- #ifdef MP-WEIXIN -->
-		<view class="list3">
-			<view class="td">
-				<image class="im1" src="../../static/images/wechat.png" style="width: 150rpx; height: 150rpx;"></image>
-			<view>微信</view>
-			</view>
-			<view class="td">
-				<image class="im1" src="../../static/images/circle_of_friends.png" style="width: 150rpx; height: 150rpx;"></image>
-			<view>微信朋友圈</view>
-			</view>
-			<!-- <view class="td">
-				<image class="im1" src="../../static/images/zone.png" style="width: 150rpx; height: 150rpx;"></image>
+  <view>
+    <!-- 分享弹窗 -->
+    <view mode="aspectFill" @click.stop="ShowHidden = !ShowHidden">
+      <image
+        class="im"
+        src="/static/images/详情页.分享.icon.png"
+        style="width: 50rpx; height: 50rpx"
+      ></image>
+    </view>
+    <view class="all" v-if="ShowHidden">
+      <!-- #ifdef APP-PLUS -->
+      <view class="list">
+        <view class="td">
+          <image
+            class="im1"
+            src="/static/images/wechat.png"
+            style="width: 150rpx; height: 150rpx"
+          ></image>
+          <view>微信</view>
+        </view>
+        <view class="td">
+          <image
+            class="im1"
+            src="/static/images/circle_of_friends.png"
+            style="width: 150rpx; height: 150rpx"
+          ></image>
+          <view>微信朋友圈</view>
+        </view>
+        <view class="td">
+          <image
+            class="im1"
+            src="/static/images/zone.png"
+            style="width: 150rpx; height: 150rpx"
+          ></image>
+          <view>QQ空间</view>
+        </view>
+      </view>
+      <!-- #endif -->
+      <!-- #ifdef MP-WEIXIN -->
+      <view class="list3">
+        <view class="td">
+          <image
+            class="im1"
+            src="/static/images/wechat.png"
+            style="width: 150rpx; height: 150rpx"
+          ></image>
+          <view>微信</view>
+        </view>
+        <view class="td">
+          <image
+            class="im1"
+            src="/static/images/circle_of_friends.png"
+            style="width: 150rpx; height: 150rpx"
+          ></image>
+          <view>微信朋友圈</view>
+        </view>
+        <!-- <view class="td">
+				<image class="im1" src="/static/images/zone.png" style="width: 150rpx; height: 150rpx;"></image>
 			<view>QQ空间</view>
 			</view> -->
-		</view>
-		<!-- #endif -->
-		<!-- #ifdef APP-PLUS -->
-		<view class="list1">
-			<view class="td">
-				<image class="im1" src="../../static/images/QQ.png" style="width: 150rpx; height: 150rpx;"></image>
-			<view>微信</view>
-			</view>
-			<view class="td">
-				<image class="im1" src="../../static/images/wechat_collect.png" style="width: 150rpx; height: 150rpx;"></image>
-			<view>微信朋友圈</view>
-			</view>
-			<view class="td">
-				<image class="im1" src="../../static/images/microblog.png" style="width: 150rpx; height: 150rpx;"></image>
-			<view>QQ空间</view>
-			</view>
-		</view>
-		<!-- #endif -->
-		</view>
-	</view>
+      </view>
+      <!-- #endif -->
+      <!-- #ifdef APP-PLUS -->
+      <view class="list1">
+        <view class="td">
+          <image
+            class="im1"
+            src="/static/images/QQ.png"
+            style="width: 150rpx; height: 150rpx"
+          ></image>
+          <view>微信</view>
+        </view>
+        <view class="td">
+          <image
+            class="im1"
+            src="/static/images/wechat_collect.png"
+            style="width: 150rpx; height: 150rpx"
+          ></image>
+          <view>微信朋友圈</view>
+        </view>
+        <view class="td">
+          <image
+            class="im1"
+            src="/static/images/microblog.png"
+            style="width: 150rpx; height: 150rpx"
+          ></image>
+          <view>QQ空间</view>
+        </view>
+      </view>
+      <!-- #endif -->
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				ShowHidden:false,
-			}
-		},
-		methods: {
-			HiddenClick(){
-				this.ShowHidden=false
-			},
-		}
-	}
+export default {
+  data() {
+    return {
+      ShowHidden: false,
+    };
+  },
+  methods: {
+    HiddenClick() {
+      this.ShowHidden = false;
+    },
+  },
+};
 </script>
 
 <style>
-.im{
-		margin-top: 15rpx;
-		margin-left: 220rpx;
-	}
-	.all{
-		margin-top: -200rpx;
-		width: 100%;
-		position: absolute;
-		height: 38%;
-		background-color: #F8F8F8;
-		right: 0rpx;
-		margin-top: 100rpx;
-		z-index: 99;
-		margin-top: 760rpx;
-		/* margin-left: 10rpx; */
-	}
-	.list{
-		display: flex;
-		/* margin-top: 669rpx; */
-		
-	}
-	.list1{
-		display: flex;
-		/* margin-top: 500rpx; */
-	}
-	.list3{
-		display: flex;
-		/* margin-top: 200rpx; */
-	}
-	.td{
-		height: 250rpx;
-		width: 300rpx;
-		text-align: center;
-		border: 1rpx solid #F1F1F1;
-		font-size: 28rpx;
-		color: #555555;
-		margin-left: 50rpx;
-	}
-	.im1{
-		margin-top: 30rpx;
-		margin-left: -20rpx;
-	}
+.im {
+  margin-top: 15rpx;
+  margin-left: 220rpx;
+}
+.all {
+  margin-top: -200rpx;
+  width: 100%;
+  position: absolute;
+  height: 38%;
+  background-color: #f8f8f8;
+  right: 0rpx;
+  margin-top: 100rpx;
+  z-index: 99;
+  margin-top: 760rpx;
+  /* margin-left: 10rpx; */
+}
+.list {
+  display: flex;
+  /* margin-top: 669rpx; */
+}
+.list1 {
+  display: flex;
+  /* margin-top: 500rpx; */
+}
+.list3 {
+  display: flex;
+  /* margin-top: 200rpx; */
+}
+.td {
+  height: 250rpx;
+  width: 300rpx;
+  text-align: center;
+  border: 1rpx solid #f1f1f1;
+  font-size: 28rpx;
+  color: #555555;
+  margin-left: 50rpx;
+}
+.im1 {
+  margin-top: 30rpx;
+  margin-left: -20rpx;
+}
 </style>
diff --git a/pages/Setup/Setup.vue b/pages/Setup/Setup.vue
index b200ba4d262a679a239033d5686c591fea03dce2..176156ba0916cbdb127f36a94c5004114b24130d 100644
--- a/pages/Setup/Setup.vue
+++ b/pages/Setup/Setup.vue
@@ -1,100 +1,113 @@
 <template>
-	<view>
-		<view class="top ">
-			<!-- 分割线br1 -->
-			<view class="br1"></view>
-			<navigator url="../readLabel/readLabel">
-			<view class="class1">
-				<view class="neirong">阅读偏好</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image>
-			</view>
-			</navigator>
-			<!-- 分割线br1 -->
-			<view class="br1"></view>
-			<navigator url="/pages_read_circle/pages/index/wuliu">
-			<view class="class1">
-				<view class="neirong">物流偏好</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image> 
+  <view>
+    <view class="top">
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="偏好设置" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
 			</view>
-			</navigator>
-			<!-- 分割线br1 -->
-			<view class="br1"></view>
-			<!-- <navigator url="jszlist">
+		</u-navbar>
+      <!-- 分割线br1 -->
+      <view class="br1"></view>
+      <navigator url="../readLabel/readLabel">
+        <view class="class1">
+          <view class="neirong">阅读偏好</view>
+          <image class="img2" src="/static/images/right_arrow.png"></image>
+        </view>
+      </navigator>
+      <!-- 分割线br1 -->
+      <view class="br1"></view>
+      <navigator url="/pages_read_circle/pages/index/wuliu">
+        <view class="class1">
+          <view class="neirong">物流偏好</view>
+          <image class="img2" src="/static/images/right_arrow.png"></image>
+        </view>
+      </navigator>
+      <!-- 分割线br1 -->
+      <navigator url="/pages_borrow_books/pages/address/address">
+        <view class="class1">
+          <view class="neirong">地址管理</view>
+          <image class="img2" src="/static/images/right_arrow.png"></image>
+        </view>
+      </navigator>
+      <!-- <navigator url="jszlist">
 			<view class="class1">
 				<view class="neirong"></view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image>
+				<image class="img2" src="/static/images/right_arrow.png"></image>
 			</view>
 			</navigator>
 			<view class="br2"></view>
-			
+
 			<navigator url="../allOrders/index">
 				<view class="class1">
 					<view class="neirong"></view>
-					<image class="img2" src="../../static/images/right_arrow.png"></image>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
 				</view>
 			</navigator>
-			
+
 			<view class="br1"></view>
 			<view class="class1">
 				<view class="neirong"></view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image> 
+				<image class="img2" src="/static/images/right_arrow.png"></image>
 			</view>
 			<view class="br1"></view>
 			<navigator url="../return/return">
 				<view class="class1">
 					<view class="neirong"></view>
-					<image class="img2" src="../../static/images/right_arrow.png"></image>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
 				</view>
 			</navigator>
-			
+
 			<view class="br1"></view>
 			<view class="class1">
 				<view class="neirong"></view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image>
+				<image class="img2" src="/static/images/right_arrow.png"></image>
 			</view>
 			<view class="br1"></view> -->
-		</view>
-	</view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
+export default {
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
 		},
-		methods: {
-			
-		}
-	}
+	};
+  },
+  methods: {},
+};
 </script>
 
 <style>
 .br1 {
-		width: 100%;
-		height: 5rpx;
-		background-color: #F5F5F5;
-	}
-.class1{
-		display: flex;
-		width: 100%;
-		height: 80rpx;
-	}
-.neirong{
-		width: 87%;
-		height: 60rpx;
-		margin-left: 30rpx;
-		margin-top: 20rpx;
-	}
-.img2{
-	width: 40rpx;
-	height: 40rpx;
-	margin-top: 20rpx;
-	}
+  width: 100%;
+  height: 5rpx;
+  background-color: #f5f5f5;
+}
+.class1 {
+  display: flex;
+  width: 100%;
+  height: 80rpx;
+}
+.neirong {
+  width: 87%;
+  height: 60rpx;
+  margin-left: 30rpx;
+  margin-top: 20rpx;
+}
+.img2 {
+  width: 40rpx;
+  height: 40rpx;
+  margin-top: 20rpx;
+}
 .br2 {
-		width: 100%;
-		height: 40rpx;
-		background-color: #F5F5F5;
-	}
+  width: 100%;
+  height: 40rpx;
+  background-color: #f5f5f5;
+}
 </style>
diff --git a/pages/Setup/sysSet.vue b/pages/Setup/sysSet.vue
new file mode 100644
index 0000000000000000000000000000000000000000..2466e2794970af7beba2cd5018e149875646b336
--- /dev/null
+++ b/pages/Setup/sysSet.vue
@@ -0,0 +1,130 @@
+<template>
+  <view>
+    <view class="top">
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="设置" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
+      <!-- 分割线br1 -->
+      <view class="br1"></view>
+        <view class="class1">
+          <view class="neirong">帮助与反馈</view>
+          <image class="img2" src="/static/images/right_arrow.png"></image>
+        </view>
+      <!-- 分割线br1 -->
+      <view class="br1"></view>
+        <view class="class1">
+          <view class="neirong">应用升级</view>
+          <image class="img2" src="/static/images/right_arrow.png"></image>
+        </view>
+      <!-- 分割线br1 -->
+	  <view class="br1"></view>
+        <view class="class1">
+          <view class="neirong">关于我们</view>
+          <image class="img2" src="/static/images/right_arrow.png"></image>
+        </view>
+	  <view class="br2"></view>
+	    <view class="class2">
+	      <view class="neirong2">退出登录</view>
+	      <!-- <image class="img2" src="/static/images/right_arrow.png"></image> -->
+	    </view>
+      <!-- <navigator url="jszlist">
+			<view class="class1">
+				<view class="neirong"></view>
+				<image class="img2" src="/static/images/right_arrow.png"></image>
+			</view>
+			</navigator>
+			<view class="br2"></view>
+
+			<navigator url="../allOrders/index">
+				<view class="class1">
+					<view class="neirong"></view>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
+				</view>
+			</navigator>
+
+			<view class="br1"></view>
+			<view class="class1">
+				<view class="neirong"></view>
+				<image class="img2" src="/static/images/right_arrow.png"></image>
+			</view>
+			<view class="br1"></view>
+			<navigator url="../return/return">
+				<view class="class1">
+					<view class="neirong"></view>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
+				</view>
+			</navigator>
+
+			<view class="br1"></view>
+			<view class="class1">
+				<view class="neirong"></view>
+				<image class="img2" src="/static/images/right_arrow.png"></image>
+			</view>
+			<view class="br1"></view> -->
+    </view>
+  </view>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
+		},
+	};
+  },
+  methods: {},
+};
+</script>
+
+<style>
+.br1 {
+  width: 90%;
+  height: 5rpx;
+  background-color: #f5f5f5;
+  margin-left: 30rpx;
+}
+.class1 {
+  display: flex;
+  width: 100%;
+  height: 80rpx;
+  background-color: #FFFFFF;
+}
+.neirong {
+  width: 87%;
+  height: 60rpx;
+  margin-left: 30rpx;
+  margin-top: 20rpx;
+}
+.class2{
+  width: 100%;
+  height: 80rpx;
+  text-align: center;
+  line-height: 80rpx;
+  font-size: 36rpx;
+  background-color: #FFFFFF;
+}
+.neirong2 {
+  width: 87%;
+  height: 60rpx;
+  color: red;
+  margin-left: 30rpx;
+  margin-top: 20rpx;
+}
+.img2 {
+  width: 40rpx;
+  height: 40rpx;
+  margin-top: 20rpx;
+}
+.br2 {
+  width: 100%;
+  height: 20rpx;
+  background-color: #f5f5f5;
+}
+</style>
diff --git a/pages/book-selection-car/book-selection-car.vue b/pages/book-selection-car/book-selection-car.vue
deleted file mode 100644
index 20e4a084c8f450c1520b7a86ece681a8c94ff2b7..0000000000000000000000000000000000000000
--- a/pages/book-selection-car/book-selection-car.vue
+++ /dev/null
@@ -1,311 +0,0 @@
-<template>
-	<view>
-		<!--书籍-->
-		<view class="show">
-			<view class="yuan">
-			</view>
-			
-			<view class="midone">
-				<view class="zhengti">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">致敬老师</view>
-				</view>
-				<view>
-					<view class="s1">作者：
-						<view class="s6">汪魏青</view>
-					</view>
-					<view class="s2">出版社：浙江大学出版社</view>
-					<view class="s7">
-						<view class="s3">出版时间：2017-09-10</view>
-					</view>
-				</view>
-				<view class="aa">
-					<view class="sa">
-						<view class="ss">馆藏：
-							<view class="s5">广州图书馆</view>
-						</view>
-						<view class="s7">
-							<view class="s4">状态：
-								<view class="s5">书易流通/在馆待借</view>
-							</view>
-						</view>
-					</view>
-					<view class="sa2">
-						<button type="warn" class="delete">删除</button>
-					</view>
-				</view>
-
-
-			</view>
-		</view>
-		<!--书籍-->
-		
-		<view class="show">
-			<view class="yuan">
-			</view>
-			
-			<view class="midone">
-				<view class="zhengti">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">致敬老师</view>
-				</view>
-				<view>
-					<view class="s1">作者：
-						<view class="s6">汪魏青</view>
-					</view>
-					<view class="s2">出版社：浙江大学出版社</view>
-					<view class="s7">
-						<view class="s3">出版时间：2017-09-10</view>
-					</view>
-				</view>
-				<view class="aa">
-					<view class="sa">
-						<view class="ss">馆藏：
-							<view class="s5">广州图书馆</view>
-						</view>
-						<view class="s7">
-							<view class="s4">状态：
-								<view class="s5">书易流通/在馆待借</view>
-							</view>
-						</view>
-					</view>
-					<view class="sa2">
-						<button type="warn" class="delete">删除</button>
-					</view>
-				</view>
-		
-		
-			</view>
-		</view>
-		<!--书籍-->
-		<view class="show">
-			<view class="yuan">
-			</view>
-			
-			<view class="midone">
-				<view class="zhengti">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">致敬老师</view>
-				</view>
-				<view>
-					<view class="s1">作者：
-						<view class="s6">汪魏青</view>
-					</view>
-					<view class="s2">出版社：浙江大学出版社</view>
-					<view class="s7">
-						<view class="s3">出版时间：2017-09-10</view>
-					</view>
-				</view>
-				<view class="aa">
-					<view class="sa">
-						<view class="ss">馆藏：
-							<view class="s5">广州图书馆</view>
-						</view>
-						<view class="s7">
-							<view class="s4">状态：
-								<view class="s5">书易流通/在馆待借</view>
-							</view>
-						</view>
-					</view>
-					<view class="sa2">
-						<button type="warn" class="delete">删除</button>
-					</view>
-				</view>
-		
-		
-			</view>
-		</view>
-		
-		<!--书籍-->
-		<view class="show">
-			<view class="yuan">
-			</view>
-			
-			<view class="midone">
-				<view class="zhengti">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">致敬老师</view>
-				</view>
-				<view>
-					<view class="s1">作者：
-						<view class="s6">汪魏青</view>
-					</view>
-					<view class="s2">出版社：浙江大学出版社</view>
-					<view class="s7">
-						<view class="s3">出版时间：2017-09-10</view>
-					</view>
-				</view>
-				<view class="aa">
-					<view class="sa">
-						<view class="ss">馆藏：
-							<view class="s5">广州图书馆</view>
-						</view>
-						<view class="s7">
-							<view class="s4">状态：
-								<view class="s5">书易流通/在馆待借</view>
-							</view>
-						</view>
-					</view>
-					<view class="sa2">
-						<button type="warn" class="delete">删除</button>
-					</view>
-				</view>
-		
-		
-			</view>
-		</view>
-		<!--书籍-->
-		<view class="bottom">
-			<view class="yuan">
-			</view>
-		</view>
-		
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-
-			}
-		},
-		methods: {
-			
-		}
-	}
-</script>
-
-<style>
-	.bottom{
-		border: #EEEEEE 1rpx solid;
-	}
-	.show {
-		border-bottom: 1rpx solid #C8C7CC;
-		display: flex;
-	}
-
-	.delete {
-		width: 110rpx;
-		font-size: 20rpx;
-		height: 50rpx;
-	}
-
-	.sa2 {
-		margin-left: 150rpx;
-		margin-top: 30rpx;
-	}
-
-	.aa {
-		display: flex;
-	}
-
-	.yuan {
-		border-radius: 50%;
-		width: 45rpx;
-		height: 40rpx;
-		border: 1rpx solid #C8C7CC;
-		margin-top: 100rpx;
-		margin-left: 50rpx;
-		margin-right: -70rpx;
-
-	}
-
-	.midone {
-		width: 100%;
-		height: 200rpx;
-		font-size: 30rpx;
-		margin-top: 35rpx;
-		margin-bottom: 50rpx;
-		align-items: center;
-		/* background-color: #007AFF; */
-		margin-left: 40rpx;
-	}
-
-	.zhengti {
-		display: flex;
-		width: 100%;
-		/* background-color: #4CD964; */
-	}
-
-	.imag {
-		margin-left: 30rpx;
-	}
-
-	.midwz {
-		font-size: 28rpx;
-		height: 35rpx;
-		margin-top: -5rpx;
-		align-items: center;
-		margin-left: 30rpx;
-		width: auto;
-		/* background-color:  #333333; */
-	}
-
-	.s1 {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: -120rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-		display: flex;
-	}
-
-	.s2 {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-
-	.s3 {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-
-	.s4 {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #F0AD4E;
-	}
-
-	.ss {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #00BFFF;
-	}
-
-	.s5 {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: -26rpx;
-		align-items: center;
-		margin-left: 60rpx;
-		color: #;
-	}
-
-	.s6 {
-		color: #00BFFF;
-
-	}
-
-	.s7 {
-		height: 35rpx;
-		align-items: center;
-		width: auto;
-		/* display: flex; */
-	}
-</style>
diff --git "a/pages/book_cart/book_cart - \345\211\257\346\234\254.vue" "b/pages/book_cart/book_cart - \345\211\257\346\234\254.vue"
deleted file mode 100644
index de708afcf901810634bdbaa15efed54db2ded6c4..0000000000000000000000000000000000000000
--- "a/pages/book_cart/book_cart - \345\211\257\346\234\254.vue"	
+++ /dev/null
@@ -1,294 +0,0 @@
-<template>
-	
-	<view>
-		<view class="" v-if="flag">
-			购物车空空如也，请<navigator open-type="switchTab" url="../home/home">先选购</navigator>
-		</view>
-		
-		
-		<view class="" v-else>
-			<view class="cartlist">
-				<view class="cartitem" v-for="(item,index) of cartlist" :key="index">
-					<checkbox-group @change="selected(item)">
-						<checkbox class="xuanzhong" :checked="item.flag" />
-					</checkbox-group>
-
-					<image :src="item.proimg" mode=""></image>
-					<view class="itemright">
-						<view class="">
-							{{item.proname}}
-						</view>
-						<view class="">
-							￥{{item.price}}
-							<text @click="reduce(item)">[-]</text>
-							{{item.num}}
-							<text @click="add(item)">[+]</text>
-							<text class="del" @click="del(item,index)">删除</text>
-						</view>
-					</view>
-				</view>
-			</view>
-			<view class="di">
-				<view class="quanxuan">
-					<checkbox-group @change="selectedall()">
-						<checkbox class="quanxuananniu" :checked="allchecked" />全选
-					</checkbox-group>
-				</view>
-				<view class="">
-					总数:{{totalNum}}
-				</view>
-				<view class="">
-					总价:{{totalPrice}}
-				</view>
-			</view>
-		</view>
-		
-		
-		
-	</view>
-</template>
-
-<script>
-	//因为他们的功能我们不能全用上，所以自己封装个简单的（可以不封装）
-	
-	export default { 
-		data() {
-			return { 
-				flag: true, // 用于判断用户购物车是否有商品，没有商品为true，有商品为false
-				cartlist: [], // 购物车商品信息
-				allchecked: true //默认全选为true，因为后台数据没有是否选中的信息
-			}
-		},
-		computed: {
-			// 计算选中商品数量
-			totalNum() {
-				let totalNum = 0;
-				this.cartlist.map(item => {
-					item.flag ? totalNum += item.num : totalNum += 0
-				})
-				return totalNum
-			},
-			//计算选中商品的总价
-			totalPrice() {
-				let totalPrice = 0;
-				this.cartlist.map(item => {
-					item.flag ? totalPrice += item.num * item.price : totalPrice += 0
-				})
-				return totalPrice
-			}
-		},
-		onShow() {
-			try {
-				let userid = uni.getStorageSync('userid') // 提取缓存中的用户id
-				let token = uni.getStorageSync('token') // 提取缓存中的token值
-				if (userid && token) { // 两个值都在的时候才能访问购物车数据，否则跳到登录界面
-					request({
-						url: '/cart',
-						data: {
-							userid,
-							token
-						}
-					}).then(res => {
-						// console.log(res.data.data)
-						if (res.data.code === '10019') {
-							toast({
-								title: '请先登录'
-							})
-							uni.navigateTo({
-								url: '/pages/login/login'
-							})
-						} else if (res.data.code === '10012') {
-							toast({
-								title: '请选择商品'
-							})
-							this.flag = true
-						} else {
-							toast({
-								title: '获取列表成功'
-							})
-							this.flag = false
-							res.data.data.map(item => { //因为后端数据没有是否选中，所以自己加了一条
-								item.flag = true
-							})
-							this.cartlist = res.data.data
-						}
-					})
-				} else {
-					toast({
-						title: '请先登录'
-					})
-					uni.navigateTo({
-						url: '/pages/login/login'
-					})
-				}
-			} catch (e) {
-				//TODO handle the exception
-			}
-		},
-		methods: {
-			// 减号操作
-			reduce(item) {
-				let num = item.num
-				// 需要判断是否会减到0，我在这里是最小为1.
-				if (num > 1) {
-					num -= 1
-				} else {
-					num = 1
-					return
-				}
-				let token = uni.getStorageSync('token')
-				request({
-					url: '/cart/update',
-					data: {
-						token,
-						cartid: item.cartid,
-						num
-					}
-				}).then(res => {
-					if (res.data.code === '10019') {
-						toast({
-							title: '请先登录'
-						})
-						uni.navigateTo({
-							url: '/pages/login/login'
-						})
-					} else {
-						toast({
-							title: '修改数量成功'
-						})
-						item.num = num
-					}
-				})
-			},
-			// 加号操作
-			add(item) {
-				let num = item.num
-				num += 1
-				let token = uni.getStorageSync('token')
-				request({
-					url: '/cart/update',
-					data: {
-						token,
-						cartid: item.cartid,
-						num
-					}
-				}).then(res => {
-					if (res.data.code === '10019') {
-						toast({
-							title: '请先登录'
-						})
-						uni.navigateTo({
-							url: '/pages/login/login'
-						})
-					} else {
-						toast({
-							title: '修改数量成功'
-						})
-						item.num += 1
-					}
-				})
-			},
-			// 删除单挑购物车商品
-			del(item, index) {
-				let token = uni.getStorageSync('token')
-				request({
-					url: '/cart/delete',
-					data: {
-						token,
-						cartid: item.cartid,
-					}
-				}).then(res => {
-					if (res.data.code === '10019') {
-						toast({
-							title: '请先登录'
-						})
-						uni.navigateTo({
-							url: '/pages/login/login'
-						})
-					} else {
-						toast({
-							title: '删除成功'
-						})
-						this.cartlist.splice(index, 1)
-						if (this.cartlist.length === 0) {
-							this.flag = true
-						}
-					}
-				})
-			},
-			// 单个商品前的勾选
-			selected(item) {
-				// console.log(item)
-				item.flag = !item.flag
-				if (!item.flag) {
-					this.allchecked = false
-				} else {
-					const test = this.cartlist.every(item => {
-						return item.flag === true
-					})
-					if (test) {
-						this.allchecked = true
-					} else {
-						this.allchecked = false
-					}
-				}
-			},
-			// 全选按钮
-			selectedall() {
-				this.allchecked = !this.allchecked
-				if (this.allchecked) {
-					this.cartlist.map(item => {
-						item.flag = true
-					})
-				} else {
-					this.cartlist.map(item => {
-						item.flag = false
-					})
-				}
-			}
-
-		}
-	}
-</script>
-
-<style lang="scss">
-	.cartlist {
-		background-color: #999999;
-		padding: 10px;
-
-		.cartitem {
-			background-color: #FFFFFF;
-			height: 50px;
-			margin-bottom: 10px;
-
-			.xuanzhong {
-				float: left;
-				line-height: 50px;
-				padding-left: 5px;
-			}
-
-			image {
-				display: inline-block;
-				height: 40px;
-				width: 40px;
-				padding: 5px 0;
-				float: left;
-			}
-
-			.itemright {
-				display: inline-block;
-				padding: 5px;
-
-				.del {
-					margin-left: 10px;
-					background-color: red;
-					color: #FFFFFF;
-					border-radius: 3px;
-					padding: 0 5px;
-				}
-			}
-		}
-
-	}
-</style>
-
diff --git a/pages/book_cart/book_cart.vue b/pages/book_cart/book_cart.vue
index 1195cea2edd97a12eda85c87c31d8a7bd40ae6a0..e19d6ab72b214da8254e719dbde56e244002a461 100644
--- a/pages/book_cart/book_cart.vue
+++ b/pages/book_cart/book_cart.vue
@@ -1,215 +1,235 @@
 <template>
+
+<view>
+	<!-- 导航栏 -->
+	<view class="top">
+		借书车
+	</view>
 	<!-- 商品列表 -->
-	<view class="pd-20 goods-list">
-		<view class="tis" v-if="goodsList.length==0">购物车是空的哦~</view>
-		<view class="my-10 pd-20 row" v-for="(row, index) in goodsList" :key="index">
-			<!-- 商品 -->
-			<view class="top-firm-info">
-				<view class="">
-					<checkbox color="#8a17c6" :checked="row.selectedAll" @click="firmSelectedAll(index)" />
-				</view>
-				<!-- 图书馆名称 -->
-				<view class="firm-box">
-					<text class="firm-name">{{row.firmName}}</text>
-					<cmd-icon type="chevron-right" size="14" color="#888"></cmd-icon>
-				</view>
-			</view>
-			<!-- 企业商品列表 -->
-			<view class="firm-goods-list" v-for="(goods, i) in row.goods">
-				<view class="">
-					<checkbox color="#8a17c6" :checked="goods.selected" @click="selectedSole(index, i)" />
+	<view class="show">
+		<view class="pd-20 goods-list">
+			<view class="tis" v-if="goodsList.length == 0">借书车是空的哦~</view>
+			<view class="my-10 pd-20 row" v-for="(row, index) in goodsList" :key="index">
+				<!-- 商品 -->
+				<view class="top-firm-info">
+					<view class="">
+						<checkbox color="#8a17c6" :checked="row.selectedAll" @click="firmSelectedAll(index)" />
+					</view>
+					<!-- 图书馆名称 -->
+					<view class="firm-box">
+						<text class="firm-name">{{ row.firmName }}</text>
+						<cmd-icon type="chevron-right" size="14" color="#888"></cmd-icon>
+					</view>
 				</view>
-				<image class="goods-img" :src="goods.img"></image>
-				<view class="right-goods-box">
-					<view class="goods-name">{{goods.name}}</view>
-					<view class="my-10 goods-spec"><text class="text">{{goods.spec}}</text></view>
-					<view class="price-number-box">
-						<view class="red-price">￥{{goods.price}}</view>
-						<view class="number-box">
-							<text class="number-sub" @click="sub(index,i)">-</text>
-							<text class="number-num">{{goods.number}}</text>
-							<text class="number-add" @click="add(index,i)">+</text>
+				<!-- 企业商品列表 -->
+				<view class="firm-goods-list" v-for="(goods, i) in row.goods">
+					<view class="">
+						<checkbox color="#8a17c6" :checked="goods.selected" @click="selectedSole(index, i)" />
+					</view>
+					<image class="goods-img" :src="goods.img"></image>
+					<view class="right-goods-box">
+						<view class="goods-name">{{ goods.name }}</view>
+						<view class="my-10 goods-spec"><text class="text">{{ goods.spec }}</text></view>
+						<view class="price-number-box">
 						</view>
 					</view>
 				</view>
 			</view>
-		</view>
-		<!-- 在其他端显示底部 -->
-		<!-- #ifndef MP-WEIXIN -->
-		<view style="width:100% ;height: 174rpx; background-color: #F2F2F2;"></view>
-		<view class="footer1">
-			<view class="check-box">
-				<checkbox color="#8a17c6" :disabled="!goodsList.length" :checked="isSelectedAllRow" @click="selectedAllRow" />
-			</view>
-			<view class="goods-remove" v-if="selectedAllRowLength" @click="removeGoodsEvent">删除</view>
-			<view class="right-box">
-				<text class="total-cost">总价格<text class="red-price">￥{{sumPrice}}</text></text>
-				<!-- <navigator url="../borrow/borrow"> -->
-					<text class="account">确定借入<text v-if="selectedAllRowLength">({{selectedAllRowLength}})</text></text>
-				<!-- </navigator> -->
+			<!-- 在App端显示底部 -->
+			<!-- #ifdef APP-PLUS -->
+			<view style="width: 100%; height: 60rpx; background-color: #f2f2f2;"></view>
+			<view class="footer1">
+				<view class="check-box">
+					<checkbox color="#574ef5" :disabled="!goodsList.length" :checked="isSelectedAllRow" @click="selectedAllRow" />全选
+				</view>
+				<view class="right-box">
+					<text class="total-cost">合计：<text style="color: #DC2626;">{{selectedAllRowLength}}</text>本</text>
+					<!-- <navigator url="../borrow/borrow"> -->
+					
+					<view class="account" :style="{backgroundColor:selectedAllRowLength? ' #ff3d3d': '#b5b5b5'}" @click="removeGoodsEvent">删除</view>
+					<text class="account" :style="{backgroundColor:selectedAllRowLength? ' #574ef5': '#b5b5b5'}">确定借入</text>
+					<!-- </navigator> -->
+				</view>
 			</view>
-			
-		</view>
-		<!-- #endif -->
-		
+			<!-- #endif -->
 		
-		<!-- 在微信小程序中显示 -->
-		<!-- #ifndef H5 -->
-		<!-- 脚部菜单 -->
-		<view style="width:100% ;height: 26rpx; background-color: #F2F2F2;"></view>
-		<view class="pd-20 footer">
-			<view class="check-box">
-				<checkbox color="#8a17c6" :disabled="!goodsList.length" :checked="isSelectedAllRow" @click="selectedAllRow" />
-			</view>
-			<view class="goods-remove" v-if="selectedAllRowLength" @click="removeGoodsEvent">删除</view>
-			<view class="right-box">
-				<text class="total-cost">总价格<text class="red-price">￥{{sumPrice}}</text></text>
-				<!-- <navigator url="../borrow/borrow"> -->
-					<text class="account">确定借入<text v-if="selectedAllRowLength">({{selectedAllRowLength}})</text></text>
-				<!-- </navigator> -->
+			<!-- 在微信小程序中显示 -->
+			<!-- #ifdef MP-WEIXIN -->
+			<!-- 脚部菜单 -->
+			<view style="width: 100%; height: 60rpx; background-color: #f2f2f2;"></view>
+			<view class="pd-20 footer">
+				<view class="check-box">
+					<checkbox color="#574ef5" :disabled="!goodsList.length" :checked="isSelectedAllRow" @click="selectedAllRow" />全选
+				</view>
+				
+				<view class="right-box">
+					<text class="total-cost">合计：<text style="color: #DC2626;">{{selectedAllRowLength}}</text>本</text>
+					<!-- <navigator url="../borrow/borrow"> -->
+					<view class="account" :style="{backgroundColor:selectedAllRowLength? ' #ff3d3d': '#b5b5b5'}" @click="removeGoodsEvent">删除</view>
+					<text class="account" :style="{backgroundColor:selectedAllRowLength? ' #574ef5': '#b5b5b5'}">确定借入</text>
+					<!-- </navigator> -->
+				</view>
 			</view>
+			<!-- <view style="width:100% ;height: 26rpx; background-color: #F2F2F2;"></view> -->
+			<!-- #endif -->
 		</view>
-		<!-- <view style="width:100% ;height: 26rpx; background-color: #F2F2F2;"></view> -->
-		<!-- #endif -->
-		
 	</view>
+	
 </template>
 <script>
 	export default {
 		data() {
 			return {
-				goodsList: [
-					{
+				background: {
+					background: "#6C40F3",
+				},
+				goodsList: [{
 						firmId: 101,
-						firmName: '锦绣图书馆',
+						firmName: "锦绣图书馆",
 						selectedAll: false,
-						goods: [
-							{
+						goods: [{
 								id: 1,
-								img: '../../static/images/photo.gif',
-								name: '冰与火之歌',
-								spec: ' 《冰与火之歌》是美国作家乔治.马丁创作的长篇小说，该书以荒谬的风格...',
+								img: "/static/images/booklogo.png",
+								name: "冰与火之歌",
+								spec: " 《冰与火之歌》是美国作家乔治.马丁创作的长篇小说，该书以荒谬的风格...",
 								price: 27.5,
 								number: 1,
-								selected: false
-							}, {
+								selected: false,
+							},
+							{
 								id: 2,
-								img: '../../static/images/photo.gif',
-								name: '冰与火之歌',
-								spec: '《冰与火之歌》是美国作家乔治.马丁创作的长篇小说，该书以荒谬的风格...',
+								img: "/static/images/booklogo.png",
+								name: "冰与火之歌",
+								spec: "《冰与火之歌》是美国作家乔治.马丁创作的长篇小说，该书以荒谬的风格...",
 								price: 9.5,
 								number: 2,
-								selected: false
-							}
-						]
-					}, {
+								selected: false,
+							},
+						],
+					},
+					{
 						firmId: 102,
-						firmName: 'GeekFun',
+						firmName: "中山图书馆",
 						selectedAll: false,
-						goods: [
-							{
-								id: 3,
-								img: '../../static/images/photo.gif',
-								name: '冰与火之歌',
-								spec: '《冰与火之歌》是美国作家乔治.马丁创作的长篇小说，该书以荒谬的风格...',
-								price: 17.5,
-								number: 1,
-								selected: false
-							}
-						]
-					}
+						goods: [{
+							id: 3,
+							img: "/static/images/booklogo.png",
+							name: "冰与火之歌",
+							spec: "《冰与火之歌》是美国作家乔治.马丁创作的长篇小说，该书以荒谬的风格...",
+							price: 17.5,
+							number: 1,
+							selected: false,
+						}, 
+						// {
+						// 	id: 2,
+						// 	img: "/static/images/booklogo.png",
+						// 	name: "冰与火之歌",
+						// 	spec: "《冰与火之歌》是美国作家乔治.马丁创作的长篇小说，该书以荒谬的风格...",
+						// 	price: 9.5,
+						// 	number: 2,
+						// 	selected: false,
+						// },
+						],
+					},
 				],
 				isSelectedAllRow: false, // 全选所有商品
 				selectedAllRowList: [],
 				selectedAllRowLength: 0,
-				sumPrice: '0.00' // 总价格
-			}
+				sumPrice: "0.00", // 总价格
+			};
 		},
 		methods: {
-			sub(m,n){
-				if(this.goodsList[m].goods[n].number <= 1){
-					return
+			sub(m, n) {
+				if (this.goodsList[m].goods[n].number <= 1) {
+					return;
 				}
-				this.goodsList[m].goods[n].number--
-				this.sumTotalPrice()
+				this.goodsList[m].goods[n].number--;
+				this.sumTotalPrice();
 			},
-			add(m,n) {
-				this.goodsList[m].goods[n].number++
-				this.sumTotalPrice()
+			add(m, n) {
+				this.goodsList[m].goods[n].number++;
+				this.sumTotalPrice();
 			},
 			// 选择单个商品 m 父  n 子
-			selectedSole (m, n) {
-				this.goodsList[m].goods[n].selected = !this.goodsList[m].goods[n].selected
+			selectedSole(m, n) {
+				this.goodsList[m].goods[n].selected = !this.goodsList[m].goods[n]
+					.selected;
 				// 循环设置父全选 如果全部选中  则父全选选中 否则 不选中
 				for (let i = 0; i < this.goodsList[m].goods.length; i++) {
-					if(this.goodsList[m].goods[i].selected) {
-						this.goodsList[m].selectedAll = true
+					if (this.goodsList[m].goods[i].selected) {
+						this.goodsList[m].selectedAll = true;
 					} else {
-						this.goodsList[m].selectedAll = false
-						break
+						this.goodsList[m].selectedAll = false;
+						break;
 					}
 				}
-				this.computeSelectedAll()
-				this.sumTotalPrice()
+				this.computeSelectedAll();
+				this.sumTotalPrice();
 			},
 			// 全选企业所有商品
-			firmSelectedAll (index) {
-				this.goodsList[index].selectedAll = !this.goodsList[index].selectedAll
+			firmSelectedAll(index) {
+				this.goodsList[index].selectedAll = !this.goodsList[index].selectedAll;
 				for (let i = 0; i < this.goodsList[index].goods.length; i++) {
-					this.goodsList[index].goods[i].selected = this.goodsList[index].selectedAll
+					this.goodsList[index].goods[i].selected = this.goodsList[
+						index
+					].selectedAll;
 				}
-				this.computeSelectedAll()
-				this.sumTotalPrice()
+				this.computeSelectedAll();
+				this.sumTotalPrice();
 			},
 			// 全选所有行
 			selectedAllRow() {
-				this.isSelectedAllRow = this.goodsList.length ? !this.isSelectedAllRow : false
-				let len = this.goodsList.length
+				this.isSelectedAllRow = this.goodsList.length ?
+					!this.isSelectedAllRow :
+					false;
+				let len = this.goodsList.length;
 				for (let i = 0; i < len; i++) {
-					this.goodsList[i].selectedAll = this.isSelectedAllRow
+					this.goodsList[i].selectedAll = this.isSelectedAllRow;
 					for (let j = 0; j < this.goodsList[i].goods.length; j++) {
-						this.goodsList[i].goods[j].selected = this.goodsList[i].selectedAll
+						this.goodsList[i].goods[j].selected = this.goodsList[i].selectedAll;
 					}
 				}
-				this.sumTotalPrice()
+				this.sumTotalPrice();
 			},
 			// 判断全部商品选择
 			computeSelectedAll() {
 				for (let i = 0; i < this.goodsList.length; i++) {
-					if(this.goodsList[i].selectedAll) {
-						this.isSelectedAllRow = true
+					if (this.goodsList[i].selectedAll) {
+						this.isSelectedAllRow = true;
 					} else {
-						this.isSelectedAllRow = false
-						break
+						this.isSelectedAllRow = false;
+						break;
 					}
 				}
 			},
 			// 合计总价格
 			sumTotalPrice() {
 				// 获取选择信息
-				this.getSelectedInfoList()
-				this.sumPrice = 0
-				this.selectedAllRowLength = 0
+				this.getSelectedInfoList();
+				this.sumPrice = 0;
+				this.selectedAllRowLength = 0;
 				for (let i = 0; i < this.selectedAllRowList.length; i++) {
 					for (let j = 0; j < this.selectedAllRowList[i].goods.length; j++) {
-						this.sumPrice += this.selectedAllRowList[i].goods[j].price*this.selectedAllRowList[i].goods[j].number
+						this.sumPrice +=
+							this.selectedAllRowList[i].goods[j].price *
+							this.selectedAllRowList[i].goods[j].number;
 					}
-					this.selectedAllRowLength += this.selectedAllRowList[i].goods.length
+					this.selectedAllRowLength += this.selectedAllRowList[i].goods.length;
 				}
-				this.sumPrice = this.sumPrice.toFixed(2)
+				this.sumPrice = this.sumPrice.toFixed(2);
 			},
 			getSelectedInfoList() {
-				let len = this.goodsList.length
-				this.selectedAllRowList = []
+				let len = this.goodsList.length;
+				this.selectedAllRowList = [];
 				for (let i = 0; i < len; i++) {
-					if(this.goodsList[i].selectedAll) {
-						this.selectedAllRowList.push(this.goodsList[i])
+					if (this.goodsList[i].selectedAll) {
+						this.selectedAllRowList.push(this.goodsList[i]);
 					} else {
 						for (let j = 0; j < this.goodsList[i].goods.length; j++) {
-							if(this.goodsList[i].goods[j].selected) {
-								this.selectedAllRowList.push(this.copyTowArr(i, j))
+							if (this.goodsList[i].goods[j].selected) {
+								this.selectedAllRowList.push(this.copyTowArr(i, j));
 							} else {
-								continue
+								continue;
 							}
 						}
 					}
@@ -217,251 +237,290 @@
 			},
 			// 二位数组复制
 			copyTowArr(m, n) {
-				let arr = {}
+				let arr = {};
 				for (let key in this.goodsList[m]) {
-					arr[key] = this.goodsList[m][key]
+					arr[key] = this.goodsList[m][key];
 				}
-				arr.goods = []
-				arr.goods.push(this.goodsList[m].goods[n])
-				return arr
+				arr.goods = [];
+				arr.goods.push(this.goodsList[m].goods[n]);
+				return arr;
 			},
 			// 删除数据从对象中
-			deleteDataFromObj () {
-				let itemArr = []
+			deleteDataFromObj() {
+				let itemArr = [];
 				for (let i = 0; i < this.goodsList.length; i++) {
-					let item = []
-					let len = Object.keys(JSON.stringify(this.goodsList[i].goods)).length
+					let item = [];
+					let len = Object.keys(JSON.stringify(this.goodsList[i].goods)).length;
 					for (let j = 0; j < this.selectedAllRowList.length; j++) {
 						for (let k = 0; k < this.selectedAllRowList[j].goods.length; k++) {
-							let addr = JSON.stringify(this.goodsList[i].goods).indexOf(JSON.stringify(this.selectedAllRowList[j].goods[k]))
-							if(addr > 1) {
+							let addr = JSON.stringify(this.goodsList[i].goods).indexOf(
+								JSON.stringify(this.selectedAllRowList[j].goods[k])
+							);
+							if (addr > 1) {
 								for (let x in this.goodsList[i].goods) {
-									let len1 = Object.keys(JSON.stringify(this.goodsList[i].goods[x])).length
-									let num = addr - len1 - 1
-									if(num < 0) {
-										break
-									} else { item.push(num) }
+									let len1 = Object.keys(
+										JSON.stringify(this.goodsList[i].goods[x])
+									).length;
+									let num = addr - len1 - 1;
+									if (num < 0) {
+										break;
+									} else {
+										item.push(num);
+									}
 								}
 							} else {
-								item.push(addr - 1)
+								item.push(addr - 1);
 							}
 						}
 					}
-					itemArr.push(item)
+					itemArr.push(item);
 				}
-				for (let i = itemArr.length - 1; i >= 0 ; i--) {
-					let towArr = itemArr[i]
+				for (let i = itemArr.length - 1; i >= 0; i--) {
+					let towArr = itemArr[i];
 					for (let x = towArr.length; x > 0; x--) {
-						console.log(towArr[x-1])
-						if(towArr[x-1] > -1) {
-							this.goodsList[i].goods.splice(towArr[x-1], 1)
-						} else { continue }
+						console.log(towArr[x - 1]);
+						if (towArr[x - 1] > -1) {
+							this.goodsList[i].goods.splice(towArr[x - 1], 1);
+						} else {
+							continue;
+						}
 					}
-					if(!this.goodsList[i].goods.length) {
-						this.goodsList.splice(i, 1)
+					if (!this.goodsList[i].goods.length) {
+						this.goodsList.splice(i, 1);
 					}
 				}
-				this.selectedAllRowList = []
-				this.isSelectedAllRow = false
-				this.computeSelectedAll()
-				this.sumTotalPrice()
+				this.selectedAllRowList = [];
+				this.isSelectedAllRow = false;
+				this.computeSelectedAll();
+				this.sumTotalPrice();
 			},
 			// 将商品移出购物出
 			removeGoodsEvent() {
-				uni.showLoading()
+				uni.showLoading();
 				// 请求接口写在此位置
-				this.deleteDataFromObj()
-				setTimeout(function () {
-					uni.hideLoading()
-				}, 800)
-			}
-		}
-	}
+				this.deleteDataFromObj();
+				setTimeout(function() {
+					uni.hideLoading();
+				}, 800);
+			},
+		},
+	};
 </script>
 <style lang="scss" scoped>
-/deep/checkbox .wx-checkbox-input,
-/deep/uni-checkbox .uni-checkbox-input {
-	border-radius: 50% !important;
-	height: 32rpx;
-	width: 32rpx;
-	margin-top: -8rpx;
-	vertical-align: middle;
-}
-/deep/uni-checkbox .uni-checkbox-input,
-/deep/uni-checkbox .wx-checkbox-input {
-	border-color: #d1d1d1;
-}
-/deep/uni-checkbox:not([disabled]) .uni-checkbox-input,
-/deep/uni-checkbox:not([disabled]) .uni-checkbox-input:hover,
-/deep/checkbox:not([disabled]) .wx-checkbox-input,
-/deep/checkbox:not([disabled]) .wx-checkbox-input:hover {
-	border-color: #d1d1d1;
-}
-/deep/uni-checkbox:not([disabled]) .uni-checkbox-input.uni-checkbox-input-checked:hover,
-/deep/checkbox:not([disabled]) .wx-checkbox-input.uni-checkbox-input-checked:hover {
-	border-color: #8a17c6;
-}
-/deep/uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked,
-/deep/checkbox .wx-checkbox-input.wx-checkbox-input-checked {
-	border-color: #8a17c6;
-}
-/deep/uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked:before,
-/deep/checkbox .wx-checkbox-input.wx-checkbox-input-checked:before{
-	font-size: 28rpx;
-}
-.red-price {
-	color: #F0250F;
-}
-.goods-list{
-	font-size: 36rpx;
-	color: #333333;
-	.row{
-		// border-radius: 20rpx;
-		box-shadow: 0rpx 5rpx 20rpx rgba(#000, .1);
-		.top-firm-info {
-			display: flex;
-			height: 70rpx;
-			line-height: 60rpx;
-			background-color: #F2F2F2;
-			.firm-box{
-				margin-left: 10rpx;
-				.firm-name{
-					font-weight: 600;
-					font-size: 26rpx;
-					color: #646464;
+	/deep/checkbox .wx-checkbox-input,
+	/deep/uni-checkbox .uni-checkbox-input {
+		border-radius: 50% !important;
+		height: 32rpx;
+		width: 32rpx;
+		margin-top: -8rpx;
+		vertical-align: middle;
+	}
+
+	/deep/uni-checkbox .uni-checkbox-input,
+	/deep/uni-checkbox .wx-checkbox-input {
+		border-color: #d1d1d1;
+	}
+
+	/deep/uni-checkbox:not([disabled]) .uni-checkbox-input,
+	/deep/uni-checkbox:not([disabled]) .uni-checkbox-input:hover,
+	/deep/checkbox:not([disabled]) .wx-checkbox-input,
+	/deep/checkbox:not([disabled]) .wx-checkbox-input:hover {
+		border-color: #d1d1d1;
+	}
+
+	/deep/uni-checkbox:not([disabled]) .uni-checkbox-input.uni-checkbox-input-checked:hover,
+	/deep/checkbox:not([disabled]) .wx-checkbox-input.uni-checkbox-input-checked:hover {
+		border-color: #8a17c6;
+	}
+
+	/deep/uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked,
+	/deep/checkbox .wx-checkbox-input.wx-checkbox-input-checked {
+		border-color: #8a17c6;
+	}
+
+	/deep/uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked:before,
+	/deep/checkbox .wx-checkbox-input.wx-checkbox-input-checked:before {
+		font-size: 28rpx;
+	}
+	
+	.show{
+		background-color: #FEFEFE;
+	}
+	.red-price {
+		color: #f0250f;
+	}
+
+	.goods-list {
+		font-size: 36rpx;
+		color: #333333;
+		.row {
+			// border-radius: 20rpx;
+			box-shadow: 0rpx 5rpx 20rpx rgba(#000, 0.1);
+
+			.top-firm-info {
+				display: flex;
+				height: 90rpx;
+				line-height: 90rpx;
+				background-color: #F2F2F2;
+
+				.firm-box {
+					margin-left: 10rpx;
+
+					.firm-name {
+						font-weight: 600;
+						font-size: 26rpx;
+						color: #646464;
+					}
 				}
 			}
-		}
-		.firm-goods-list {
-			display: flex;
-			align-items: center;
-			padding: 32rpx 0 32rpx 10rpx;
-			border-bottom: 1rpx #F1F1F1 solid;
-			.goods-img{
-				width: 150rpx;
-				height: 188rpx;
-				// border-radius: 10rpx;
-			}
-			.right-goods-box{
-				flex: 1;
-				margin-left: 20rpx;
-				.goods-name{
-					overflow: hidden;
-					text-overflow: ellipsis;
-					display: -webkit-box;
-					-webkit-box-orient: vertical;
-					-webkit-line-clamp: 2;
-					line-height: 40rpx;
+
+			.firm-goods-list {
+				display: flex;
+				align-items: center;
+				padding: 32rpx 0 32rpx 10rpx;
+				border-bottom: 1rpx #f1f1f1 solid;
+				.goods-img {
+					width: 150rpx;
+					height: 188rpx;
+					// border-radius: 10rpx;
 				}
-				.goods-spec{
-					.text{
-						padding: 0 10rpx;
-						border-radius: 10rpx;
-						color: #999999;
-						font-size: 24rpx;
-						
+
+				.right-goods-box {
+					flex: 1;
+					margin-left: 20rpx;
+
+					.goods-name {
+						overflow: hidden;
+						text-overflow: ellipsis;
+						display: -webkit-box;
+						-webkit-box-orient: vertical;
+						-webkit-line-clamp: 2;
+						line-height: 40rpx;
 					}
-				}
-				.price-number-box{
-					display: flex;
-					line-height: 46rpx;
-					justify-content: space-between;
-					.number-box{
-						.number-sub,
-						.number-num,
-						.number-add{
-							display: inline-block;
-							min-width: 40rpx;
-							text-align: center;
-							border: 2rpx solid #ccc;
-						}
-						.number-sub{
+
+					.goods-spec {
+						.text {
+							padding: 0 10rpx;
+							border-radius: 10rpx;
+							color: #999999;
+							font-size: 24rpx;
 						}
-						.number-num{
-							min-width: 60rpx;
-							border-left-style: none;
-							border-right-style: none;
+					}
+
+					.price-number-box {
+						display: flex;
+						line-height: 46rpx;
+						justify-content: space-between;
+
+						.number-box {
+
+							.number-sub,
+							.number-num,
+							.number-add {
+								display: inline-block;
+								min-width: 40rpx;
+								text-align: center;
+								border: 2rpx solid #ccc;
+							}
+
+							.number-sub {}
+
+							.number-num {
+								min-width: 60rpx;
+								border-left-style: none;
+								border-right-style: none;
+							}
+
+							.number-add {}
 						}
-						.number-add{}
 					}
 				}
 			}
 		}
 	}
-}
-.footer {
-	position: fixed;
-	left: 0;
-	right: 0;
-	bottom: 0;
-	// margin-bottom: 10rpx;
-	height: 74rpx;
-	line-height: 60rpx;
-	display: flex;
-	justify-content: space-between;
-	.goods-remove{
-		border: solid 2rpx #f06c7a;
-		color: #FAFAFA;
-		padding: 0 30rpx;
+
+	.footer {
+		background-color: #FFFFFF;
+		position: fixed;
+		// bottom: 26rpx;
+		left: 0;
+		right: 0;
+		bottom: 0;
+		margin-bottom: 26rpx;
 		height: 74rpx;
-		width: 158;
-		// border-radius: 30upx;
+		line-height: 60rpx;
 		display: flex;
-		justify-content: center;
-		align-items: center;
-		background-color: #FF3D3D;
-	}
-	.right-box{
-		.total-cost{}
-		.account{
-			display: inline-block;
-			margin-left: 20rpx;
-			padding: 0 10rpx;
-			min-width: 140rpx;
-			// border-radius: 40rpx;
-			text-align: center;
-			color: #fff;
-			background-color: #574ef5;
+		justify-content: space-between;
+
+		.goods-remove {
+			border: solid 2rpx #f06c7a;
+			color: #fafafa;
+			padding: 0 30rpx;
 			height: 74rpx;
-			width: 158;
+			width: 158rpx;
+			// border-radius: 30upx;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			background-color: #ff3d3d;
 		}
-	}
-}
-
 
+		.right-box {			
+			width: 70%;
+			.total-cost {}
+			.account {
+				display: inline-block;
+				margin-left: 20rpx;
+				padding: 0 10rpx;
+				min-width: 158rpx;
+				// border-radius: 40rpx;
+				text-align: center;
+				color: #fff;
+				background-color: #574ef5;
+				height: 74rpx;
+			}
+		}
+	}
 
-.footer1 {
-	// height: 74rpx;
-	line-height: 60rpx;
-	display: flex;
-	// margin-top: 150rpx;
-	justify-content: space-between;
-	.goods-remove{
-		border: solid 2rpx #f06c7a;
-		color: #FAFAFA;
-		padding: 0 30rpx;
+	.footer1 {
+		background-color: #FFFFFF;
 		height: 74rpx;
-		width: 158;
-		// border-radius: 30upx;
+		line-height: 64rpx;
 		display: flex;
-		justify-content: center;
-		align-items: center;
-		background-color: #FF3D3D;
-	}
-	.right-box{
-		.total-cost{}
-		.account{
-			display: inline-block;
-			margin-left: 20rpx;
-			padding: 0 10rpx;
-			min-width: 140rpx;
-			// border-radius: 40rpx;
-			text-align: center;
-			color: #fff;
-			background-color: #574ef5;
+		// margin-top: 74rpx;
+		justify-content: space-between;
+		position: fixed;
+		bottom: 26rpx;
+		// margin-bottom: 26rpx;
+		left: 0;
+		right: 0;
+		.goods-remove {
+			border: solid 2rpx #f06c7a;
+			color: #fafafa;
+			padding: 0 30rpx;
 			height: 74rpx;
 			width: 158;
+			display: flex;
+			justify-content: center;
+			align-items: center;
+			background-color: #ff3d3d;
+		}
+
+		.right-box {
+			width: 70%;
+			margin-left: 20rpx;
+			.total-cost {}
+			.account {
+				display: inline-block;
+				margin-left: 20rpx;
+				padding: 0 10rpx;
+				min-width: 140rpx;
+				// border-radius: 40rpx;
+				text-align: center;
+				color: #fff;
+				background-color: #574ef5;
+				height: 74rpx;
+			}
 		}
 	}
-}
-</style>
\ No newline at end of file
+</style>
diff --git a/pages/classify/classify.vue b/pages/classify/classify.vue
index e8c7e85bd5ab27719cc2178948ea678d0e9bcbc7..2faca76feef219500c088d3aa59a6c21e862661e 100644
--- a/pages/classify/classify.vue
+++ b/pages/classify/classify.vue
@@ -6,34 +6,34 @@
 		<view class="di">
 			<!-- #ifdef APP-PLUS -->
 			<view class="tit">最近使用</view>
-			<image class="more" src="../../static/images/red_clearance_icon.png" style="width: 40rpx; height: 40rpx;"></image>
+			<image class="more" src="/static/images/red_clearance_icon.png" style="width: 40rpx; height: 40rpx"></image>
 			<view class="text">清除</view>
 			<!-- #endif -->
 			<!-- #ifdef MP-WEIXIN -->
 			<view class="tit4">最近使用</view>
-			<image class="more1" src="../../static/images/red_clearance_icon.png" style="width: 40rpx; height: 40rpx;"></image>
+			<image class="more1" src="/static/images/red_clearance_icon.png" style="width: 40rpx; height: 40rpx"></image>
 			<view class="text1">清除</view>
 			<!-- #endif -->
 		</view>
 		<view class="td">
 			<view>
-				<image class="image" src="../../static/images/art_icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+				<image class="image" src="/static/images/art_icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">艺术</view>
 			</view>
 			<view>
-				<image class="image" src="../../static/images/economics_icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+				<image class="image" src="/static/images/economics_icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">经济</view>
 			</view>
 			<view>
-				<image class="image" src="../../static/images/hour_icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+				<image class="image" src="/static/images/hour_icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">小说</view>
 			</view>
 			<view>
-				<image class="image" src="../../static/images/children.icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+				<image class="image" src="/static/images/children.icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">儿童</view>
 			</view>
 			<view>
-				<image class="image" src="../../static/images/aviation_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+				<image class="image" src="/static/images/aviation_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">航天</view>
 			</view>
 		</view>
@@ -48,116 +48,116 @@
 		</view>
 		<!-- #endif -->
 		<view class="td">
-			<view>
-				<image class="image" src="../../static/images/literature_icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="文学" @click="goSubclass">
+				<image class="image" src="/static/images/literature_icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">文学</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/art_icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="艺术" @click="goSubclass">
+				<image class="image" src="/static/images/art_icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">艺术</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/children.icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="儿童" @click="goSubclass">
+				<image class="image" src="/static/images/children.icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">儿童</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/hour_icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="小说" @click="goSubclass">
+				<image class="image" src="/static/images/hour_icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">小说</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/economics_icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="经济" @click="goSubclass">
+				<image class="image" src="/static/images/economics_icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">经济</view>
 			</view>
 		</view>
 		<view class="tr1"></view>
 		<view class="td">
-			<view>
-				<image class="image" src="../../static/images/law_icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="法律" @click="goSubclass">
+				<image class="image" src="/static/images/law_icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">法律</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/military_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="军事" @click="goSubclass">
+				<image class="image" src="/static/images/military_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">军事</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/science_icon2x.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="科技" @click="goSubclass">
+				<image class="image" src="/static/images/science_icon2x.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">科技</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/history_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="历史" @click="goSubclass">
+				<image class="image" src="/static/images/history_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">历史</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/financial_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="金融" @click="goSubclass">
+				<image class="image" src="/static/images/financial_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">金融</view>
 			</view>
 		</view>
 		<view class="tr1"></view>
 		<view class="td">
-			<view>
-				<image class="image" src="../../static/images/politics_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="政治" @click="goSubclass">
+				<image class="image" src="/static/images/politics_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">政治</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/philosophy_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="哲学" @click="goSubclass">
+				<image class="image" src="/static/images/philosophy_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">哲学</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/geography_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="地理" @click="goSubclass">
+				<image class="image" src="/static/images/geography_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">地理</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/horticulture_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="园艺" @click="goSubclass">
+				<image class="image" src="/static/images/horticulture_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">园艺</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/language_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="语言" @click="goSubclass">
+				<image class="image" src="/static/images/language_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">语言</view>
 			</view>
 		</view>
 		<view class="tr1"></view>
 		<view class="td">
-			<view>
-				<image class="image" src="../../static/images/medicine_icon.png" style="width: 50rpx; height: 50rpx;"></image>
-				<view class="name">医学</view>
+			<view data-name="医药" @click="goSubclass">
+				<image class="image" src="/static/images/medicine_icon.png" style="width: 50rpx; height: 50rpx"></image>
+				<view class="name">医药</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/traffic_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="交通" @click="goSubclass">
+				<image class="image" src="/static/images/traffic_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">交通</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/environment_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="环境" @click="goSubclass">
+				<image class="image" src="/static/images/environment_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">环境</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/astronomy_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="天文" @click="goSubclass">
+				<image class="image" src="/static/images/astronomy_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">天文</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/aviation_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="航空" @click="goSubclass">
+				<image class="image" src="/static/images/aviation_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">航空</view>
 			</view>
 		</view>
 		<view class="tr1"></view>
 		<view class="td">
-			<view>
-				<image class="image" src="../../static/images/spaceflight_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="航天" @click="goSubclass">
+				<image class="image" src="/static/images/spaceflight_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">航天</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/mathematics_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="数学" @click="goSubclass">
+				<image class="image" src="/static/images/mathematics_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">数学</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/physics_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="物理" @click="goSubclass">
+				<image class="image" src="/static/images/physics_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">物理</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/chemistry_icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="化学" @click="goSubclass">
+				<image class="image" src="/static/images/chemistry_icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">化学</view>
 			</view>
-			<view>
-				<image class="image" src="../../static/images/forestry.icon.png" style="width: 50rpx; height: 50rpx;"></image>
+			<view data-name="林业" @click="goSubclass">
+				<image class="image" src="/static/images/forestry.icon.png" style="width: 50rpx; height: 50rpx"></image>
 				<view class="name">林业</view>
 			</view>
 		</view>
@@ -168,14 +168,119 @@
 <script>
 	export default {
 		data() {
-			return {
-
-			}
+			return {};
 		},
 		methods: {
-
-		}
-	}
+			
+			//跳转到子类
+			goSubclass(e){
+				console.log(e.currentTarget.dataset.name);
+				let name = e.currentTarget.dataset.name;
+				if(name==="文学"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=I&name='+name
+					});
+				}else if(name==="艺术"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=J&name='+name
+					});
+				}else if(name==="儿童"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=I28&name='+name
+					});
+				}else if(name==="小说"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=I24&name='+name
+					});
+				}else if(name==="经济"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=F&name='+name
+					});
+				}else if(name==="法律"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=D9&name='+name
+					});
+				}else if(name==="军事"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=E&name='+name
+					});
+				}else if(name==="科技"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=G3&name='+name
+					});
+				}else if(name==="历史"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=K&name='+name
+					});
+				}else if(name==="金融"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=F83&name='+name
+					});
+				}else if(name==="政治"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=D&name='+name
+					});
+				}else if(name==="哲学"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=B&name='+name
+					});
+				}else if(name==="地理"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=K9&name='+name
+					});
+				}else if(name==="园艺"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=S6&name='+name
+					});
+				}else if(name==="语言"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=H&name='+name
+					});
+				}else if(name==="医药"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=R&name='+name
+					});
+				}else if(name==="交通"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=U&name='+name
+					});
+				}else if(name==="环境"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=X&name='+name
+					});
+				}else if(name==="天文"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=P1&name='+name
+					});
+				}else if(name==="航空"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=V&name='+name
+					});
+				}else if(name==="航天"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=V3&name='+name
+					});
+				}else if(name==="数学"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=O1&name='+name
+					});
+				}else if(name==="物理"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=O4&name='+name
+					});
+				}else if(name==="化学"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=O6&name='+name
+					});
+				}else if(name==="林业"){
+					uni.navigateTo({
+					    url: '/pages/jianshu/subclass?classificationSymbol=S7&name='+name
+					});
+				}
+			},
+			
+		},
+	};
 </script>
 
 <style>
@@ -190,7 +295,7 @@
 	}
 
 	.di {
-		background-color: #F1F1FF;
+		background-color: #f1f1ff;
 		width: 100%;
 		display: flex;
 		height: 80rpx;
@@ -208,25 +313,25 @@
 
 	.text {
 		margin-top: 18rpx;
-		color: #FF3D3D;
+		color: #ff3d3d;
 	}
 
 	.text1 {
 		margin-top: 24rpx;
-		color: #FF3D3D;
+		color: #ff3d3d;
 		margin-left: 10rpx;
 	}
 
 	.tr {
 		width: 100%;
 		height: 5rpx;
-		background-color: #F1F1F1;
+		background-color: #f1f1f1;
 	}
 
 	.tr1 {
 		width: 100%;
 		height: 3rpx;
-		background-color: #F1F1F1;
+		background-color: #f1f1f1;
 	}
 
 	.tit {
@@ -248,7 +353,7 @@
 	.td {
 		display: flex;
 		height: 150rpx;
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		width: 100%;
 	}
 
diff --git a/pages/friend/friend.vue b/pages/friend/friend.vue
index f1df16303bd89c4183c4c498373e876d737631ca..c640f9cc7063e98ccae41a4703f5d611516f4712 100644
--- a/pages/friend/friend.vue
+++ b/pages/friend/friend.vue
@@ -1,34 +1,48 @@
 <template>
-	<view>
-		<view class="tq"></view>
-		<view class="container">
-			<view class="top">
-				<view class="tab" style="width: 100%; height: 90rpx;">
-					<navigator url="friends_rank">
-						<image @click="back" class="back" src="../../static/images/address_book.png" style="width: 70rpx; height: 70rpx;"></image>
-					</navigator>
-					<view class="tit2">
-						<scroll-view class="scroll-container" scroll-x scroll-with-animation v-if="brands.length > 1" :scroll-into-view="'s' + currentIndex">
-							<view :class="['scroll-item', { active: index == currentId }]" :id="'s' + index" v-for="(item, index) in brands"
-							 :key="index" @tap="handleScroll(index)">
-								{{ item }}
-								<view class="bottom-border" v-if="index == currentId">
-								</view>
+	<view class="page">
+		<view class="top">
+			<view class="tab" style="width: 100%; height: 90rpx;">
+				<navigator url="friends_rank">
+					<image @click="back" class="back" src="/static/images/friendsort.png" style="width: 70rpx; height: 70rpx;"></image>
+				</navigator>
+				<view class="tit2">
+					<scroll-view class="scroll-container" scroll-x scroll-with-animation v-if="brands.length > 1" :scroll-into-view="'s' + currentIndex">
+						<view :class="['scroll-item', { active: index == currentId }]" :id="'s' + index" v-for="(item, index) in brands"
+						 :key="index" @tap="handleScroll(index)">
+							{{ item }}
+							<view class="bottom-border" v-if="index == currentId">
 							</view>
-						</scroll-view>
-					</view>
-					<navigator url="./friendSearch">
-						<image class="shua1" src="../../static/images/Fsearch.png" style="width: 45rpx; height: 45rpx;"></image>
-					</navigator>
+						</view>
+					</scroll-view>
 				</view>
+				<navigator url="./friendSearch">
+					<image class="shua1" src="/static/images/Fsearch.png" style="width: 45rpx; height: 45rpx;"></image>
+				</navigator>
 			</view>
 		</view>
-		<u-index-list :scrollTop="scrollTop">
-			<view v-for="(item, index) in indexList" :key="index">
-				<u-index-anchor :index="item" />
-				<view class="list-cell u-flex"  v-for="(item1,index1) in (currentId===1?user1:user2).filter(u=>u.username.startsWith(item))"  :key="index1">
-					<u-avatar size="60" :src="item1.url"></u-avatar>
-					{{item1.username}}
+		<u-index-list class="u_index_list" :scrollTop="scrollTop">
+			<!-- <view v-for="(item, index) in indexList" :key="index"> -->
+			<u-index-anchor />
+			<view v-if="currentId===1">
+				<!-- 关注 -->
+				<view class="list-cell u-border-bottom" style="margin-top: 20rpx;" v-for="(item1,index1) in user2" :key="index1">
+					<view class="nike_name" @click="toPersonalHome(item1.followerId)">
+						<view>
+							<u-avatar size="60" :src="item1.follower.avatar"></u-avatar>
+						</view>
+						<view class="nike_name2">{{item1.follower.readerName}}</view>
+					</view>
+				</view>
+			</view>
+			<view v-else>
+				<!-- 好友 -->
+				<view class="list-cell u-border-bottom" style="margin-top: 10rpx;" v-for="(item1,index1) in user1" :key="index1">
+					<view class="nike_name" @tap="toPersonalHome(item1.friendId)">
+						<view>
+							<u-avatar size="60" :src="item1.avatar"></u-avatar>
+						</view>
+						<view class="nike_name2">{{item1.readerName}}</view>
+					</view>
 				</view>
 			</view>
 		</u-index-list>
@@ -36,6 +50,11 @@
 </template>
 
 <script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
 		data() {
 			return {
@@ -50,7 +69,7 @@
 				indexList: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U",
 					"V", "W", "X", "Y", "Z"
 				],
-				user1:[{
+				/* user1:[{
 					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
 					username:"VBDF"
 				},{
@@ -63,9 +82,10 @@
 					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
 					username:"BAAA"
 				},{
-					url:"com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
+					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
 					username:"BCCC"
-				}],
+				}], */
+				user1:[],
 				user2:[{
 					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
 					username:"ADDD"
@@ -79,16 +99,34 @@
 					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
 					username:"D"
 				},{
-					url:"com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
+					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
 					username:"Agjygjy"
 				}]
 			}
 		},
+		onLoad(){
+			this.getMyFriends(); //获取我的朋友列表
+
+				},
 		methods: {
 			handleScroll(index) {
 				this.currentId = index;
 				console.log(this.currentId)
 			},
+			//获取我的朋友列表
+			async getMyFriends() {
+				var that = this;
+				var params = {
+					url: "friends/myFriends",
+					type: 'GET',
+					data: {}
+				}
+				const res = await app.myRequest(params);
+				that.user1 = res;
+				console.log(res);
+
+
+			},
 		},
 		onPageScroll(e) {
 			this.scrollTop = e.scrollTop;
@@ -97,14 +135,29 @@
 </script>
 
 <style lang="scss" scoped>
-	.tq {
-		height: 80rpx;
-		background-color: #6C40F3;
+	.page /deep/.u-index-bar__sidebar{
+		top: 54%;
 	}
+	.page /deep/.u-index-bar{
+		position: relative;
+		top: 122px;
+	}
+	.top{
+		width: 100%;
+		// height: 500rpx;
+		position: fixed;
+		top: 0;
+		z-index: 999;
 
+		height: 195rpx;
+		background-color: #6C40F3;
+		text-align: center;
+	}
 	.tab {
+		margin-top:100rpx;
 		display: flex;
 		background-color: #6C40F3;
+
 	}
 
 	.tit2 {
@@ -125,11 +178,7 @@
 		margin-left: 55rpx;
 	}
 
-	.top {
-		height: 95rpx;
-		background-color: #6C40F3;
-		text-align: center;
-	}
+
 
 	.scroll-container {
 		margin-left: 120rpx;
@@ -160,12 +209,11 @@
 		}
 
 		.bottom-border {
-			margin: 0 auto;
+			// margin: 0 auto;
 			width: 50upx;
 			height: 5upx;
 		}
 	}
-
 	.list-cell {
 		display: flex;
 		box-sizing: border-box;
diff --git a/pages/friend/friendSearch.vue b/pages/friend/friendSearch.vue
index c38a18ebd7c45bb20a29b38583017c1906674238..b3a20b92d01e40446c3a3d4db09ede2b5832c2c6 100644
--- a/pages/friend/friendSearch.vue
+++ b/pages/friend/friendSearch.vue
@@ -1,72 +1,193 @@
 <template>
 	<view>
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="搜索好友" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<view class="top">
-		<view class="header-input">
-			<view>
-				<image class="image" src="../../static/images/search_icon.png">
-				</image>
+			<view class="header-input">
+				<view>
+					<image class="image" src="../../static/images/search_icon.png">
+					</image>
+				</view>
+				<input v-model="name" placeholder="请输入好友昵称或者手机号..." placeholderStyle="color:#BBBBBB" type="text"></input>
 			</view>
-			<input @input="goToSearch" placeholder="请输入关键字" placeholderStyle="color:#BBBBBB" type="text"></input>
+			<view class="ssuo" @click="goToSearch()">搜索</view>
+		</view>
+		<view v-if="type==1">
+
 		</view>
-		<view class="ssuo">搜索</view>
+		<view v-else>
+			<view v-if="findFriendsList !=undefined && findFriendsList.length > 0">
+				<view class="show" v-for="(item,index) in findFriendsList" :key="index">
+					<view @tap="toPersonalHome(item.reader_id)" class="info">
+						<view class="img" >
+							<view v-if="item.avatar != null">
+								<image :src="item.avatar" style="width: 80rpx; height: 80rpx; border-radius: 50%; margin-top: 10rpx; border: solid 1rpx #0066CC;"></image>
+							</view>
+							<view v-else>
+								<image :src="getImg()" style="width: 80rpx; height: 80rpx; border-radius: 50%; margin-top: 10rpx;border: solid 1rpx #0066CC;"></image>
+							</view>
+						</view>
+						<view class="np">
+							<view class="name">{{item.reader_name}}</view>
+							<view class="phone">{{item.phone_num}}</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			<view v-else>
+				<view style="width: 100%;height: 100rpx;text-align: center;margin-top: 60rpx;">
+					<view>
+						没有搜索到相关结果
+					</view>
+				</view>
+			</view>
 		</view>
+
 	</view>
 </template>
 
 <script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
 		data() {
 			return {
-				
+        background: {
+          background: "#6C40F3",
+        },
+				name: '',
+				/*搜索框内容*/
+				findFriendsList: [],
+				type: 1,
 			}
 		},
+		/* onLoad(){
+			this.goToSearch();
+				}, */
 		methods: {
-			
+			//根据昵称进行模糊查询
+			async goToSearch() {
+				var that = this;
+				if (this.name === '') {
+					this.type = 1;
+					uni.showToast({
+						icon: "none",
+						title: '搜索内容不能为空！',
+						duration: 2000
+					});
+				} else {
+					this.type = 2;
+					var params = {
+						url: "friends/queryByName",
+						type: 'GET',
+						data: {
+							size: 10,
+							page: 0,
+							name: this.name
+						}
+					}
+					const res = await app.myRequest(params);
+					console.log("好友列表111：", res);
+					that.findFriendsList = res;
+				}
+			},
+			//去他的主页
+			toPersonalHome(friendId) {
+				uni.navigateTo({
+					url: "/pages/friend/friendXQ?friendId=" + friendId,
+				})
+			},
 		}
 	}
 </script>
 
 <style>
-.top{
+	.info{
+		display: flex;
+	}
+	.top {
 		/* background-color: #007AFF; */
 		height: 90rpx;
 		box-shadow: #EDEDED 0rpx 0rpx 0rpx 0rpx;
 	}
+
 	.header-input {
-	    margin-left: 30rpx;
-	    margin-top: 30rpx;
-	    width: 600rpx;
-	    height: 66rpx;
-	    border-radius: 36rpx;
+		margin-left: 30rpx;
+		margin-top: 30rpx;
+		width: 600rpx;
+		height: 66rpx;
+		border-radius: 36rpx;
 		background-color: #F8F8F8;
-	    /* border: 1rpx solid #E3E3E3; */
-	    display: flex;
-	    flex-direction: row;
+		/* border: 1rpx solid #E3E3E3; */
+		display: flex;
+		flex-direction: row;
 		/* box-shadow: #007AFF 1rpx 1rpx 5rpx 1rpx; */
-	} 
+	}
+
 	.header-input input {
-	    margin-left: 5rpx;
-	    width: 479rpx;
-	    height: 66rpx;
-	    line-height: 66rpx;
-	    /* border-right: 1rpx solid #dfdfdf; */
-	    font-size: 28rpx;
+		margin-left: 5rpx;
+		width: 479rpx;
+		height: 66rpx;
+		line-height: 66rpx;
+		/* border-right: 1rpx solid #dfdfdf; */
+		font-size: 28rpx;
 	}
-	
+
 	.header-input view {
-	    width: 96rpx;
-	    height: 66rpx;
+		width: 96rpx;
+		height: 66rpx;
 	}
-	
+
 	.image {
-	    margin-left: 30rpx;
-	    margin-top: 5rpx;
-	    width: 60rpx;
-	    height: 60rpx;
+		margin-left: 30rpx;
+		margin-top: 5rpx;
+		width: 60rpx;
+		height: 60rpx;
 	}
-	.ssuo{
+
+	.ssuo {
 		margin-top: -50rpx;
 		text-align: right;
 		margin-right: 30rpx;
 	}
+
+	.show {
+		background-color: #F5F5F5;
+		width: 100%;
+		height: 100%;
+		display: flex;
+		margin-top: 5rpx;
+		margin-bottom: 5rpx;
+	}
+
+	.img {
+		margin-left: 30rpx;
+		margin-top: 20rpx;
+		height: 100rpx;
+	}
+
+	.name {
+		color: #00aaff;
+		font-size: 28rpx;
+		margin-top: 34rpx;
+		margin-left: 40rpx;
+	}
+
+	.phone{
+		font-size: 25rpx;
+		margin-top: 12rpx;
+		margin-left: 36rpx;
+	}
+	.np{
+		flex-direction:row-reverse
+	}
 </style>
diff --git a/pages/friend/friendXQ.vue b/pages/friend/friendXQ.vue
new file mode 100644
index 0000000000000000000000000000000000000000..7cc5bfc5ab4c0dbc4db20ec487b5e0d8bd859781
--- /dev/null
+++ b/pages/friend/friendXQ.vue
@@ -0,0 +1,547 @@
+<template>
+	<view>
+		<view class="tq"></view>
+		<view class="tab" style="width: 100%; height: 90rpx;">
+			<view @click="back()">
+				<image class="back" src="/static/images/turn_left_two_return2x.png" style="width: 64rpx; height: 64rpx;"></image>
+			</view>
+			<view class="tit2">{{readerInfo.reader.readerName}}</view>
+			<view class="friend_more" @click="more()">
+				<image src="/static/images/friend_more.png" style="width: 50rpx; height: 50rpx;"></image>
+			</view>
+		</view>
+		<view class="top">
+
+			<view class="tou">
+				<image class="topimage" :src="readerInfo.reader.avatar" style="width: 155rpx;height: 155rpx;border-radius: 50%;"></image>
+				<view class="cancel_tab">
+					<view class="cancel" v-if="isFriend.isFollow" @click="showModal1(readerInfo.reader.readerName)">不再关注</view>
+					<view class="cancel" v-else @click="follow()">+关注</view>
+				</view>
+			</view>
+			<view class="dj">
+				<view class="vip">LV.{{readerInfo.max}}</view>
+				<view class="denji">{{readerInfo.name}}</view>
+			</view>
+		</view>
+		<view class="one">
+			<view class="title">个性签名</view>
+		</view>
+		<view class="two">
+			<view class="gq">{{readerInfo.reader.signature}}</view>
+		</view>
+		<view class="one">
+			<view class="title">读过的书</view>
+		</view>
+
+		<view class="mid" v-for="item in recentlyBook">
+			<navigator :url="'/pages/Bdetail/Bdetail?isbn=' + item.ISBN">
+				<view class="imgs">
+					<image class="img" :src="item.picture_path" style="width: 180rpx; height: 200rpx;"></image>
+				</view>
+			</navigator>
+		</view>
+		<view v-if="recentlyBook.length==0" class="recentlyBook" @click="toBorrow()">
+			他还没有读书记录！
+			<!-- <span style="color: #00AAFF;">快去借书吧!</span> -->
+		</view>
+		<view class="one">
+			<view class="title">我的心得</view>
+		</view>
+		<navigator url="/pages_read_circle/pages/index/MyExperience">
+			<view class="below">
+				<view class="belowone">
+					<view class="note">
+						<view class="notetitle">
+							《学习心得》
+						</view>
+						<view class="time">
+							2020-08-09
+						</view>
+					</view>
+					<view class="nr">
+						平时多记记，到用时才能看看，记录你的进步，分享你的成果
+					</view>
+				</view>
+				<view class="br1"></view>
+				<view class="belowone">
+					<view class="note">
+						<view class="notetitle">
+							《学习心得》
+						</view>
+						<view class="time">
+							2020-08-09
+						</view>
+					</view>
+					<view class="nr">
+						平时多记记，到用时才能看看，记录你的进步，分享你的成果
+					</view>
+				</view>
+			</view>
+		</navigator>
+	</view>
+</template>
+<script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
+	export default {
+		data() {
+			return {
+				readerInfo: {}, //读者信息
+				recentlyBook: [], //最近读的
+				isFriend: {}, //是否是朋友或者已关注
+				friendId: null,
+				itemList:[],//底部弹出框
+				flag:false //判断是哪一个弹框
+			}
+		},
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
+		onLoad(e) {
+			console.log("前面传过来的：", e)
+			this.friendId = parseInt(e.friendId);
+			this.getInfo(parseInt(e.friendId));
+			this.getIsFriend(parseInt(e.friendId))
+		},
+		methods: {
+			//获取信息
+			async getInfo(id) {
+				var that = this;
+				var params = {
+					url: "reader/personal",
+					type: 'GET',
+					data: {
+						readerId: id
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log(res)
+				that.readerInfo = res.readerInfo;
+				that.recentlyBook = res.zjds;
+			},
+
+			//判断是否是朋友或者已经关注
+			async getIsFriend(friendId) {
+				var that = this;
+				var params = {
+					url: "friends/isFriend",
+					type: 'GET',
+					data: {
+						friendId: friendId
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log("isFriend:", res)
+				that.isFriend = res
+				if(res.isFriend){
+					that.itemList = ['去聊天', '删除好友']
+					that.flag = true
+				}else{
+					that.itemList = ['添加好友']
+
+				}
+			},
+
+			//三个点点
+			more() {
+				var that = this
+				uni.showActionSheet({
+					itemList: this.itemList,
+					success: function(res) {
+						console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
+						if(res.tapIndex + 1 ==1 && that.flag){
+							//去聊天
+							console.log("去聊天！")
+							console.log("对方id",that.friendId)
+							that.toChat()
+						}else if(res.tapIndex + 1 ==2 && that.flag){
+							//删除好友
+							console.log("删除好友！")
+							that.showModal(that.readerInfo.reader.readerName)
+						}else if(res.tapIndex + 1 ==1 && !that.flag){
+							//添加好友
+							console.log("添加好友！")
+							that.apply();
+						}
+					},
+					fail: function(res) {
+						console.log(res.errMsg);
+					}
+				});
+			},
+
+
+			//添加好友
+			async apply() {
+				var that = this;
+				console.log("添加好友",that.friendId)
+				var params = {
+					url: "friends/apply",
+					type: 'GET',
+					data: {
+						friendId: that.friendId
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log("apply: ", res)
+				if (res) {
+					uni.showToast({
+						title: '已成功发出好友申请！',
+						icon: 'none'
+					});
+				}
+			},
+
+			//删除好友
+			async delFriend() {
+				var that = this;
+				var params = {
+					url: "friends/delete",
+					type: 'GET',
+					data: {
+						relationId: that.isFriend.relationId
+					}
+				}
+				const res = await app.myRequest(params);
+				if (res) {
+					//提示框
+					uni.showToast({
+						title: '好友已删除！',
+						icon: 'none'
+					});
+					setTimeout(function() {
+						uni.navigateBack({
+							success: () => {
+								let page = getCurrentPages().pop(); //跳转页面成功之后
+								if (!page) return;
+								page.onLoad();
+							}
+						})
+					}, 2000)
+				} else {
+					uni.showToast({
+						title: '网络繁忙请稍后再试！',
+						icon: 'none'
+					});
+				}
+			},
+
+			//关注好友
+			async follow() {
+				var that = this;
+				var params = {
+					url: "follow/follow",
+					type: 'GET',
+					data: {
+						followerId: that.friendId
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log("follow: ", res)
+				if (res) {
+					that.getIsFriend(that.friendId);
+					uni.showToast({
+						title: '您已成功关注了“' + that.readerInfo.reader.readerName + '”!',
+						icon: 'none'
+					});
+				} else {
+
+				}
+			},
+
+			//取消关注
+			async cancelFollow() {
+				var that = this;
+				var params = {
+					url: "follow/cancelFollow",
+					type: 'GET',
+					data: {
+						followerId: that.friendId
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log("follow: ", res)
+				if (res) {
+					that.getIsFriend(that.friendId);
+					uni.showToast({
+						title: '已经取消关注！',
+						icon: 'none'
+					});
+				} else {
+					uni.showToast({
+						title: '网络繁忙请稍后再试！',
+						icon: 'none'
+					});
+				}
+			},
+
+			showModal(e) {
+				console.log("要删除的：", e)
+				uni.showModal({
+					content: '删除好友“' + e + '”后将不再收到其下发的消息',
+					success: (res) => {
+						if (res.confirm) {
+							console.log('用户点击确定');
+							this.delFriend()
+						} else if (res.cancel) {
+							console.log('用户点击取消');
+						}
+					}
+				})
+			},
+
+			//取消关注
+			showModal1(e) {
+				uni.showModal({
+					content: '不再关注“' + e + '”吗？',
+					success: (res) => {
+						if (res.confirm) {
+							console.log('用户点击确定');
+							this.cancelFollow()
+						} else if (res.cancel) {
+							console.log('用户点击取消');
+						}
+					}
+				})
+			},
+
+			back() {
+				uni.navigateBack({
+					delta: 1
+				})
+			},
+
+			toBorrow() {
+				uni.navigateTo({
+					url: '/pages/classify/classify'
+				});
+			},
+			
+			toChat(){
+				uni.navigateTo({
+					url:`/pages_read_circle/pages/personal/unChat?readerId=${this.friendId}`
+				})
+			}
+		}
+	}
+</script>
+<style>
+	/* 顶部导航条 */
+	.tq {
+		height: 120rpx;
+		background-color: #6C40F3;
+	}
+
+	.tab {
+		display: flex;
+		background-color: #6C40F3;
+	}
+
+	.tit2 {
+		margin-top: 20rpx;
+		color: #FFFFFF;
+		text-align: center;
+		margin-left: 55rpx;
+		/* display: flex; */
+		font-size: 40rpx;
+		width: 67%;
+
+	}
+
+	.back {
+		margin-top: 15rpx;
+		margin-left: 10rpx;
+	}
+
+	.shua1 {
+		margin-top: 28rpx;
+		margin-left: 15rpx;
+
+	}
+
+	/* 头像 */
+	.top {
+		height: 270rpx;
+		text-align: center;
+	}
+
+	.cancel {
+		margin-left: 75rpx;
+		margin-top: 120rpx;
+		text-align: center;
+		width: 170rpx;
+		height: 50rpx;
+		color: #676767;
+		font-size: 26rpx;
+		line-height: 50rpx;
+		border-radius: 35rpx;
+		border: #C3C3C3 1rpx solid;
+		background-color: #FFFFFF;
+	}
+
+	.cancel_tab{
+		width: 171rpx;
+		height: 51rpx;
+	}
+
+	.tou {
+		height: 140rpx;
+		align-items: center;
+		background-color: #6c40f3;
+		display: flex;
+		/* border: 1rpx solid #f0ad4e; */
+	}
+
+	.topimage {
+		margin-left: 300rpx;
+		margin-top: 130rpx;
+		align-items: center;
+		border: 5rpx solid #ffffff;
+	}
+
+	.delate {
+		font-size: 26rpx;
+		margin-left: 60rpx;
+		margin-top: 220rpx;
+		text-align: center;
+		width: 170rpx;
+		height: 50rpx;
+		color: #fefefe;
+		line-height: 50rpx;
+		border-radius: 35rpx;
+		border: #FF3D3D 1rpx solid;
+		background-color: #FF3D3D;
+	}
+
+	/* 等级 */
+	.dj {
+		display: flex;
+		align-items: center;
+	}
+
+	.vip {
+		margin-left: 308rpx;
+		color: #f0ad4e;
+		font-size: 25rpx;
+		border-radius: 10rpx;
+		border: 1rpx solid #f0ad4e;
+		height: 35rpx;
+		margin-top: 80rpx;
+		width: 80rpx;
+		align-items: center;
+	}
+
+	.denji {
+		align-items: center;
+		color: #f0ad4e;
+		font-size: 28rpx;
+		margin-left: 5rpx;
+		margin-top: 80rpx;
+	}
+
+	/* 标题 */
+	.one {
+		background-color: #f5f5f5;
+		display: flex;
+		height: 60rpx;
+	}
+
+	.title {
+		font-size: 28rpx;
+		color: #333333;
+		margin-top: 10rpx;
+		margin-left: 30rpx;
+	}
+
+	.recentlyBook {
+		background-color: #FFFFFF;
+		color: #c3c3c3;
+		font-size: 24rpx;
+		margin: 10rpx 30rpx;
+	}
+
+	.two {
+		display: flex;
+		height: 60rpx;
+	}
+
+	.gq {
+		width: 100%;
+		color: #c3c3c3;
+		/* background-color: #000000; */
+		font-size: 24rpx;
+		margin-top: 10rpx;
+		margin-left: 30rpx;
+	}
+
+	.mid {
+		background-color: #FFFFFF;
+		height: 260rpx;
+		margin: 10rpx 10rpx;
+		display: inline-block;
+	}
+
+	.imgs {
+		width: 95%;
+		margin-left: 20rpx;
+		margin-top: 10rpx;
+		/* display: inline-flex; */
+	}
+
+	.img {
+		size: 100%;
+		margin: 10rpx 12rpx;
+	}
+
+	/* 读书笔记内容 */
+	.below {
+		/* margin: 12rpx 12rpx; */
+	}
+
+	.belowone {
+		height: 160rpx;
+		/* background-color: #008000; */
+	}
+
+	.note {
+		display: flex;
+	}
+
+	.notetitle {
+		margin-top: 50rpx;
+		margin-left: 30rpx;
+		font-size: 26rpx;
+		/* background-color: #000000; */
+		width: 70%;
+	}
+
+	.time {
+		margin-top: 50rpx;
+		margin-left: 15rpx;
+		font-size: 26rpx;
+		color: #E6E6E6;
+	}
+
+	.nr {
+		margin-left: 30rpx;
+		margin-top: 10rpx;
+		font-size: 24rpx;
+		color: #999999;
+	}
+
+	.br1 {
+		width: 100%;
+		height: 3rpx;
+		background-color: #F4F5F6;
+		margin-left: 30rpx;
+	}
+
+	.friend_more {
+		margin-top: 20rpx;
+		margin-left: 50rpx;
+	}
+</style>
diff --git a/pages/friend/friends_rank.vue b/pages/friend/friends_rank.vue
index e66f9c3ed37c842c5a984a0b3b4964ee954125f8..246f26586fc41eb1779d45f32934d60238f44717 100644
--- a/pages/friend/friends_rank.vue
+++ b/pages/friend/friends_rank.vue
@@ -1,146 +1,150 @@
 <template>
 	<view>
-		<view class="top">
-			<view class="ima">
-				<view class="imaone">
-					<image src="../../static/images/头像2.jpg" style="width: 110rpx;height: 110rpx;border-radius: 50%"></image>
+    <!-- 顶部部分 -->
+    <u-navbar zhead="65rpx" height="44" title="好友排行" title-color="white" title-size="40" :background="background"
+              back-icon-color="white" back-icon-size="50">
+      <view class="navbar-right" slot="right">
+        <view class="right_list" @click="bindInBatch">
+        </view>
+      </view>
+    </u-navbar>
+		<view v-for="(item,index) in info" :key="index">
+			<view v-if="item.readerBorrowCount!=0 && (index ==0 || index ==1 || index ==2) ">
+				<view class="top" @click="toPersonalHome(item.friendId)">
+					<view class="ima">
+						<view class="imaone">
+							<image :src="item.avatar" style="width: 100rpx; height: 100rpx; border-radius: 50%"></image>
+						</view>
+						<view class="imatwo">
+							<image :src="item.rank==1?'/static/images/champion.png':item.rank==2?'/static/images/runner_up.png':item.rank==3?'/static/images/third_winner_in_contest.png':null"
+							 style="width: 70rpx; height: 70rpx"></image>
+						</view>
+						<view class="mz">{{item.readerName}}</view>
+					</view>
+					<view class="shulian">
+						<view class="number">{{item.readerBorrowCount}}</view>
+						<view class="danwei">本书</view>
+					</view>
 				</view>
-				<view class="imatwo">	
-					<image src="../../static/images/champion.png" style="width: 60rpx;height: 60rpx;"></image>
-				</view>
-				<view class="mz">肖石榴</view>
-			</view>
-			<view class="shulian">
-				<view class="number">2021</view>
-				<view class="danwei">本书</view>
-			</view>
-		</view>
-		<view class="br2"></view>
-		<view class="top">
-			<view class="ima">
-				<view class="imaone">
-					<image src="../../static/images/头像2.jpg" style="width: 110rpx;height: 110rpx;border-radius: 50%"></image>
-				</view>
-				<view class="imatwo">	
-					<image src="../../static/images/runner_up.png" style="width: 60rpx;height: 60rpx;"></image>
-				</view>
-				<view class="mz">肖石榴</view>
-			</view>
-			<view class="shulian">
-				<view class="number">2020</view>
-				<view class="danwei">本书</view>
-			</view>
-		</view>
-		<view class="br2"></view>
-		<view class="top">
-			<view class="ima">
-				<view class="imaone">
-					<image src="../../static/images/头像2.jpg" style="width: 110rpx;height: 110rpx;border-radius: 50%"></image>
-				</view>
-				<view class="imatwo">	
-					<image src="../../static/images/third_winner_in_contest.icon.png" style="width: 60rpx;height: 60rpx;"></image>
-				</view>
-				<view class="mz">肖石榴</view>
+				<view class="br2"></view>
 			</view>
-			<view class="shulian">
-				<view class="number">2019</view>
-				<view class="danwei">本书</view>
+			<view @click="toPersonalHome(item.friendId)" class="tr" v-else >
+				<view class="BH">{{item.rank}}</view>
+				<image class="image" :src="item.avatar" style="width: 100rpx; height: 100rpx; border-radius: 50%"></image>
+				<view class="minzi">{{item.readerName}}</view>
 			</view>
 		</view>
-		<view class="br2"></view>
-		<view class="tr">
-			<view class="BH">04</view>
-			<image class="image" src="../../static/images/4.jpg" style="width: 110rpx;height: 110rpx;border-radius: 50%;"></image>
-			<view class="minzi">肖石榴</view>
-		</view>
-		<view class="tr">
-			<view class="BH">05</view>
-			<image class="image" src="../../static/images/4.jpg" style="width: 110rpx;height: 110rpx;border-radius: 50%;"></image>
-			<view class="minzi">肖石榴</view>
-		</view>
-		<view class="tr">
-			<view class="BH">06</view>
-			<image class="image" src="../../static/images/4.jpg" style="width: 110rpx;height: 110rpx;border-radius: 50%;"></image>
-			<view class="minzi">肖石榴</view>
-		</view>
 	</view>
 </template>
 
 <script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
 		data() {
 			return {
-				
-			}
+				info: [], //后台数据
+        background: {
+          background: "#6C40F3",
+        },
+			};
+		},
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
+		onLoad() {
+			this.getInfo()
 		},
 		methods: {
-			
+			//获取信息
+			async getInfo() {
+				var that = this;
+				let rid = parseInt(that.userinfo.readerId)
+				var params = {
+					url: "friends/rankingList",
+					type: "GET",
+					data: {
+						readerId: rid
+					},
+				};
+				const res = await app.myRequest(params);
+				that.info = res
+			},
+			//去主页
+			toPersonalHome(friendId) {
+				uni.navigateTo({
+					url: "/pages/friend/friendXQ?friendId=" + friendId,
+				})
+			},
 		}
-	}
+	};
 </script>
 
 <style>
-.top{
-	color: #FFFFFF;
+.top {
+	color: #ffffff;
 	height: 160rpx;
 	/* background-color: #18B566; */
 	display: flex;
-	
+
 	align-items: center;
 	/* text-align: center; */
 }
 .br2 {
-		width: 100%;
-		height: 32rpx;
-		background-color: #F5F5F5;
-	}
-.ima{
+	width: 100%;
+	height: 32rpx;
+	background-color: #f5f5f5;
+}
+.ima {
 	width: 50%;
 	margin-left: 30rpx;
 	/* background-color: yellow; */
 }
-.imaone{
+.imaone {
 	/* background-color: #00AAFF; */
 	margin-top: -20rpx;
 }
-.imatwo{
+.imatwo {
 	margin-top: -140rpx;
 }
-.mz{
-	color: #3B3B3B;
+.mz {
+	color: #3b3b3b;
 	margin-top: -10rpx;
 	margin-left: 160rpx;
 	/* background-color: #0066CC; */
 }
-.shulian{
+.shulian {
 	width: 250rpx;
 	/* background-color: #19BE6B; */
 	display: flex;
 	margin-top: 25rpx;
 	margin-left: 80rpx;
 }
-.number{
+.number {
 	font-size: 32rpx;
 	margin-left: 80rpx;
-	color: #32A0FE;
+	color: #32a0fe;
 }
-.danwei{
+.danwei {
 	font-size: 28rpx;
-	color: #B5B5B5;
+	color: #b5b5b5;
 }
 .tr {
 	height: 155rpx;
 	/* background-color: red; */
 	display: flex;
-	border-bottom: 1rpx solid #F3F4F6;
+	border-bottom: 1rpx solid #f3f4f6;
 	align-items: center;
 	text-align: center;
 }
-.BH{
+.BH {
 	margin-left: 30rpx;
 	margin-top: 110rpx;
 	font-size: 24rpx;
-	color: #B5B5B5;
+	color: #b5b5b5;
 }
 .image {
 	margin-top: 20rpx;
diff --git a/pages/friend/test.vue b/pages/friend/test.vue
deleted file mode 100644
index bd657222dc6ed0ae9e3019fde6f3771d01702f8e..0000000000000000000000000000000000000000
--- a/pages/friend/test.vue
+++ /dev/null
@@ -1,180 +0,0 @@
-<template>
-	<view>
-		<view class="tq"></view>
-		<view class="container">
-			<view class="top">
-				<view class="tab" style="width: 100%; height: 90rpx;">
-					<navigator url="friends_rank">
-						<image @click="back" class="back" src="../../static/images/address_book.png" style="width: 70rpx; height: 70rpx;"></image>
-					</navigator>
-					<view class="tit2">
-						<scroll-view class="scroll-container" scroll-x scroll-with-animation v-if="brands.length > 1" :scroll-into-view="'s' + currentIndex">
-							<view :class="['scroll-item', { active: index == currentId }]" :id="'s' + index" v-for="(item, index) in brands"
-							 :key="index" @tap="handleScroll(index)">
-								{{ item }}
-								<view class="bottom-border" v-if="index == currentId">
-								</view>
-							</view>
-						</scroll-view>
-					</view>
-					<navigator url="./friendSearch">
-						<image class="shua1" src="../../static/images/Fsearch.png" style="width: 45rpx; height: 45rpx;"></image>
-					</navigator>
-				</view>
-			</view>
-		</view>
-		<u-index-list :scrollTop="scrollTop">
-			<view v-for="(item, index) in indexList" :key="index">
-				<u-index-anchor :index="item" />
-				<view class="list-cell"  v-for="(item1,index1) in (currentId===1?user1:user2).filter(u=>u.username.startsWith(item))"  :key="index1">
-					<u-avatar :src="item1.url"></u-avatar>
-					{{item1.username}}
-				</view>
-			</view>
-		</u-index-list>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				currentId: '',
-				/* 控制被选中 */
-				brands: [
-					'关注',
-					'好友',
-				],
-				currentIndex: 1,
-				scrollTop: 0,
-				indexList: ["A", "B", "C", "D", "E", "F", "G", "H", "I", "J", "K", "L", "M", "N", "O", "P", "Q", "R", "S", "T", "U",
-					"V", "W", "X", "Y", "Z"
-				],
-				user1:[{
-					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
-					username:"张三"
-				},{
-					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
-					username:"1"
-				},{
-					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
-					username:"2"
-				},{
-					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
-					username:"3"
-				},{
-					url:"com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
-					username:"4"
-				}],
-				user2:[{
-					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
-					username:"0"
-				},{
-					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
-					username:"1"
-				},{
-					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
-					username:"2"
-				},{
-					url:"https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
-					username:"D"
-				},{
-					url:"com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=2974706256,1511610652&fm=11&gp=0.jpg",
-					username:"Agjygjy"
-				}]
-			}
-		},
-		methods: {
-			handleScroll(index) {
-				this.currentId = index;
-				console.log(this.currentId)
-			},
-		},
-		onPageScroll(e) {
-			this.scrollTop = e.scrollTop;
-		}
-	}
-</script>
-
-<style lang="scss" scoped>
-	.tq {
-		height: 80rpx;
-		background-color: #6C40F3;
-	}
-
-	.tab {
-		display: flex;
-		background-color: #6C40F3;
-	}
-
-	.tit2 {
-		margin-top: 20rpx;
-		text-align: center;
-		margin-left: 55rpx;
-		width: 65%;
-
-	}
-
-	.back {
-		margin-top: 15rpx;
-		margin-left: 10rpx;
-	}
-
-	.shua1 {
-		margin-top: 28rpx;
-		margin-left: 55rpx;
-	}
-
-	.top {
-		height: 95rpx;
-		background-color: #6C40F3;
-		text-align: center;
-	}
-
-	.scroll-container {
-		margin-left: 120rpx;
-		height: 50upx;
-		background: #fff;
-		border-radius: 70rpx;
-		width: 265rpx;
-		border: #FFFFFF 5rpx solid;
-
-		.scroll-item {
-			text-align: center;
-			display: inline-block;
-			padding: 0rpx 30upx;
-			line-height: 60rpx;
-			font-size: 32upx;
-			font-weight: 90;
-
-			&.active {
-				display: inline-block;
-				font-weight: bold;
-				color: #FFFFFF;
-				width: 140rpx;
-				height: 50rpx;
-				border-radius: 50rpx;
-				background-color: #6C40F3;
-				font-size: 32upx;
-			}
-		}
-
-		.bottom-border {
-			margin: 0 auto;
-			width: 50upx;
-			height: 5upx;
-		}
-	}
-
-	.list-cell {
-		display: flex;
-		box-sizing: border-box;
-		width: 100%;
-		padding: 10px 24rpx;
-		overflow: hidden;
-		color: #323233;
-		font-size: 14px;
-		line-height: 24px;
-		background-color: #fff;
-	}
-</style>
diff --git a/pages/jianshu/fenlei.vue b/pages/jianshu/fenlei.vue
index 2bbb690a4032c345679ce839d53321045b86296d..2a53dad97444d0ac5d980f8eff3fddc11be8db98 100644
--- a/pages/jianshu/fenlei.vue
+++ b/pages/jianshu/fenlei.vue
@@ -1,108 +1,139 @@
 <template>
 	<view>
-		<view class="fenl" mode="aspectFill" @click="ShowHidden=!ShowHidden">
-			<image class="im" src="../../static/images/classify_one.png" style="width: 45rpx; height: 45rpx;"></image>
+		<view class="fenl" mode="aspectFill" @click="ShowHidden = !ShowHidden">
+			<slot name="right"></slot>
 			<!-- <view class="tit1">分类</view> -->
 		</view>
-		<!-- 弹出下拉筛选框 -->
-		<view class="Array" v-if="ShowHidden">
+		<u-popup mode="right" v-model="ShowHidden" width="440rpx" :custom-style="styleData">
+			<!-- 弹出下拉筛选框 -->
 			<view class="ty">
-				<view :class="['type',type==1&&'type_active']" mode="aspectFill" @click="type=1">通俗分类</view>
-				<view :class="['type',type==2&&'type_active']" mode="aspectFill" @click="type=2">中图法分类</view>
+				<view :class="['type', type == 1 && 'type_active']" mode="aspectFill" @click="type = 1">通俗分类</view>
+				<view :class="['type', type == 2 && 'type_active']" mode="aspectFill" @click="type = 2">中图法分类</view>
 			</view>
 			<view class="d4"></view>
 			<view class="side">
-
-				<nav class="nav1" v-if="type==1">
+				<nav class="nav1" v-if="type == 1">
 					<ul>
-						<li>小说作品</li>
-						<view class="liBottomBorder"></view>
-						<li>人文社科</li>
-						<view class="liBottomBorder"></view>
-						<li>品质生活</li>
+						<li data-name="F27" @click="getSubclass">企业</li>
 						<view class="liBottomBorder"></view>
-						<li>两性情感</li>
+						<li data-name="G7" @click="getSubclass">礼仪</li>
 						<view class="liBottomBorder"></view>
-						<li>人文社科</li>
+						<li data-name="I207.6" @click="getSubclass">散文</li>
 						<view class="liBottomBorder"></view>
-						<li>成功励志</li>
+						<li data-name="TN" @click="getSubclass">互联网络</li>
 						<view class="liBottomBorder"></view>
-						<li>经济管理</li>
+						<li data-name="I247.5" @click="getSubclass">侠义小说</li>
 						<view class="liBottomBorder"></view>
-						<li>文学作品</li>
+						<li data-name="G64" @click="getSubclass">高等教育</li>
 						<view class="liBottomBorder"></view>
-						<li>文化艺术</li>
+						<li data-name="F272.9" @click="getSubclass">行政管理</li>
 						<view class="liBottomBorder"></view>
-						<li>自然科学</li>
+						<li data-name="F713.5" @click="getSubclass">资本市场</li>
 						<view class="liBottomBorder"></view>
-						<li>亲子少儿</li>
+						<li data-name="K85" @click="getSubclass">历史文物</li>
 						<view class="liBottomBorder"></view>
-						<li>计算机</li>
+						<li data-name="C913" @click="getSubclass">人际交往</li>
 						<view class="liBottomBorder"></view>
-						<li>培训考试</li>
+						<li data-name="C912" @click="getSubclass">人际关系学</li>
 					</ul>
 				</nav>
-				<nav class="nav2" v-else="type==2">
+				<nav class="nav2" v-else="type == 2">
 					<ul>
-						<li>A 马克思主义</li>
+						<li data-name="A" @click="getSubclass" >A 马克思主义</li>
+						<view class="liBottomBorder"></view>
+						<li data-name="B" @click="getSubclass">B 哲学.宗教</li>
+						<view class="liBottomBorder"></view>
+						<li data-name="C" @click="getSubclass">C 社会科学总论</li>
 						<view class="liBottomBorder"></view>
-						<li>B 人文社科</li>
+						<li data-name="D" @click="getSubclass">D 政治.法制</li>
 						<view class="liBottomBorder"></view>
-						<li>C 社会科学总论</li>
+						<li data-name="E" @click="getSubclass">E 军事</li>
 						<view class="liBottomBorder"></view>
-						<li>D 政治.法制</li>
+						<li data-name="F" @click="getSubclass">F 经济</li>
 						<view class="liBottomBorder"></view>
-						<li>E 军事</li>
+						<li data-name="G" @click="getSubclass">G 文化.科学.教育.体育</li>
 						<view class="liBottomBorder"></view>
-						<li>F 经济</li>
+						<li data-name="H" @click="getSubclass">H 语言.文学</li>
 						<view class="liBottomBorder"></view>
-						<li>G 文化.科学.教育.体育</li>
+						<li data-name="I" @click="getSubclass">I 文学</li>
 						<view class="liBottomBorder"></view>
-						<li>H 语言.文学</li>
+						<li data-name="J" @click="getSubclass">J 艺术</li>
 						<view class="liBottomBorder"></view>
-						<li>I 文学</li>
+						<li data-name="K" @click="getSubclass">K 历史</li>
 						<view class="liBottomBorder"></view>
-						<li>J 艺术</li>
+						<li data-name="N" @click="getSubclass">N 自然科学总论</li>
 						<view class="liBottomBorder"></view>
-						<li>K 历史</li>
+						<li data-name="O" @click="getSubclass">O 数理科学和化学</li>
 						<view class="liBottomBorder"></view>
-						<li>N 自然科学总论</li>
+						<li data-name="P" @click="getSubclass">P 天文学.地球科学</li>
 						<view class="liBottomBorder"></view>
-						<li>O 数理科学与化学</li>
+						<li data-name="Q" @click="getSubclass">Q 生物科学</li>
 						<view class="liBottomBorder"></view>
-						<li>P 天文学.地球科学</li>
+						<li data-name="R" @click="getSubclass">R 医药.卫生</li>
 						<view class="liBottomBorder"></view>
-						<li>Q 生物科学</li>
+						<li data-name="S" @click="getSubclass">S 农业科学</li>
 						<view class="liBottomBorder"></view>
-						<li>R 医药.卫生</li>
+						<li data-name="T" @click="getSubclass">T 工业技术</li>
 						<view class="liBottomBorder"></view>
-						<li>S 农业科学</li>
+						<li data-name="U" @click="getSubclass">U 交通运输</li>
+						<view class="liBottomBorder"></view>
+						<li data-name="V" @click="getSubclass">V 航空.航天</li>
+						<view class="liBottomBorder"></view>
+						<li data-name="X" @click="getSubclass">X 环境科学</li>
+						<view class="liBottomBorder"></view>
+						<li data-name="Z" @click="getSubclass">Z 综合性图书</li>
 					</ul>
 				</nav>
 			</view>
-		</view>
+		</u-popup>
+
 	</view>
 </template>
 
 <script>
+	let statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
+	// 获取小程序胶囊的高度
+	let headHeight = '';
+	// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
+	headHeight = uni.getMenuButtonBoundingClientRect().height;
+	// #endif
 	export default {
 		data() {
 			return {
 				ShowHidden: false,
 				type: 1,
-			}
+			};
+		},
+		computed: {
+			//自定义弹框样式
+			styleData() {
+				let style = {};
+				// 获取系统状态栏的高度
+				style.display = 'flex';
+				style.float = 'right';
+				style.right = '0rpx';
+				style.margin = (statusBarHeight + headHeight) +'px' +' 0' +' 0'+' 0';
+				console.log("statusBarHeight",statusBarHeight)
+				return style;
+			},
 		},
 		methods: {
+			//获取书籍分类数据
+			getSubclass(e){
+				// console.log(e.currentTarget.dataset.name);
+				let name = e.currentTarget.dataset.name;
+				if(name!="" || name!='undefined'){
+					this.$emit("getSubclass",name);
+				}
+			},
 			//点击页面事件，隐藏需要隐藏的区域
 			HiddenClick() {
-				this.ShowHidden = false
-				this.type = 1
+				this.ShowHidden = false;
+				this.type = 1;
 			},
 		},
-		mounted() {
-
-		}
-	}
+		mounted() {},
+	};
 </script>
 
 <style lang="scss" scoped>
@@ -117,20 +148,21 @@
 		height: 100rpx;
 		background-color: #555555;
 		font-size: 34rpx;
-		&_active{
-			color:#636363;
-			background-color: #FFFFFF;
+
+		&_active {
+			color: #636363;
+			background-color: #ffffff;
 		}
 	}
 
 	.Array {
 		width: 440rpx;
 		position: absolute;
-		// height: 100%;
-		background-color: #F8F8F8;
-		right: 0rpx;
+		// margin-top: 100rpx;
+		background-color: #f8f8f8;
+		// right: 0rpx;
 		// margin-top: 20rpx;
-		z-index: 99;
+		// z-index: 99;
 	}
 
 	.side {
@@ -138,13 +170,13 @@
 		line-height: 75rpx;
 		margin-left: 20rpx;
 		margin-top: 20rpx;
-	
 	}
 
 	.liBottomBorder {
 		/* border-bottom: 1rpx solid #007AFF; */
-		border: 1rpx solid #C8C7CC;
-		margin-top: 20rpx;
+		border: 1rpx solid #c8c7cc;
+		margin-top: 10rpx;
+		margin-bottom: 10rpx;
 	}
 
 	.d4 {
@@ -153,16 +185,14 @@
 		margin-left: 150rpx;
 		margin-top: -20rpx;
 		border-width: 20rpx;
-		border-color: transparent #007AFF transparent transparent;
+		border-color: transparent #007aff transparent transparent;
 		transform: rotate(90deg);
 	}
 
-	.im{
-			margin-top: 10rpx;
-			width: 60rpx;
-			height: 60rpx;
-			margin-left: 40rpx;
-		}
+	.im {
+		width: 60rpx;
+		height: 60rpx;
+	}
 
 	.tit1 {
 		margin-top: 15rpx;
diff --git a/pages/jianshu/newb.vue b/pages/jianshu/newb.vue
index 56c4ffdde674e7c7fe775cd91ce4dc10222efa31..8e4f741a2cd5b5715a99f58e77ef7971a7cfe785 100644
--- a/pages/jianshu/newb.vue
+++ b/pages/jianshu/newb.vue
@@ -1,36 +1,31 @@
 <template>
 	<view>
 		<!-- 顶部部分 -->
-		<view class="head">
-			<view class="header-wrap">
-				<view class="index-header">
-					<image @click="leftClick" class="address" src="../../static/images/turn_left_two_return2x.png"></image>
-					<view class="name">新书上架</view>
-					<view class="map-wrap" @click="rightClick">
-						<image class="iconfont" src="../../static/images/change_icon.png"></image>
-					</view>
+		<u-navbar zhead="65rpx" height="44" title="新书上架" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+					<image style="height: 50rpx; width: 50rpx;margin-right: 30rpx;" src="/static/images/change_icon.png"></image>
 				</view>
 			</view>
-		</view>
-		<view class="blank"></view>
+		</u-navbar>
 
-		<view class="list" v-for="item in newbookList">
+		<view class="list" v-for="(item,index) in newbookList" :key="index">
 			<view class="ta">
-				<image v-if="item.book.num <=0" class="biaoz" src="../../static/images/bukejie_icon.png" style="width: 60rpx; height: 60rpx;"></image>
-				<image v-if="item.book.num > 0" class="biaoz" src="../../static/images/kejie_icon.png" style="width: 60rpx; height: 60rpx;"></image>
+				<image v-if="item.book.num <= 0" class="biaoz" src="/static/images/bukejie_icon.png" style="width: 60rpx; height: 60rpx"></image>
+				<image v-if="item.book.num > 0" class="biaoz" src="/static/images/kejie_icon.png" style="width: 60rpx; height: 60rpx"></image>
 			</view>
-			<image class="ima1" :src="item.book.picturePath"></image>
+			<image class="ima1" :src="item.book.picturePath" @error="imageError(item)"></image>
 			<view>
-				<navigator :url="'../Bdetail/Bdetail?isbn='+item.isbn">
-					<view class="title_name">{{item.book.bookName}}</view>
-					<view class="text_tex">作者 ：{{item.book.author}}</view>
-					<view class="text_tex">出版社 ：{{item.book.publisher}}</view>
+				<navigator :url="'../Bdetail/Bdetail?isbn=' + item.isbn">
+					<view class="title_name">{{ item.book.bookName }}</view>
+					<view class="text_tex">作者 ：{{ item.book.author }}</view>
+					<view class="text_tex">出版社 ：{{ item.book.publisher }}</view>
 					<!-- <view class="tex">出版时间 ：2020-09</view> -->
 					<!-- <view class="tex1">广东省图书馆、广东中山图书馆</view> -->
 				</navigator>
 			</view>
 		</view>
-
 	</view>
 </template>
 
@@ -39,8 +34,11 @@
 	export default {
 		data() {
 			return {
+				background: {
+					background: "#6C40F3",
+				},
 				newbookList: [], //新书list
-			}
+			};
 		},
 		onLoad() {
 			this.getNewBook(0); //新书
@@ -51,35 +49,40 @@
 				var that = this;
 				var params = {
 					url: "newbook?size=10&page=" + e,
-					type: 'GET',
-					data: {}
-				}
+					type: "GET",
+					data: {},
+				};
 				const res = await app.myRequest(params);
 				that.newbookList = res.content;
 				for (var i = 0; that.newbookList.length > i; i++) {
 					var bookId = that.newbookList[i].book.bookId;
 					var params = {
 						url: "realBook/queryIsBorrowed?bookId=" + bookId,
-						type: 'GET',
-						data: {}
-					}
+						type: "GET",
+						data: {},
+					};
 					const num = await app.myRequest(params);
 					//将可解的数量赋值到num中
-					that.newbookList[i].book.num = num
+					that.newbookList[i].book.num = num;
 				}
 			},
+			//图片加载不出来
+			imageError(index) {
+				let that = this;
+				index.book.picturePath = "/static/images/temporary.jpg"
+			},
 			leftClick() {
 				uni.navigateBack({
-					delta: 1
-				})
-			}
-		}
-	}
+					delta: 1,
+				});
+			},
+		},
+	};
 </script>
 
 <style lang="scss">
 	// 顶部页面
-	$color-base: #6C40F3;
+	$color-base: #6c40f3;
 	$words-color-base: #333333;
 	$words-color-light: #999999;
 
@@ -110,7 +113,7 @@
 			}
 
 			.name {
-				color: #FFFFFF;
+				color: #ffffff;
 				width: 80%;
 				height: 60rpx;
 				font-size: 36rpx;
@@ -140,32 +143,30 @@
 
 	.tq {
 		height: 70rpx;
-		background-color: #6C40F3;
+		background-color: #6c40f3;
 	}
 
 	.tab {
 		display: flex;
-		background-color: #6C40F3;
+		background-color: #6c40f3;
 	}
 
 	.tit {
 		margin-top: 9rpx;
-		color: #FFFFFF;
+		color: #ffffff;
 		margin-left: 250rpx;
 		display: flex;
 		font-size: 40rpx;
 		width: 60%;
-
 	}
 
 	.tit2 {
 		margin-top: 9rpx;
-		color: #FFFFFF;
+		color: #ffffff;
 		margin-left: 230rpx;
 		display: flex;
 		font-size: 40rpx;
 		width: 50%;
-
 	}
 
 	.back {
@@ -180,18 +181,16 @@
 	.shua {
 		margin-top: 28rpx;
 		margin-left: 60rpx;
-
 	}
 
 	.shua1 {
 		margin-top: 28rpx;
 		margin-left: 60rpx;
-
 	}
 
 	.tit1 {
 		margin-top: 28rpx;
-		color: #FFFFFF;
+		color: #ffffff;
 		margin-left: 20rpx;
 		font-size: 28rpx;
 		width: 20%;
@@ -199,7 +198,7 @@
 
 	.list {
 		height: 330rpx;
-		border-bottom: 1rpx solid #C8C7CC;
+		border-bottom: 1rpx solid #c8c7cc;
 		display: flex;
 	}
 
@@ -258,7 +257,7 @@
 	.tex1 {
 		margin-top: 15rpx;
 		font-size: 35rpx;
-		color: #F0AD4E;
+		color: #f0ad4e;
 	}
 
 	.top {
diff --git a/pages/jianshu/person.vue b/pages/jianshu/person.vue
index cb3147da87f0c788ad0cbdd54a159a7e627194b6..d8b2abcd4bdece15729e101b06d6a02b92234546 100644
--- a/pages/jianshu/person.vue
+++ b/pages/jianshu/person.vue
@@ -1,117 +1,139 @@
 <template>
 	<view>
 		<!-- 导航栏 -->
-		<!-- #ifdef APP-PLUS -->
-		<view class="tq"></view>
-		<view class="tab" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-			<view class="tit">猜您喜欢</view>
-			<image class="shua" src="../../static/images/换一批.icon.png" style="width: 55rpx; height: 45rpx;"></image>
-			<view class="tit1">换一批</view>
-		</view>
-		<!-- #endif -->
-		<!-- #ifdef MP-WEIXIN -->
-		<view class="tq"></view>
-		<view class="tab" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-			<view class="tit2">猜您喜欢</view>
-			<image class="shua1" src="../../static/images/换一批.icon.png" style="width: 55rpx; height: 40rpx;"></image>
-			<view class="tit1">换一批</view>
-		</view>
-		<!-- #endif -->
-		<!-- #ifdef MP-WEIXIN -->
-		<view class="list">
-			<image class="ima1" src="../../static/images/封面.png" ></image>
-			<view>
-				<view class="name">书名....</view>
-				<view class="tex">作者 ：哈哈</view>
-				<view class="tex">出版社 ：浙江大学出版社</view>
-				<!-- <view class="tex">出版时间 ：2020-09</view> -->
-				<!-- <view class="tex1">广东省图书馆、广东中山图书馆</view> -->
-			</view>
-		</view>
-		<view class="list">
-			<image class="ima1" src="../../static/images/封面.png" ></image>
-			<view>
-				<view class="name">书名....</view>
-				<view class="tex">作者 ：哈哈</view>
-				<view class="tex">出版社 ：浙江大学出版社</view>
-				<!-- <view class="tex">出版时间 ：2020-09</view> -->
-				<!-- <view class="tex1">广东省图书馆、广东中山图书馆</view> -->
+		<u-navbar zhead="65rpx" height="44" title="猜您喜欢" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+					<image style="height: 40rpx; width: 40rpx" src="/static/images/change_icon.png"></image>
+					<view style="color: #FFFFFF;">换一批</view>
+				</view>
 			</view>
-		</view>
-		<!-- #endif -->
-		<!-- #ifdef APP-PLUS -->
-		<view class="list">
-			
-			<image class="ima" src="../../static/images/封面.png" style="width: 200rpx; height: 250rpx;"></image>
-			<view>
-				<view class="name">书名....</view>
-				<view class="tex">作者 ：哈哈</view>
-				<view class="tex">出版社 ：浙江大学出版社</view>
-				<!-- <view class="tex">出版时间 ：2020-09</view> -->
-				<!-- <view class="tex1">广东省图书馆、广东中山图书馆</view> -->
-			</view>
-		</view>
-		<view class="list">
-			<image class="ima" src="../../static/images/封面.png" style="width: 200rpx; height: 250rpx;"></image>
+		</u-navbar>
+		<!-- <view style="height: 65rpx"></view> -->
+
+		<view class="list" v-for="(item,index) in guessLikeList" :key="index">
+			<image class="ima1" :src="item.picturePath" @error="imageError(item)"></image>
 			<view>
-				<view class="name">书名....</view>
-				<view class="tex">作者 ：哈哈</view>
-				<view class="tex">出版社 ：浙江大学出版社</view>
-				<!-- <view class="tex">出版时间 ：2020-09</view> -->
-				<!-- <view class="tex1">广东省图书馆、广东中山图书馆</view> -->
+				<navigator :url="'../Bdetail/Bdetail?isbn=' + item.isbn">
+					<view class="title_name">{{ item.bookName }}</view>
+					<view class="text_tex">作者 ：{{ item.author }}</view>
+					<view class="text_tex">出版社 ：{{ item.publisher }}</view>
+				</navigator>
 			</view>
 		</view>
-		<!-- #endif -->
-		</view>
+	</view>
 </template>
 
 <script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from "vuex";
 	export default {
 		data() {
 			return {
-				
-			}
+				background: {
+					background: "#6C40F3",
+				},
+				guessLikeList: [], //猜您列表
+			};
+		},
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
+		onLoad(e) {
+			var that = this;
+			this.getGuessLike(); //猜您
 		},
 		methods: {
-			back(){
+			//获取荐书列表
+			async getGuessLike() {
+				var that = this;
+				let linkList = [];
+				if (that.userinfo.length > 0 || that.userinfo != undefined) {
+					var params = {
+						url: "book/recommend?readerId=" + that.userinfo.readerId,
+						type: "GET",
+						data: {},
+					};
+					const res = await app.myRequest(params);
+					linkList = res;
+				}
+				that.guessLikeList = linkList;
+			},
+			//换一批
+			async bindInBatch(){
+				let that = this;
+				uni.showLoading({
+				    title: '加载中'
+				});
+				setTimeout(function () {
+				    uni.hideLoading();
+				}, 8000);
+				that.getGuessLike();
+				uni.hideLoading();
+			},
+			//图片加载不出来
+			imageError(index){
+				let that = this;
+				index.picturePath = "/static/images/temporary.jpg"
+			},
+			back() {
 				uni.navigateBack({
-					delta:1
-				})
-			}
-		}
-	}
+					delta: 1,
+				});
+			},
+		},
+	};
 </script>
 
 <style>
-.tq{
+	.navbar-right {
+		width: 100%;
+		display: flex;
+		align-items: center;
+	}
+
+	.right_list {
+		width: 100%;
+		display: flex;
+		align-items: center;
+		height: 80rpx;
+		/* width: 80rpx; */
+		margin-right: 20rpx;
+		margin-top: 10rpx;
+	}
+
+	.tq {
 		height: 70rpx;
-		background-color:#6C40F3;
+		background-color: #6c40f3;
 	}
-.tab {
+
+	.tab {
 		display: flex;
-		background-color:#6C40F3;
+		background-color: #6c40f3;
 	}
 
 	.tit {
 		margin-top: 9rpx;
-		color:#FFFFFF ;
+		color: #ffffff;
 		margin-left: 250rpx;
 		display: flex;
 		font-size: 40rpx;
 		width: 60%;
-	
 	}
-.tit2 {
+
+	.tit2 {
 		margin-top: 9rpx;
-		color:#FFFFFF ;
+		color: #ffffff;
 		margin-left: 230rpx;
 		display: flex;
 		font-size: 40rpx;
 		width: 30%;
-	
 	}
+
 	.back {
 		margin-top: 15rpx;
 		margin-left: 10rpx;
@@ -121,62 +143,91 @@
 		height: 10rpx;
 		background-color: #F1F1F1;
 	} */
-.shua {
-		margin-top: 28rpx;
-		margin-left: 60rpx;
-
-	}
-	.shua1 {
-		margin-top: 28rpx;
-		margin-left: 80rpx;
-
-	}
 
 	.tit1 {
 		margin-top: 28rpx;
-		color:#FFFFFF ;
-		margin-left: 10rpx;
+		color: #ffffff;
+		margin-left: 20rpx;
 		font-size: 28rpx;
 		width: 20%;
 	}
 
+	.im {
+		margin-top: 10rpx;
+		width: 60rpx;
+		height: 60rpx;
+		margin-left: 40rpx;
+	}
+
+	.im1 {
+		/* margin-top: 10rpx; */
+		width: 60rpx;
+		height: 60rpx;
+		margin-left: 0rpx;
+	}
+
 	.list {
 		height: 330rpx;
-		border-bottom: 1rpx solid #C8C7CC;
+		border-bottom: 1rpx solid #c8c7cc;
 		display: flex;
 	}
 
 	.ima {
 		margin: 40rpx 40rpx;
 	}
+
 	.ima1 {
 		margin: 40rpx 40rpx;
 		width: 200rpx;
 		height: 250rpx;
 	}
-	.ta{
+
+	.ta {
 		/* margin-left: 100rpx; */
 		width: 0rpx;
 	}
-.biaoz{
-	/* margin-top: 60rpx; */
-	margin-left: 180rpx;
-}
-	.name {
+
+	.biaoz {
+		/* margin-top: 60rpx; */
+		margin-left: 180rpx;
+	}
+
+	.title_name {
+		width: 400rpx;
+		margin-left: 10rpx;
 		margin-top: 50rpx;
 		font-size: 40rpx;
+		display: -webkit-box;
+		word-break: break-all;
+		text-overflow: ellipsis;
+		/*自适应字体*/
+		overflow: hidden;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 2;
+		/*设置 需要显示的行数*/
 	}
 
-	.tex {
+	.text_tex {
+		width: 450rpx;
+		/* height: 30rpx; */
+		text-align: left;
 		font-size: 28rpx;
-		margin-top: 5rpx;
+		margin-top: 15rpx;
 		color: #808080;
+		display: -webkit-box;
+		word-break: break-all;
+		text-overflow: ellipsis;
+		/*自适应字体*/
+		overflow: hidden;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 1;
+		/*设置 需要显示的行数*/
 	}
 
 	.tex1 {
 		margin-top: 15rpx;
 		font-size: 35rpx;
-		color: #F0AD4E;
+		color: #f0ad4e;
 	}
 
 	.top {
diff --git a/pages/jianshu/remen.vue b/pages/jianshu/remen.vue
index 0c06340896eed06c1eb32f231072cc0c52e46c32..be995571c0ac0655cffe2fb2804139e16ff649db 100644
--- a/pages/jianshu/remen.vue
+++ b/pages/jianshu/remen.vue
@@ -1,56 +1,42 @@
 <template>
 	<view>
 		<!-- 导航栏 -->
-		<u-navbar zhead="65rpx" height="44" title="热门推荐" title-color="white" title-size="40" :background="background"
-		 back-icon-color="white" back-icon-size="50">
+		<u-navbar height="44" title="热门推荐" title-color="white" title-size="40" :background="background" back-icon-color="white"
+		 back-icon-size="50">
 			<view class="navbar-right" slot="right">
 				<view class="right_list">
-					<image style="height: 60rpx;width: 60rpx;" src="../../static/images/classify_one.png"></image>
-				</view>
-				<view class="right_list">
-					<!-- <fenlei></fenlei> -->
-					<image style="height: 60rpx;width: 60rpx;" src="../../static/images/搜索icon@2x.png"></image>
+					<fenlei @getSubclass="getSubclassBySymbol">
+						<image slot="right" @click="clickPop" style="height: 60rpx; width: 60rpx" src="/static/images/classify_one.png"></image>
+					</fenlei>
+					<image style="height: 60rpx; width: 60rpx" src="/static/images/搜索icon@2x.png"></image>
 				</view>
 			</view>
 		</u-navbar>
-		<view style="height: 65rpx;"></view>
+
+		<view v-if="hotbookList !== undefined && hotbookList.length > 0">
+			<view class="list" v-for="(item,index) in hotbookList" :key="index">
+				<image class="ima1" :src="item.book.picturePath" @error="imageError(item)"></image>
+				<view>
+					<navigator :url="'../Bdetail/Bdetail?isbn=' + item.isbn">
+						<view class="title_name">{{ item.book.bookName }}</view>
+						<view class="text_tex">作者 ：{{ item.book.author }}</view>
+						<view class="text_tex">出版社 ：{{ item.book.publisher }}</view>
+					</navigator>
+				</view>
+			</view>
+		</view>
 		
-		<!-- #ifdef APP-PLUS -->
-		<!-- <view class="tq"></view>
-		<view class="tab" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-			<view class="tit">热门推荐</view>
-			<image class="im" src="../../static/images/classify_one.png" style="width: 80rpx; height: 80rpx;"></image>
-			<image class="im1" src="../../static/images/搜索icon@2x.png" style="width: 80rpx; height: 80rpx;"></image>
-		</view> -->
-		<!-- #endif -->
-		<!-- #ifdef MP-WEIXIN -->
-		<!-- <view class="tq"></view>
-		<view class="tab" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-			<view class="tit2">热门推荐</view>
-			<image class="im" src="../../static/images/classify_one.png"></image>
-			<image class="im1" src="../../static/images/搜索icon@2x.png"></image>
-		</view> -->
-		<!-- #endif -->
-
-		<view class="list" v-for="item in hotbookList">
-			<image class="ima1" :src="item.book.picturePath"></image>
-			<view>
-				<navigator :url="'../Bdetail/Bdetail?isbn='+item.isbn">
-					<view class="title_name">{{item.book.bookName}}</view>
-					<view class="text_tex">作者 ：{{item.book.author}}</view>
-					<view class="text_tex">出版社 ：{{item.book.publisher}}</view>
-				</navigator>
+		<view v-if="hotbookList == undefined || hotbookList.length <= 0">
+			<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
+				暂时没有该类书籍哦,换换其它的吧~
 			</view>
 		</view>
-
 	</view>
 </template>
 
 <script>
 	let app = getApp();
-	import navbar from '../../components/c-navbar/index.vue'
+	import navbar from "../../components/c-navbar/index.vue";
 	export default {
 		components: {
 			navbar,
@@ -58,37 +44,86 @@
 		data() {
 			return {
 				background: {
-					background: '#6C40F3'
+					background: "#6C40F3",
 				},
 				hotbookList: [], //热书列表
-			}
+				symbol: '', //分类号
+				sense: false, //弹框状态
+			};
 		},
 		onLoad() {
 			this.getHotBook(0); //热书
 		},
 		methods: {
-
 			//获取热书列表
 			async getHotBook(e) {
 				var that = this;
 				var params = {
 					url: "hotbook?size=10&page=" + e,
-					type: 'GET',
-					data: {}
-				}
+					type: "GET",
+					data: {},
+				};
+				const res = await app.myRequest(params);
+				that.hotbookList = res.content;
+			},
+			/**
+			 * 获取子组件参数
+			 * @param {Object} e 子组件fenlei传递过来的值
+			 */
+			getSubclassBySymbol(e) {
+				let that = this;
+				uni.showLoading({
+				    title: '加载中'
+				});
+				setTimeout(function () {
+				    uni.hideLoading();
+				}, 8000);
+				that.getHotBookBySymbol(e, 0);
+				uni.hideLoading();
+			},
+			/**
+			 * 根据分类号查询热门书籍
+			 * @param {Object} symbol 分类号 
+			 * @param {Object} num 第几页
+			 */
+			async getHotBookBySymbol(symbol, num) {
+				var that = this;
+				var params = {
+					url: "hotbook/getSubClass?symbol=" + symbol + "&size=10&page=" + num,
+					type: "GET",
+					data: {},
+				};
 				const res = await app.myRequest(params);
 				that.hotbookList = res.content;
 			},
+			//分类弹框
+			clickPop() {
+				let that = this;
+				if (that.sense) {
+					that.sense = false;
+				} else {
+					that.sense = true;
+				}
+			},
+			//图片加载失败
+			imageError(index) {
+				let that = this;
+				index.book.picturePath = "/static/images/temporary.jpg"
+			},
 			back() {
 				uni.navigateBack({
-					delta: 1
-				})
-			}
-		}
-	}
+					delta: 1,
+				});
+			},
+		},
+	};
 </script>
 
 <style>
+	.remen {
+		background: rgba(0, 0, 0, 0.5);
+	}
+
 	.navbar-right {
 		display: flex;
 		align-items: center;
@@ -105,32 +140,30 @@
 
 	.tq {
 		height: 70rpx;
-		background-color: #6C40F3;
+		background-color: #6c40f3;
 	}
 
 	.tab {
 		display: flex;
-		background-color: #6C40F3;
+		background-color: #6c40f3;
 	}
 
 	.tit {
 		margin-top: 9rpx;
-		color: #FFFFFF;
+		color: #ffffff;
 		margin-left: 250rpx;
 		display: flex;
 		font-size: 40rpx;
 		width: 60%;
-
 	}
 
 	.tit2 {
 		margin-top: 9rpx;
-		color: #FFFFFF;
+		color: #ffffff;
 		margin-left: 230rpx;
 		display: flex;
 		font-size: 40rpx;
 		width: 30%;
-
 	}
 
 	.back {
@@ -145,7 +178,7 @@
 
 	.tit1 {
 		margin-top: 28rpx;
-		color: #FFFFFF;
+		color: #ffffff;
 		margin-left: 20rpx;
 		font-size: 28rpx;
 		width: 20%;
@@ -167,7 +200,7 @@
 
 	.list {
 		height: 330rpx;
-		border-bottom: 1rpx solid #C8C7CC;
+		border-bottom: 1rpx solid #c8c7cc;
 		display: flex;
 	}
 
@@ -201,7 +234,7 @@
 		text-overflow: ellipsis;
 		/*自适应字体*/
 		overflow: hidden;
-		/* -webkit-box-orient: vertical; */
+		-webkit-box-orient: vertical;
 		-webkit-line-clamp: 2;
 		/*设置 需要显示的行数*/
 	}
@@ -226,7 +259,7 @@
 	.tex1 {
 		margin-top: 15rpx;
 		font-size: 35rpx;
-		color: #F0AD4E;
+		color: #f0ad4e;
 	}
 
 	.top {
diff --git a/pages/jianshu/subclass.vue b/pages/jianshu/subclass.vue
new file mode 100644
index 0000000000000000000000000000000000000000..df5dafb59c0348b3d3ad56175f6a84c6d497367e
--- /dev/null
+++ b/pages/jianshu/subclass.vue
@@ -0,0 +1,249 @@
+<template>
+	<view>
+		<!-- 导航栏 -->
+		<u-navbar zhead="65rpx" height="44" :title="title" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+					<image style="height: 40rpx; width: 40rpx" src="/static/images/change_icon.png"></image>
+					<view style="color: #FFFFFF;">换一批</view>
+				</view>
+			</view>
+		</u-navbar>
+		<!-- <view style="height: 65rpx"></view> -->
+
+		<view class="list" v-for="(item,index) in subclassBookList" :key="index">
+			<image class="ima1" :src="item.picturePath" @error="imageError(item)"></image>
+			<view>
+				<navigator :url="'../Bdetail/Bdetail?isbn=' + item.isbn">
+					<view class="title_name">{{ item.bookName }}</view>
+					<view class="text_tex">作者 ：{{ item.author }}</view>
+					<view class="text_tex">出版社 ：{{ item.publisher }}</view>
+				</navigator>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	let app = getApp();
+	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+				title: "分类",	//分类名
+				subclassBookList: [], //分类列表
+				totalElements: 0,	//分类总条数
+				classificationSymbol: "",	//分类标签
+				num: 0,	//换一批次数
+			};
+		},
+		onLoad(e) {
+			var that = this;
+			let name = e.name;	//传过来的分类名
+			let classificationSymbol = e.classificationSymbol;	//传过来的分类标签
+			that.title = name;
+			that.classificationSymbol = classificationSymbol;
+			this.getSubclassBook(classificationSymbol,0); //热书
+		},
+		methods: {
+			//获取分类列表
+			async getSubclassBook(w,e) {
+				var that = this;
+				var params = {
+					url: "book?size=10&page=" + e+"&blurry="+w,
+					type: "GET",
+					data: {},
+				};
+				const res = await app.myRequest(params);
+				that.subclassBookList = res.content;
+				that.totalElements = res.totalElements;
+			},
+			//换一批
+			async bindInBatch(){
+				let that = this;
+				uni.showLoading({
+				    title: '加载中'
+				});
+				setTimeout(function () {
+				    uni.hideLoading();
+				}, 8000);
+				++that.num;
+				if(that.num*10<that.totalElements){
+					var params = {
+						url: "book?size=10&page=" + that.num+"&blurry="+that.classificationSymbol,
+						type: "GET",
+						data: {},
+					};
+					const res = await app.myRequest(params);
+					that.subclassBookList = res.content;
+				}else{
+					uni.showToast({
+					  title: "没有更多了~",
+					  duration: 2000,
+					});
+				}
+				uni.hideLoading();
+			},
+			//图片加载不出来
+			imageError(index){
+				let that = this;
+				index.picturePath = "/static/images/temporary.jpg"
+			},
+			back() {
+				uni.navigateBack({
+					delta: 1,
+				});
+			},
+		},
+	};
+</script>
+
+<style>
+	.navbar-right {
+		width: 100%;
+		display: flex;
+		align-items: center;
+	}
+
+	.right_list {
+		width: 100%;
+		display: flex;
+		align-items: center;
+		height: 80rpx;
+		/* width: 80rpx; */
+		margin-right: 20rpx;
+		margin-top: 10rpx;
+	}
+
+	.tq {
+		height: 70rpx;
+		background-color: #6c40f3;
+	}
+
+	.tab {
+		display: flex;
+		background-color: #6c40f3;
+	}
+
+	.tit {
+		margin-top: 9rpx;
+		color: #ffffff;
+		margin-left: 250rpx;
+		display: flex;
+		font-size: 40rpx;
+		width: 60%;
+	}
+
+	.tit2 {
+		margin-top: 9rpx;
+		color: #ffffff;
+		margin-left: 230rpx;
+		display: flex;
+		font-size: 40rpx;
+		width: 30%;
+	}
+
+	.back {
+		margin-top: 15rpx;
+		margin-left: 10rpx;
+	}
+
+	/* .tab1 {
+		height: 10rpx;
+		background-color: #F1F1F1;
+	} */
+
+	.tit1 {
+		margin-top: 28rpx;
+		color: #ffffff;
+		margin-left: 20rpx;
+		font-size: 28rpx;
+		width: 20%;
+	}
+
+	.im {
+		margin-top: 10rpx;
+		width: 60rpx;
+		height: 60rpx;
+		margin-left: 40rpx;
+	}
+
+	.im1 {
+		/* margin-top: 10rpx; */
+		width: 60rpx;
+		height: 60rpx;
+		margin-left: 0rpx;
+	}
+
+	.list {
+		height: 330rpx;
+		border-bottom: 1rpx solid #c8c7cc;
+		display: flex;
+	}
+
+	.ima {
+		margin: 40rpx 40rpx;
+	}
+
+	.ima1 {
+		margin: 40rpx 40rpx;
+		width: 200rpx;
+		height: 250rpx;
+	}
+
+	.ta {
+		/* margin-left: 100rpx; */
+		width: 0rpx;
+	}
+
+	.biaoz {
+		/* margin-top: 60rpx; */
+		margin-left: 180rpx;
+	}
+
+	.title_name {
+		width: 400rpx;
+		margin-left: 10rpx;
+		margin-top: 50rpx;
+		font-size: 40rpx;
+		display: -webkit-box;
+		word-break: break-all;
+		text-overflow: ellipsis;
+		/*自适应字体*/
+		overflow: hidden;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 2;
+		/*设置 需要显示的行数*/
+	}
+
+	.text_tex {
+		width: 450rpx;
+		/* height: 30rpx; */
+		text-align: left;
+		font-size: 28rpx;
+		margin-top: 15rpx;
+		color: #808080;
+		display: -webkit-box;
+		word-break: break-all;
+		text-overflow: ellipsis;
+		/*自适应字体*/
+		overflow: hidden;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 1;
+		/*设置 需要显示的行数*/
+	}
+
+	.tex1 {
+		margin-top: 15rpx;
+		font-size: 35rpx;
+		color: #f0ad4e;
+	}
+
+	.top {
+		top: -170rpx;
+		margin-left: 680rpx;
+	}
+</style>
diff --git a/pages/login/login.vue b/pages/login/login.vue
index eb8f09e1d5ea957932ee8077877e3c7a5aea387f..e2095f5b8c79791d3e91124f2d2f0dc94143fb6b 100644
--- a/pages/login/login.vue
+++ b/pages/login/login.vue
@@ -1,15 +1,15 @@
 <template>
 	<view>
-		<image class="im" src="../../static/images/logo.png" style="width: 200rpx; height: 200rpx;"></image>
+		<image class="im" src="/static/images/logo.png" style="width: 200rpx; height: 200rpx;"></image>
 		<view class="name">
 			<view class="rt">
-			<image src="../../static/images/person.png" style="width: 50rpx;height: 50rpx; "></image>
+			<image src="/static/images/person.png" style="width: 50rpx;height: 50rpx; "></image>
 			</view>
 			<input class="inp" placeholder="请输入用户名" placeholder-style="color:#BBBBBB"  type="number"></input>
 		</view>
 		<view class="name1">
 			<view class="rt">
-			<image src="../../static/images/password.png" style="width: 50rpx;height: 50rpx; "></image>
+			<image src="/static/images/password.png" style="width: 50rpx;height: 50rpx; "></image>
 			</view>
 			<input class="inp" placeholder="请输入密码" placeholder-style="color:#BBBBBB"  type="number"></input>
 		</view>
@@ -26,8 +26,8 @@
 			<text class="oth">第三方登录</text>
 			<view class="li"></view>
 		</view>
-		<image class="ima" src="../../static/images/QQ.png" style="width: 100rpx; height: 100rpx;"></image>
-		<image  class="ima" src="../../static/images/wechat.png" style="width: 100rpx; height: 100rpx;"></image>
+		<image class="ima" src="/static/images/QQ.png" style="width: 100rpx; height: 100rpx;"></image>
+		<image  class="ima" src="/static/images/wechat.png" style="width: 100rpx; height: 100rpx;"></image>
 	</view>
 </template>
 
@@ -35,11 +35,11 @@
 	export default {
 		data() {
 			return {
-				
+
 			}
 		},
 		methods: {
-			
+
 		}
 	}
 </script>
@@ -101,11 +101,11 @@
 	text-align: center;
 	margin-top: 70rpx;
 	display: flex;
-	
+
 }
 .ima{
 	margin-top: 80rpx;
 	margin-left: 180rpx;
-	
+
 }
 </style>
diff --git a/pages/login/register.vue b/pages/login/register.vue
index 6ea0ac9a9b846e97e8235967a7abe61dbe61e653..27ef0da1e28471e1b9316e80a670abb34288182c 100644
--- a/pages/login/register.vue
+++ b/pages/login/register.vue
@@ -1,27 +1,27 @@
 <template>
 	<view>
-		<image class="im" src="../../static/images/logo.png" style="width: 200rpx; height: 200rpx;"></image>
+		<image class="im" src="/static/images/logo.png" style="width: 200rpx; height: 200rpx;"></image>
 		<view class="name">
 			<view class="rt">
-			<image src="../../static/images/person.png" style="width: 50rpx;height: 50rpx; "></image>
+			<image src="/static/images/person.png" style="width: 50rpx;height: 50rpx; "></image>
 			</view>
 			<input class="inp" placeholder="请输入电话号码" placeholder-style="color:#BBBBBB"  type="number"></input>
 		</view>
 		<view class="name">
 			<view class="rt">
-			<image src="../../static/images/password.png" style="width: 50rpx;height: 50rpx; "></image>
+			<image src="/static/images/password.png" style="width: 50rpx;height: 50rpx; "></image>
 			</view>
 			<input class="inp" placeholder="请输入密码" placeholder-style="color:#BBBBBB"  type="number"></input>
 		</view>
 		<view class="name">
 			<view class="rt">
-			<image src="../../static/images/confirm_password.png" style="width: 50rpx;height: 50rpx; "></image>
+			<image src="/static/images/confirm_password.png" style="width: 50rpx;height: 50rpx; "></image>
 			</view>
 			<input class="inp" placeholder="确认密码" placeholder-style="color:#BBBBBB"  type="number"></input>
 		</view>
 		<view class="name">
 			<view class="rt">
-			<image src="../../static/images/verification_code.png" style="width: 50rpx;height: 50rpx; "></image>
+			<image src="/static/images/verification_code.png" style="width: 50rpx;height: 50rpx; "></image>
 			</view>
 			<view class="yanz">
 			<input class="inp" placeholder="输入验证码" placeholder-style="color:#BBBBBB"  type="number"></input>
@@ -39,11 +39,11 @@
 	export default {
 		data() {
 			return {
-				
+
 			}
 		},
 		methods: {
-			
+
 		}
 	}
 </script>
diff --git a/pages/login/shuyiLogin.vue b/pages/login/shuyiLogin.vue
new file mode 100644
index 0000000000000000000000000000000000000000..a8f542e9581651dee59848f4cc59896aa3d1b648
--- /dev/null
+++ b/pages/login/shuyiLogin.vue
@@ -0,0 +1,311 @@
+<template>
+	<view>
+		<view class="end">
+			<image @click="toBack" class="imag" src="/static/images/login_end.png"></image>
+		</view>
+		<view class="title">欢迎登录</view>
+		<view class="account">
+			<input @input="inputName" class="input" placeholder="读者号" placeholder-style="color:#D2D2D2" type="text" />
+			<view class="br"></view>
+			<input @input="inputPassWord" class="input" placeholder="密码" placeholder-style="color:#D2D2D2" type="password" />
+			<view class="br"></view>
+			<view class="remember">
+				<!-- 记住密码 -->
+				<view class="mui-input-row mui-checkbox">
+					<!-- <input id="chkRem" type="checkbox" checked="checked" class="RememberCheck"  @change="checkboxChange" /> -->
+					<checkbox-group @change="checkboxChange">
+						<checkbox id="chkRem" type="checkbox" :checked="rememberPsw" class="RememberCheck">
+							记住密码
+						</checkbox>
+						<!-- <lable for="chkRem" class="RememberPass">记住密码</lable> -->
+					</checkbox-group>
+				</view>
+			</view>
+		</view>
+		<view class="uni-button">
+			<button @click="saveSubmit" class="button">登 录</button>
+		</view>
+		<view class="forget">
+			<view class="first-forget">首次登录?</view>
+			<view class="end-forget">忘记密码</view>
+		</view>
+		<!-- #ifdef APP-PLUS -->
+		<view class="third-party">第三方登录</view>
+		<view class="third-icon">
+			<image data-logintype="qq" @click="appOAuthLogin" class="qq" src="/static/images/QQ.png"></image>
+			<image data-logintype="weixin" @click="appOAuthLogin" class="wx" src="/static/images/wechat.png"></image>
+			<image data-logintype="sinaweibo" @click="appOAuthLogin" class="wx" src="/static/images/microblog.png"></image>
+		</view>
+		<!-- #endif -->
+	</view>
+</template>
+
+<script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from "vuex";
+	export default {
+		data() {
+			return {
+				account: "", //账号
+				password: "", //密码
+				rememberPsw: false,
+			};
+		},
+		computed: {
+			...mapState(["token", "userinfo", "login"]),
+		},
+		onLoad() {
+			//TODO 没有判断登陆是否已经过期，只是简单的判断token是否存在，有缺陷
+			/*let that = this;
+			if (that.login) {
+			  uni.reLaunch({
+			    url: "/pages/main/main",
+			  });
+			}*/
+		},
+		methods: {
+			...mapMutations(["setUserInfo", "setToken"]),
+			inputName(e) {
+				var that = this;
+				// console.log(e.detail.value)
+				that.account = e.detail.value;
+			},
+			inputPassWord(e) {
+				var that = this;
+				// console.log(e.detail.value)
+				that.password = e.detail.value;
+			},
+			//账号登录
+			async saveSubmit() {
+				let that = this;
+				if (that.account == "") {
+					uni.showModal({
+						content: "账号不能为空！",
+						showCancel: false,
+					});
+					return;
+				}
+				if (that.password == "") {
+					uni.showModal({
+						content: "密码不能为空！",
+						showCancel: false,
+					});
+					return;
+				}
+				var params = {
+					url: "readerAuth/readerLogin",
+					type: "POST",
+					headerType: "application/json",
+					name: "Link",
+					data: {
+						type: 1,
+						account: that.account,
+						password: that.password,
+					},
+				};
+				let res = await app.myRequest(params);
+				console.log(res);
+				// console.log(res);
+				if (res.status === 400 || res.token === null) {
+					uni.showModal({
+						content: "账号或密码错误！测试账户：18888888888 密码123456",
+						showCancel: false,
+					});
+					return;
+				} else {
+					uni.showToast({
+						title: "登录成功",
+						duration: 2000,
+					});
+					uni.setStorageSync("reader", res);
+					uni.setStorageSync("token", res.token);
+					that.setUserInfo(res.reader);
+					that.setToken(res.token);
+					uni.reLaunch({
+						url: "/pages/main/main",
+					});
+				}
+			},
+			toBack() {
+				uni.showModal({
+					title: "请先登录获取token",
+					content: "账号：18888888888 密码123456",
+					showCancel: false,
+				});
+			},
+			checkboxChange(e) {},
+			//第三方登录
+			appOAuthLogin(e) {
+				var me = this;
+				// 1 获取用户的登录类型
+				var logintype = e.currentTarget.dataset.logintype;
+				// 2 授权登录，弹出授权窗口
+				uni.login({
+					provider: logintype,
+					success(loginRes) {
+						// 3 授权登录成功以后，获取用户的信息
+						uni.getUserInfo({
+							provider: logintype,
+							success(info) {
+								console.log("info:", info);
+								var userInfo = info.userInfo;
+								console.log("userInfoL:", info.userInfo);
+								var face = "";
+								var nickname = "";
+								var openIdOrUid = "";
+								if (logintype == "weixin") {
+									openIdOrUid = userInfo.openId;
+									face = userInfo.avatarUrl;
+									nickname = userInfo.nickName;
+								} else if (logintype == "qq") {
+									openIdOrUid = userInfo.openId;
+									face = userInfo.figureurl_qq_2;
+									nickname = userInfo.nickname;
+								} else if (logintype == "sinaweibo") {
+									openIdOrUid = userInfo.id;
+									face = userInfo.avatar_large;
+									nickname = userInfo.nickname;
+								}
+								// 4 调用开发者后台，执行一键注册或登录
+								uni.request({
+									url: me.serverUrl + "/appUnionLogin/" + logintype,
+									data: {
+										openIdOrUid: openIdOrUid,
+										nickname: nickname,
+										face: face,
+									},
+									method: "POST",
+									success(result) {
+										if (result.data.status == 200) {
+											var userInfo = result.data.data;
+											// 5 保存用户信息到全局的缓存中
+											uni.setStorageSync("globalUser", userInfo);
+											// 6 切换页面跳转，使用tab切换的api
+											uni.switchTab({
+												url: "../me/me",
+											});
+										}
+									},
+								});
+							},
+						});
+					},
+				});
+			},
+		},
+	};
+</script>
+
+<style>
+	.end {
+		width: 100%;
+		height: 40rpx;
+		margin-top: 100rpx;
+	}
+
+	.imag {
+		width: 40rpx;
+		height: 40rpx;
+		margin-left: 30rpx;
+		margin-top: 0;
+	}
+
+	.title {
+		margin-top: 60rpx;
+		margin-left: 70rpx;
+		color: #353535;
+		font-size: 60rpx;
+	}
+
+	.account {
+		height: 220rpx;
+	}
+
+	.input {
+		width: 100%;
+		height: 40rpx;
+		margin-left: 70rpx;
+		margin-top: 60rpx;
+		font-size: 40rpx;
+	}
+
+	.br {
+		margin-left: 70rpx;
+		margin-right: 70rpx;
+		margin-top: 15rpx;
+		height: 1rpx;
+		background-color: #d2d2d2;
+	}
+
+	.remember {
+		display: flex;
+		margin-left: 70rpx;
+		margin-top: 40rpx;
+		color: #555555;
+		font-size: 40rpx;
+	}
+
+	.uni-button {
+		width: 100%;
+	}
+
+	.button {
+		margin-top: 150rpx;
+		margin-left: 70rpx;
+		margin-right: 70rpx;
+		background-color: #6148f4;
+		color: #ffffff;
+	}
+
+	.forget {
+		display: flex;
+		width: 100%;
+		height: 80rpx;
+		justify-content: space-between;
+	}
+
+	.first-forget {
+		margin-left: 70rpx;
+		margin-top: 20rpx;
+		color: #32a0fe;
+	}
+
+	.end-forget {
+		margin-right: 70rpx;
+		margin-top: 20rpx;
+		color: #32a0fe;
+	}
+
+	.third-party {
+		margin-top: 300rpx;
+		text-align: center;
+		font-size: 40rpx;
+		color: #4d4d4d;
+	}
+
+	.third-icon {
+		display: flex;
+		width: 100%;
+		height: 100rpx;
+		justify-content: center;
+	}
+
+	.qq {
+		height: 110rpx;
+		width: 110rpx;
+		border-radius: 50%;
+		margin-top: 100rpx;
+		/* margin-left: 180rpx; */
+	}
+
+	.wx {
+		height: 110rpx;
+		width: 110rpx;
+		border-radius: 50%;
+		margin-top: 100rpx;
+		margin-left: 40rpx;
+	}
+</style>
diff --git a/pages/main/main.vue b/pages/main/main.vue
index fb4c3135365d0f536a30175827c210089f68ebfb..3c435318c98a62fea6641296993f8171b67515bb 100644
--- a/pages/main/main.vue
+++ b/pages/main/main.vue
@@ -3,24 +3,26 @@
 		<!-- 顶部部分 -->
 		<view class="head">
 			<view class="header-wrap">
+				<view :style="headHeight"></view>
 				<view class="index-header">
-					<image class="address" src="../../static/images/shuyi_LOGO_SY2x.png"></image>
+					<image class="address" src="/static/images/shuyi_LOGO_SY2x.png"></image>
 					<view class="input-wrap">
 						<navigator url="../sousuo/sousuo">
 							<image class="img" src="/static/images/search_icon2x.png"></image>
-							<input type="search" placeholder="  书易搜索" v-model="value" @change="inputChange" />
+							<input class="input-name" type="search" placeholder="  书易搜索" v-model="value"  />
 						</navigator>
 					</view>
-					<view class="map-wrap" @click="rightClick">
-						<image class="iconfont" src="../../static/images/message_icon2x.png"></image>
+					<view class="map-wrap" @click="scanCodes()">
+						<image class="iconfont" src="/static/images/scanCode.png"></image>
 					</view>
 				</view>
 			</view>
+			<view :style="headHeight"></view>
 			<view class="blank"></view>
 		</view>
 		<!-- 轮播图 -->
-		<view class="lunbo"> 
-			<swiper style="height: 350rpx;" indicator-dots="true" autoplay="true" interval='5000' indicator-active-color="#6C40F3"
+		<view class="lunbo">
+			<swiper style="height: 350rpx" indicator-dots="true" autoplay="true" interval="5000" indicator-active-color="#6C40F3"
 			 circular="true">
 				<swiper-item>
 					<image class="ima1" src="https://ss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=3498136939,2417991357&fm=26&gp=0.jpg"></image>
@@ -38,32 +40,32 @@
 			<!-- 找还书列表 -->
 			<view class="gongnen">
 				<view class="module">
-					<navigator url="../zhaob/blist">
-						<image class="tupian" src="../../static/images/find_book_icon2x.png"></image>
+					<navigator url="../sousuo/sousuo">
+						<image class="tupian" src="/static/images/find_book_icon2x.png"></image>
 						<view class="name">找书</view>
 					</navigator>
 				</view>
 				<view class="module">
 					<navigator url="/pages_borrow_books/pages/return-books/return-books">
-						<image class="tupian" src="../../static/images/repay_book_icon2x.png"></image>
+						<image class="tupian" src="/static/images/repay_book_icon2x.png"></image>
 						<view class="name">还书</view>
 					</navigator>
 				</view>
 				<view class="module">
 					<navigator url="/pages_borrow_books/pages/appointment/appointment">
-						<image class="tupian" src="../../static/images/make_book_icon2x.png"></image>
+						<image class="tupian" src="/static/images/make_book_icon2x.png"></image>
 						<view class="name">预约</view>
 					</navigator>
 				</view>
 				<view class="module">
-					<navigator url="../mycollection/mycollection">
-						<image class="tupian" src="../../static/images/collect_book_icon2x.png"></image>
+					<navigator url="/pages_read_circle/pages/mycollection/mycollection">						
+					<image class="tupian" src="/static/images/collect_book_icon2x.png"></image>
 						<view class="name">收藏</view>
 					</navigator>
 				</view>
 				<view class="module">
 					<navigator url="../sousuo/fujin">
-						<image class="tupian" src="../../static/images/nearby_book_icon2x.png"></image>
+						<image class="tupian" src="/static/images/nearby_book_icon2x.png"></image>
 						<view class="name">附近的书</view>
 					</navigator>
 				</view>
@@ -71,170 +73,175 @@
 			<view class="tr"></view>
 			<!-- 分类 -->
 			<view class="fenlei">
-				<view class="module1">
-					<image class="tupian1" src="../../static/images/art_icon2x.png"></image>
+				<view class="module1" data-name="艺术" @click="goSubclass">
+					<!-- <navigator url="/pages/jianshu/subclass"> -->
+					<image class="tupian1" src="/static/images/art_icon2x.png"></image>
 					<view class="name">艺术</view>
+					<!-- </navigator> -->
 				</view>
-				<view class="module1">
-					<image class="tupian1" src="../../static/images/economics_icon2x.png"></image>
+				<view class="module1" data-name="经济" @click="goSubclass">
+					<image class="tupian1" src="/static/images/economics_icon2x.png"></image>
 					<view class="name">经济</view>
 				</view>
-				<view class="module1">
-					<image class="tupian1" src="../../static/images/hour_icon2x.png"></image>
+				<view class="module1" data-name="小说" @click="goSubclass">
+					<image class="tupian1" src="/static/images/hour_icon2x.png"></image>
 					<view class="name">小说</view>
 				</view>
-				<view class="module1">
-					<image class="tupian1" src="../../static/images/children.icon2x.png"></image>
+				<view class="module1" data-name="儿童" @click="goSubclass">
+					<image class="tupian1" src="/static/images/children.icon2x.png"></image>
 					<view class="name">儿童</view>
 				</view>
-				<view class="module1">
-					<image class="tupian1" src="../../static/images/activity_icon2x.png"></image>
+				<view class="module1" data-name="活动" @click="goSubclass">
+					<image class="tupian1" src="/static/images/activity_icon2x.png"></image>
 					<view class="name">活动</view>
 				</view>
 			</view>
 			<view class="fenlei">
-				<view class="module1">
-					<image class="tupian1" src="../../static/images/law_icon2x.png"></image>
+				<view class="module1" data-name="法律" @click="goSubclass">
+					<image class="tupian1" src="/static/images/law_icon2x.png"></image>
 					<view class="name">法律</view>
 				</view>
-				<view class="module1">
-					<image class="tupian1" src="../../static/images/science_icon2x.png"></image>
+				<view class="module1" data-name="科技" @click="goSubclass">
+					<image class="tupian1" src="/static/images/science_icon2x.png"></image>
 					<view class="name">科技</view>
 				</view>
-				<view class="module1">
-					<image class="tupian1" src="../../static/images/sports_icon2x.png"></image>
+				<view class="module1" data-name="体育" @click="goSubclass">
+					<image class="tupian1" src="/static/images/sports_icon2x.png"></image>
 					<view class="name">体育</view>
 				</view>
-				<view class="module1">
-					<image class="tupian1" src="../../static/images/literature_icon2x.png"></image>
+				<view class="module1" data-name="文学" @click="goSubclass">
+					<image class="tupian1" src="/static/images/literature_icon2x.png"></image>
 					<view class="name">文学</view>
 				</view>
-				<view class="module1">
-					<navigator url="../classify/classify">
-						<image class="tupian1" src="../../static/images/all_classifications_icon2x.png"></image>
-						<view class="name">全部分类</view>
-					</navigator>
+				<view class="module1" data-name="全部分类" @click="goSubclass">
+					<image class="tupian1" src="/static/images/all_classifications_icon2x.png"></image>
+					<view class="name">全部分类</view>
 				</view>
 			</view>
 			<!-- 分割线 -->
 			<view class="br"></view>
 			<!-- 新书上架 -->
-			<view class="xinshu" v-if="newbookList !==undefined && newbookList.length > 0">
+			<view class="xinshu" v-if="newbookList !== undefined && newbookList.length > 0">
 				<navigator url="../jianshu/newb">
-					<view class="tit">
-						<image class="imag1" src="../../static/images/title_navigation_icon2x.png"></image>
+					<view class="tite">
+						<image class="imag1" src="/static/images/title_navigation_icon2x.png"></image>
 						<view class="shu">新书上架</view>
 						<view class="gengduo">查看更多</view>
-						<image class="imag2" src="../../static/images/arrow_right_icon_32_2x.png"></image>
+						<image class="imag2" src="/static/images/arrow_right_icon_32_2x.png"></image>
 					</view>
 				</navigator>
-				<view class="lieshu">
+				<view class="lieshus">
 					<view class="lies" v-for="item in newbookList">
-						<navigator :url="'../Bdetail/Bdetail?isbn='+item.isbn">
-							<image class="imag3" :src="item.book.picturePath"></image>
-							<view class="name1">{{item.book.bookName}}</view>
-							<view class="name2">{{item.book.publisher}}</view>
+						<navigator :url="'../Bdetail/Bdetail?isbn=' + item.isbn">
+							<image class="imag3" :src="item.book.picturePath" @error="imageError('2',item)"></image>
+							<view class="name-1">{{ item.book.bookName }}</view>
+							<view class="name2">{{ item.book.publisher }}</view>
 						</navigator>
 					</view>
 				</view>
 			</view>
-			<view v-if="newbookList == undefined || newbookList.length <= 0" style="height: 300rpx;">
+			<view v-if="newbookList == undefined || newbookList.length <= 0" style="height: 300rpx">
 				<navigator url="../jianshu/person">
-					<view class="tit">
-						<image class="imag1" src="../../static/images/title_navigation_icon2x.png"></image>
+					<view class="tite">
+						<image class="imag1" src="/static/images/title_navigation_icon2x.png"></image>
 						<view class="shu">新书上架</view>
 						<view class="gengduo">查看更多</view>
-						<image class="imag2" src="../../static/images/arrow_right_icon_32_2x.png"></image>
+						<image class="imag2" src="/static/images/arrow_right_icon_32_2x.png"></image>
 					</view>
 				</navigator>
-				<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
-					<view>
-						书籍正在上架中...
-					</view>
+				<view style="
+            width: 100%;
+            height: 100rpx;
+            font-size: 40rpx;
+            color: red;
+            text-align: center;
+            margin-top: 60rpx;
+          ">
+					<view> 书籍正在上架中... </view>
 				</view>
 			</view>
 			<!-- 分割线 -->
 			<view class="br"></view>
 			<!-- 热门推荐 -->
-			<view class="xinshu" v-if="hotbookList !==undefined && hotbookList.length > 0">
+			<view class="xinshu" v-if="hotbookList !== undefined && hotbookList.length > 0">
 				<navigator url="../jianshu/remen">
-					<view class="tit">
-						<image class="imag1" src="../../static/images/title_navigation_icon2x.png"></image>
+					<view class="tite">
+						<image class="imag1" src="/static/images/title_navigation_icon2x.png"></image>
 						<view class="shu">热门推荐</view>
 						<view class="gengduo">查看更多</view>
-						<image class="imag2" src="../../static/images/arrow_right_icon_32_2x.png"></image>
+						<image class="imag2" src="/static/images/arrow_right_icon_32_2x.png"></image>
 					</view>
 				</navigator>
-				<view class="lieshu">
+				<view class="lieshus">
 					<view class="lies" v-for="item in hotbookList">
-						<navigator :url="'../Bdetail/Bdetail?isbn='+item.isbn">
-							<image class="imag3" :src="item.book.picturePath"></image>
-							<view class="name1">{{item.book.bookName}}</view>
-							<view class="name2">{{item.book.publisher}}</view>
+						<navigator :url="'../Bdetail/Bdetail?isbn=' + item.isbn">
+							<image class="imag3" :src="item.book.picturePath" @error="imageError('2',item)"></image>
+							<view class="name-1">{{ item.book.bookName }}</view>
+							<view class="name2">{{ item.book.publisher }}</view>
 						</navigator>
 					</view>
 				</view>
 			</view>
-			<view v-if="hotbookList == undefined || hotbookList.length <= 0" style="height: 300rpx;">
+			<view v-if="hotbookList == undefined || hotbookList.length <= 0" style="height: 300rpx">
 				<navigator url="../jianshu/person">
-					<view class="tit">
-						<image class="imag1" src="../../static/images/title_navigation_icon2x.png"></image>
+					<view class="tite">
+						<image class="imag1" src="/static/images/title_navigation_icon2x.png"></image>
 						<view class="shu">热门推荐</view>
 						<view class="gengduo">查看更多</view>
-						<image class="imag2" src="../../static/images/arrow_right_icon_32_2x.png"></image>
+						<image class="imag2" src="/static/images/arrow_right_icon_32_2x.png"></image>
 					</view>
 				</navigator>
-				<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
-					<view>
-						书籍正在上架中...
-					</view>
+				<view style="
+            width: 100%;
+            height: 100rpx;
+            font-size: 40rpx;
+            color: red;
+            text-align: center;
+            margin-top: 60rpx;
+          ">
+					<view> 书籍正在上架中... </view>
 				</view>
 			</view>
 			<!-- 分割线 -->
 			<view class="br"></view>
 			<!-- 猜您喜欢 -->
-			<view class="xinshu" v-if="guessLikeList !==undefined && guessLikeList.length > 0">
+			<view class="xinshu" v-if="guessLikeList !== undefined && guessLikeList.length > 0">
 				<navigator url="../jianshu/person">
-					<view class="tit">
-						<image class="imag1" src="../../static/images/title_navigation_icon2x.png"></image>
+					<view class="tite">
+						<image class="imag1" src="/static/images/title_navigation_icon2x.png"></image>
 						<view class="shu">猜您喜欢</view>
 						<view class="gengduo">查看更多</view>
-						<image class="imag2" src="../../static/images/arrow_right_icon_32_2x.png"></image>
+						<image class="imag2" src="/static/images/arrow_right_icon_32_2x.png"></image>
 					</view>
 				</navigator>
-				<view class="lieshu">
-					<view class="lies">
-						<navigator url="../Bdetail/Bdetail">
-							<image class="imag3" src="http://cdn.static.17k.com/book/189x272/61/95/3159561.jpg-189x272?v=1590116249000"></image>
-							<view class="name1">解忧杂货铺</view>
-							<view class="name2">[日]东野圭吾电风扇广泛广泛是</view>
+				<view class="lieshus">
+					<view class="lies" v-for="item in guessLikeList">
+						<navigator :url="'../Bdetail/Bdetail?isbn=' + item.isbn">
+							<image class="imag3" :src="item.picturePath" @error="imageError('1',item)" ></image>
+							<view class="name-1">{{ item.bookName }}</view>
+							<view class="name2">{{ item.publisher }}</view>
 						</navigator>
 					</view>
-					<view class="lies">
-						<image class="imag3" src="http://cdn.static.17k.com/book/189x272/83/03/3200383.jpg-189x272?v=1596527153000"></image>
-						<view class="name1">解忧杂货铺牛</view>
-						<view class="name2">[日]东野圭吾</view>
-					</view>
-					<view class="lies">
-						<image class="imag3" src="https://img11.360buyimg.com/n1/jfs/t26623/338/419718625/245064/7ef5b21b/5b9106caNc9b79061.jpg"></image>
-						<view class="name1">解忧杂货铺</view>
-						<view class="name2">[日]东野圭吾</view>
-					</view>
 				</view>
 			</view>
-			<view v-if="guessLikeList == undefined || guessLikeList.length <= 0" style="height: 300rpx;">
+			<view v-if="guessLikeList == undefined || guessLikeList.length <= 0" style="height: 300rpx">
 				<navigator url="../jianshu/person">
-					<view class="tit">
-						<image class="imag1" src="../../static/images/title_navigation_icon2x.png"></image>
+					<view class="tite">
+						<image class="imag1" src="/static/images/title_navigation_icon2x.png"></image>
 						<view class="shu">猜您喜欢</view>
 						<view class="gengduo">查看更多</view>
-						<image class="imag2" src="../../static/images/arrow_right_icon_32_2x.png"></image>
+						<image class="imag2" src="/static/images/arrow_right_icon_32_2x.png"></image>
 					</view>
 				</navigator>
-				<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
-					<view>
-						书籍正在上架中...
-					</view>
+				<view style="
+            width: 100%;
+            height: 100rpx;
+            font-size: 40rpx;
+            color: red;
+            text-align: center;
+            margin-top: 60rpx;
+          ">
+					<view> 书籍正在上架中... </view>
 				</view>
 			</view>
 			<view class="br1"></view>
@@ -247,19 +254,33 @@
 	import {
 		mapState,
 		mapMutations
-	} from 'vuex'
+	} from "vuex";
 	export default {
 		data() {
 			return {
-				value: '',
+				headHeight: "", //小程序胶囊高度
+				value: "",
 				newbookList: [], //新书list
 				hotbookList: [], //热书列表
 				guessLikeList: [], //猜你喜欢列表
-			}
+			};
+		},
+		computed: {
+			...mapState(["token", "userinfo"]),
 		},
 		onLoad() {
+			// 获取系统状态栏的高度
+			let statusBarHeight = uni.getSystemInfoSync().statusBarHeight;
+			// 获取小程序胶囊高度
+			// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
+			this.headHeight = 'background-color: #6c40f3;height:'+ (uni.getMenuButtonBoundingClientRect().height + statusBarHeight) + 'px';
+			// #endif
+			// #ifdef APP-PLUS
+			this.headHeight = 'background-color: #6c40f3;height:'+ statusBarHeight + 'px';
+			// #endif
 			this.getNewBook(); //新书
 			this.getHotBook(); //热书
+			this.getGuessLike(); //荐书
 		},
 		methods: {
 			//获取新书列表
@@ -267,9 +288,9 @@
 				var that = this;
 				var params = {
 					url: "newbook?size=6&page=0",
-					type: 'GET',
-					data: {}
-				}
+					type: "GET",
+					data: {},
+				};
 				const res = await app.myRequest(params);
 				that.newbookList = res.content;
 			},
@@ -278,20 +299,121 @@
 				var that = this;
 				var params = {
 					url: "hotbook?size=6&page=0",
-					type: 'GET',
-					data: {}
-				}
+					type: "GET",
+					data: {},
+				};
 				const res = await app.myRequest(params);
 				that.hotbookList = res.content;
 			},
+			//获取荐书列表
+			async getGuessLike() {
+				var that = this;
+				let linkList = [];
+				if (that.userinfo.length > 0 || that.userinfo != undefined) {
+					var params = {
+						url: "book/recommend?readerId=" + that.userinfo.readerId,
+						type: "GET",
+						data: {},
+					};
+					const res = await app.myRequest(params);
+					linkList = res;
+				}
+				if (linkList.length > 6) {
+					for (let i = 0; i < 6; i++) {
+						that.guessLikeList.push(linkList[i]);
+					}
+				}else{
+					that.guessLikeList = linkList;
+				}
+			},
+			//图片加载不出来
+			imageError(e,index){
+				let that = this;
+				if(e==='1'){
+					console.log(e)
+					index.picturePath = "/static/images/temporary.jpg"
+				}
+				if(e==='2'){
+					index.book.picturePath = "/static/images/temporary.jpg"
+				}
+				
+			},
+			//扫码
+			scanCodes(){
+				// 调起条码扫描
+				uni.scanCode({
+				    scanType: ['qrCode'],
+				    success: function (res) {
+				        console.log('条码类型：' + res.scanType);
+				        console.log('条码内容：' + res.result);
+						
+						uni.switchTab({
+							url: '/pages/main/main'
+						});
+						
+						uni.showToast({
+							icon: 'none',
+							title: '借书成功！'
+						})
+						
+				    }
+				});
+			},
 			// inputChange: function() {
 			// 	this.$emit('change', this.value)
 			// },
 			// rightClick: function() {
 			// 	this.$emit("rightClick")
 			// }
-		}
-	}
+
+			//跳转到子类
+			goSubclass(e) {
+				console.log(e.currentTarget.dataset.name);
+				let name = e.currentTarget.dataset.name;
+				if (name === "艺术") {
+					uni.navigateTo({
+						url: '/pages/jianshu/subclass?classificationSymbol=J&name=' + name
+					});
+				} else if (name === "经济") {
+					uni.navigateTo({
+						url: '/pages/jianshu/subclass?classificationSymbol=F&name=' + name
+					});
+				} else if (name === "小说") {
+					uni.navigateTo({
+						url: '/pages/jianshu/subclass?classificationSymbol=I24&name=' + name
+					});
+				} else if (name === "儿童") {
+					uni.navigateTo({
+						url: '/pages/jianshu/subclass?classificationSymbol=I28&name=' + name
+					});
+				} else if (name === "活动") {
+					uni.navigateTo({
+						url: '/pages/jianshu/subclass?classificationSymbol=G898&name=' + name
+					});
+				} else if (name === "法律") {
+					uni.navigateTo({
+						url: '/pages/jianshu/subclass?classificationSymbol=D9&name=' + name
+					});
+				} else if (name === "科技") {
+					uni.navigateTo({
+						url: '/pages/jianshu/subclass?classificationSymbol=G3&name=' + name
+					});
+				} else if (name === "体育") {
+					uni.navigateTo({
+						url: '/pages/jianshu/subclass?classificationSymbol=G8&name=' + name
+					});
+				} else if (name === "文学") {
+					uni.navigateTo({
+						url: '/pages/jianshu/subclass?classificationSymbol=I&name=' + name
+					});
+				} else if (name === "全部分类") {
+					uni.navigateTo({
+						url: '/pages/classify/classify'
+					});
+				}
+			},
+		},
+	};
 </script>
 
 <style lang="scss">
@@ -299,11 +421,10 @@
 	$color-base: #fff;
 	$words-color-base: #333333;
 	$words-color-light: #999999;
-	.head{
-		/*  #ifdef MP-WEIXIN  */
-		height: 220rpx;
-		/*  #endif  */
+
+	.head {
 	}
+
 	.header-wrap {
 		width: 100%;
 		position: fixed;
@@ -311,15 +432,8 @@
 		z-index: 999;
 
 		.index-header {
-			/*  #ifdef MP-WEIXIN  */
-			height: 220rpx;
-			padding-top: 120rpx;
-			/*  #endif  */
-			/*  #ifdef APP-PLUS  */
-			height: 150rpx;
-			padding-top: 40rpx;
-			/*  #endif  */
-			line-height: 110rpx;
+			height: 100rpx;
+			// padding-top: 40rpx;
 			padding-left: 30rpx;
 			padding-right: 30rpx;
 			font-size: 28rpx;
@@ -327,7 +441,7 @@
 			display: flex;
 			align-items: center;
 			justify-content: space-between;
-			background-color: #6C40F3;
+			background-color: #6c40f3;
 
 			.address {
 				margin-left: -10rpx;
@@ -340,12 +454,11 @@
 			.input-wrap {
 				display: flex;
 				width: 530rpx;
-				height: 75rpx;
 				height: 70rpx;
 				padding: 10rpx 80rpx 10rpx 50rpx;
 				margin-left: 0;
 				box-sizing: border-box;
-				background-color: #F5F5F5;
+				background-color: #f5f5f5;
 				border-radius: 50upx;
 				color: $words-color-base;
 				position: relative;
@@ -369,18 +482,21 @@
 					font-size: 30rpx;
 					z-index: 1000;
 				}
+				.input-name{	
+					height: 50rpx;
+					margin-top: 5rpx;
+				}
 			}
 
-
 			.map-wrap {
-				.iconfont {
-					margin-top: 50rpx;
-					width: 70rpx;
-					height: 70rpx;
-					font-size: 32rpx;
-					margin-right: -10rpx;
-					// margin-left: ;
-				}
+					.iconfont {
+						margin-top: 10rpx;
+						width: 76rpx;
+						height: 76rpx;
+						font-size: 32rpx;
+						margin-right: -10rpx;
+						// margin-left: ;
+					}
 
 				text {
 					font-size: 26rpx;
@@ -390,7 +506,7 @@
 	}
 
 	.blank {
-		height: 126rpx;
+		height: 100rpx;
 	}
 
 	/* 轮播 */
@@ -411,15 +527,15 @@
 	}
 
 	wx-swiper .wx-swiper-dot-active {
-		background-color: #18C7F2;
+		background-color: #18c7f2;
 		width: 10px;
 		border-radius: 10px;
-		background: #18C7F2;
+		background: #18c7f2;
 	}
 
 	/* 功能模块 */
 	.neir {
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		width: 100%;
 		height: 450rpx;
 	}
@@ -429,7 +545,6 @@
 		margin-top: 20rpx;
 		width: 100%;
 		height: 150rpx;
-
 	}
 
 	.module {
@@ -446,7 +561,7 @@
 	.name {
 		width: 100%;
 		height: 50rpx;
-		color: #3C3C3C;
+		color: #3c3c3c;
 		font-size: 26rpx;
 		text-align: center;
 		margin-top: 0rpx;
@@ -455,6 +570,7 @@
 	/* 分类 */
 	.fenlei {
 		display: flex;
+		background-color: #ffffff;
 		margin-top: 30rpx;
 		width: 100%;
 		height: 125rpx;
@@ -472,10 +588,10 @@
 	}
 
 	.br {
-		margin-top: 30rpx;
+		margin-top: 10rpx;
 		width: 100%;
 		height: 25rpx;
-		background-color: #F5F5F5;
+		background-color: #f5f5f5;
 	}
 
 	/* 新书上架 */
@@ -484,9 +600,10 @@
 		height: 1070rpx;
 	}
 
-	.tit {
+	.tite {
 		display: flex;
 		width: 100%;
+		background-color: #FFFFFF;
 		// height: 80rpx;
 		// margin-top: -20rpx;
 	}
@@ -495,7 +612,7 @@
 		color: #333333;
 		font-size: 40rpx;
 		margin-left: 20rpx;
-		margin-top: 20rpx;
+		margin-top: 23rpx;
 		margin-right: 15rpx;
 		width: 30%;
 	}
@@ -515,13 +632,12 @@
 		height: 50rpx;
 		font-size: 28rpx;
 		width: 20%;
-
 	}
 
 	.tr {
 		margin-top: 10rpx;
 		height: 2rpx;
-		background-color: #F1F1F1;
+		background-color: #f1f1f1;
 		margin-left: 20rpx;
 		width: 95%;
 	}
@@ -533,8 +649,9 @@
 	}
 
 	/* 新书 */
-	.lieshu {
+	.lieshus {
 		display: flex;
+		background-color: #FFFFFF;
 		flex-wrap: wrap; //自动换行
 		width: 100%;
 		height: 1000rpx;
@@ -552,10 +669,10 @@
 		height: 300rpx;
 	}
 
-	.name1 {
+	.name-1 {
 		display: -webkit-box;
 		width: 100%;
-		height: 90rpx;
+		height: 80rpx;
 		font-size: 30rpx;
 		color: #333333;
 		word-break: break-all;
@@ -587,6 +704,6 @@
 		margin-top: 30rpx;
 		width: 100%;
 		height: 35rpx;
-		background-color: #F5F5F5;
+		background-color: #f5f5f5;
 	}
 </style>
diff --git a/pages/mineFriend/mineFriend.vue b/pages/mineFriend/mineFriend.vue
index dc4477c5e838845908d1c456867509d12c1611e7..d05ef77234278f489a2445d99e709d3c0a4f7d2d 100644
--- a/pages/mineFriend/mineFriend.vue
+++ b/pages/mineFriend/mineFriend.vue
@@ -2,7 +2,7 @@
 	<view class="all">
 		<view class="find">
 			<view class="">
-				<image src="../../static/images/friend.png" style=" margin-left: 100rpx;  width: 50rpx;height: 50rpx;"></image>
+				<image src="/static/images/friend.png" style=" margin-left: 100rpx;  width: 50rpx;height: 50rpx;"></image>
 			</view>
 			<view class="">
 				<input placeholder="搜索好友" @input="goToSearch" v-model="name"  style="width: 400rpx; height:  50rpx; font-size: 25rpx; border: solid 2rpx #EEEEEE;border-radius: 5rpx;"/>
@@ -11,8 +11,8 @@
 				<button type="warn" style="width: 110rpx; height: 50rpx; font-size: 15rpx; margin-right: 100rpx; " >搜索</button>
 			</view>
 		</view>
-		<view v-if="findFriendsList.length <= 0">
-			<view v-if="myFriendsList !==undefined && myFriendsList.length > 0">
+		<view v-if="type==1">
+			<view v-if="myFriendsList !=undefined && myFriendsList.length > 0">
 				<view class="show" v-for="(item,index) in myFriendsList" :key="index">
 					<view class="img">
 						<view v-if="item.friend.avatar != null">
@@ -23,7 +23,7 @@
 						</view>
 					</view>
 					<view class="name">{{item.friend.nickname}}</view>
-				</view>	
+				</view>
 			</view>
 			<view v-else>
 				<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
@@ -34,7 +34,7 @@
 			</view>
 		</view>
 		<view v-else>
-			<view v-if="findFriendsList !==undefined && findFriendsList.length > 0">
+			<view v-if="findFriendsList !=undefined && findFriendsList.length > 0">
 				<view class="show" v-for="(item,index) in findFriendsList" :key="index">
 					<view class="img">
 						<view v-if="item.avatar != null">
@@ -45,12 +45,12 @@
 						</view>
 					</view>
 					<view class="name">{{item.nickname}}</view>
-				</view>	
+				</view>
 			</view>
 			<view v-else>
 				<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
 					<view>
-						查询不到此人信息！！！
+						没有找到好友！！！
 					</view>
 				</view>
 			</view>
@@ -69,12 +69,13 @@
 			return {
 				myFriendsList : [],
 				name:'',
-				findFriendsList : []
+				findFriendsList : [],
+				type:1,    //更据tpye来判断当前页是总通讯页还是查询页 1:总通讯页 2：查询页
 			}
 		},
-		onLoad(){			
-			this.getMyFriends(); //获取我的朋友列表	
-			
+		onLoad(){
+			this.getMyFriends(); //获取我的朋友列表
+
 				},
 		methods: {
 			//获取我的朋友列表
@@ -88,7 +89,9 @@
 				const res = await app.myRequest(params);
 				that.myFriendsList = res;
 				console.log(res);
-				console.log(that.myFriendsList[1].friend.nickname);
+				console.log('myFriendsList');
+
+
 			},
 			//默认头像
 			getImg(){
@@ -97,20 +100,27 @@
 			//根据昵称进行模糊查询
 			async goToSearch() {
 				var that = this;
-				var params = {
-					url: "friends/queryByName",
-					type: 'GET',
-					data: {
-						size : 10,
-						page : 0,
-						name : this.name
-						
+				if(this.name ===''){
+					this.type = 1;
+					this.getMyFriends();
+				}else{
+					this.type = 2;
+					var params = {
+						url: "friends/queryByName",
+						type: 'GET',
+						data: {
+							size : 10,
+							page : 0,
+							name : this.name
+
+						}
 					}
+					const res = await app.myRequest(params);
+					that.findFriendsList = res;
+
+
 				}
-				const res = await app.myRequest(params);
-				that.findFriendsList = res;
-				console.log(res);
-				
+
 			},
 		}
 	}
@@ -136,7 +146,7 @@
 		margin-left: 40rpx;
 	}
 	.all{
-		
+
 	}
 	.find{
 		display: flex;
diff --git a/pages/my/Uchart.vue b/pages/my/Uchart.vue
new file mode 100644
index 0000000000000000000000000000000000000000..01c00a3137fab98d9a5a523344abae35f5fa3c8f
--- /dev/null
+++ b/pages/my/Uchart.vue
@@ -0,0 +1,88 @@
+<template>
+	<view class="qiun-columns">
+		<view class="qiun-bg-white qiun-title-bar qiun-common-mt" >
+			<view class="qiun-title-dot-light">知识图谱</view>
+		</view>
+		<view class="qiun-charts" >
+			<canvas canvas-id="canvasRadar" id="canvasRadar" class="charts"></canvas>
+		</view>
+	</view>
+</template>
+
+<script>
+	import uCharts from '@/common/u-charts.js';
+	var _self;
+	var canvaRadar=null;
+	export default {
+		data() {
+			return {
+				cWidth:'',
+				cHeight:'',
+				pixelRatio:1,
+			}
+		},
+		onLoad() {
+			_self = this;
+			this.cWidth=uni.upx2px(750);
+			this.cHeight=uni.upx2px(500);
+			this.getServerData();
+		},
+		methods: {
+			getServerData(){
+				uni.request({
+					url: 'https://www.ucharts.cn/data.json',
+					data:{
+					},
+					success: function(res) {
+						console.log(res.data.data)
+						let Radar={categories:[],series:[]};
+						Radar.categories=res.data.data.Radar.categories;
+						Radar.series=res.data.data.Radar.series;
+						_self.showRadar("canvasRadar",Radar);
+					},
+					fail: () => {
+						_self.tips="网络错误，小程序端请检查合法域名";
+					},
+				});
+			},
+			showRadar(canvasId,chartData){
+				canvaRadar=new uCharts({
+					$this:_self,
+					canvasId: canvasId,
+					type: 'radar',
+					fontSize:11,
+					legend:{show:true},
+					background:'#FFFFFF',
+					pixelRatio:_self.pixelRatio,
+					animation: true,
+					dataLabel: true,
+					categories: chartData.categories,
+					series: chartData.series,
+					width: _self.cWidth*_self.pixelRatio,
+					height: _self.cHeight*_self.pixelRatio,
+					extra: {
+						radar: {
+							max: 200//雷达数值的最大值
+						}
+					}
+				});
+			}
+		}
+	}
+</script>
+
+<style>
+	/*样式的width和height一定要与定义的cWidth和cHeight相对应*/
+	.qiun-charts {
+		width: 750upx;
+		height: 500upx;
+		background-color: #FFFFFF;
+	}
+	
+	.charts {
+		width: 750upx;
+		height: 500upx;
+		background-color: #FFFFFF;
+	}
+</style>
+
diff --git a/pages/my/build.vue b/pages/my/build.vue
index ed55949ccd69da44146bde637dde68d6740a5702..c26b031498eaebf30963b535e211998bb9d5b85b 100644
--- a/pages/my/build.vue
+++ b/pages/my/build.vue
@@ -1,35 +1,38 @@
 <template>
 	<view>
 		<!-- 导航栏 -->
-		<view class="tab1" style="width: 100%; height: 90rpx;">
-			<image class="back" src="../../static/images/back.png" style="width: 60rpx; height: 60rpx;"></image>
-			<view class="tit1">创建个人图书馆</view>
+		<u-navbar height="44" title="创建个人图书馆" title-color="white" title-size="40" :background="background" back-icon-color="white"
+		 back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list">
+				</view>
 			</view>
-			<!-- 内容 -->
-			<view class="tr"></view>
-			<view class="tex"><input @input="goToSearch" placeholder="图书馆名称"   type="text"/></view>
-			<picker>
+		</u-navbar>
+		<!-- 内容 -->
+		<view class="tr"></view>
+		<view class="tex"><input @input="goToSearch" placeholder="图书馆名称" type="text" /></view>
+		<picker>
 			<view class="tab">
-				<input class="inp" @input="goToSearch" placeholder="图书馆类型"  type="number"></input>
-				<image class="ima" src="../../static/images/more.png" style="width: 30rpx; height: 30rpx;"></image>
+				<input class="inp" @input="goToSearch" placeholder="图书馆类型" type="number"></input>
+				<image class="ima" src="/static/images/more.png" style="width: 30rpx; height: 30rpx;"></image>
 			</view>
-			</picker>
-			<view class="jian">图书馆简介 :</view>
-			<textarea class="tex1" placeholder="" ></textarea>
-			<view class="jian">选择图书馆成员</view>
-			<view class="tr"></view>
-			<view class="list">
-				<image src="../../static/images/add_more2.png" style="width: 90rpx; height: 90rpx;"></image>
-			</view>
-			<view class="tr"></view>
-			<view class="jian">上传图书馆背景图：</view>
-			<view class="tr"></view>
-			<view class="tup">
-				<image class="image" src="../../static/images/add_more2.png" style="width: 120rpx; height: 120rpx;"></image>
-			</view>
-	<button class="btn" >
-		创建
-	</button>
+		</picker>
+		<view class="jian">图书馆简介 :</view>
+		<textarea class="tex1" placeholder=""></textarea>
+		<view class="jian">选择图书馆成员</view>
+		<view class="tr"></view>
+		<view class="list">
+			<image src="/static/images/add_more2.png" style="width: 90rpx; height: 90rpx;"></image>
+		</view>
+		<view class="tr"></view>
+		<view class="jian">上传图书馆背景图：</view>
+		<view class="tr"></view>
+		<view class="tup">
+			<image class="image" src="/static/images/add_more2.png" style="width: 120rpx; height: 120rpx;"></image>
+		</view>
+		<button class="btn">
+			创建
+		</button>
 	</view>
 </template>
 
@@ -37,42 +40,48 @@
 	export default {
 		data() {
 			return {
-				
+				background: {
+					background: "#6C40F3",
+				},
 			}
 		},
 		methods: {
-			
+
 		}
 	}
 </script>
 
 <style>
-.tab1 {
-	margin-top: 69rpx;
+	.tab1 {
+		margin-top: 69rpx;
 		display: flex;
 	}
+
 	.tit1 {
 		margin-top: 19rpx;
-		color: #555555 ;
+		color: #555555;
 		margin-left: 15rpx;
 		font-size: 45rpx;
 	}
-	
+
 	.back {
 		margin-top: 18rpx;
 		margin-left: 10rpx;
 	}
-	.tr{
+
+	.tr {
 		height: 10rpx;
 		background-color: #F8F8F8;
 	}
-	.tex{
+
+	.tex {
 		height: 80rpx;
 		border-bottom: 1rpx solid #F1F1F1;
 		color: #8F8F94;
-		
+
 	}
-	.tex input{
+
+	.tex input {
 		margin-left: 20rpx;
 		width: 450rpx;
 		height: 60rpx;
@@ -80,61 +89,71 @@
 		font-size: 36rpx;
 		margin-top: 20rpx;
 	}
-	.btn{
+
+	.btn {
 		margin-top: 100rpx;
 		width: 80%;
 		background-color: #00AAFF;
 		color: #FFFFFF;
 	}
-	.tab{
+
+	.tab {
 		height: 100rpx;
 		background-color: #FFFFFF;
 		margin-top: 20rpx;
 		border-bottom: 3rpx solid #F1F1F1;
 	}
-		.inp{
-			/* text-align: center; */
-			height: 80rpx;
-			margin-left: 20rpx;
-			font-size: 36rpx;
-		}
-		.ima{
-			top: -60rpx;
-			margin-left: 680rpx;
-		}
-		.tex1{
-			margin: 10rpx 20rpx;
-			font-size: 34rpx;
-			font-family: 'Courier New', Courier, monospace;
-			width: 95%;
-			-moz-box-shadow:2px 2px 10px #F1F1F1;
-			-webkit-box-shadow:2px 2px 10px #F1F1F1;
-			box-shadow:2px 2px 10px #F1F1F1;
-		}
-		.jian{
-			height: 50rpx;
-			margin: 10rpx 20rpx;
-			font-size: 36rpx;
-			color: #808080;
-			/* border-bottom: 3rpx solid #F1F1F1; */
-		}
-		.tr{
-			height: 10rpx;
-			background-color: #F8F8F8;
-		}
-		.list{
-			height: 100rpx;
-		}
-		.tup{
-			margin: 10rpx 20rpx;
-			width: 200rpx;
-			height: 200rpx;
-			-moz-box-shadow:2px 2px 10px #F1F1F1;
-			-webkit-box-shadow:2px 2px 10px #F1F1F1;
-			box-shadow:2px 2px 10px #F1F1F1;
-		}
-		.image{
-			margin-left: 35rpx;
-			margin-top: 30rpx;
-		}
+
+	.inp {
+		/* text-align: center; */
+		height: 80rpx;
+		margin-left: 20rpx;
+		font-size: 36rpx;
+	}
+
+	.ima {
+		top: -60rpx;
+		margin-left: 680rpx;
+	}
+
+	.tex1 {
+		margin: 10rpx 20rpx;
+		font-size: 34rpx;
+		font-family: 'Courier New', Courier, monospace;
+		width: 95%;
+		-moz-box-shadow: 2px 2px 10px #F1F1F1;
+		-webkit-box-shadow: 2px 2px 10px #F1F1F1;
+		box-shadow: 2px 2px 10px #F1F1F1;
+	}
+
+	.jian {
+		height: 50rpx;
+		margin: 10rpx 20rpx;
+		font-size: 36rpx;
+		color: #808080;
+		/* border-bottom: 3rpx solid #F1F1F1; */
+	}
+
+	.tr {
+		height: 10rpx;
+		background-color: #F8F8F8;
+	}
+
+	.list {
+		height: 100rpx;
+	}
+
+	.tup {
+		margin: 10rpx 20rpx;
+		width: 200rpx;
+		height: 200rpx;
+		-moz-box-shadow: 2px 2px 10px #F1F1F1;
+		-webkit-box-shadow: 2px 2px 10px #F1F1F1;
+		box-shadow: 2px 2px 10px #F1F1F1;
+	}
+
+	.image {
+		margin-left: 35rpx;
+		margin-top: 30rpx;
+	}
 </style>
diff --git a/pages/my/card.vue b/pages/my/card.vue
index 22d05fe6e04959116cd13c27261a133e67b991c6..930633ae3aed94ab7bfce8ace16f629c31e5f0b7 100644
--- a/pages/my/card.vue
+++ b/pages/my/card.vue
@@ -1,27 +1,35 @@
 <template>
-	<view >
-		<view class="ta">
+	<view>
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="申请借书卡" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
 			</view>
+		</u-navbar>
+		<view class="ta">
+		</view>
 		<view class="tab">
-			<input class="inp" placeholder="姓         名" placeholder-style="color:#BBBBBB"  type="text"></input>
+			<input class="inp" placeholder="姓         名" placeholder-style="color:#BBBBBB" type="text"></input>
 		</view>
 		<view class="tab">
-			<input class="inp" placeholder="身份证号" placeholder-style="color:#BBBBBB"  type="text"></input>
+			<input class="inp" placeholder="身份证号" placeholder-style="color:#BBBBBB" type="text"></input>
 		</view>
 		<view class="tab">
-			<input class="inp" placeholder="密         码" placeholder-style="color:#BBBBBB"  type="password"></input>
+			<input class="inp" placeholder="密         码" placeholder-style="color:#BBBBBB" type="password"></input>
 		</view>
 		<view class="tab">
-			<input class="inp" placeholder="确认密码" placeholder-style="color:#BBBBBB"  type="password"></input>
+			<input class="inp" placeholder="确认密码" placeholder-style="color:#BBBBBB" type="password"></input>
 		</view>
 		<picker>
 			<view class="tab">
-				<input class="inp" placeholder="图  书  馆" placeholder-style="color:#BBBBBB"  type="number"></input>
+				<input class="inp" placeholder="图  书  馆" placeholder-style="color:#BBBBBB" type="number"></input>
 				<!-- #ifdef APP-PLUS -->
-				<image class="ima" src="../../static/images/more.png" style="width: 30rpx; height: 30rpx;"></image>
+				<image class="ima" src="/static/images/more.png" style="width: 30rpx; height: 30rpx;"></image>
 				<!-- #endif -->
 				<!-- #ifdef MP-WEIXIN -->
-				<image class="ima1" src="../../static/images/more.png" style="width: 30rpx; height: 30rpx;"></image>
+				<!-- <image class="ima1" src="/static/images/more.png" style="width: 30rpx; height: 30rpx;"></image> -->
 				<!-- #endif -->
 			</view>
 		</picker>
@@ -35,7 +43,7 @@
 			申请办证
 		</button>
 		<!-- #endif -->
-		
+
 	</view>
 </template>
 
@@ -43,7 +51,9 @@
 	export default {
 		data() {
 			return {
-
+				background: {
+					background: "#6C40F3",
+				},
 			}
 		},
 		methods: {
@@ -53,67 +63,77 @@
 </script>
 
 <style>
-	.ta{
-			height: 70rpx;
-			background-color:#6C40F3;
-		}
+	.ta {
+		height: 70rpx;
+		background-color: #6C40F3;
+	}
+
 	.tab1 {
-			display: flex;
-			background-color:#6C40F3;
-		}
+		display: flex;
+		background-color: #6C40F3;
+	}
+
 	.tit1 {
 		margin-top: 9rpx;
-			color:#FFFFFF ;
-			margin-left: 210rpx;
-			display: flex;
-			font-size: 40rpx;
+		color: #FFFFFF;
+		margin-left: 210rpx;
+		display: flex;
+		font-size: 40rpx;
 	}
+
 	.tit2 {
 		margin-top: 9rpx;
-			color:#FFFFFF ;
-			margin-left: 210rpx;
-			display: flex;
-			font-size: 40rpx;
-			width: 40%;
+		color: #FFFFFF;
+		margin-left: 210rpx;
+		display: flex;
+		font-size: 40rpx;
+		width: 40%;
 	}
+
 	.back {
 		margin-top: 18rpx;
 		margin-left: 10rpx;
 	}
-	.ta{
+
+	.ta {
 		height: 10rpx;
 		background-color: #F1F1F1;
 	}
-.tab{
-	height: 100rpx;
-	background-color: #FFFFFF;
-	margin-top: 20rpx;
-	border-bottom: 3rpx solid #F1F1F1;
-}
-	.inp{
+
+	.tab {
+		height: 100rpx;
+		background-color: #FFFFFF;
+		margin-top: 20rpx;
+		border-bottom: 3rpx solid #F1F1F1;
+	}
+
+	.inp {
 		/* text-align: center; */
 		height: 80rpx;
 		margin-left: 20rpx;
 	}
-	.ima{
+
+	.ima {
 		top: -47rpx;
 		margin-left: 680rpx;
 	}
-	.ima1{
-		top: 47rpx;
+
+	.ima1 {
 		margin-left: 680rpx;
 	}
-	.btn{
+
+	.btn {
 		width: 80%;
 		margin-top: 40rpx;
 		color: #FFFFFF;
-background: #6C40F3;
+		background: #6C40F3;
+	}
+
+	.btn1 {
+		width: 80%;
+		margin-top: 40rpx;
+		color: #FFFFFF;
+		height: 100rpx;
+		background: #6C40F3;
 	}
-	.btn1{
-			width: 80%;
-			margin-top: 40rpx;
-			color: #FFFFFF;
-			height: 100rpx;
-	background: #6C40F3;
-		}
 </style>
diff --git a/pages/my/chengy.vue b/pages/my/chengy.vue
index 91bf26e25467a49853780329db155b173407e7cb..d1616ddd58303e9bd57145f3cf5b3aff2090f724 100644
--- a/pages/my/chengy.vue
+++ b/pages/my/chengy.vue
@@ -1,14 +1,14 @@
 <template>
-	<view> 
+	<view>
 	<!-- #ifdef APP-PLUS -->
 			<view class="list1">
-				<image class="im" src="../../static/images/me_blue.png" ></image>
+				<image class="im" src="/static/images/me_blue.png" ></image>
 				<view class="tabs">
 					<view class="tr">
 					<view class="tit">爱读书的</view>
 					<view class="btn">LV11</view>
 					<view class="te">书圣</view>
-					<image class="imag" src="../../static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
+					<image class="imag" src="/static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
 					</view>
 					<view class="tr">
 				</view>
@@ -17,20 +17,20 @@
 	<!-- #endif -->
 		<!-- #ifdef MP-WEIXIN -->
 				<view class="list2">
-					<image class="im" src="../../static/images/me_blue.png" ></image>
+					<image class="im" src="/static/images/me_blue.png" ></image>
 					<view class="tabs">
 						<view class="t">
 						<view class="tit">爱读书的</view>
 						<view class="btn">LV11</view>
 						<view class="te">书圣</view>
-						<image class="imag" src="../../static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
+						<image class="imag" src="/static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
 						</view>
 					</view>
 				</view>
 		<!-- #endif -->
 		</view>
 	</view>
-	
+
 </template>
 
 <script>
@@ -41,14 +41,14 @@
 			}
 		},
 		methods: {
-			
+
 		},
 	}
 </script>
 
 <style>
 	.tit1{
-		margin: 30rpx 55rpx; 
+		margin: 30rpx 55rpx;
 		width: 80rpx;
 	}
 	.blue{
@@ -69,7 +69,7 @@
 		width: 160rpx;
 		height: 60rpx;
 	}
-	
+
 	.list1 {
 		/* margin-left: -370rpx; */
 		height: 130rpx;
@@ -115,13 +115,13 @@
 		margin-top: 60rpx;
 		border:1px solid #F0AD4E;
 	}
-	
+
 	.tex {
 		font-size: 25rpx;
 		margin-top: -40rpx;
 		color: #808080;
 	}
-	
+
 	.text {
 		height: 1rpx;
 		width: 250rpx;
diff --git a/pages/my/join.vue b/pages/my/join.vue
index f12c80c276be9cdb1c8251255939a60e72bff163..c14a1fccbfe693ee8bf2259a7fc284f0a3309bcf 100644
--- a/pages/my/join.vue
+++ b/pages/my/join.vue
@@ -1,14 +1,14 @@
 <template>
-	<view> 
+	<view>
 		<view class="Array">
 				<view class="list1">
-					<image class="ima" src="../../static/images/me_blue.png" style="width: 110rpx; height: 110rpx;"></image>
+					<image class="ima" src="/static/images/me_blue.png" style="width: 110rpx; height: 110rpx;"></image>
 					<view class="tabs">
 						<view class="tr">
 						<view class="tit">文学书馆</view>
 						<view class="btn">LV11</view>
 						<view class="te">书圣</view>
-						<image class="imag" src="../../static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
+						<image class="imag" src="/static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
 						</view>
 						<view class="tex">馆主</view>
 						<view class="tr">
@@ -20,7 +20,7 @@
 			</view>
 		</view>
 	</view>
-	
+
 </template>
 
 <script>
@@ -43,7 +43,7 @@
 
 <style>
 	.tit1{
-		margin: 30rpx 55rpx; 
+		margin: 30rpx 55rpx;
 		width: 80rpx;
 	}
 	.blue{
@@ -63,16 +63,16 @@
 		width: 160rpx;
 		height: 60rpx;
 	}
-	
+
 	.list1 {
 		/* margin-left: -370rpx; */
 		height: 190rpx;
 		width: 100%;
 		border-bottom: 1rpx solid #C8C7CC;
 		display: flex;
-		
+
 	}
-	
+
 	.ima {
 		margin: 40rpx 40rpx;
 		border-radius: 50%;
@@ -94,13 +94,13 @@
 		margin: 45rpx 20rpx;
 		border:1px solid #F0AD4E;
 	}
-	
+
 	.tex {
 		font-size: 25rpx;
 		margin-top: -40rpx;
 		color: #808080;
 	}
-	
+
 	.text {
 		height: 1rpx;
 		width: 250rpx;
diff --git a/pages/my/jszlist.vue b/pages/my/jszlist.vue
index fb54274203608f4cc36cf32440e0f24af3298a6a..5da3c24e0bae143ecaf67aa0b0eb136ea71764ec 100644
--- a/pages/my/jszlist.vue
+++ b/pages/my/jszlist.vue
@@ -1,22 +1,18 @@
 <template>
 	<view class="all">
-		<view class="ta"></view>
-		<view class="tab1" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-			<!-- #ifdef APP-PLUS -->
-			<view class="tit1">借书卡</view>
-			<image class="im" src="../../static/images/搜索icon@2x.png"style="width: 80rpx; height: 80rpx;"></image>
-			<!-- #endif -->
-			<!-- #ifdef MP-WEIXIN -->
-			<view class="tit5">借书卡</view>
-			<image class="im1" src="../../static/images/搜索icon@2x.png"style="width: 80rpx; height: 80rpx;"></image>
-			<!-- #endif -->
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="借书卡" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
 			</view>
+		</u-navbar>
 		<view class="tab"></view>
 		<!-- #ifdef APP-PLUS -->
-			<view class="tr">
-				<image class="ima" src="../../static/images/library_card.jpg" style="width: 310rpx; height: 200rpx;"></image>
-				<view>
+		<view class="tr">
+			<image class="ima" src="/static/images/library_card.jpg" style="width: 310rpx; height: 200rpx"></image>
+			<view>
 				<view class="tit">广东省省立图书馆</view>
 				<view class="tex">注册日期：2020-9-9</view>
 				<view class="tex">类型：普通A A类卡</view>
@@ -25,34 +21,34 @@
 				<view class="tex">正在借阅：124本</view>
 				<view class="li">
 					<navigator url="xuig">
-					<image class="share" src="../../static/images/modification.png" style="width: 70rpx; height: 80rpx;"></image>
-					<image class="dele" src="../../static/images/delete.png" style="width: 70rpx; height: 70rpx;"></image>
+						<image class="share" src="/static/images/modification.png" style="width: 70rpx; height: 80rpx"></image>
+						<image class="dele" src="/static/images/delete.png" style="width: 70rpx; height: 70rpx"></image>
 					</navigator>
-					</view>
-						</view>
-					</view>
-					<!-- #endif -->
-				<!-- #ifdef MP-WEIXIN -->
-				<view class="tr1">
-					<image class="ima" src="../../static/images/library_card.jpg" style="width: 310rpx; height: 200rpx;"></image>
-					<view>
-					<view class="tit7">广东省省立图书馆</view>
-					<view class="tex">注册日期：2020-9-9</view>
-					<view class="tex">类型：普通A A类卡</view>
-					<view class="tex">当前状态：正常</view>
-					<view class="tex">借阅证编号：111111</view>
-					<view class="tex">正在借阅：124本</view>
-					<view class="li">
-						<navigator url="xuig">
-						<image class="share" src="../../static/images/modification.png" style="width: 70rpx; height: 80rpx;"></image>
-						<image class="dele" src="../../static/images/delete.png" style="width: 70rpx; height: 70rpx;"></image>
-						</navigator>
-						</view>
-							</view>
-						</view>
-				<!-- #endif -->
+				</view>
+			</view>
+		</view>
+		<!-- #endif -->
+		<!-- #ifdef MP-WEIXIN -->
+		<view class="tr1">
+			<image class="ima" src="/static/images/library_card.jpg" style="width: 310rpx; height: 200rpx"></image>
+			<view>
+				<view class="tit7">广东省省立图书馆</view>
+				<view class="tex">注册日期：2020-9-9</view>
+				<view class="tex">类型：普通A A类卡</view>
+				<view class="tex">当前状态：正常</view>
+				<view class="tex">借阅证编号：111111</view>
+				<view class="tex">正在借阅：124本</view>
+				<view class="li">
+					<navigator url="xuig">
+						<image class="share" src="/static/images/modification.png" style="width: 70rpx; height: 80rpx"></image>
+						<image class="dele" src="/static/images/delete.png" style="width: 70rpx; height: 70rpx"></image>
+					</navigator>
+				</view>
+			</view>
+		</view>
+		<!-- #endif -->
 		<navigator url="card">
-		<button class="but">+ 添加图书馆</button>
+			<button class="but">申请借书卡</button>
 		</navigator>
 	</view>
 </template>
@@ -61,113 +57,131 @@
 	export default {
 		data() {
 			return {
-				
-			}
+				background: {
+					background: "#6C40F3",
+				},
+			};
 		},
 		methods: {
-			back(){
+			back() {
 				uni.navigateBack({
-						delta:1
-					})
-			}
-		}
-	}
+					delta: 1,
+				});
+			},
+		},
+	};
 </script>
 
 <style>
-	.ta{
-			height: 70rpx;
-			background-color:#6C40F3;
-		}
+	.ta {
+		height: 70rpx;
+		background-color: #6c40f3;
+	}
+
 	.tab1 {
-			display: flex;
-			background-color:#6C40F3;
-		}
-	
+		display: flex;
+		background-color: #6c40f3;
+	}
+
 	.tit1 {
 		margin-top: 9rpx;
-			color:#FFFFFF ;
-			margin-left: 230rpx;
-			display: flex;
-			font-size: 40rpx;
-			/* width: 20%; */
-		}
+		color: #ffffff;
+		margin-left: 230rpx;
+		display: flex;
+		font-size: 40rpx;
+		/* width: 20%; */
+	}
+
 	.tit5 {
 		margin-top: 9rpx;
-			color:#FFFFFF ;
-			margin-left: 220rpx;
-			display: flex;
-			font-size: 40rpx;
-			width: 30%;
-		}
-	.li{
+		color: #ffffff;
+		margin-left: 220rpx;
+		display: flex;
+		font-size: 40rpx;
+		width: 30%;
+	}
+
+	.li {
 		display: flex;
 	}
+
 	.back {
 		margin-top: 18rpx;
 		margin-left: 10rpx;
 	}
-	.im{
+
+	.im {
 		margin-top: 8rpx;
 		margin-left: 240rpx;
 	}
-	.im1{
+
+	.im1 {
 		margin-top: 8rpx;
 		margin-left: 140rpx;
 	}
-	.tab{
+
+	.tab {
 		height: 20rpx;
-		background-color: #F1F1F1;
+		background-color: #f1f1f1;
 	}
-	.tr{
+
+	.tr {
 		width: 100%;
 		height: 300rpx;
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		display: flex;
-		border-bottom: 1rpx solid #C8C7CC;
+		border-bottom: 1rpx solid #c8c7cc;
 	}
-	.tr1{
+
+	.tr1 {
 		width: 100%;
 		height: 350rpx;
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		display: flex;
-		border-bottom: 1rpx solid #C8C7CC;
-	}
-.ima{
-	margin: 30rpx 30rpx;
-	margin-top: 40rpx;
-	border-radius: 3%;
-}
-.tit{
-	font-size: 30rpx;
-	margin-top: 20rpx;
-}
-.tit7{
-	font-size: 30rpx;
-	margin-top: 20rpx;
-	width: 70%;
-}
-.tex{
-	font-size: 25rpx;
-	color: #8F8F94;
-	margin-top: 10rpx;
-}
-.share{
-	margin-left: 240rpx;
-	top: -55rpx;
-}
-.share1{
-	margin-left: 240rpx;
-	/* top: -55rpx; */
-}
-.dele{
-	top: -50rpx;
-	/* margin-left: -10rpx; */
-}
-
-.but{
-	margin-top: 20rpx;
-	background-color: #6C40F3;
-	color: #FFFFFF;
-}
+		border-bottom: 1rpx solid #c8c7cc;
+	}
+
+	.ima {
+		margin: 30rpx 30rpx;
+		margin-top: 40rpx;
+		border-radius: 3%;
+	}
+
+	.tit {
+		font-size: 30rpx;
+		margin-top: 20rpx;
+	}
+
+	.tit7 {
+		font-size: 30rpx;
+		margin-top: 20rpx;
+		width: 70%;
+	}
+
+	.tex {
+		font-size: 25rpx;
+		color: #8f8f94;
+		margin-top: 10rpx;
+	}
+
+	.share {
+		margin-left: 240rpx;
+		top: -55rpx;
+	}
+
+	.share1 {
+		margin-left: 240rpx;
+		/* top: -55rpx; */
+	}
+
+	.dele {
+		top: -60rpx;
+		/* margin-left: -10rpx; */
+	}
+
+	.but {
+		margin-top: 20rpx;
+		background-color: #6c40f3;
+		color: #ffffff;
+	}
 </style>
diff --git a/pages/my/lib.vue b/pages/my/lib.vue
index 83f35291b88ffb3f54aa68b97c13df0078faf520..1d75eeedebd6755ba6af75b2b8dae3e1a9c1f673 100644
--- a/pages/my/lib.vue
+++ b/pages/my/lib.vue
@@ -1,42 +1,25 @@
 <template>
 	<view>
-		<!-- 导航栏 -->
-		<view class="ta"></view>
-		<view class="tab1" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-			<!-- #ifdef APP-PLUS -->
-			<view class="tit1">爱读书的猫</view>
-			<!-- #endif -->
-			<!-- #ifdef MP-WEIXIN -->
-			<view class="tit5">爱读书的猫</view>
-			<!-- #endif -->
-			<navigator url="../sousuo/sousuo">
-			</navigator>
-		</view>
-		<!-- #ifdef APP-PLUS -->
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="我的图书馆" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<view>
-			<image class="ima" src="../../static/images/头像.jpg"></image>
+			<image class="ima" src="/static/images/头像.jpg"></image>
 		</view>
 		<view class="list">
-			<view :class="['tit',index===1&&'blue']" @click="index=1">简介</view>
-			<view :class="['tit',index===2&&'blue']" @click="index=2">图书</view>
-			<view :class="['tit',index===3&&'blue']" @click="index=3">成员</view>
-		</view>
-		<!-- #endif -->
-		<!-- #ifdef MP-WEIXIN -->
-		<view>
-			<image class="ima1" src="../../static/images/头像.jpg"></image>
+			<view :class="['tit', index === 1 && 'blue']" @click="index = 1">简介</view>
+			<view :class="['tit', index === 2 && 'blue']" @click="index = 2">图书</view>
+			<view :class="['tit', index === 3 && 'blue']" @click="index = 3">成员</view>
 		</view>
-		<view class="list1">
-			<view :class="['tit',index===1&&'blue']" @click="index=1">简介</view>
-			<view :class="['tit',index===2&&'blue']" @click="index=2">图书</view>
-			<view :class="['tit',index===3&&'blue']" @click="index=3">成员</view>
-		</view>
-		<!-- #endif -->
 
-		<jianj v-if="index===1"></jianj>
-		<tushu v-if="index===2"></tushu>
-		<chengy v-if="index===3"></chengy>
+		<jianj v-if="index === 1"></jianj>
+		<tushu v-if="index === 2"></tushu>
+		<chengy v-if="index === 3"></chengy>
 	</view>
 </template>
 
@@ -44,33 +27,36 @@
 	export default {
 		data() {
 			return {
-				index: 1
-			}
+				background: {
+					background: "#6C40F3",
+				},
+				index: 1,
+			};
 		},
 		methods: {
 			back() {
 				uni.navigateBack({
-					delta: 1
-				})
-			}
-		}
-	}
+					delta: 1,
+				});
+			},
+		},
+	};
 </script>
 
 <style>
 	.ta {
 		height: 70rpx;
-		background-color: #6C40F3;
+		background-color: #6c40f3;
 	}
 
 	.tab1 {
 		display: flex;
-		background-color: #6C40F3;
+		background-color: #6c40f3;
 	}
 
 	.tit1 {
 		margin-top: 9rpx;
-		color: #FFFFFF;
+		color: #ffffff;
 		margin-left: 220rpx;
 		display: flex;
 		font-size: 40rpx;
@@ -78,7 +64,7 @@
 
 	.tit5 {
 		margin-top: 9rpx;
-		color: #FFFFFF;
+		color: #ffffff;
 		margin-left: 220rpx;
 		display: flex;
 		font-size: 40rpx;
@@ -115,7 +101,7 @@
 	}
 
 	.blue {
-		color: #6C40F3;
-		border-bottom: 2rpx solid #6C40F3;
+		color: #6c40f3;
+		border-bottom: 2rpx solid #6c40f3;
 	}
 </style>
diff --git a/pages/my/my.vue b/pages/my/my.vue
index 7908cc342752f1032826ed43449d9f02ce55d7d6..e8a0930cc698ce5e64ef7a3def28a98dbb9b905c 100644
--- a/pages/my/my.vue
+++ b/pages/my/my.vue
@@ -1,191 +1,166 @@
 <template>
 	<view>
 		<!-- 顶部部分 -->
-		<view class="head">
-			<view class="header-wrap">
-				<navigator url="/pages_read_circle/pages/personal/personal_home">
-				<view class="index-header">
-					<image class="address" src="../../static/images/back.png"></image>
-					<view class="name">个人中心</view>
-					<view class="map-wrap" @click="rightClick">
-						<image class="iconfont" src="../../static/images/Fsearch.png"></image>
-					</view>
+		<!-- 导航栏 -->
+		<u-navbar zhead="65rpx" height="44" title="个人中心" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+					<image style="height: 50rpx; width: 50rpx;margin-right: 20rpx;" src="/static/images/Fsearch.png"></image>
 				</view>
-				</navigator>
 			</view>
-			<view class="blank"></view>
-		</view>
-		<!-- 分割线br -->
-		<view class="br"></view>
+		</u-navbar>
 		<!-- 列表 -->
 		<view class="lie">
 			<!-- 头部-->
-			<navigator url="/pages_read_circle/pages/personal/personal_home">
-			<view class="midone">
-				<view class="zhengti">
-					<image src="../../static/images/书3.jpg" style="width: 140rpx; height: 140rpx;border-radius: 50%; "></image>
-				</view>
-				<view class="m">
-					<view class="midwz">你是人间四月天</view>
-					<view class="shumu">
-						账号：
-						<view class="shumutwo">055522222</view>
+			<navigator url="/pages/myinfomation/myinfomation">
+				<view class="midone">
+					<view class="zhengti">
+						<image :src="info.reader.avatar" style="width: 140rpx; height: 140rpx; border-radius: 50%"></image>
+					</view>
+					<view class="m">
+						<view class="midwz">{{ info.reader.nickname }}</view>
+						<view class="shumu">
+							账号：
+							<view class="shumutwo">{{ info.reader.wxId }}</view>
+						</view>
+					</view>
+					<view class="next">
+						<image src="/static/images/right_arrow.png" style="width: 50rpx; height: 50rpx"></image>
 					</view>
 				</view>
-				<view class="next">
-					<image src="../../static/images/right_arrow.png" style="width: 50rpx;height: 50rpx; "></image>
-				</view>
-			</view>
 			</navigator>
 			<!-- 分割线br2 -->
 			<view class="br2"></view>
-			<navigator url="/pages_read_circle/pages/personal/personal_home">
-			<view class="class1">
-				<image class="tupian" src="../../static/images/centre_main.png"></image>
+			<view class="class1" @click="toPersonal_home(info.reader.readerId)">
+				<image class="tupian" src="/static/images/centre_main.png"></image>
 				<view class="neirong">我的主页</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image>
+				<image class="img2" src="/static/images/right_arrow.png"></image>
 			</view>
-			</navigator>
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
 			<navigator url="/pages_read_circle/pages/personal/Mynotice">
-			<view class="class1">
-				<image class="tupian" src="../../static/images/message_one.png"></image>
-				<view class="neirong">通知信息</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image> 
-			</view>
+				<view class="class1">
+					<view>
+						<image class="tupian" src="/static/images/message_one.png"></image>
+					</view>
+					<view class="neirong">通知信息</view>
+					<view class="imaWD" v-show=msgNum>
+						<image src="/static/images/WD.png" style="width: 25rpx;height: 25rpx;"></image>
+					</view>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
+				</view>
 			</navigator>
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
 			<navigator url="jszlist">
-			<view class="class1">
-				<image class="tupian" src="../../static/images/centre_library_card.png"></image>
-				<view class="neirong">借书卡</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image>
-			</view>
+				<view class="class1">
+					<image class="tupian" src="/static/images/centre_library_card.png"></image>
+					<view class="neirong">借书卡</view>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
+				</view>
+			</navigator>
+			<!-- 分割线br1 -->
+			<view class="br1"></view>
+			<navigator url="Uchart">
+				<view class="class1">
+					<image class="tupian" src="/static/images/tupu.png"></image>
+					<view class="neirong">知识图谱</view>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
+				</view>
 			</navigator>
 			<!-- 分割线br2 -->
 			<view class="br2"></view>
-			
-			<navigator url="/pages_borrow_books/pages/appointment/appointment">
+			<navigator url="/pages/my/read_report">
 				<view class="class1">
-					<image class="tupian" src="../../static/images/my_subscribe.png"></image>
-					<view class="neirong">我的预约</view>
-					<image class="img2" src="../../static/images/right_arrow.png"></image>
+					<image class="tupian" src="/static/images/baogao.png"></image>
+					<view class="neirong">读书报告</view>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
 				</view>
 			</navigator>
-			
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
-			<view class="class1">
-				<image class="tupian" src="../../static/images/centre_read.png"></image>
+			<navigator url="/pages_borrow_books/pages/my_reserve/my_reserve">
+				<view class="class1">
+					<image class="tupian" src="/static/images/jiehuanjilu.png"></image>
+					<view class="neirong">预约记录</view>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
+				</view>
+			</navigator>
+			<!-- 分割线br1 -->
+			<view class="br1"></view>
+			<view class="class1" @click="reading()">
+				<image class="tupian" src="/static/images/centre_read.png"></image>
 				<view class="neirong">正在阅读</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image> 
+				<image class="img2" src="/static/images/right_arrow.png"></image>
 			</view>
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
 			<navigator url="/pages_borrow_books/pages/return-books/return-books">
 				<view class="class1">
-					<image class="tupian" src="../../static/images/return_book.png"></image>
+					<image class="tupian" src="/static/images/return_book.png"></image>
 					<view class="neirong">我要还书</view>
-					<image class="img2" src="../../static/images/right_arrow.png"></image>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
 				</view>
 			</navigator>
-			
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
 			<navigator url="/pages_borrow_books/pages/borrow_and_return/borrow_and_return">
-			<view class="class1">
-				<image class="tupian" src="../../static/images/read_history.png"></image>
-				<view class="neirong">借还记录</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image>
-			</view>
-			</navigator>
-			<!-- 分割线br1 -->
-			<view class="br1"></view>
-			<navigator url="/pages_borrow_books/pages/my_reserve/my_reserve">
-			<view class="class1">
-				<image class="tupian" src="../../static/images/jiehuanjilu.png"></image>
-				<view class="neirong">预约记录</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image>
-			</view>
+				<view class="class1">
+					<image class="tupian" src="/static/images/read_history.png"></image>
+					<view class="neirong">借还记录</view>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
+				</view>
 			</navigator>
 			<!-- 分割线br2 -->
 			<view class="br2"></view>
-			
 			<view class="class1">
-				<image class="tupian" src="../../static/images/book_review.png"></image>
+				<image class="tupian" src="/static/images/book_review.png"></image>
 				<view class="neirong">我的书评</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image>
+				<image class="img2" src="/static/images/right_arrow.png"></image>
 			</view>
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
-			<navigator url="../mycollection/mycollection">
-			<view class="class1">
-				<image class="tupian" src="../../static/images/my_collect.png"></image>
-				<view class="neirong">我的收藏</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image> 
-			</view>
-			</navigator>
-			<!-- 分割线br1 -->
-			<view class="br1"></view>
-			<navigator url="mylibrary">
+			<navigator url="/pages/my/mylibrary">
 				<view class="class1">
-					<image class="tupian" src="../../static/images/centre_my_library.png"></image>
-					<view class="neirong">个人图书管</view>
-					<image class="img2" src="../../static/images/right_arrow.png"></image>
+					<image class="tupian" src="/static/images/centre_my_library.png"></image>
+					<view class="neirong">个人图书馆</view>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
 				</view>
 			</navigator>
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
 			<navigator url="/pages_read_circle/pages/readCircle/readCircle">
 				<view class="class1">
-					<image class="tupian" src="../../static/images/circle.png"></image>
+					<image class="tupian" src="/static/images/circle.png"></image>
 					<view class="neirong">阅读圈子</view>
-					<image class="img2" src="../../static/images/right_arrow.png"></image>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
 				</view>
 			</navigator>
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
 			<navigator url="../../pages_read_circle/pages/index/MyExperience">
 				<view class="class1">
-					<image class="tupian" src="../../static/images/woyaofabu.png" ></image>
+					<image class="tupian" src="/static/images/woyaofabu.png"></image>
 					<view class="neirong">我的心得</view>
-					<image class="img2" src="../../static/images/right_arrow.png"></image>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
 				</view>
 			</navigator>
 			<!-- 分割线br2 -->
 			<view class="br2"></view>
-			
-			<navigator url="../mineFriend/mineFriend">
+			<navigator url="../Setup/sysSet">
 				<view class="class1">
-					<image class="tupianO" src="../../static/images/contacts_blue.png"></image>
-					<view class="neirong">我的好友</view>
-					<image class="img2" src="../../static/images/right_arrow.png"></image>
+					<image class="tupian" src="/static/images/setting_up.png"></image>
+					<view class="neirong">系统设置</view>
+					<image class="img2" src="/static/images/right_arrow.png"></image>
 				</view>
 			</navigator>
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
 			<view class="class1">
-				<image class="tupian" src="../../static/images/my_attention.png"></image>
-				<view class="neirong">我的关注</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image> 
-			</view>
-			<!-- 分割线br1 -->
-			<view class="br1"></view>
-			<navigator url="../Setup/Setup">
-			<view class="class1">
-				<image class="tupian" src="../../static/images/setting_up.png"></image>
-				<view class="neirong">系统设置</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image>	
-			</view>
-			</navigator>
-			<!-- 分割线br1 -->
-			<view class="br1"></view>
-			<view class="class1">
-				<image class="tupian" src="../../static/images/third_binding.png"></image> 
+				<image class="tupian" src="/static/images/third_binding.png"></image>
 				<view class="neirong">快捷登录绑定设置</view>
-				<image class="img2" src="../../static/images/right_arrow.png"></image>
+				<image class="img2" src="/static/images/right_arrow.png"></image>
 			</view>
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
@@ -194,16 +169,90 @@
 </template>
 
 <script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
 		data() {
 			return {
+				background: {
+					background: "#6C40F3",
+				},
+				info: {}, //后台数据
+				msgNum: false
+			};
+		},
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
 
-			}
+		onShow() {
+			this.queryMessageNum();
+		},
+		/* 点击tab栏发生的函数*/
+		onTabItemTap() {
+			this.getInfo();
+			console.log("登录获取的信息userInfo：", this.userinfo)
+			console.log("登录获取的信息Token：", this.token)
 		},
 		methods: {
-
-		}
-	}
+			//获取信息
+			async getInfo() {
+				var that = this;
+				let rid = parseInt(that.userinfo.readerId)
+				var params = {
+					url: "reader/personal",
+					type: "GET",
+					data: {
+						readerId: rid
+					},
+				};
+				const res = await app.myRequest(params);
+				console.log("+++后台数据：", res);
+				that.info = res.readerInfo;
+			},
+			async queryMessageNum() {
+				var that = this;
+				let rid = parseInt(that.userinfo.readerId)
+				var params = {
+					url: "systemMessage/queryMessageNum",
+					type: "GET",
+					data: {
+						readerId: rid
+					},
+				};
+				const res = await app.myRequest(params);
+				console.log("系统消息数量：", res)
+				// that msgNum = res
+				if (res > 0) {
+					//显示红点
+					that.msgNum = true
+					uni.setTabBarBadge({
+						index: 3,
+						text: String(res)
+					})
+				} else {
+					//隐藏红点
+					that.msgNum = false
+					uni.removeTabBarBadge({
+						index: 3
+					})
+				}
+			},
+			toPersonal_home(e) {
+				uni.navigateTo({
+					url: "../../pages_read_circle/pages/personal/personal_home?id=" + e
+				})
+			},
+			reading() {
+				uni.navigateTo({
+					url: "../../pages_borrow_books/pages/reading/reading"
+				})
+			}
+		},
+	};
 </script>
 
 <style lang="scss">
@@ -217,18 +266,18 @@
 		position: fixed;
 		top: 0;
 		z-index: 999;
-		height: 160rpx;
-		background-color: #6C40F3;
+		// height: 220rpx;
+		background-color: #6c40f3;
 
 		.index-header {
 			display: flex;
-			height: 110rpx;
-			line-height: 110rpx;
+			height: 210rpx;
+			line-height: 120rpx;
 			padding: 0 30rpx;
-			padding-top: 40rpx;
+			padding-top: 120rpx;
 			// background-color: $color-base;
 			font-size: 28rpx;
-			color: #FFFFFF;
+			color: #ffffff;
 			align-items: center;
 			justify-content: space-between;
 
@@ -272,38 +321,45 @@
 		margin-top: 30rpx;
 		width: 100%;
 		height: 15rpx;
-		background-color: #F5F5F5;
+		background-color: #f5f5f5;
 	}
+
 	/* 列表 */
-	.lie{
+	.lie {
 		width: 100%;
+		background-color: #FFFFFF;
 		// height: 250rpx;
 	}
-	
+
 	.midone {
 		width: 100%;
 		height: 200rpx;
 		font-size: 30rpx;
 		display: flex;
 	}
+
 	.zhengti {
 		width: 150rpx;
 		margin-top: 35rpx;
 		margin-left: 30rpx;
 	}
+
 	.imag {
 		margin-left: 30rpx;
 	}
+
 	.ima {
 		width: 40rpx;
 		height: 30rpx;
 		/* margin-left: 400rpx; */
 	}
-	.m{
+
+	.m {
 		width: 490rpx;
 		height: 200rpx;
 		// background-color: blue;
 	}
+
 	.midwz {
 		font-size: 30rpx;
 		height: 35rpx;
@@ -316,6 +372,7 @@
 		// margin-left: 30rpx;
 		// background-color: #008000;
 	}
+
 	.shumu {
 		margin-left: 10rpx;
 		height: 30rpx;
@@ -325,12 +382,14 @@
 		// background-color: #4CD964;
 		width: 420rpx;
 	}
+
 	.shumuone {
 		margin-left: 180rpx;
 		font-size: 25rpx;
 		color: #999999;
 		/* background-color: #4CD964; */
 	}
+
 	.shumutwo {
 		width: 410rpx;
 		margin-left: 70rpx;
@@ -339,6 +398,7 @@
 		margin-top: -32rpx;
 		// background-color:  #F0AD4E;
 	}
+
 	.shumuthree {
 		margin-top: 10rpx;
 		font-size: 25rpx;
@@ -346,10 +406,11 @@
 		margin-left: 180rpx;
 		/* background-color: #3F536E; */
 	}
-	.next{
+
+	.next {
 		margin-top: 80rpx;
 	}
-	
+
 	// .neirou{
 	// 	display: flex;
 	// 	width: 100%;
@@ -391,39 +452,55 @@
 	// 	height: 40rpx;
 	// 	margin-top: 60rpx;
 	// }
-	.class1{
+	.class1 {
 		display: flex;
 		width: 100%;
 		height: 80rpx;
 	}
-	.tupian{
+
+	.tupian {
 		width: 60rpx;
-		height: 60rpx; 
+		height: 60rpx;
 		margin-top: 10rpx;
 		margin-left: 30rpx;
 	}
-	.tupianO{
+
+	.tupianO {
 		width: 55rpx;
-		height: 50rpx; 
+		height: 50rpx;
 		margin-top: 10rpx;
 		margin-left: 30rpx;
 	}
-	.neirong{
+
+	.neirong {
 		width: 72%;
 		height: 60rpx;
 		margin-left: 40rpx;
 		margin-top: 20rpx;
 		// background-color: yellow;
 	}
-	
-	.img2{
+
+	.img2 {
 		width: 50rpx;
 		height: 50rpx;
 		margin-top: 15rpx;
 	}
+
+	.br1 {
+		width: 100%;
+		height: 3rpx;
+		margin-left: 120rpx;
+		background-color: #F5F5F5;
+	}
+
 	.br2 {
 		width: 100%;
 		height: 30rpx;
-		background-color: #F5F5F5;
+		background-color: #F8F8F8;
+	}
+
+	.imaWD {
+		margin-left: -25rpx;
+		padding-top: 4rpx;
 	}
 </style>
diff --git a/pages/my/mylib.vue b/pages/my/mylib.vue
index 829f5e481dfa25e84ffddfe3352f33c6078dbe33..9dbff763a4d7013a97965e6c7d86536d5fc99220 100644
--- a/pages/my/mylib.vue
+++ b/pages/my/mylib.vue
@@ -1,15 +1,15 @@
 <template>
-	<view> 
-	<!-- 	<view class="Array">
+	<view>
+		<!-- 	<view class="Array">
 			<navigator url="lib">
 				<view class="list1">
-					<image class="ima" src="../../static/images/me_blue.png" style="width: 110rpx; height: 110rpx;"></image>
+					<image class="ima" src="/static/images/me_blue.png" style="width: 110rpx; height: 110rpx;"></image>
 					<view class="tabs">
 						<view class="tr">
 						<view class="tit">爱读书的</view>
 						<view class="btn">LV11</view>
 						<view class="te">书圣</view>
-						<image class="imag" src="../../static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
+						<image class="imag" src="/static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
 						</view>
 						<view class="tex">馆主s</view>
 						<view class="tr">
@@ -21,30 +21,25 @@
 				</navigator>
 			</view>
 		</view> -->
-		<view class="ta"></view>
-		<view class="tab1" style="width: 100%; height: 90rpx;">
-			<image class="back" @click="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-			<!-- #ifdef APP-PLUS -->
-			<view class="tit1">好友图书馆</view>
-			<image class="im" src="../../static/images/搜索icon@2x.png"style="width: 80rpx; height: 80rpx;"></image>
-			<!-- #endif -->
-			<!-- #ifdef MP-WEIXIN -->
-			<view class="tit5">好友图书馆</view>
-			<image class="im1" src="../../static/images/搜索icon@2x.png"style="width: 80rpx; height: 80rpx;"></image>
-			<!-- #endif -->
-			</view>
-			<!-- #ifdef MP-WEIXIN -->
-			<view class="tr">
-						<image class="ima" src="../../static/images/library_card.jpg" style="width: 310rpx; height: 200rpx;"></image>
-						<view>
-						<view class="tit">好友图书馆</view>
-						<view class="tex1">创建时间：2020-9-9</view>
-						<view class="tex1">类型：文学类</view>
-						<view class="tex1">图书馆人数：124人</view>
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="好友图书馆" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
 			</view>
+		</u-navbar>
+		<!-- #ifdef MP-WEIXIN -->
+		<view class="tr">
+			<image class="ima" src="/static/images/library_card.jpg" style="width: 310rpx; height: 200rpx"></image>
+			<view>
+				<view class="tit">好友图书馆</view>
+				<view class="tex1">创建时间：2020-9-9</view>
+				<view class="tex1">类型：文学类</view>
+				<view class="tex1">图书馆人数：124人</view>
 			</view>
-			<!-- #endif -->
-
+		</view>
+		<!-- #endif -->
 	</view>
 </template>
 
@@ -52,96 +47,111 @@
 	export default {
 		data() {
 			return {
-				ShowHidden:false,
-			}
+				background: {
+					background: "#6C40F3",
+				},
+				ShowHidden: false,
+			};
 		},
 		methods: {
-			back(){
+			back() {
 				uni.navigateBack({
-					delta:1
-				})
-			}
+					delta: 1,
+				});
+			},
 		},
-	}
+	};
 </script>
 
 <style>
-	.ta{
-			height: 70rpx;
-			background-color:#6C40F3;
-		}
+	.ta {
+		height: 70rpx;
+		background-color: #6c40f3;
+	}
+
 	.tab1 {
-			display: flex;
-			background-color:#6C40F3;
-		}
-	
+		display: flex;
+		background-color: #6c40f3;
+	}
+
 	.tit1 {
 		margin-top: 9rpx;
-			color:#FFFFFF ;
-			margin-left: 200rpx;
-			display: flex;
-			font-size: 40rpx;
-			width: 50%;
-		}
+		color: #ffffff;
+		margin-left: 200rpx;
+		display: flex;
+		font-size: 40rpx;
+		width: 50%;
+	}
+
 	.tit5 {
 		margin-top: 9rpx;
-			color:#FFFFFF ;
-			margin-left: 220rpx;
-			display: flex;
-			font-size: 40rpx;
-			width: 35%;
-		}
-	.li{
+		color: #ffffff;
+		margin-left: 220rpx;
+		display: flex;
+		font-size: 40rpx;
+		width: 35%;
+	}
+
+	.li {
 		display: flex;
 	}
+
 	.back {
 		margin-top: 18rpx;
 		margin-left: 10rpx;
 	}
-	.im{
+
+	.im {
 		margin-top: 8rpx;
 		margin-left: 240rpx;
 	}
-	.im1{
+
+	.im1 {
 		margin-top: 8rpx;
 		margin-left: 140rpx;
 	}
-	.tab{
+
+	.tab {
 		height: 20rpx;
-		background-color: #F1F1F1;
+		background-color: #f1f1f1;
 	}
-	.tr{
+
+	.tr {
 		width: 100%;
 		height: 300rpx;
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		display: flex;
-		border-bottom: 1rpx solid #C8C7CC;
+		border-bottom: 1rpx solid #c8c7cc;
 	}
-	.tr1{
+
+	.tr1 {
 		width: 100%;
 		height: 400rpx;
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		display: flex;
-		border-bottom: 1rpx solid #C8C7CC;
+		border-bottom: 1rpx solid #c8c7cc;
+	}
+
+	.ima {
+		margin: 30rpx 30rpx;
+		margin-top: 40rpx;
+		border-radius: 3%;
+	}
+
+	.tit {
+		font-size: 30rpx;
+		margin-top: 50rpx;
+	}
+
+	.tex {
+		font-size: 25rpx;
+		color: #8f8f94;
+		margin-top: 10rpx;
+	}
+
+	.tex1 {
+		font-size: 25rpx;
+		color: #8f8f94;
+		/* margin-top: 10rpx; */
 	}
-.ima{
-	margin: 30rpx 30rpx;
-	margin-top: 40rpx;
-	border-radius: 3%;
-}
-.tit{
-	font-size: 30rpx;
-	margin-top: 50rpx;
-}
-
-.tex{
-	font-size: 25rpx;
-	color: #8F8F94;
-	margin-top: 10rpx;
-}
-.tex1{
-	font-size: 25rpx;
-	color: #8F8F94;
-	/* margin-top: 10rpx; */
-}
 </style>
diff --git a/pages/my/mylibrary.vue b/pages/my/mylibrary.vue
index f635e3fb7406bbcf83065e853eea23f0d9524aff..3f30efb1ea537a8db32d5e34ad11bf89d7f9e737 100644
--- a/pages/my/mylibrary.vue
+++ b/pages/my/mylibrary.vue
@@ -1,51 +1,45 @@
 <template>
 	<view class="all">
-		<view class="ta"></view>
-		<view class="tab1" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-<!-- #ifdef APP-PLUS -->
-			<view class="tit1">个人图书馆</view>
-			<navigator url="../sousuo/sousuo">
-				<image class="im" src="../../static/images/搜索icon@2x.png"style="width: 80rpx; height: 80rpx;"></image>
-			</navigator>
-<!-- #endif -->
-<!-- #ifdef MP-WEIXIN -->
-			<view class="tit2">个人图书馆</view>
-			<navigator url="../sousuo/sousuo">
-				<image class="im1" src="../../static/images/搜索icon@2x.png"style="width: 80rpx; height: 80rpx;"></image>
-			</navigator>
-<!-- #endif -->
-			
+		<!-- 头部 -->
+		<u-navbar zhead="65rpx" height="44" title="个人图书馆" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" style="height: 80rpx; width: 80rpx">
+					<navigator url="../sousuo/sousuo">
+					<image style="height: 80rpx; width: 80rpx" src="/static/images/search_icon2x.png"></image>
+					</navigator>
+				</view>
 			</view>
-			<!-- #ifdef APP-PLUS -->
-			<navigator url="lib">
+		</u-navbar>
+		<!-- #ifdef APP-PLUS -->
+		<navigator url="lib">
 			<view class="td">
-			<view class="tex">我的图书馆</view>
-			<image  class="ima" src="../../static/images/right_arrows.png" style="width: 64rpx; height: 64rpx;"></image>
+				<view class="tex">我的图书馆</view>
+				<image class="ima" src="/static/images/right_arrows.png" style="width: 64rpx; height: 64rpx"></image>
 			</view>
-			</navigator>
-			<navigator url="jianj">
+		</navigator>
+		<navigator url="jianj">
 			<view class="td">
-			<view class="tex">好友图书馆</view>
-			<image  class="ima" src="../../static/images/right_arrows.png" style="width: 64rpx; height: 64rpx;"></image>
+				<view class="tex">好友图书馆</view>
+				<image class="ima" src="/static/images/right_arrows.png" style="width: 64rpx; height: 64rpx"></image>
 			</view>
-			</navigator>
-			<!-- #endif -->
-			<!-- #ifdef MP-WEIXIN -->
-			<navigator url="lib">
+		</navigator>
+		<!-- #endif -->
+		<!-- #ifdef MP-WEIXIN -->
+		<navigator url="lib">
 			<view class="td1">
-			<view class="tex1">我的图书馆</view>
-			<image  class="ima1" src="../../static/images/right_arrows.png" style="width: 64rpx; height: 64rpx;"></image>
+				<view class="tex1">我的图书馆</view>
+				<image class="ima1" src="/static/images/right_arrows.png" style="width: 64rpx; height: 64rpx"></image>
 			</view>
-			</navigator>
-			<navigator url="mylib">
+		</navigator>
+		<navigator url="mylib">
 			<view class="td1">
-			<view class="tex1">好友图书馆</view>
-			<image  class="ima1" src="../../static/images/right_arrows.png" style="width: 64rpx; height: 64rpx;"></image>
+				<view class="tex1">好友图书馆</view>
+				<image class="ima1" src="/static/images/right_arrows.png" style="width: 64rpx; height: 64rpx"></image>
 			</view>
-			</navigator>
-			<!-- #endif -->
-			<!-- <view class="tr">
+		</navigator>
+		<!-- #endif -->
+		<!-- <view class="tr">
 			<view :class="['tit',index===1&&'blue']" @click="index=1">我的</view>
 			<view :class="['tit',index===2&&'blue']" @click="index=2">已加入</view>
 			</view>
@@ -58,92 +52,108 @@
 	export default {
 		data() {
 			return {
-				index: 1
-			}
+				background: {
+					background: "#6C40F3",
+				},
+				index: 1,
+			};
 		},
 		methods: {
-			back(){
+			back() {
 				uni.navigateBack({
-					delta:1
-				})
-			}
-		}
-	}
+					delta: 1,
+				});
+			},
+		},
+	};
 </script>
 
 <style>
-	.all{
-		background-color: #F1F1F1;
+	.all {
+		background-color: #f1f1f1;
 		height: 1500rpx;
 	}
-.ta{
-			height: 70rpx;
-			background-color:#6C40F3;
-		}
+
+	.ta {
+		height: 70rpx;
+		background-color: #6c40f3;
+	}
+
 	.tab1 {
-			display: flex;
-			background-color:#6C40F3;
-		}
-		.tit1 {
+		display: flex;
+		background-color: #6c40f3;
+	}
+
+	.tit1 {
 		margin-top: 9rpx;
-			color:#FFFFFF ;
-			margin-left: 210rpx;
-			display: flex;
-			font-size: 40rpx;
-		}
-		.tit2 {
+		color: #ffffff;
+		margin-left: 210rpx;
+		display: flex;
+		font-size: 40rpx;
+	}
+
+	.tit2 {
 		margin-top: 9rpx;
-			color:#FFFFFF ;
-			margin-left: 210rpx;
-			display: flex;
-			font-size: 40rpx;
-			width: 40%;
-		}
-		.back {
-			margin-top: 8rpx;
-			margin-left: 10rpx;
-		}
-		.im{
-			margin-top: 10rpx;
-			margin-left: 180rpx;
-		}
-		.im1{
-			margin-top: 10rpx;
-			margin-left: 100rpx;
-		}
-.tit{
-	/* color: #007AFF; */
-	height: 60rpx;
-	width: 160rpx;
-	text-align: center;
-	background-color: ;
-	margin-left: 140rpx;
-}
-.tr{
-	height: 80rpx;
-	display: flex;
-	align-items: center;
-	background-color: #F8F8F8;
-}
-.blue{
-		color: #007AFF;
-		border-bottom: 2rpx solid #00AAFF;
-	}
-	.td{
+		color: #ffffff;
+		margin-left: 210rpx;
+		display: flex;
+		font-size: 40rpx;
+		width: 40%;
+	}
+
+	.back {
+		margin-top: 8rpx;
+		margin-left: 10rpx;
+	}
+
+	.im {
+		margin-top: 10rpx;
+		margin-left: 180rpx;
+	}
+
+	.im1 {
+		margin-top: 10rpx;
+		margin-left: 100rpx;
+	}
+
+	.tit {
+		/* color: #007AFF; */
+		height: 60rpx;
+		width: 160rpx;
+		text-align: center;
+		background-color: ;
+		margin-left: 140rpx;
+	}
+
+	.tr {
+		height: 80rpx;
+		display: flex;
+		align-items: center;
+		background-color: #f8f8f8;
+	}
+
+	.blue {
+		color: #007aff;
+		border-bottom: 2rpx solid #00aaff;
+	}
+
+	.td {
 		margin-top: 20rpx;
 		width: 100%;
 		height: 100rpx;
-		background-color:#FFFFFF; 
+		background-color: #ffffff;
 		display: flex;
 	}
-	.td1{
+
+	.td1 {
 		margin-top: 20rpx;
 		width: 100%;
 		height: 100rpx;
-		background-color:#FFFFFF; 
+		background-color: #ffffff;
 		display: flex;
 	}
-	.tex{
+
+	.tex {
 		font-size: 34rpx;
 		margin-left: 20rpx;
 		/* text-align: center; */
@@ -153,7 +163,8 @@
 		color: #333333;
 		width: 60%;
 	}
-	.tex1{
+
+	.tex1 {
 		font-size: 34rpx;
 		margin-left: 20rpx;
 		/* text-align: center; */
@@ -163,11 +174,13 @@
 		color: #333333;
 		width: 60%;
 	}
-	.ima{
+
+	.ima {
 		margin-top: 20rpx;
 		margin-left: 270rpx;
 	}
-	.ima1{
+
+	.ima1 {
 		margin-top: 20rpx;
 		margin-left: 270rpx;
 	}
diff --git a/pages/my/read_report.vue b/pages/my/read_report.vue
new file mode 100644
index 0000000000000000000000000000000000000000..1ce4ea59e8f7f91c250074eed4d85460276d38f3
--- /dev/null
+++ b/pages/my/read_report.vue
@@ -0,0 +1,312 @@
+<template>
+	<view>
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="读书报告" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
+		<!-- 头部开始 -->
+		
+		<view class="tq"></view>
+		<view class="top">
+			<view>
+				<view class="text1">
+					总借阅量
+				</view>
+				<view class="textone">
+					8888
+				</view>
+			</view>
+			<view>
+				<view class="text2">
+					您的段位
+				</view>
+				<view class="texttwo">
+						LV.11书圣
+				</view>
+			</view>
+			<view>
+				<view class="text2">
+					您的历史借阅
+				</view>
+				<navigator url="../../pages_borrow_books/pages/borrow_and_return/borrow_and_return">
+				<view class="textthree">
+					去查看<img src="../../static/images/arrow_right_icon_32_2x.png" style="width: 35rpx;height: 35rpx;" />
+				</view>
+				</navigator>
+			</view>
+
+		</view>
+		<!-- 头部结束 -->
+		<view class="mid">
+			<view class="br">
+				<view class="title">本月借阅报告</view>
+				<view class="delate">
+					<!-- <view class="Sc">查看更多</view> -->
+				</view>
+			</view>
+			<view class="midone">
+				<view>
+					<view class="one">
+						总借阅量
+					</view>
+					<view class="one1">
+						预约总数
+					</view>
+				</view>
+				<view>
+					<view class="two">
+						52
+					</view>
+					<view class="two1">
+						28
+					</view>
+				</view>
+				<view>
+					<view class="one">
+						圈子
+					</view>
+					<view class="one1">
+						逾期记录
+					</view>
+				</view>
+				<view>
+					<view class="two">
+						52
+					</view>
+					<view class="two1">
+						28
+					</view>
+				</view>
+			</view>
+			<view class="br">
+				<view class="title">年度借阅报告</view>
+				<view class="delate">
+					<!-- <view class="Sc">查看更多</view> -->
+				</view>
+			</view>
+			<view class="midone">
+				<view>
+					<view class="one">
+						总借阅量
+					</view>
+					<view class="one1">
+						预约总数
+					</view>
+				</view>
+				<view>
+					<view class="two">
+						52
+					</view>
+					<view class="two1">
+						28
+					</view>
+				</view>
+				<view>
+					<view class="one">
+						圈子
+					</view>
+					<view class="one1">
+						逾期记录
+					</view>
+				</view>
+				<view>
+					<view class="two">
+						52
+					</view>
+					<view class="two1">
+						28
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+			};
+		},
+		methods: {
+			back() {
+				uni.navigateBack({
+					delta: 1,
+				});
+			},
+		},
+	};
+</script>
+<style>
+	/* 头部开始 */
+	.tq{
+			height: 160rpx;
+			background-color:#6C40F3;
+		}
+	.top{
+		width: 95%;
+		height: 260rpx;
+		margin: -150rpx 20rpx;
+		/* display: flex; */
+		background-color: #F7E7C5;
+		/* box-sizing: border-box; */
+		/* border: #FFFFFF solid 5rpx; */
+		border-radius: 20rpx;
+		
+	}
+	.top view{
+		/* width: 100%; */
+		display: flex;
+		height: 50rpx;
+		margin-top: 30rpx;
+		/* background-color: #00BFFF; */
+	}
+	.text1{
+		font-size: 38rpx;
+		margin-left: 25rpx;
+		width: 75%;
+		font-weight: 700;
+		/* background-color: #000000; */
+		/* background-color: #008000; */
+	}
+	.textone{
+		font-weight: 700;
+		font-size: 46rpx;
+		/* width: 20%; */
+		/* text-align: right; */
+		/* background-color: #255BBA; */
+		/* margin-right: 30rpx; */
+		color: #FFBE00;
+		
+	}
+	.text2{
+		width: 70%;
+		font-size: 28rpx;
+		margin-left: 25rpx;
+		/* background-color: #000000; */
+	}
+	
+	/* 等级 */
+	.texttwo {
+		font-size: 28rpx;
+		margin-left: 20rpx;
+		/* width: 20%; */
+		/* text-align: right; */
+		/* background-color: #255BBA; */
+		/* margin-right: 30rpx; */
+		color: #FFBE00;
+	}
+	.textthree {
+		font-size: 28rpx;
+		margin-left: 50rpx;
+		/* width: 20%; */
+		/* text-align: right; */
+		/* background-color: #255BBA; */
+		/* margin-right: 30rpx; */
+		/* color: #FFBE00; */
+	}
+	.vip {
+		/* margin-left: 308rpx; */
+		color: #f0ad4e;
+		font-size: 25rpx;
+		border-radius: 10rpx;
+		/* border: 1rpx solid #f0ad4e; */
+		height: 35rpx;
+		margin-top: 80rpx;
+		width: 80rpx;
+		align-items: center;
+		/* margin-left: 300rpx; */
+	}
+	.denji{
+		align-items: center;
+		color: #f0ad4e;
+		font-size: 28rpx;
+		margin-left: 5rpx;
+		margin-top: 80rpx;
+	}
+	/* 头部结束 */
+	.mid{
+		margin-top: 150rpx;
+		/* background-color: #D2D2D2; */
+	}
+	.br {
+		background-color: #f5f5f5;
+		display: flex;
+		height: 60rpx;
+		
+		
+	}
+	.title {
+		width: 70%;
+		/* background-color: #000000; */
+		font-size: 28rpx;
+		margin-top: 10rpx;
+		font-weight: 700;
+		margin-left: 20rpx;
+	}
+	.delate {
+		display: flex;
+		font-size: 28rpx;
+		margin-top: 15rpx;
+		margin-left: 35rpx;
+	}
+	.Sc {
+		margin-left: 5rpx;
+		font-size: 28rpx;
+		color: #FFBE00;
+	}
+	.midone{
+		width: 95%;
+		height: 320rpx;
+		margin: 10rpx 20rpx;
+		/* display: flex; */
+		background-color: #FFFFFF;
+		/* box-sizing: border-box; */
+		/* border: #FFFFFF solid 5rpx; */
+		border-radius: 20rpx;
+	}
+	.midone view{
+		display: flex;
+		height: 50rpx;
+		margin-top: 20rpx;
+	}
+	.one{
+		font-size: 28rpx;
+		margin-left: 25rpx;
+		width: 50%;
+		/* font-weight: 700; */
+		/* background-color: #000000; */
+		/* background-color: #008000; */
+	}
+	.one1{
+		/* font-weight: 700; */
+		font-size: 28rpx;
+		/* width: 20%; */
+		/* text-align: right; */
+		/* background-color: #255BBA; */
+		/* margin-right: 30rpx; */
+	}
+	.two{
+		font-size: 32rpx;
+		margin-left: 25rpx;
+		width: 50%;
+		/* font-weight: 700; */
+		/* background-color: #000000; */
+		/* background-color: #008000; */
+	}
+	.two1{
+		/* font-weight: 700; */
+		font-size: 32rpx;
+		/* width: 20%; */
+		/* text-align: right; */
+		/* background-color: #255BBA; */
+		/* margin-right: 30rpx; */
+		
+	}
+</style>
\ No newline at end of file
diff --git a/pages/my/tushu.vue b/pages/my/tushu.vue
index 502d44e13bb0ca8e23a6e46a016adfb79e1676d3..4856eda7cfd44a886ba3446e9d8645e4d1810301 100644
--- a/pages/my/tushu.vue
+++ b/pages/my/tushu.vue
@@ -1,137 +1,133 @@
 <template>
-	<view class="all">
-		<view class="td"></view>
-		<view class="tit">
-			<image class="image" src="../../static/images/userinfo_reading.png" ></image>
-			<view class="tex">图书列表</view>
-		</view>
-		<view class="lieshu">
-			<view class="lies">
-				<image class="imag3" src="../../static/images/封面.png"></image>
-				<view class="name1">解忧杂货铺牛吼i哦吼i的hi后i松平定紧哦碰上架</view>
-				<view class="name2">[日]东野圭吾电风扇广泛广泛是</view>
-			</view>
-			<view class="lies">
-				<image class="imag3" src="../../static/images/封面.png"></image>
-				<view class="name1">解忧杂货铺</view>
-				<view class="name2">[日]东野圭吾</view>
-			</view>
-			<view class="lies">
-				<image class="imag3" src="../../static/images/封面.png"></image>
-				<view class="name1">解忧杂货铺</view>
-				<view class="name2">[日]东野圭吾</view>
-			</view>
-		</view>
-		<view class="lieshu">
-			<view class="lies">
-				<image class="imag3" src="../../static/images/封面.png"></image>
-				<view class="name1">解忧杂货铺牛吼i哦吼i的hi后i松平定紧哦碰上架</view>
-				<view class="name2">[日]东野圭吾电风扇广泛广泛是</view>
-			</view>
-			<view class="lies">
-				<image class="imag3" src="../../static/images/封面.png"></image>
-				<view class="name1">解忧杂货铺</view>
-				<view class="name2">[日]东野圭吾</view>
-			</view>
-			<view class="lies">
-				<image class="imag3" src="../../static/images/封面.png"></image>
-				<view class="name1">解忧杂货铺</view>
-				<view class="name2">[日]东野圭吾</view>
-			</view>
-		</view>
-	</view>
+  <view class="all">
+    <view class="td"></view>
+    <view class="tit">
+      <image class="image" src="/static/images/userinfo_reading.png"></image>
+      <view class="tex">图书列表</view>
+    </view>
+    <view class="lieshu">
+      <view class="lies">
+        <image class="imag3" src="/static/images/封面.png"></image>
+        <view class="name1">解忧杂货铺牛吼i哦吼i的hi后i松平定紧哦碰上架</view>
+        <view class="name2">[日]东野圭吾电风扇广泛广泛是</view>
+      </view>
+      <view class="lies">
+        <image class="imag3" src="/static/images/封面.png"></image>
+        <view class="name1">解忧杂货铺</view>
+        <view class="name2">[日]东野圭吾</view>
+      </view>
+      <view class="lies">
+        <image class="imag3" src="/static/images/封面.png"></image>
+        <view class="name1">解忧杂货铺</view>
+        <view class="name2">[日]东野圭吾</view>
+      </view>
+    </view>
+    <view class="lieshu">
+      <view class="lies">
+        <image class="imag3" src="/static/images/封面.png"></image>
+        <view class="name1">解忧杂货铺牛吼i哦吼i的hi后i松平定紧哦碰上架</view>
+        <view class="name2">[日]东野圭吾电风扇广泛广泛是</view>
+      </view>
+      <view class="lies">
+        <image class="imag3" src="/static/images/封面.png"></image>
+        <view class="name1">解忧杂货铺</view>
+        <view class="name2">[日]东野圭吾</view>
+      </view>
+      <view class="lies">
+        <image class="imag3" src="/static/images/封面.png"></image>
+        <view class="name1">解忧杂货铺</view>
+        <view class="name2">[日]东野圭吾</view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			
-		}
-	}
+export default {
+  data() {
+    return {};
+  },
+  methods: {},
+};
 </script>
 
 <style>
-	.all{
-		background-color: #F8F8F8;
-	}
-	.td{
-		height: 10rpx;
-		background-color: #F8F8F8;
-	}
-	.image{
-		margin-top: 10rpx;
-		width: 50rpx;
-		height: 50rpx;
-	}
-	.tex{
-		/* text-align: center; */
-		margin-top: 10rpx;
-		margin-left: 10rpx;
-		align-items: center;
-		font-size: 36rpx;
-	}
-	.tit{
-		/* margin-top: 10rpx; */
-		width: 98%;
-		height: 80rpx;
-		margin-left: 5rpx;
-		background-color: #FFFFFF;
-		border-radius: 3%;
-		text-align: center;
-		display: flex;
-	}
+.all {
+  background-color: #f8f8f8;
+}
+.td {
+  height: 10rpx;
+  background-color: #f8f8f8;
+}
+.image {
+  margin-top: 10rpx;
+  width: 50rpx;
+  height: 50rpx;
+}
+.tex {
+  /* text-align: center; */
+  margin-top: 10rpx;
+  margin-left: 10rpx;
+  align-items: center;
+  font-size: 36rpx;
+}
+.tit {
+  /* margin-top: 10rpx; */
+  width: 98%;
+  height: 80rpx;
+  margin-left: 5rpx;
+  background-color: #ffffff;
+  border-radius: 3%;
+  text-align: center;
+  display: flex;
+}
 .lieshu {
-	margin-top: 10rpx;
-	background-color: #FFFFFF;
-		display: flex;
-		width: 100%;
-		height: 500rpx;
-	}
+  margin-top: 10rpx;
+  background-color: #ffffff;
+  display: flex;
+  width: 100%;
+  height: 500rpx;
+}
 
-	.lies {
-		margin-left: 20rpx;
-		margin-top: 20rpx;
-		width: 30%;
-		height: 450rpx;
-	}
+.lies {
+  margin-left: 20rpx;
+  margin-top: 20rpx;
+  width: 30%;
+  height: 450rpx;
+}
 
-	.imag3 {
-		width: 100%;
-		height: 300rpx;
-	}
+.imag3 {
+  width: 100%;
+  height: 300rpx;
+}
 
-	.name1 {
-		display: -webkit-box;
-		width: 100%;
-		height: 90rpx;
-		font-size: 35rpx;
-		color: #3C3C3C;
-		word-break: break-all;
-		text-overflow: ellipsis;
-		/*自适应字体*/
-		overflow: hidden;
-		-webkit-box-orient: vertical;
-		-webkit-line-clamp: 2;
-		/*设置 需要显示的行数*/
-	}
-	.name2 {
-		display: -webkit-box;
-		width: 100%;
-		height: 40rpx;
-		margin-top: 10rpx;
-		font-size: 30rpx;
-		color: #838383;
-		word-break: break-all;
-		text-overflow: ellipsis;
-		/*自适应字体*/
-		overflow: hidden;
-		-webkit-box-orient: vertical;
-		-webkit-line-clamp: 1;
-		/*设置 需要显示的行数*/
-	}
+.name1 {
+  display: -webkit-box;
+  width: 100%;
+  height: 90rpx;
+  font-size: 35rpx;
+  color: #3c3c3c;
+  word-break: break-all;
+  text-overflow: ellipsis;
+  /*自适应字体*/
+  overflow: hidden;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  /*设置 需要显示的行数*/
+}
+.name2 {
+  display: -webkit-box;
+  width: 100%;
+  height: 40rpx;
+  margin-top: 10rpx;
+  font-size: 30rpx;
+  color: #838383;
+  word-break: break-all;
+  text-overflow: ellipsis;
+  /*自适应字体*/
+  overflow: hidden;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 1;
+  /*设置 需要显示的行数*/
+}
 </style>
diff --git a/pages/my/xuig.vue b/pages/my/xuig.vue
index ba5c1f38250b97222077573e7dc33fef7563ce3e..5516ecac65547a7c95655097aa7c5f8cf3e9140a 100644
--- a/pages/my/xuig.vue
+++ b/pages/my/xuig.vue
@@ -1,37 +1,30 @@
 <template>
 	<view>
-		<!-- 导航栏 -->
-		<!-- #ifdef APP-PLUS -->
-		<view class="ta"></view>
-			<view class="tab1" style="width: 100%; height: 90rpx;">
-				<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-				<view class="tit1">修改借书卡</view>
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="修改借书卡" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
 				</view>
-				<!-- 内容 -->
-				<view class="tr"></view>
-				<view class="tex"><input @input="goToSearch" placeholder="借书证号"   type="text"/></view>
-				<view class="tex"><input @input="goToSearch" placeholder="身份证号"   type="text"/></view>
-				<view class="tex"><input @input="goToSearch" placeholder="图书馆"   type="text"/></view>
-				<view class="tex"><input @input="goToSearch" placeholder="密码"   type="password"/></view>
-		<button class="btn" >
-			提交
-		</button>
+			</view>
+		</u-navbar>
+		<!-- #ifdef APP-PLUS -->
+		<!-- 内容 -->
+		<view class="tr"></view>
+		<view class="tex"><input @input="goToSearch" placeholder="借书证号" type="text" /></view>
+		<view class="tex"><input @input="goToSearch" placeholder="身份证号" type="text" /></view>
+		<view class="tex"><input @input="goToSearch" placeholder="图书馆" type="text" /></view>
+		<view class="tex"><input @input="goToSearch" placeholder="密码" type="password" /></view>
+		<button class="btn">提交</button>
 		<!-- #endif -->
 		<!-- #ifdef MP-WEIXIN -->
-		<view class="ta"></view>
-			<view class="tab1" style="width: 100%; height: 90rpx;">
-				<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-				<view class="tit2">修改借书卡</view>
-				</view>
-				<!-- 内容 -->
-				<view class="tr"></view>
-				<view class="tex1"><input @input="goToSearch" placeholder="借书证号"   type="text"/></view>
-				<view class="tex1"><input @input="goToSearch" placeholder="身份证号"   type="text"/></view>
-				<view class="tex1"><input @input="goToSearch" placeholder="图书馆"   type="text"/></view>
-				<view class="tex1"><input @input="goToSearch" placeholder="密码"   type="password"/></view>
-		<button class="btn1" >
-			提交
-		</button>
+		<!-- 内容 -->
+		<view class="tr"></view>
+		<view class="tex1"><input @input="goToSearch" placeholder="借书证号" type="text" /></view>
+		<view class="tex1"><input @input="goToSearch" placeholder="身份证号" type="text" /></view>
+		<view class="tex1"><input @input="goToSearch" placeholder="图书馆" type="text" /></view>
+		<view class="tex1"><input @input="goToSearch" placeholder="密码" type="password" /></view>
+		<button class="btn1">提交</button>
 		<!-- #endif -->
 	</view>
 </template>
@@ -40,64 +33,72 @@
 	export default {
 		data() {
 			return {
-				
-			}
+				background: {
+					background: "#6C40F3",
+				},
+			};
 		},
 		methods: {
-			back(){
+			back() {
 				uni.navigateBack({
-					delta:1
-				})
-			}
-		}
-	}
+					delta: 1,
+				});
+			},
+		},
+	};
 </script>
 
 <style>
-.ta{
-			height: 70rpx;
-			background-color:#6C40F3;
-		}
+	.ta {
+		height: 70rpx;
+		background-color: #6c40f3;
+	}
+
 	.tab1 {
-			display: flex;
-			background-color:#6C40F3;
-		}
+		display: flex;
+		background-color: #6c40f3;
+	}
+
 	.tit1 {
 		margin-top: 9rpx;
-			color:#FFFFFF ;
-			margin-left: 210rpx;
-			display: flex;
-			font-size: 40rpx;
+		color: #ffffff;
+		margin-left: 210rpx;
+		display: flex;
+		font-size: 40rpx;
 	}
+
 	.tit2 {
 		margin-top: 9rpx;
-			color:#FFFFFF ;
-			margin-left: 200rpx;
-			display: flex;
-			font-size: 40rpx;
-			width: 60%;
+		color: #ffffff;
+		margin-left: 200rpx;
+		display: flex;
+		font-size: 40rpx;
+		width: 60%;
 	}
+
 	.back {
 		margin-top: 18rpx;
 		margin-left: 10rpx;
 	}
-	.tr{
+
+	.tr {
 		height: 10rpx;
-		background-color: #F8F8F8;
+		background-color: #f8f8f8;
 	}
-	.tex{
+
+	.tex {
 		height: 80rpx;
-		border-bottom: 1rpx solid #F1F1F1;
-		color: #8F8F94;
-		
+		border-bottom: 1rpx solid #f1f1f1;
+		color: #8f8f94;
 	}
-	.tex1{
+
+	.tex1 {
 		height: 80rpx;
-		border-bottom: 1rpx solid #F1F1F1;
-		color: #8F8F94;
-		
+		border-bottom: 1rpx solid #f1f1f1;
+		color: #8f8f94;
 	}
-	.tex input{
+
+	.tex input {
 		margin-left: 20rpx;
 		width: 450rpx;
 		height: 60rpx;
@@ -105,7 +106,8 @@
 		font-size: 36rpx;
 		margin-top: 20rpx;
 	}
-	.tex1 input{
+
+	.tex1 input {
 		margin-left: 20rpx;
 		width: 450rpx;
 		height: 60rpx;
@@ -113,17 +115,19 @@
 		font-size: 36rpx;
 		margin-top: 20rpx;
 	}
-	.btn{
+
+	.btn {
 		margin-top: 200rpx;
 		width: 80%;
-		background-color: #DD524D;
-		color: #FFFFFF;
+		background-color: #dd524d;
+		color: #ffffff;
 	}
-	.btn1{
+
+	.btn1 {
 		margin-top: 200rpx;
 		width: 80%;
 		height: 100rpx;
-		background-color: #DD524D;
-		color: #FFFFFF;
+		background-color: #dd524d;
+		color: #ffffff;
 	}
 </style>
diff --git a/pages/my_reserve_Spage/reserve_SpageL.vue b/pages/my_reserve_Spage/reserve_SpageL.vue
index 276a8812bd9256c2c43f9233daa4403b79e8dfb6..18ea6215ac7dfdd25c64a9ad71fbac4f936e5a02 100644
--- a/pages/my_reserve_Spage/reserve_SpageL.vue
+++ b/pages/my_reserve_Spage/reserve_SpageL.vue
@@ -1,293 +1,294 @@
 <template name="Logistic">
-	<view>
-		<view class="mid">
-			<view>
-				<view class="zt"><view class="zt1">广东图书馆</view></view>
-				<view class="midone">
-					<view class="zhengti">
-						<image src="../../static/images/书2.jpg" style="width: 125rpx; height: 170rpx;"></image>
-						<view class="midwz">致敬老师</view>
-					</view>
-					<view>
-						<view class="s1">
-							预约时间：2017-11-08
-						</view>
-						<view class="s2">持书人：爱哭的猫</view>
-						<view class="s7">
-							<view class="s3">支付：未支付</view>
-							<view class="s4">
-								当前状态：
-								<view class="s5">等待持书人还书</view>
-							</view>
-							<view class="s8">
-								<button class="btn5"><view class="wz">删除记录</view></button>
-							</view>
-						</view>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+    <view class="mid">
+      <view>
+        <view class="zt"><view class="zt1">广东图书馆</view></view>
+        <view class="midone">
+          <view class="zhengti">
+            <image
+              src="/static/images/书2.jpg"
+              style="width: 125rpx; height: 170rpx"
+            ></image>
+            <view class="midwz">致敬老师</view>
+          </view>
+          <view>
+            <view class="s1"> 预约时间：2017-11-08 </view>
+            <view class="s2">持书人：爱哭的猫</view>
+            <view class="s7">
+              <view class="s3">支付：未支付</view>
+              <view class="s4">
+                当前状态：
+                <view class="s5">等待持书人还书</view>
+              </view>
+              <view class="s8">
+                <button class="btn5"><view class="wz">删除记录</view></button>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
 export default {
-	data() {
-		return {
-			mhcx:'', /*搜索框内容*/
-			page:0,
-			size:20,
-			info:[],//
-			openId:'1',//暂时是1
-			flag:'true',//判断是否到底部
-			condition:2//切换
-		};
-	},
-	onLoad() {
-		console.log("执行方法了")
-		this.goToSearch()
-	},
-	//当划到最底部的时候触发事件
-	onReachBottom:function(){				
-			console.log("我是最底部了");
-			if(this.flag=='true'){
-				this.getMoreNews();
-			}else{
-				this.showModal("到底啦~")
-			}			
-			},
-	methods: {
-		//获取数据
-		goToSearch(){
-			uni.request({
-				 url:getApp().globalData.URL+'api/reserveList/queryReserveList	',
-				 data:{
-					 
-					 openId:this.openId,
-					 mhcx:this.mhcx,
-					 condition:this.condition,
-					 page:this.page,
-					 size:this.size,
-				 },
-				 method:'GET',
-				 header: {
-				     'content-type': 'application/json;charset=UTF-8' // 默认值
-				   },
-				success:res =>{
-					console.log("后台传来的数据：",res.data)
-					this.info = res.data;
-					},
-				fail: (res) => {
-					this.showModal("网络错误！")
-				}
-			})
-		},
-		//分页加载
-		getMoreNews:function(){						//数据到底,触发这个函数
-			this.page = this.page + 1;
-			uni.showNavigationBarLoading();		//一读取数据,就进行刷新
-			var that = this;
-			uni.request({
-				url:getApp().globalData.URL+'api/reserveList/queryReserveList',
-				data:{
-					 openId:that.openId,
-					 mhcx:that.mhcx,
-					 page:that.page,
-					 size:that.size,
-				},
-				method:'GET',
-				header: {
-					 'content-type': 'application/json;charset=UTF-8' // 默认值
-				   },
-				success:res =>{
-					console.log("分页后台传来的",res.data);
-					if(res.data.length==0){
-						//到底了
-						that.flag = 'false';
-						that.page = that.page - 1;
-						return false;
-					}
-					that.info=that.info.concat(Array.from(res.data)); //拼接数组
-					// uni.stopPullDownRefresh();	//数据加载完成,刷新结束
-					// uni.hideNavigationBarLoading();	//数据读取完毕,刷新停止	
-				},
-				fail: (res) => {
-					this.showModal("网络错误！")
-				}
-			})
-		},
-		//日期转换方法
-		formatDate(value) {
-			let date = new Date(value);
-			let y = date.getFullYear();
-			let MM = date.getMonth() + 1;
-			MM = MM < 10 ? ('0' + MM) : MM;
-			let d = date.getDate();
-			d = d < 10 ? ('0' + d) : d;
-			let h = date.getHours();
-			h = h < 10 ? ('0' + h) : h;
-			let m = date.getMinutes();
-			m = m < 10 ? ('0'+ m) : m;
-			let s = date.getSeconds();
-			s = s < 10 ? ('0' + s) : s;
-			return y + '/' + MM + '/' + d+' '+h+':'+m+':'+s ;
-		},
-		//提示框
-		showModal(val){
-			 uni.showToast({
-				title: val,
-				icon: 'none'
-			 });
-		},
-	}
+  data() {
+    return {
+      mhcx: "" /*搜索框内容*/,
+      page: 0,
+      size: 20,
+      info: [], //
+      openId: "1", //暂时是1
+      flag: "true", //判断是否到底部
+      condition: 2, //切换
+    };
+  },
+  onLoad() {
+    console.log("执行方法了");
+    this.goToSearch();
+  },
+  //当划到最底部的时候触发事件
+  onReachBottom: function () {
+    console.log("我是最底部了");
+    if (this.flag == "true") {
+      this.getMoreNews();
+    } else {
+      this.showModal("到底啦~");
+    }
+  },
+  methods: {
+    //获取数据
+    goToSearch() {
+      uni.request({
+        url: getApp().globalData.URL + "api/reserveList/queryReserveList	",
+        data: {
+          openId: this.openId,
+          mhcx: this.mhcx,
+          condition: this.condition,
+          page: this.page,
+          size: this.size,
+        },
+        method: "GET",
+        header: {
+          "content-type": "application/json;charset=UTF-8", // 默认值
+        },
+        success: (res) => {
+          console.log("后台传来的数据：", res.data);
+          this.info = res.data;
+        },
+        fail: (res) => {
+          this.showModal("网络错误！");
+        },
+      });
+    },
+    //分页加载
+    getMoreNews: function () {
+      //数据到底,触发这个函数
+      this.page = this.page + 1;
+      uni.showNavigationBarLoading(); //一读取数据,就进行刷新
+      var that = this;
+      uni.request({
+        url: getApp().globalData.URL + "api/reserveList/queryReserveList",
+        data: {
+          openId: that.openId,
+          mhcx: that.mhcx,
+          page: that.page,
+          size: that.size,
+        },
+        method: "GET",
+        header: {
+          "content-type": "application/json;charset=UTF-8", // 默认值
+        },
+        success: (res) => {
+          console.log("分页后台传来的", res.data);
+          if (res.data.length == 0) {
+            //到底了
+            that.flag = "false";
+            that.page = that.page - 1;
+            return false;
+          }
+          that.info = that.info.concat(Array.from(res.data)); //拼接数组
+          // uni.stopPullDownRefresh();	//数据加载完成,刷新结束
+          // uni.hideNavigationBarLoading();	//数据读取完毕,刷新停止
+        },
+        fail: (res) => {
+          this.showModal("网络错误！");
+        },
+      });
+    },
+    //日期转换方法
+    formatDate(value) {
+      let date = new Date(value);
+      let y = date.getFullYear();
+      let MM = date.getMonth() + 1;
+      MM = MM < 10 ? "0" + MM : MM;
+      let d = date.getDate();
+      d = d < 10 ? "0" + d : d;
+      let h = date.getHours();
+      h = h < 10 ? "0" + h : h;
+      let m = date.getMinutes();
+      m = m < 10 ? "0" + m : m;
+      let s = date.getSeconds();
+      s = s < 10 ? "0" + s : s;
+      return y + "/" + MM + "/" + d + " " + h + ":" + m + ":" + s;
+    },
+    //提示框
+    showModal(val) {
+      uni.showToast({
+        title: val,
+        icon: "none",
+      });
+    },
+  },
 };
 </script>
 
 <style>
 .mid {
-	/* margin-top:30rpx; */
-	width: 100%;
-	height: auto;
-	/* background-color: #007AFF; */
-	/* box-shadow: #808080 1rpx 1rpx 15rpx 1rpx; */
+  /* margin-top:30rpx; */
+  width: 100%;
+  height: auto;
+  /* background-color: #007AFF; */
+  /* box-shadow: #808080 1rpx 1rpx 15rpx 1rpx; */
 }
 .zt {
-	/* height: 40rpx; */
-	border-bottom: solid 1rpx;
-	/* border-top:solid 1rpx; */
-	margin-top: -5rpx;
-	height: 60rpx;
-	color: #bbbbbb;
+  /* height: 40rpx; */
+  border-bottom: solid 1rpx;
+  /* border-top:solid 1rpx; */
+  margin-top: -5rpx;
+  height: 60rpx;
+  color: #bbbbbb;
 }
 .zt1 {
-	color: #f0ad4e;
-	font-size: 28rpx;
-	margin-left: 30rpx;
-	line-height: center;
-	margin-top: 25rpx;
+  color: #f0ad4e;
+  font-size: 28rpx;
+  margin-left: 30rpx;
+  line-height: center;
+  margin-top: 25rpx;
 }
 .midone {
-	width: 100%;
-	height: 200rpx;
-	font-size: 30rpx;
-	margin-top: 35rpx;
-	align-items: center;
-	border-bottom: 1rpx solid #e3e3e3;
+  width: 100%;
+  height: 200rpx;
+  font-size: 30rpx;
+  margin-top: 35rpx;
+  align-items: center;
+  border-bottom: 1rpx solid #e3e3e3;
 }
 .zhengti {
-	display: flex;
-	width: 100%;
-	margin-left: 30rpx;
+  display: flex;
+  width: 100%;
+  margin-left: 30rpx;
 }
 .imag {
-	margin-left: 30rpx;
+  margin-left: 30rpx;
 }
 .midwz {
-	font-size: 28rpx;
-	height: 35rpx;
-	margin-top: -5rpx;
-	align-items: center;
-	margin-left: 30rpx;
-	width: auto;
-	/* background-color:  #333333; */
+  font-size: 28rpx;
+  height: 35rpx;
+  margin-top: -5rpx;
+  align-items: center;
+  margin-left: 30rpx;
+  width: auto;
+  /* background-color:  #333333; */
 }
 .s1 {
-	font-size: 20rpx;
-	height: 35rpx;
-	margin-top: -130rpx;
-	align-items: center;
-	margin-left: 190rpx;
-	color: #999999;
-	display: flex;
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -130rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+  display: flex;
 }
 .s2 {
-	font-size: 20rpx;
-	height: 35rpx;
-	margin-top: 0rpx;
-	align-items: center;
-	margin-left: 190rpx;
-	color: #999999;
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
 }
 .s3 {
-	font-size: 20rpx;
-	height: 35rpx;
-	margin-top: 0rpx;
-	align-items: center;
-	margin-left: 190rpx;
-	color: #999999;
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
 }
 .s4 {
-	font-size: 20rpx;
-	height: 35rpx;
-	margin-top: 0rpx;
-	align-items: center;
-	margin-left: 190rpx;
-	color: #f0ad4e;
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #f0ad4e;
 }
 .s5 {
-	font-size: 20rpx;
-	height: 35rpx;
-	margin-top: -26rpx;
-	align-items: center;
-	margin-left: 100rpx;
-	color: #555555;
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -26rpx;
+  align-items: center;
+  margin-left: 100rpx;
+  color: #555555;
 }
 .s6 {
-	color: #dd524d;
+  color: #dd524d;
 }
 
 .s7 {
-	height: 35rpx;
-	align-items: center;
-	width: auto;
-	/* display: flex; */
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  /* display: flex; */
 }
 
 .s8 {
-	text-align: center;
+  text-align: center;
 }
 .btn1 {
-	color: #f8f8f8;
-	width: 137rpx;
-	height: 55rpx;
-	margin-right: 20rpx;
-	margin-top: -60rpx;
-	background-color: #00bfff;
-	border-radius: 15rpx;
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #00bfff;
+  border-radius: 15rpx;
 }
 .btn3 {
-	color: #f8f8f8;
-	width: 137rpx;
-	height: 55rpx;
-	margin-right: 20rpx;
-	margin-top: -60rpx;
-	background-color: #4cd964;
-	border-radius: 15rpx;
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #4cd964;
+  border-radius: 15rpx;
 }
 .wz {
-	font-size: 16rpx;
-	margin-top: 8rpx;
-	/* width: 137rpx; */
-	margin-left: 5rpx;
-	text-align: center;
-	position: absolute;
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 5rpx;
+  text-align: center;
+  position: absolute;
 }
 .btn5 {
-	color: #f8f8f8;
-	width: 137rpx;
-	height: 55rpx;
-	margin-right: 20rpx;
-	margin-top: -60rpx;
-	background-color: #dd524d;
-	border-radius: 15rpx;
-	text-align: center;
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #dd524d;
+  border-radius: 15rpx;
+  text-align: center;
 }
 .wz1 {
-	font-size: 16rpx;
-	margin-top: 8rpx;
-	/* width: 137rpx; */
-	margin-left: 20rpx;
-	text-align: center;
-	position: absolute;
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 20rpx;
+  text-align: center;
+  position: absolute;
 }
 </style>
diff --git a/pages/my_reserve_Spage/reserve_SpageR.vue b/pages/my_reserve_Spage/reserve_SpageR.vue
index 996920e2e4e35a3d679654a22c5eb375ea2d7939..ce64b4dfc5ba90735b373128076874e096985625 100644
--- a/pages/my_reserve_Spage/reserve_SpageR.vue
+++ b/pages/my_reserve_Spage/reserve_SpageR.vue
@@ -1,196 +1,192 @@
 <template name="Orders">
-	<view>
-		<view class="mid">
-			<view>
-				<view class="zt">
-					<view class="zt1">
-						广东图书馆
-					</view>
-				</view>
-				<view class="midone">
-					<view class="zhengti">
-						<image src="../../static/images/书2.jpg" style="width: 125rpx; height: 170rpx;"></image>
-						<view class="midwz">致敬老师</view>
-					</view>
-					<view >
-						<view class="s1">预约时间：2017-11-08 
-						</view>
-						<view class="s2">持书人：爱哭的猫</view>
-						<view class="s7">
-							<view class="s3">支付：未支付</view>
-							<view class="s4">当前状态：
-								<view class="s5">预约失败，交易终止</view>
-							</view>
-							<view class="s8">
-								<button class="btn5"><view class="wz1">删除记录</view></button>
-							</view>
-						</view>
-					</view>
-				</view>
-			</view>	
-		</view>
-	</view>
+  <view>
+    <view class="mid">
+      <view>
+        <view class="zt">
+          <view class="zt1"> 广东图书馆 </view>
+        </view>
+        <view class="midone">
+          <view class="zhengti">
+            <image
+              src="/static/images/书2.jpg"
+              style="width: 125rpx; height: 170rpx"
+            ></image>
+            <view class="midwz">致敬老师</view>
+          </view>
+          <view>
+            <view class="s1">预约时间：2017-11-08 </view>
+            <view class="s2">持书人：爱哭的猫</view>
+            <view class="s7">
+              <view class="s3">支付：未支付</view>
+              <view class="s4"
+                >当前状态：
+                <view class="s5">预约失败，交易终止</view>
+              </view>
+              <view class="s8">
+                <button class="btn5"><view class="wz1">删除记录</view></button>
+              </view>
+            </view>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			
-		}
-	}
+export default {
+  data() {
+    return {};
+  },
+  methods: {},
+};
 </script>
 
 <style>
 .mid {
-		/* margin-top:30rpx; */
-		width: 100%;
-		height: auto;
-		/* background-color: #007AFF; */
-		/* box-shadow: #808080 1rpx 1rpx 15rpx 1rpx; */
-	}
-	.zt{
-		/* height: 40rpx; */
-		border-bottom:solid 1rpx;
-		/* border-top:solid 1rpx; */
-		margin-top: -5rpx;
-		height: 60rpx;
-		color: #BBBBBB;
-	}
-	.zt1{
-		color: #F0AD4E;
-		font-size: 28rpx;
-		margin-left: 30rpx;
-		line-height: center;
-		margin-top: 25rpx;
-	}
-	.midone {
-		width: 100%;
-		height: 200rpx;
-		font-size: 30rpx;
-		margin-top: 35rpx;
-		align-items: center;
-		border-bottom: 1rpx solid #E3E3E3;
-	}
-	.zhengti {
-		display: flex;
-		width: 100%;
-		margin-left:30rpx;
-	}
-	.imag{
-		margin-left:30rpx;
-	}
-	.midwz {
-		font-size: 28rpx;
-		height:35rpx;
-		margin-top: -5rpx;
-		align-items: center;
-		margin-left: 30rpx;
-		width: auto;
-		/* background-color:  #333333; */
-	}
-	.s1{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: -130rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-		display: flex;
-	}
-	.s2{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-	.s3{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-	.s4{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #F0AD4E;
-	}
-	.s5{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: -26rpx;
-		align-items: center;
-		margin-left: 100rpx;
-		color: #555555;
-	}
-	.s6{
-		color: #DD524D;
-		
-	}
-	
-	.s7{
-		height:35rpx;
-		align-items: center;
-		width: auto;
-		/* display: flex; */
-	}
-	
-	.s8{
-		text-align: center;
-	}
-	.btn1{
-		color: #F8F8F8;
-		width: 137rpx;
-		height: 55rpx;
-		margin-right: 20rpx;
-		margin-top: -60rpx;
-		background-color: #00BFFF;
-		border-radius: 15rpx;
-		}
-		.btn3{
-				color: #F8F8F8;
-				width: 137rpx;
-				height: 55rpx;
-				margin-right: 20rpx;
-				margin-top: -60rpx;
-				background-color: #4CD964;
-				border-radius: 15rpx;
-				}
-		.wz{
-			font-size: 16rpx;
-			margin-top: 8rpx;
-			/* width: 137rpx; */
-			margin-left: 5rpx;
-			text-align: center;
-			position: absolute;
-		}
-		.btn5{
-			color: #F8F8F8;
-			width: 137rpx;
-			height: 55rpx;
-			margin-right: 20rpx;
-			margin-top: -60rpx;
-			background-color: #DD524D;
-			border-radius: 15rpx;
-			text-align: center;
-			}
-	.wz1{
-		font-size: 16rpx;
-		margin-top: 8rpx;
-		/* width: 137rpx; */
-		margin-left: 20rpx;
-		text-align: center;
-		position: absolute;
-	}	
+  /* margin-top:30rpx; */
+  width: 100%;
+  height: auto;
+  /* background-color: #007AFF; */
+  /* box-shadow: #808080 1rpx 1rpx 15rpx 1rpx; */
+}
+.zt {
+  /* height: 40rpx; */
+  border-bottom: solid 1rpx;
+  /* border-top:solid 1rpx; */
+  margin-top: -5rpx;
+  height: 60rpx;
+  color: #bbbbbb;
+}
+.zt1 {
+  color: #f0ad4e;
+  font-size: 28rpx;
+  margin-left: 30rpx;
+  line-height: center;
+  margin-top: 25rpx;
+}
+.midone {
+  width: 100%;
+  height: 200rpx;
+  font-size: 30rpx;
+  margin-top: 35rpx;
+  align-items: center;
+  border-bottom: 1rpx solid #e3e3e3;
+}
+.zhengti {
+  display: flex;
+  width: 100%;
+  margin-left: 30rpx;
+}
+.imag {
+  margin-left: 30rpx;
+}
+.midwz {
+  font-size: 28rpx;
+  height: 35rpx;
+  margin-top: -5rpx;
+  align-items: center;
+  margin-left: 30rpx;
+  width: auto;
+  /* background-color:  #333333; */
+}
+.s1 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -130rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+  display: flex;
+}
+.s2 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+.s3 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+.s4 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #f0ad4e;
+}
+.s5 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -26rpx;
+  align-items: center;
+  margin-left: 100rpx;
+  color: #555555;
+}
+.s6 {
+  color: #dd524d;
+}
+
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  /* display: flex; */
+}
+
+.s8 {
+  text-align: center;
+}
+.btn1 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #00bfff;
+  border-radius: 15rpx;
+}
+.btn3 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #4cd964;
+  border-radius: 15rpx;
+}
+.wz {
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 5rpx;
+  text-align: center;
+  position: absolute;
+}
+.btn5 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #dd524d;
+  border-radius: 15rpx;
+  text-align: center;
+}
+.wz1 {
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 20rpx;
+  text-align: center;
+  position: absolute;
+}
 </style>
diff --git a/pages/myinfomation/myinfomation.vue b/pages/myinfomation/myinfomation.vue
index 17b6a488351ffcf6f560da97cb79ffc4e9f3f67e..29fcb17a4975764a8bb4d8019c9f1836f4bfcd9b 100644
--- a/pages/myinfomation/myinfomation.vue
+++ b/pages/myinfomation/myinfomation.vue
@@ -1,5 +1,13 @@
 <template>
 	<view class="all">
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="信息管理" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<form @submit="formSubmit" >
 		<view class="top" >
 			<view class="topone">头像</view>
@@ -57,16 +65,23 @@
 
 <script>
 	var _self;
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
 		data() {
 			return {
+				background: {
+					background: "#6C40F3",
+				},
 				percent:0,
 				loading:false,
 				disabled:false,
 				isShow:true,//是否隐藏电话号码
 				openId:1 ,//暂时是1
 				info:{},//读者信息
-				token:'token',
 				head_img:'',//头像
 				info:{
 					openId:1
@@ -74,6 +89,9 @@
 				
 			};
 		},
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
 		onLoad() {
 			this.getReaderInfo();
 		},
@@ -81,14 +99,14 @@
 		 //获取读者信息
 		 getReaderInfo(){
 		 	var that = this;
+			let rid = parseInt(that.userinfo.readerId)
 		 	uni.request({
-		 		 // url:getApp().globalData.URL +'api/reader/app?id='+that.openId,
 		 		 url:getApp().globalData.URL +'reader/app',
 		 		 data:{
-		 			 id:that.openId,
-		 			 token:that.token,
+		 			 readerId:rid
 		 		 },
 		 		 header: {
+					 Authorization: that.token,
 		 		     'content-type': 'application/json;charset=UTF-8' // 默认值
 		 		   },
 		 		 method:'GET',
@@ -118,12 +136,18 @@
 			}else if(!sign_email){
 				this.showModal('请检查电子邮箱格式')
 			}else{
+				let rid = parseInt(that.userinfo.readerId)
+				console.log("低首付："+rid)
 				uni.request({
-					url:getApp().globalData.URL +'reader/app?openId='+that.openId+'&headImg='+that.head_img,
+					url:getApp().globalData.URL +'reader/app?readerId='+rid+'&headImg='+that.head_img,
 					data: tmp,
+					header: {
+						Authorization: that.token,
+					    'content-type': 'application/json;charset=UTF-8' // 默认值
+					  },
 					method: "PUT",
 					success:(res)=> {
-						console.log('idhjeiofhiuhfi',res)
+						console.log('后台信息：',res)
 						if(res.statusCode==200){
 							this.showModal("更改信息成功了！")
 						}else{
@@ -154,7 +178,7 @@
 		 					var datas=JSON.parse(uploadFileRes.data);
 		 					if(datas.errno==0){
 								this.showModal("头像已上传！")
-		 						that.head_img = getApp().globalData.Link+"upload/图片/" + datas.data[0];
+		 						that.head_img = getApp().globalData.Link+"upload/picture/" + datas.data[0];
 		 					}else{
 								this.showModal("图片上传失败了！")
 		 						}
@@ -182,21 +206,17 @@
 	background-color: #FFFFFF;
 }
 .top {
-	height: 110rpx;
-	/* background-color: #BBBBBB; */
+	height: 150rpx;
+	line-height: 150rpx;
 	border-bottom: 1rpx solid #F1F1F1;
 }
 .topone {
-	/* background-color: #007AFF; */
 	width: 20%;
 	margin-left: 30rpx;
-	margin-top: 55rpx;
-	/* border-bottom: 1rpx solid #bbbbbb; */
 }
 .topthree {
 	margin-top: -90rpx;
 	margin-left: 705rpx;
-	/* background-color:  #FF0000; */
 }
 .image {
 	margin-left: 580rpx;
diff --git a/pages/privateSpace/privateSpace.vue b/pages/privateSpace/privateSpace.vue
index a47d54f80a0b84c39d5d5aa1cea5c012e0077c9d..26aa238b74731730d6993b0ee9fad4b0e8800280 100644
--- a/pages/privateSpace/privateSpace.vue
+++ b/pages/privateSpace/privateSpace.vue
@@ -3,15 +3,19 @@
 		<!-- 顶部部分 -->
 		<view class="head">
 			<view class="header-wrap">
-				<view class="index-header">
-					<image class="address" src="../../static/images/back.png"></image>
-					<view class="name2">个人空间</view>
-				</view><!--  -->
-				
-				<view class="map-wrap" style="display: flex; margin-left: 330rpx;" @click="rightClick">
-					<view class="bn1" style="background-color: #00BFFF; color: #F8F8F8">加好友</view>
-					<view class="bn1" style="background-color: #4CD964; color: #F8F8F8">关注</view>
-					<view class="bn1" style="background-color: #F3F3F3; color: #CCCCCC">发消息</view>
+				<!-- 标题 -->
+				<u-navbar zhead="65rpx" height="44" title="个人空间" title-color="white" title-size="40" :background="background"
+				 back-icon-color="white" back-icon-size="50">
+					<view class="navbar-right" slot="right">
+						<view class="right_list" @click="bindInBatch">
+						</view>
+					</view>
+				</u-navbar>
+
+				<view class="map-wrap" style="display: flex; margin-left: 330rpx" @click="rightClick">
+					<view class="bn1" style="background-color: #00bfff; color: #f8f8f8">加好友</view>
+					<view class="bn1" style="background-color: #4cd964; color: #f8f8f8">关注</view>
+					<view class="bn1" style="background-color: #f3f3f3; color: #cccccc">发消息</view>
 				</view>
 			</view>
 			<view class="blank"></view>
@@ -20,121 +24,115 @@
 		<view class="br"></view>
 		<!-- 列表 -->
 		<view class="lie">
-			<view class="neirou"> 
-				<image class="img" src="../../static/images/4.jpg"></image>
+			<view class="neirou">
+				<image class="img" src="/static/images/4.jpg"></image>
 				<view class="tit">
 					<view class="name1">小明</view>
 					<view class="zhanghao">count：22181099665</view>
 				</view>
 			</view>
-			
+
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
 			<view class="class1">
-				<image class="tupian" src="../../static/images/me_blue.png"></image>
+				<image class="tupian" src="/static/images/me_blue.png"></image>
 				<view class="neirong">我的好友</view>
 			</view>
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
-			
+
 			<!-- <view class="br1"></view> -->
 			<!-- <view class="class1">
-				<image class="tupian" src="../../static/images/me_blue.png"></image>
+				<image class="tupian" src="/static/images/me_blue.png"></image>
 				<view class="neirong">我的关注</view>
 			</view> -->
 			<!-- 分割线br1 -->
 			<!-- <view class="br1"></view> -->
 		</view>
-		
+
 		<view class="show">
-			
-				<view class="top">
-					<view class="person">
-						<view class="tou">
-							<image class="image-bg" src="../../static/images/4.jpg" style="width: 100rpx;height: 100rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="bn">
-							<text class="name">小明</text>
-						</view>
-						<view class="tw">
-							<view class="time">2020-08-09 14:10</view>
-						</view>
+			<view class="top">
+				<view class="person">
+					<view class="tou">
+						<image class="image-bg" src="/static/images/4.jpg" style="width: 100rpx; height: 100rpx; border-radius: 50%"></image>
 					</view>
-					<view class="zy">
-						<view class="">添加好友是为了让读书笔记可以只公开给好友；添加好友可以为数据挖掘提供依据添加好友以后在创建个人图书馆时可以把好友加入到个人图书馆中。成功添加了某读者作为好友。
-						</view>
+					<view class="bn">
+						<text class="name">小明</text>
+					</view>
+					<view class="tw">
+						<view class="time">2020-08-09 14:10</view>
 					</view>
 				</view>
-				<view class="qt">
-					<view class="dz">
-						<image class="wave" src="../../static/images/give_like.png"></image>
-						<text id="ct">1</text>
+				<view class="zy">
+					<view class="">添加好友是为了让读书笔记可以只公开给好友；添加好友可以为数据挖掘提供依据添加好友以后在创建个人图书馆时可以把好友加入到个人图书馆中。成功添加了某读者作为好友。
 					</view>
-					<!-- <view class="pl">
-						<image class="wave" src="../../static/images/评论.png"></image>
+				</view>
+			</view>
+			<view class="qt">
+				<view class="dz">
+					<image class="wave" src="/static/images/give_like.png"></image>
+					<text id="ct">1</text>
+				</view>
+				<!-- <view class="pl">
+						<image class="wave" src="/static/images/评论.png"></image>
 						<text id="t">1</text>
 					</view> -->
-					<view class="zf">
-						<image class="wave" src="../../static/images/transmit_one.png"></image>
-		
-					</view>
+				<view class="zf">
+					<image class="wave" src="/static/images/transmit_one.png"></image>
 				</view>
+			</view>
 		</view>
 		<!-- 分割线br1 -->
-		<view class="br1" style="margin-top: 20rpx;"></view>
-		
+		<view class="br1" style="margin-top: 20rpx"></view>
+
 		<view class="show">
-			
-				<view class="top">
-					<view class="person">
-						<view class="tou">
-							<image class="image-bg" src="../../static/images/4.jpg" style="width: 100rpx;height: 100rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="bn">
-							<text class="name">小明</text>
-						</view>
-						<view class="tw">
-							<view class="time">2020-08-09 14:10</view>
-						</view>
+			<view class="top">
+				<view class="person">
+					<view class="tou">
+						<image class="image-bg" src="/static/images/4.jpg" style="width: 100rpx; height: 100rpx; border-radius: 50%"></image>
 					</view>
-					<view class="zy">
-						<view class="">添加好友是为了让读书笔记可以只公开给好友；添加好友可以为数据挖掘提供依据添加好友以后在创建个人图书馆时可以把好友加入到个人图书馆中。成功添加了某读者作为好友。
-						</view>
+					<view class="bn">
+						<text class="name">小明</text>
+					</view>
+					<view class="tw">
+						<view class="time">2020-08-09 14:10</view>
 					</view>
 				</view>
-				<view class="qt">
-					<view class="dz">
-						<image class="wave" src="../../static/images/give_like.png"></image>
-						<text id="ct">1</text>
+				<view class="zy">
+					<view class="">添加好友是为了让读书笔记可以只公开给好友；添加好友可以为数据挖掘提供依据添加好友以后在创建个人图书馆时可以把好友加入到个人图书馆中。成功添加了某读者作为好友。
 					</view>
-					<!-- <view class="pl">
-						<image class="wave" src="../../static/images/评论.png"></image>
+				</view>
+			</view>
+			<view class="qt">
+				<view class="dz">
+					<image class="wave" src="/static/images/give_like.png"></image>
+					<text id="ct">1</text>
+				</view>
+				<!-- <view class="pl">
+						<image class="wave" src="/static/images/评论.png"></image>
 						<text id="t">1</text>
 					</view> -->
-					<view class="zf">
-						<image class="wave" src="../../static/images/transmit_one.png"></image>
-		
-					</view>
+				<view class="zf">
+					<image class="wave" src="/static/images/transmit_one.png"></image>
 				</view>
+			</view>
 		</view>
 		<!-- 分割线br1 -->
-		<view class="br1" style="margin-top: 20rpx;"></view>
-	
+		<view class="br1" style="margin-top: 20rpx"></view>
 	</view>
-	
 </template>
 
 <script>
 	export default {
 		data() {
 			return {
-
-			}
+				background: {
+					background: "#6C40F3",
+				},
+			};
 		},
-		methods: {
-
-		}
-	}
+		methods: {},
+	};
 </script>
 
 <style lang="scss">
@@ -148,6 +146,7 @@
 		position: fixed;
 		top: 0;
 		z-index: 999;
+
 		// display: flex;
 		.index-header {
 			display: flex;
@@ -169,8 +168,6 @@
 				margin-top: 20rpx;
 			}
 
-			
-
 			.map-wrap {
 				.iconfont {
 					margin-top: 50rpx;
@@ -178,13 +175,14 @@
 					height: 40rpx;
 					font-size: 32rpx;
 					margin-right: 5rpx;
-					color: #3C3C3C;
+					color: #3c3c3c;
 					width: 30rpx;
 				}
 
 				text {
 					font-size: 26rpx;
 				}
+
 				display: flex;
 			}
 		}
@@ -198,19 +196,22 @@
 		margin-top: 30rpx;
 		width: 100%;
 		height: 15rpx;
-		background-color: #F5F5F5;
+		background-color: #f5f5f5;
 	}
+
 	/* 列表 */
-	.lie{
+	.lie {
 		width: 100%;
 		height: 250rpx;
 	}
-	.neirou{
+
+	.neirou {
 		display: flex;
 		width: 100%;
 		height: 190rpx;
 	}
-	.img{
+
+	.img {
 		margin-left: 30rpx;
 		margin-top: 20rpx;
 		margin-bottom: 20rpx;
@@ -218,70 +219,81 @@
 		height: 150rpx;
 		border-radius: 50%;
 	}
+
 	.br1 {
 		width: 100%;
 		height: 5rpx;
-		background-color: #F5F5F5;
+		background-color: #f5f5f5;
 	}
-	.tit{
+
+	.tit {
 		margin-left: 30rpx;
 		margin-top: 20rpx;
 		padding-top: 20rpx;
 		width: 70%;
 		height: 150rpx;
 	}
-	.name1{
+
+	.name1 {
 		width: 100%;
 		height: 60rpx;
 		font-size: 40rpx;
 	}
+
 	.name2 {
-		color: #3C3C3C;
+		color: #3c3c3c;
 		width: 100%;
 		height: 60rpx;
 		font-size: 40rpx;
 		margin-top: -35rpx;
 	}
-	
-	.zhanghao{
+
+	.zhanghao {
 		width: 100%;
 		height: 80rpx;
 		font-size: 28rpx;
 	}
-	.img1{
+
+	.img1 {
 		width: 60rpx;
 		height: 60rpx;
 		margin-top: 60rpx;
 	}
-	.class1{
+
+	.class1 {
 		display: flex;
 		width: 100%;
 		height: 70rpx;
 	}
-	.tupian{
+
+	.tupian {
 		width: 50rpx;
-		height: 50rpx; 
+		height: 50rpx;
 		margin-left: 30rpx;
 		margin-top: 10rpx;
 	}
-	.neirong{
+
+	.neirong {
 		width: 73%;
 		height: 60rpx;
 		margin-left: 20rpx;
 		margin-top: 20rpx;
 		font-size: 26rpx;
 	}
-	.img2{
+
+	.img2 {
 		width: 60rpx;
 		height: 60rpx;
 		margin-top: 10rpx;
 	}
+
 	.br2 {
 		width: 100%;
 		height: 40rpx;
-		background-color: #F5F5F5;
+		background-color: #f5f5f5;
 	}
-	.bn1{
+
+	.bn1 {
 		font-size: 28rpx;
 		margin-left: 30rpx;
 		width: 100rpx;
@@ -292,57 +304,63 @@
 		border-radius: 10rpx;
 		// box-shadow: @at-root ;
 		// padding-left: 100rpx;
-		border: 1rpx solid #CCCCCC ;
+		border: 1rpx solid #cccccc;
 	}
+
 	/* 动态 */
-	
-	.show{
+
+	.show {
 		margin-top: 55rpx;
 		width: 95%;
 		align-items: center;
 		text-align: left;
 		margin-left: 20rpx;
 	}
+
 	.person {
 		line-height: 20rpx;
 		display: flex;
 		margin-right: 100rpx;
 	}
+
 	.bn {
 		height: 100%;
 		margin-top: 55rpx;
 		// width: 90%;
-	
 	}
+
 	.name {
 		font-size: 28rpx;
 		margin: 20rpx;
 		top: 100rpx;
 		/* margin-top: 20rpx; */
-	
 	}
+
 	.tw {
 		margin-top: -110rpx;
 		text-align: right;
 	}
-	
+
 	.time {
 		font-size: 22rpx;
-		
+
 		margin-top: 160rpx;
 		margin-left: 200rpx;
 		color: #999999;
 	}
+
 	.zy {
 		margin-top: 10rpx;
 		line-height: 40rpx;
 		margin-left: 20rpx;
 		font-size: 30rpx;
 	}
+
 	.dz {
 		margin-left: 500rpx;
 		display: flex;
 	}
+
 	.wave {
 		z-index: 3;
 		right: 0;
@@ -354,21 +372,21 @@
 		margin-top: 50rpx;
 		/* animation: wave 10s linear infinite;  */
 	}
-	
-	#ct{
+
+	#ct {
 		margin-top: 50rpx;
-		color: #CCCCCC;
+		color: #cccccc;
 	}
+
 	.zf {
 		margin-left: 70rpx;
 	}
+
 	.qt {
 		display: flex;
 		border-top: none;
 		height: 80rpx;
 		font-size: 15rpx;
 		align-items: center;
-	
 	}
-	
 </style>
diff --git a/pages/readLabel/readLabel.vue b/pages/readLabel/readLabel.vue
index 026eaf0d0d5334114cfd67dfc7eb71ce0a60aad6..81e7321c0fabf6f68c3068530fa3fb752ea4d1f4 100644
--- a/pages/readLabel/readLabel.vue
+++ b/pages/readLabel/readLabel.vue
@@ -1,5 +1,13 @@
 <template>
 	<view>
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="我的标签" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<!-- 头部 -->
 		<view class="topall">
 			<view class="top">
@@ -32,6 +40,9 @@
 	export default {
 		data() {
 			return {
+				background: {
+					background: "#6C40F3",
+				},
 				openId:"1",//暂时
 				info:[],//接收的数据
 				color:[
diff --git a/pages/readLabel/readLabelNew.vue b/pages/readLabel/readLabelNew.vue
index fb40dc2ee22ea95d6c8e011b6513e7d8e82a7fac..9d8351ac0849b990fab1aeb8bf59d24dbc8672eb 100644
--- a/pages/readLabel/readLabelNew.vue
+++ b/pages/readLabel/readLabelNew.vue
@@ -1,5 +1,13 @@
 <template>
 	<view class="all">
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="添加标签" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<!-- 头部 -->
 		<view class="topall">
 			<view class="top">
@@ -24,6 +32,9 @@
 	export default {
 			data() {
 				return {
+					background: {
+						background: "#6C40F3",
+					},
 					bg:[], //标签背景颜色 "#ffffff",
 					tags: [],//标签几号
 					arr: [], //判断是否可以选择
diff --git a/pages/sousuo/Gzhu.vue b/pages/sousuo/Gzhu.vue
index 9200444968da171fffe106fda49d0d09e8058efd..1cac1f2d69af053945791e936ef13397040f1297 100644
--- a/pages/sousuo/Gzhu.vue
+++ b/pages/sousuo/Gzhu.vue
@@ -1,36 +1,24 @@
 <template>
-	<view> 
-	<!-- #ifdef APP-PLUS -->
-			<view class="list1">
-				<image class="im" src="../../static/images/me_blue.png" ></image>
-				<view class="tabs">
-					<view class="tr">
+	<view>
+		<view class="list1" v-if="message !== undefined && message.length > 0">
+			<image class="im" src="/static/images/me_blue.png"></image>
+			<view class="tabs">
+				<view class="tr">
 					<view class="tit">爱读书的</view>
 					<view class="btn">LV11</view>
 					<view class="te">书圣</view>
-					<image class="imag" src="../../static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
-					</view>
-					<view class="tr">
+					<image class="imag" src="/static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
 				</view>
+				<view class="tr">
 				</view>
 			</view>
-	<!-- #endif -->
-		<!-- #ifdef MP-WEIXIN -->
-				<view class="list2">
-					<image class="im" src="../../static/images/me_blue.png" ></image>
-					<view class="tabs">
-						<view class="t">
-						<view class="tit">爱读书的</view>
-						<view class="btn">LV11</view>
-						<view class="te">书圣</view>
-						<image class="imag" src="../../static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
-						</view>
-					</view>
-				</view>
-		<!-- #endif -->
+		</view>
+		<view v-if="message == undefined || message.length <= 0">
+			<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
+				暂时没有读者关注该书籍哦~
+			</view>
 		</view>
 	</view>
-	
 </template>
 
 <script>
@@ -40,45 +28,58 @@
 				// ShowHidden:false,
 			}
 		},
+		props: {
+			// 关列表
+			message: {
+				type: Array,
+				default () {
+					return {}
+				}
+			},
+		},
 		methods: {
-			
+
 		},
 	}
 </script>
 
 <style>
-	.tit1{
-		margin: 30rpx 55rpx; 
+	.tit1 {
+		margin: 30rpx 55rpx;
 		width: 80rpx;
 	}
-	.blue{
+
+	.blue {
 		color: #007AFF;
 		border-bottom: 2rpx solid #00AAFF;
 	}
-	.list{
+
+	.list {
 		/* margin-left: -370rpx; */
 		height: 120rpx;
 		display: flex;
 	}
-	.tit{
+
+	.tit {
 		margin: 30rpx -10rpx;
 		margin-top: 50rpx;
 		font-size: 35rpx;
-		font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif ;
+		font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
 		color: #333333;
 		width: 160rpx;
 		height: 60rpx;
 	}
-	
+
 	.list1 {
 		/* margin-left: -370rpx; */
 		height: 130rpx;
 		margin-top: 10rpx;
 		width: 100%;
 		border-bottom: 1rpx solid #F1F1F1;
-		border-top:1rpx solid #F1F1F1 ;
+		border-top: 1rpx solid #F1F1F1;
 		display: flex;
 	}
+
 	.list2 {
 		height: 150rpx;
 		/* margin-top: 10rpx; */
@@ -88,23 +89,28 @@
 		/* border-top:3rpx solid #F1F1F1 ; */
 		display: flex;
 	}
+
 	.im {
 		margin: 40rpx 40rpx;
 		width: 80rpx;
 		height: 80rpx;
 		border-radius: 50%;
 	}
+
 	.imag {
 		margin-left: 270rpx;
 		margin-top: 60rpx;
 	}
-	.tr{
+
+	.tr {
 		display: flex;
 	}
-	.t{
+
+	.t {
 		display: flex;
 	}
-	.btn{
+
+	.btn {
 		width: 45rpx;
 		height: 22rpx;
 		font-size: 15rpx;
@@ -113,15 +119,15 @@
 		border-radius: 15%;
 		margin: 15rpx 20rpx;
 		margin-top: 60rpx;
-		border:1px solid #F0AD4E;
+		border: 1px solid #F0AD4E;
 	}
-	
+
 	.tex {
 		font-size: 25rpx;
 		margin-top: -40rpx;
 		color: #808080;
 	}
-	
+
 	.text {
 		height: 1rpx;
 		width: 250rpx;
@@ -129,6 +135,7 @@
 		color: #555555;
 		margin-top: 10rpx;
 	}
+
 	.text1 {
 		height: 1rpx;
 		/* width: 250rpx; */
@@ -137,17 +144,19 @@
 		color: #555555;
 		margin-top: 10rpx;
 	}
+
 	/* .tabs{
 		width: 550rpx;
 	} */
-	.te{
+	.te {
 		font-size: 25rpx;
 		font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
 		color: #F0AD4E;
 		margin: 30rpx -10rpx;
 		margin-top: 56rpx;
 	}
-	.li{
+
+	.li {
 		display: flex;
 	}
 </style>
diff --git a/pages/sousuo/Hyou.vue b/pages/sousuo/Hyou.vue
index 1e90ae610e84188d510165b3446fba810a9c7ae0..3a68cdce3f98e462db86a293f837fd790bc46ced 100644
--- a/pages/sousuo/Hyou.vue
+++ b/pages/sousuo/Hyou.vue
@@ -1,36 +1,25 @@
 <template>
-	<view> 
-	<!-- #ifdef APP-PLUS -->
-			<view class="list1">
-				<image class="im" src="../../static/images/me_blue.png" ></image>
-				<view class="tabs">
-					<view class="tr">
+	<view>
+		<view class="list1" v-if="message !== undefined && message.length > 0">
+			<image class="im" src="/static/images/me_blue.png"></image>
+			<view class="tabs">
+				<view class="tr">
 					<view class="tit">爱读书的</view>
 					<view class="btn">LV11</view>
 					<view class="te">书圣</view>
-					<image class="imag" src="../../static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
-					</view>
-					<view class="tr">
+					<image class="imag" src="/static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
 				</view>
+				<view class="tr">
 				</view>
 			</view>
-	<!-- #endif -->
-		<!-- #ifdef MP-WEIXIN -->
-				<view class="list2">
-					<image class="im" src="../../static/images/me_blue.png" ></image>
-					<view class="tabs">
-						<view class="t">
-						<view class="tit">爱读书的</view>
-						<view class="btn">LV11</view>
-						<view class="te">书圣</view>
-						<image class="imag" src="../../static/images/double_right_arrow.png" style="width: 20rpx; height: 20rpx;"></image>
-						</view>
-					</view>
-				</view>
-		<!-- #endif -->
+		</view>
+		<view v-if="message == undefined || message.length <= 0">
+			<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
+				暂时没有该类书籍的好友哦~
+			</view>
 		</view>
 	</view>
-	
+
 </template>
 
 <script>
@@ -41,44 +30,47 @@
 			}
 		},
 		methods: {
-			
+
 		},
 	}
 </script>
 
 <style>
-/* 	.tit1{
-		margin: 30rpx 55rpx; 
+	/* 	.tit1{
+		margin: 30rpx 55rpx;
 		width: 80rpx;
 	} */
-	.blue{
+	.blue {
 		color: #007AFF;
 		border-bottom: 2rpx solid #00AAFF;
 	}
-	.list{
+
+	.list {
 		/* margin-left: -370rpx; */
 		height: 120rpx;
 		display: flex;
 	}
-	.tit{
+
+	.tit {
 		margin: 30rpx -10rpx;
 		margin-top: 50rpx;
 		font-size: 35rpx;
-		font-family:'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif ;
+		font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
 		color: #333333;
 		width: 160rpx;
 		height: 60rpx;
 	}
-	
+
 	.list1 {
 		/* margin-left: -370rpx; */
 		height: 130rpx;
 		margin-top: 10rpx;
 		width: 100%;
 		border-bottom: 1rpx solid #F1F1F1;
-		border-top:1rpx solid #F1F1F1 ;
+		border-top: 1rpx solid #F1F1F1;
 		display: flex;
 	}
+
 	.list2 {
 		height: 150rpx;
 		/* margin-top: 10rpx; */
@@ -88,23 +80,28 @@
 		/* border-top:3rpx solid #F1F1F1 ; */
 		display: flex;
 	}
+
 	.im {
 		margin: 40rpx 40rpx;
 		width: 80rpx;
 		height: 80rpx;
 		border-radius: 50%;
 	}
+
 	.imag {
 		margin-left: 270rpx;
 		margin-top: 60rpx;
 	}
-	.tr{
+
+	.tr {
 		display: flex;
 	}
-	.t{
+
+	.t {
 		display: flex;
 	}
-	.btn{
+
+	.btn {
 		width: 45rpx;
 		height: 22rpx;
 		font-size: 15rpx;
@@ -113,15 +110,15 @@
 		border-radius: 15%;
 		margin: 15rpx 20rpx;
 		margin-top: 60rpx;
-		border:1px solid #F0AD4E;
+		border: 1px solid #F0AD4E;
 	}
-	
+
 	.tex {
 		font-size: 25rpx;
 		margin-top: -40rpx;
 		color: #808080;
 	}
-	
+
 	.text {
 		height: 1rpx;
 		width: 250rpx;
@@ -129,6 +126,7 @@
 		color: #555555;
 		margin-top: 10rpx;
 	}
+
 	.text1 {
 		height: 1rpx;
 		/* width: 250rpx; */
@@ -137,17 +135,19 @@
 		color: #555555;
 		margin-top: 10rpx;
 	}
+
 	/* .tabs{
 		width: 550rpx;
 	} */
-	.te{
+	.te {
 		font-size: 25rpx;
 		font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
 		color: #F0AD4E;
 		margin: 30rpx -10rpx;
 		margin-top: 56rpx;
 	}
-	.li{
+
+	.li {
 		display: flex;
 	}
 </style>
diff --git a/pages/sousuo/Sbook.vue b/pages/sousuo/Sbook.vue
index 88a3a7a5d7c2ad3f635db2f64c2c57d3cc68bb9e..e5eb19fc6080faebe47c90f6f86ad3f04d9c7146 100644
--- a/pages/sousuo/Sbook.vue
+++ b/pages/sousuo/Sbook.vue
@@ -1,95 +1,89 @@
 <template>
 	<view>
-			<view class="list1">
-				<!-- #ifdef APP-PLUS -->
-				<image class="im" src="../../static/images/封面.png" ></image>
-				<!-- #endif -->
-				<!-- #ifdef MP-WEIXIN -->
-				<image class="im1" src="../../static/images/封面.png" ></image>
-				<!-- #endif -->
-				<view class="tabs">
-					<view class="li">
-					<view class="name">书名....</view>
-					<navigator url="../Bdetail/Bdetail">
-					</navigator>
-					</view>
-					<view class="tex">作者 ：哈哈</view>
-					<view class="tex">出版社 ：华科出版社</view>
-					<view class="tex1"></view>
-				</view>
+		<view class="liste" v-if="message != undefined || message.length > 0">
+			<image class="imae1" :src="message.picturePath" onerror="/static/images/temporary.jpg" @error="imageError(message)"></image>
+			<view>
+				<navigator :url="'../Bdetail/Bdetail?isbn=' + message.isbn">
+					<view class="title_name">{{ message.bookName }}</view>
+					<view class="text_tex">作者 ：{{ message.author }}</view>
+					<view class="text_tex">出版社 ：{{ message.publisher }}</view>
+				</navigator>
 			</view>
+		</view>
+		<view v-if="message == undefined || message.length <= 0">
+			<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
+				暂时没有该类书籍哦,换换其它的吧~
+			</view>
+		</view>
 	</view>
 </template>
 
 <script>
 	export default {
 		data() {
-			return {
-			}
+			return {};
+		},
+		props: {
+			// 书籍信息
+			message: {
+				type: Object,
+				default () {
+					return {}
+				}
+			},
 		},
 		methods: {
+			//图片加载失败
+			imageError(index) {
+				let that = this;
+				index.picturePath = "/static/images/temporary.jpg"
+			}
 		},
-	}
+	};
 </script>
 
 <style>
-	.tit1{
-		margin: 30rpx 55rpx; 
-		width: 80rpx;
-	}
-	.blue{
-		color: #007AFF;
-		border-bottom: 2rpx solid #00AAFF;
-	}
-
-	
-	.list1 {
-		height: 300rpx;
-		width: 100%;
-		/* margin-left: -200rpx; */
-		border-bottom: 1rpx solid #C8C7CC;
+	.liste {
+		height: 330rpx;
+		border-bottom: 1rpx solid #c8c7cc;
 		display: flex;
 	}
-	
-	.im{
-		margin: 40rpx 40rpx;
-		/* width: 40%; */
-		width: 150rpx;
-		height: 200rpx;
-	}
-	.im1{
+
+	.imae1 {
 		margin: 40rpx 40rpx;
-		width: 150rpx;
-		height: 200rpx;
-	}
-	.name {
-		width: 30%;
-		margin-top: 30rpx;
-		font-size: 38rpx;
+		width: 200rpx;
+		height: 250rpx;
 	}
-	
-	.tex {
-		font-size: 28rpx;
-		margin-top: 10rpx;
-		color: #808080;
+
+	.title_name {
+		width: 400rpx;
+		margin-left: 10rpx;
+		margin-top: 50rpx;
+		font-size: 40rpx;
+		display: -webkit-box;
+		word-break: break-all;
+		text-overflow: ellipsis;
+		/*自适应字体*/
+		overflow: hidden;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 2;
+		/*设置 需要显示的行数*/
 	}
-	
-	.tex1 {
-		height: 1rpx;
+
+	.text_tex {
 		width: 450rpx;
-		margin-top: 15rpx;
-		/* background-color: #C0C0C0; */
-	}
-	.tabs{
-		width: 500rpx;
-	}
-	.te{
+		/* height: 30rpx; */
+		text-align: left;
 		font-size: 28rpx;
-		color: #8F8F94;
-		margin-left: 300rpx;
-		margin-top: 35rpx;
-	}
-	.li{
-		display: flex;
+		margin-top: 15rpx;
+		color: #808080;
+		display: -webkit-box;
+		word-break: break-all;
+		text-overflow: ellipsis;
+		/*自适应字体*/
+		overflow: hidden;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 1;
+		/*设置 需要显示的行数*/
 	}
 </style>
diff --git a/pages/sousuo/Sping.vue b/pages/sousuo/Sping.vue
index 88a3a7a5d7c2ad3f635db2f64c2c57d3cc68bb9e..78983e95c9cadc2d00e9f882a852fc1cb2f940ec 100644
--- a/pages/sousuo/Sping.vue
+++ b/pages/sousuo/Sping.vue
@@ -1,95 +1,83 @@
 <template>
-	<view>
-			<view class="list1">
-				<!-- #ifdef APP-PLUS -->
-				<image class="im" src="../../static/images/封面.png" ></image>
-				<!-- #endif -->
-				<!-- #ifdef MP-WEIXIN -->
-				<image class="im1" src="../../static/images/封面.png" ></image>
-				<!-- #endif -->
-				<view class="tabs">
-					<view class="li">
-					<view class="name">书名....</view>
-					<navigator url="../Bdetail/Bdetail">
-					</navigator>
-					</view>
-					<view class="tex">作者 ：哈哈</view>
-					<view class="tex">出版社 ：华科出版社</view>
-					<view class="tex1"></view>
-				</view>
-			</view>
-	</view>
+  <view>
+    <view class="liste" v-if="message !== undefined && message.length > 0">
+    	<image class="imae1" :src="message.picturePath" @error="imageError(message)"></image>
+    	<view>
+    		<navigator :url="'../Bdetail/Bdetail?isbn=' + message.isbn">
+    			<view class="title_name">{{ message.bookName }}</view>
+    			<view class="text_tex">作者 ：{{ message.author }}</view>
+    			<view class="text_tex">出版社 ：{{ message.publisher }}</view>
+    		</navigator>
+    	</view>
+    </view>
+    <view v-if="message == undefined || message.length <= 0">
+    	<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
+    		暂时没有该类书籍的书评哦~
+    	</view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-			}
-		},
-		methods: {
-		},
-	}
+export default {
+  data() {
+    return {};
+  },
+  props: {
+  	// 书评信息
+  	message: {
+  		type: Array,
+  		default () {
+  			return {}
+  		}
+  	},
+  },
+  methods: {},
+};
 </script>
 
 <style>
-	.tit1{
-		margin: 30rpx 55rpx; 
-		width: 80rpx;
-	}
-	.blue{
-		color: #007AFF;
-		border-bottom: 2rpx solid #00AAFF;
-	}
-
-	
-	.list1 {
-		height: 300rpx;
-		width: 100%;
-		/* margin-left: -200rpx; */
-		border-bottom: 1rpx solid #C8C7CC;
+	.liste {
+		height: 330rpx;
+		border-bottom: 1rpx solid #c8c7cc;
 		display: flex;
 	}
-	
-	.im{
-		margin: 40rpx 40rpx;
-		/* width: 40%; */
-		width: 150rpx;
-		height: 200rpx;
-	}
-	.im1{
+
+	.imae1 {
 		margin: 40rpx 40rpx;
-		width: 150rpx;
-		height: 200rpx;
-	}
-	.name {
-		width: 30%;
-		margin-top: 30rpx;
-		font-size: 38rpx;
+		width: 200rpx;
+		height: 250rpx;
 	}
-	
-	.tex {
-		font-size: 28rpx;
-		margin-top: 10rpx;
-		color: #808080;
+
+	.title_name {
+		width: 400rpx;
+		margin-left: 10rpx;
+		margin-top: 50rpx;
+		font-size: 40rpx;
+		display: -webkit-box;
+		word-break: break-all;
+		text-overflow: ellipsis;
+		/*自适应字体*/
+		overflow: hidden;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 2;
+		/*设置 需要显示的行数*/
 	}
-	
-	.tex1 {
-		height: 1rpx;
+
+	.text_tex {
 		width: 450rpx;
-		margin-top: 15rpx;
-		/* background-color: #C0C0C0; */
-	}
-	.tabs{
-		width: 500rpx;
-	}
-	.te{
+		/* height: 30rpx; */
+		text-align: left;
 		font-size: 28rpx;
-		color: #8F8F94;
-		margin-left: 300rpx;
-		margin-top: 35rpx;
-	}
-	.li{
-		display: flex;
+		margin-top: 15rpx;
+		color: #808080;
+		display: -webkit-box;
+		word-break: break-all;
+		text-overflow: ellipsis;
+		/*自适应字体*/
+		overflow: hidden;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 1;
+		/*设置 需要显示的行数*/
 	}
 </style>
diff --git a/pages/sousuo/book.vue b/pages/sousuo/book.vue
index 578871402ec2dd5b71a74c3d9670653e38c29d4e..04ac8f45217622e2bc29964ea4a0e9007c50e163 100644
--- a/pages/sousuo/book.vue
+++ b/pages/sousuo/book.vue
@@ -1,90 +1,126 @@
 <template>
-	<view>
-		<view class="tr3"></view>
-		<view class="tab1" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 60rpx; height: 60rpx;"></image>
-			<view class="tit1">书易搜索</view>
-			
-			</view>
-		<view class="tr"></view>
-			<view class="list">
-				<view :class="['tit',index===1&&'blue']" @click="index=1">图书</view>
-				<view :class="['tit',index===2&&'blue']" @click="index=2">书评</view>
-				<view :class="['tit',index===3&&'blue']" @click="index=3">关注</view>
-				<view :class="['tit',index===4&&'blue']" @click="index=4">好友</view>
-			</view>
-		<!-- <view class="tr"></view> -->
-		<Sbook v-if="index===1"/>
-		<Sping v-if="index===2"/>
-		<Gzhu v-if="index===3"/>
-		<Hyou v-if="index===4"/>
-		<view class="tr"></view>
-	</view>
+  <view>
+    <view class="list">
+      <view :class="['tit', index === 1 && 'blue']" @click="messageInput('1')">图书</view>
+      <view :class="['tit', index === 2 && 'blue']" @click="messageInput('2')">书评</view>
+      <view :class="['tit', index === 3 && 'blue']" @click="messageInput('3')">关注</view> 
+      <view :class="['tit', index === 4 && 'blue']" @click="messageInput('4')">好友</view>
+    </view>
+    <!-- <view class="tr"></view> -->
+    <Sbook :message="bookDetail" v-if="index === 1" />
+    <Sping :message="bookReviewList" v-if="index === 2" />
+    <Gzhu  :message="attentionList" v-if="index === 3" />
+    <Hyou  :message="friendList" v-if="index === 4" />
+    <view class="tr"></view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				index: 1
+let app = getApp();
+export default {
+  data() {
+    return {
+      index: 1,
+	  isbn: "", 
+	  bookDetail: {},	//书籍内容
+	  bookReviewList: [],	//书评列表
+	  attentionList: [],	//关注列表
+	  friendList: [],	//好友列表
+    };
+  },
+  onLoad(e) {
+	let that = this;
+	that.isbn = e.isbn;
+	console.log(that.isbn)
+	that.getBookByISBN(e.isbn)
+  },
+  methods: {
+	messageInput(e){
+		let that = this;
+		if(e==='1'){
+			that.index = 1;
+			// console.log(that.bookDetail)
+			if(that.bookDetail.isbn===undefined ||that.bookDetail.length < 0){
+				that.getBookByISBN(that.isbn);
 			}
-		},
-		methods: {
-back(){
-	uni.navigateBack({
-		delta:1
-	})
-}
+		}else if(e==='2'){
+			that.index = 2;
+		}else if(e==='3'){
+			that.index = 3;
+		}else if(e==='4'){
+			that.index = 4;
+		}
+	},
+	//根据ISBN获取图书详情
+	async getBookByISBN(e) {
+		var that = this;
+		var params = {
+			url: "book?isbn=" + e,
+			type: 'GET'
 		}
-	}
+		const res = await app.myRequest(params);
+		console.log("book:", res);
+		that.bookDetail = res.content[0];
+	},
+	//图片加载失败
+	imageError(index) {
+		let that = this;
+		index.picturePath = "/static/images/temporary.jpg"
+	},
+    back() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+  },
+};
 </script>
 
 <style>
-	.tr3{
-		height: 70rpx;
-		background-color:#6C40F3;
-	}
-	.tab1 {
-		/* margin-top: 79rpx; */
-		background-color:#6C40F3;
-		display: flex;
-	}
-
-	.tit1 {
-		margin-top: 19rpx;
-		/* color: #555555; */
-		margin-left: 215rpx;
-		font-size: 45rpx;
-		color: #FFFFFF;
-		width: 40%;
-	}
+.tr3 {
+  height: 70rpx;
+  background-color: #6c40f3;
+}
+.tab1 {
+  /* margin-top: 79rpx; */
+  background-color: #6c40f3;
+  display: flex;
+}
 
-	.back {
-		margin-top: 8rpx;
-		margin-left: 10rpx;
-	}
+.tit1 {
+  margin-top: 19rpx;
+  /* color: #555555; */
+  margin-left: 215rpx;
+  font-size: 45rpx;
+  color: #ffffff;
+  width: 40%;
+}
 
-	.tr {
-		height: 10rpx;
-		background-color: #F8F8F8;
-	}
+.back {
+  margin-top: 8rpx;
+  margin-left: 10rpx;
+}
 
-	.list{
-		align-items: center;
-		height: 90rpx;
-		display: flex;
-		width: 100%;
-		border-bottom: 2rpx solid #dcdcdc;
-	}
-	.tit{
-		margin: 30rpx 56rpx;
-		font-size: 36rpx;
+.tr {
+  height: 10rpx;
+  background-color: #f8f8f8;
+}
 
-		color: #333333;
-	}
-	.blue{
-		color: #6C40F3;
-		/* margin-top: 5rpx; */
-		border-bottom: 4rpx solid #6C40F3;
-	}
+.list {
+  align-items: center;
+  height: 90rpx;
+  display: flex;
+  width: 100%;
+  border-bottom: 2rpx solid #dcdcdc;
+}
+.tit {
+  margin: 30rpx 56rpx;
+  font-size: 36rpx;
+  color: #333333;
+}
+.blue {
+  color: #6c40f3;
+  /* margin-top: 5rpx; */
+  border-bottom: 4rpx solid #6c40f3;
+}
 </style>
diff --git a/pages/sousuo/fujin.vue b/pages/sousuo/fujin.vue
index 9c7b3adc50962e8e32ef3972925c2538e29017ac..6eaa188dd1bfdf3bcdd77080c51ced7e67871bc9 100644
--- a/pages/sousuo/fujin.vue
+++ b/pages/sousuo/fujin.vue
@@ -1,159 +1,232 @@
 <template>
-	<view>
-		<!-- 导航栏 -->
-		<u-navbar zhead="65rpx" height="44" title="附近的书" title-color="white" title-size="40" :background="background" back-icon-color="white"
-		 back-icon-size="50">
-			<view class="navbar-right" slot="right">
-				<view class="right_list" style="height: 80rpx;width: 80rpx;">
-					<image style="height: 80rpx;width: 80rpx;" src="../../static/images/搜索icon@2x.png"></image>
-				</view>
-			</view>
-		</u-navbar>
-		<view style="height: 65rpx"></view>
-		<!-- 范围 -->
-		<view class="list">
-			<view data-num="1" @click="getNearbyNum" class="td" :class="[num == 1?'text-color':'']">1KM以内</view>
-			<view data-num="1.5" @click="getNearbyNum" class="td" :class="[num == 1.5?'text-color':'']">1.5KM以内</view>
-			<view data-num="2" @click="getNearbyNum" class="td" :class="[num == 2?'text-color':'']">2KM以内</view>
-			<!-- <navigator url="fujinB"> -->
-			<view class="td">同城</view>
-			<!-- </navigator> -->
-		</view>
-		<view>
-			<map :data-name='markers' :longitude="longitude" :latitude="latitude" @markertap="go" @tap="total" show-compass="true"
-			 show-scale="true" show-location="true" :markers="markers" :polyline="polyline" :style="'width:'+ width+'px;height:'+height+'px;'">
-				<view class="book-back" v-if="sense == 1">
-					<cover-view class="title">
-						<cover-view class="top">
-							<cover-image @click="total" class="topImage" src="/static/images/top1.png"></cover-image>
-						</cover-view>
-						<cover-view class="dw">
-							<cover-view class="weizhi">
-								<cover-image class="imgs" src="/static/images/dh.png"></cover-image>
-								<cover-view class="dimin">书籍所在位置：</cover-view>
-								<cover-view class="xianshi"></cover-view>
-							</cover-view>
-						</cover-view>
-						<cover-view class="xinxi">
-							<cover-view class="nei">
-								<cover-image class="tupian" :src="marker.picturePath"></cover-image>
-							</cover-view>
-							<cover-view class="book-body">
-								<cover-view class="book-name">书名：{{marker.bookName}}</cover-view>
-								<cover-view class="book-name1">作者：{{marker.author}}</cover-view>
-								<cover-view class="book-name1">出版社：{{marker.publisher}}</cover-view>
-								<cover-view class="book-name1">所在图书馆：{{marker.library}}</cover-view>
-								<cover-view class="book-name1">是否外借：</cover-view>
-								<cover-view class="book-add" @click="addFriend" :data-name="marker">预约</cover-view>
-							</cover-view>
-						</cover-view>
-					</cover-view>
-				</view>
-			</map>
-		</view>
-	</view>
+  <view>
+    <!-- 导航栏 -->
+    <u-navbar
+      zhead="65rpx"
+      height="44"
+      title="附近的书"
+      title-color="white"
+      title-size="40"
+      :background="background"
+      back-icon-color="white"
+      back-icon-size="50"
+    >
+      <view class="navbar-right" slot="right">
+        <view class="right_list" style="height: 80rpx; width: 80rpx">
+          <image
+            style="height: 80rpx; width: 80rpx;"
+            src="/static/images/search_icon2x.png"
+          ></image>
+        </view>
+      </view>
+    </u-navbar>
+    <!-- <view style="height: 65rpx"></view> -->
+    <!-- 范围 -->
+    <view class="list">
+      <view
+        data-num="1"
+        @click="getNearbyNum"
+        class="td"
+        :class="[num == 1 ? 'text-color' : '']"
+        >1KM以内</view
+      >
+      <view
+        data-num="1.5"
+        @click="getNearbyNum"
+        class="td"
+        :class="[num == 1.5 ? 'text-color' : '']"
+        >1.5KM以内</view
+      >
+      <view
+        data-num="2"
+        @click="getNearbyNum"
+        class="td"
+        :class="[num == 2 ? 'text-color' : '']"
+        >2KM以内</view
+      >
+      <!-- <navigator url="fujinB"> -->
+      <view class="td">同城</view>
+      <!-- </navigator> -->
+    </view>
+    <view>
+      <map
+        :data-name="markers"
+        :longitude="longitude"
+        :latitude="latitude"
+        @markertap="go"
+        @tap="total"
+        show-compass="true"
+        show-scale="true"
+        show-location="true"
+        :markers="markers"
+        :polyline="polyline"
+        :style="'width:' + width + 'px;height:' + height + 'px;'"
+      >
+        <view class="book-back" v-if="sense == 1">
+          <cover-view class="title">
+            <cover-view class="top">
+              <cover-image
+                @click="total"
+                class="topImage"
+                src="/static/images/top1.png"
+              ></cover-image>
+            </cover-view>
+            <cover-view class="dw">
+              <cover-view class="weizhi">
+                <cover-image
+                  class="imgs"
+                  src="/static/images/dh.png"
+                ></cover-image>
+                <cover-view class="dimin">书籍所在位置：</cover-view>
+                <cover-view class="xianshi"></cover-view>
+              </cover-view>
+            </cover-view>
+            <cover-view class="xinxi">
+              <cover-view class="nei">
+                <cover-image
+                  class="tupian"
+                  :src="marker.picturePath"
+                ></cover-image>
+              </cover-view>
+              <cover-view class="book-body">
+                <cover-view class="book-name"
+                  >书名：{{ marker.bookName }}</cover-view
+                >
+                <cover-view class="book-name1"
+                  >作者：{{ marker.author }}</cover-view
+                >
+                <cover-view class="book-name1"
+                  >出版社：{{ marker.publisher }}</cover-view
+                >
+                <cover-view class="book-name1"
+                  >所在图书馆：{{ marker.library }}</cover-view
+                >
+                <cover-view class="book-name1">是否外借：</cover-view>
+                <cover-view
+                  class="book-add"
+                  @click="addFriend"
+                  :data-name="marker"
+                  >预约</cover-view
+                >
+              </cover-view>
+            </cover-view>
+          </cover-view>
+        </view>
+      </map>
+    </view>
+  </view>
 </template>
 
 <script>
-	let app = getApp();
-	export default {
-		data() {
-			return {
-				background: {
-					background: '#6C40F3'
-				},
-				num: 1,	//默认选择
-				width: '', //屏幕宽度
-				height: '', //屏幕高度
-				ployline: [], //路线渲染
-				latitude: 36.309051, //当前坐标纬度
-				longitude: 120.396592, //当前坐标经度
-				now_Location: { //当前坐标
-					latitude: '',
-					longitude: '',
-				},
-				end_Location: { //目的地坐标
-					latitude: '',
-					longitude: '',
-				},
-				now_Duration: {}, //剩余时间
-				now_Distance: {}, //剩余距离
-				sense: 0, //弹出框
-				marker: {}, //当前导航信息
-				name: '', //当前地址
-				//标记点
-				markers: [],
-				//初始化标记点
-				markers_new: [{
-					iconPath: "/static/images/dw.png",
-					id: 0,
-					latitude: "26.46203",
-					longitude: "106.67001",
-					width: 40,
-					height: 40,
-					callout: {
-						content: "书本名",
-						borderWidth: "2rpx",
-						fontSize: "35rpx",
-						display: "BYCLICK"
-					},
-					bookName: '', //书本名称
-					realBookId: '', //书本id
-					picturePath: '', //书本图片
-					author: '', //作者
-					publisher: '', //出版社
-					library: '', //图书馆
-				}],
-			}
-		},
-		onLoad: function(options) {
-			console.log("options:", options);
-			var that = this;
-			// 获取屏幕宽高
-			that.width = wx.getSystemInfoSync().windowWidth;
-			that.height = wx.getSystemInfoSync().windowHeight;
-			uni.getLocation({
-				type: 'gcj02', // 默认为 wgs84 返回 gps 坐标，gcj02 返回可用于 wx.openLocation 的坐标
-				success: function(res) {
-					console.log('当前位置数据Object如下：')
-					console.log(res)
-					/** 开始同步数据 */
-					// that.latitude = res.latitude
-					// that.longitude = res.longitude
-					that.getNearbyBook(120.396592, 36.309051, 1);
-				}
-			})
-		},
-		methods: {
-
-			//点击公里数获取范围内的图书
-			getNearbyNum(e) {
-				var that = this;
-				var num = e.currentTarget.dataset.num;
-				var longitude = that.longitude;
-				var latitude = that.latitude;
-				that.num = num;
-				that.getNearbyBook(longitude, latitude, num);
-			},
-			/**
-			 * 根据当前位置获取附近的书
-			 * @param {Object} longitude 经度
-			 * @param {Object} latitude  纬度
-			 * @param {Object} distance 范围公里数
-			 */
-			async getNearbyBook(longitude, latitude, distance) {
-				var that = this;
-				var BookList = [];
-				var params = {
-					url: "realBook/getBookByMap",
-					type: 'POST',
-					data: {
-						longitude: longitude,
-						latitude: latitude,
-						distance: distance
-					}
-				}
-				/**
+let app = getApp();
+export default {
+  data() {
+    return {
+      background: {
+        background: "#6C40F3",
+      },
+      num: 1, //默认选择
+      width: "", //屏幕宽度
+      height: "", //屏幕高度
+      ployline: [], //路线渲染
+      latitude: 36.309051, //当前坐标纬度
+      longitude: 120.396592, //当前坐标经度
+      now_Location: {
+        //当前坐标
+        latitude: "",
+        longitude: "",
+      },
+      end_Location: {
+        //目的地坐标
+        latitude: "",
+        longitude: "",
+      },
+      now_Duration: {}, //剩余时间
+      now_Distance: {}, //剩余距离
+      sense: 0, //弹出框
+      marker: {}, //当前导航信息
+      name: "", //当前地址
+      //标记点
+      markers: [],
+      //初始化标记点
+      markers_new: [
+        {
+          iconPath: "/static/images/dw.png",
+          id: 0,
+          latitude: "26.46203",
+          longitude: "106.67001",
+          width: 40,
+          height: 40,
+          callout: {
+            content: "书本名",
+            borderWidth: "2rpx",
+            fontSize: "35rpx",
+            display: "BYCLICK",
+          },
+          bookName: "", //书本名称
+          realBookId: "", //书本id
+          picturePath: "", //书本图片
+          author: "", //作者
+          publisher: "", //出版社
+          library: "", //图书馆
+        },
+      ],
+    };
+  },
+  onLoad: function (options) {
+    console.log("options:", options);
+    var that = this;
+    // 获取屏幕宽高
+    that.width = wx.getSystemInfoSync().windowWidth;
+    that.height = wx.getSystemInfoSync().windowHeight;
+    uni.getLocation({
+      type: "gcj02", // 默认为 wgs84 返回 gps 坐标，gcj02 返回可用于 wx.openLocation 的坐标
+      success: function (res) {
+        console.log("当前位置数据Object如下：");
+        console.log(res);
+        /** 开始同步数据 */
+        that.latitude = res.latitude
+        that.longitude = res.longitude
+        that.getNearbyBook(that.latitude, that.longitude, 1);
+      },
+    });
+  },
+  methods: {
+    //点击公里数获取范围内的图书
+    getNearbyNum(e) {
+	  uni.showLoading({
+	      title: '加载中'
+	  });
+	  setTimeout(function () {
+	      uni.hideLoading();
+	  }, 8000);
+      var that = this;
+      var num = e.currentTarget.dataset.num;
+      var longitude = that.longitude;
+      var latitude = that.latitude;
+      that.num = num;
+      that.getNearbyBook(longitude, latitude, num);
+	  uni.hideLoading();
+    },
+    /**
+     * 根据当前位置获取附近的书
+     * @param {Object} longitude 经度
+     * @param {Object} latitude  纬度
+     * @param {Object} distance 范围公里数
+     */
+    async getNearbyBook(longitude, latitude, distance) {
+      var that = this;
+      var BookList = [];
+      var params = {
+        url: "realBook/getBookByMap",
+        type: "POST",
+        data: {
+          longitude: longitude,
+          latitude: latitude,
+          distance: distance,
+        },
+      };
+      /**
 				 * iconPath: "/static/images/dw.png",
 					id: 0,
 					latitude: "26.46203",
@@ -167,343 +240,343 @@
 						display: "BYCLICK"
 					}
 				 */
-				BookList = await app.myRequest(params);
-				console.log(BookList);
-				if (BookList !== undefined && BookList.length > 0) {
-					for (var i = 0; BookList.length > i; i++) {
-						var marker = {};
-						var callout = {};
-						// markers[i] = that.markers_new[0];
-						marker.iconPath = "/static/images/dw.png";
-						marker.id = i;
-						marker.longitude = BookList[i].longtitude;
-						marker.latitude = BookList[i].latitude;
-						marker.width = 40;
-						marker.height = 40;
-						marker.bookName = BookList[i].book.bookName;
-						marker.realBookId = BookList[i].realBookId;
-						marker.picturePath = BookList[i].book.picturePath;
-						marker.author = BookList[i].book.author;
-						marker.publisher = BookList[i].book.publisher;
-						marker.library = BookList[i].library.name;
-						callout.content = BookList[i].book.bookName;
-						callout.borderWidth = "2rpx";
-						callout.fontSize = "35rpx";
-						callout.display = "BYCLICK";
-						marker.callout = callout;
-						// console.log("wwwww",marker);
-						that.markers.push(marker)
-					}
-					// console.log("hhhhhhh",that.markers);
-				}
-			},
-			/**
-			 * 点击对应的标记点触发
-			 * @param {*} e 
-			 */
-			go(e) {
-				var that = this
-				console.log(e.detail.markerId)
-				var val = e.detail.markerId
-				if (val != null) {
-					console.log("我执行了")
-					that.sense = 1; //显示隐藏标签
-					that.marker = that.markers[val];
-				}
-				console.log("maker：", that.marker);
-				// uni.openLocation({
-				// 	latitude: 36.309051,
-				// 	longitude: 120.396592,
-				// 	success: function(e) {
-				// 		console.log(e);
-				// 	}
-				// });
-				// var point = new plus.maps.Point(120.396592, 36.309051);
-				// plus.maps.Map.reverseGeocode(
-				// 	point, {},
-				// 	function(event) {
-				// 		var address = event.address; // 转换后的地理位置
-				// 		var point = event.coord; // 转换后的坐标信息
-				// 		var coordType = event.coordType; // 转换后的坐标系类型
-				// 		console.log(address, 'address');
-				// 	},
-				// 	function(e) {}
-				// );
-			},
-			/**
-			 * 点击地图触发
-			 */
-			total() {
-				var that = this;
-				that.sense = 0;
-			},
-			/**
-			 * 借阅图书
-			 */
-			addFriend(e) {
-				console.log(e.currentTarget.dataset.name.callout.content);
-				var name = e.currentTarget.dataset.name.callout.content
-				uni.showModal({
-					content: '确定借阅图书吗？',
-					success(res) {
-						if (res.confirm) {
-							console.log('用户点击确定')
-							uni.showToast({
-								title: '借阅成功',
-								type: 'success',
-								duration: 2000
-							})
-						} else if (res.cancel) {
-							console.log('用户点击取消')
-						}
-					},
-					fail(res) {
-						console.log("失败了！")
-					}
-				})
-			},
-			back() {
-				uni.navigateBack({
-					delta: 1
-				})
-			}
-		}
-	}
+      BookList = await app.myRequest(params);
+      console.log(BookList);
+      if (BookList !== undefined && BookList.length > 0) {
+        for (var i = 0; BookList.length > i; i++) {
+          var marker = {};
+          var callout = {};
+          // markers[i] = that.markers_new[0];
+          marker.iconPath = "/static/images/dw.png";
+          marker.id = i;
+          marker.longitude = BookList[i].longtitude;
+          marker.latitude = BookList[i].latitude;
+          marker.width = 40;
+          marker.height = 40;
+          marker.bookName = BookList[i].book.bookName;
+          marker.realBookId = BookList[i].realBookId;
+          marker.picturePath = BookList[i].book.picturePath;
+          marker.author = BookList[i].book.author;
+          marker.publisher = BookList[i].book.publisher;
+          marker.library = BookList[i].library.name;
+          callout.content = BookList[i].book.bookName;
+          callout.borderWidth = "2rpx";
+          callout.fontSize = "35rpx";
+          callout.display = "BYCLICK";
+          marker.callout = callout;
+          // console.log("wwwww",marker);
+          that.markers.push(marker);
+        }
+        // console.log("hhhhhhh",that.markers);
+      }
+    },
+    /**
+     * 点击对应的标记点触发
+     * @param {*} e
+     */
+    go(e) {
+      var that = this;
+      console.log(e.detail.markerId);
+      var val = e.detail.markerId;
+      if (val != null) {
+        console.log("我执行了");
+        that.sense = 1; //显示隐藏标签
+        that.marker = that.markers[val];
+      }
+      console.log("maker：", that.marker);
+      // uni.openLocation({
+      // 	latitude: 36.309051,
+      // 	longitude: 120.396592,
+      // 	success: function(e) {
+      // 		console.log(e);
+      // 	}
+      // });
+      // var point = new plus.maps.Point(120.396592, 36.309051);
+      // plus.maps.Map.reverseGeocode(
+      // 	point, {},
+      // 	function(event) {
+      // 		var address = event.address; // 转换后的地理位置
+      // 		var point = event.coord; // 转换后的坐标信息
+      // 		var coordType = event.coordType; // 转换后的坐标系类型
+      // 		console.log(address, 'address');
+      // 	},
+      // 	function(e) {}
+      // );
+    },
+    /**
+     * 点击地图触发
+     */
+    total() {
+      var that = this;
+      that.sense = 0;
+    },
+    /**
+     * 借阅图书
+     */
+    addFriend(e) {
+      console.log(e.currentTarget.dataset.name.callout.content);
+      var name = e.currentTarget.dataset.name.callout.content;
+      uni.showModal({
+        content: "确定借阅图书吗？",
+        success(res) {
+          if (res.confirm) {
+            console.log("用户点击确定");
+            uni.showToast({
+              title: "借阅成功",
+              type: "success",
+              duration: 2000,
+            });
+          } else if (res.cancel) {
+            console.log("用户点击取消");
+          }
+        },
+        fail(res) {
+          console.log("失败了！");
+        },
+      });
+    },
+    back() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+  },
+};
 </script>
 
 <style>
-	.tab1 {
-		display: flex;
-		background-color: #6C40F3;
-	}
-
-	.tit1 {
-		margin-top: 9rpx;
-		color: #FFFFFF;
-		margin-left: 230rpx;
-		display: flex;
-		font-size: 40rpx;
-		width: 30%;
-	}
-
-	.tit3 {
-		margin-top: 9rpx;
-		color: #FFFFFF;
-		margin-left: 230rpx;
-		display: flex;
-		font-size: 40rpx;
-		width: 40%;
-	}
-
-	.back {
-		margin-top: 18rpx;
-		margin-left: 10rpx;
-	}
-
-	.im {
-		margin-top: 10rpx;
-		margin-left: 200rpx;
-	}
-
-	.im1 {
-		margin-top: 10rpx;
-		margin-left: 40rpx;
-	}
-
-	.list {
-		height: 80rpx;
-		margin-top: 10rpx;
-		display: flex;
-		background-color: #FFFFFF;
-	}
-
-	.td {
-		margin: 20rpx 20rpx;
-		height: 45rpx;
-		width: 22%;
-		font-size: 28rpx;
-		text-align: center;
-		background-color: #FFFFFF;
-		/* width: 20%; */
-
-		/* border-top: 1rpx solid #C0C0C0;
+.tab1 {
+  display: flex;
+  background-color: #6c40f3;
+}
+
+.tit1 {
+  margin-top: 9rpx;
+  color: #ffffff;
+  margin-left: 230rpx;
+  display: flex;
+  font-size: 40rpx;
+  width: 30%;
+}
+
+.tit3 {
+  margin-top: 9rpx;
+  color: #ffffff;
+  margin-left: 230rpx;
+  display: flex;
+  font-size: 40rpx;
+  width: 40%;
+}
+
+.back {
+  margin-top: 18rpx;
+  margin-left: 10rpx;
+}
+
+.im {
+  margin-top: 10rpx;
+  margin-left: 200rpx;
+}
+
+.im1 {
+  margin-top: 10rpx;
+  margin-left: 40rpx;
+}
+
+.list {
+  height: 80rpx;
+  /* margin-top: 10rpx; */
+  display: flex;
+  background-color: #ffffff;
+}
+
+.td {
+  margin: 20rpx 20rpx;
+  height: 45rpx;
+  width: 22%;
+  font-size: 28rpx;
+  text-align: center;
+  background-color: #ffffff;
+  /* width: 20%; */
+
+  /* border-top: 1rpx solid #C0C0C0;
 		border-bottom:1rpx solid #C0C0C0; */
-	}
-
-	.br {
-		height: 30rpx;
-		width: 1rpx;
-		margin-top: 25rpx;
-		background-color: #DFDFDF;
-	}
-
-	.map {
-		/* margin-top: 30rpx; */
-		width: 100%;
-		height: 1400rpx;
-	}
-
-	.book-back {
-		width: 100%;
-		height: 100%;
-		background-color: rgb(0, 0, 0, .5);
-	}
-
-	.title {
-		display: column;
-		width: 100%;
-		height: 550rpx;
-		background-color: white;
-		position: fixed;
-		bottom: 0;
-		/* margin-left: 2%;
+}
+
+.br {
+  height: 30rpx;
+  width: 1rpx;
+  margin-top: 25rpx;
+  background-color: #dfdfdf;
+}
+
+.map {
+  /* margin-top: 30rpx; */
+  width: 100%;
+  height: 1400rpx;
+}
+
+.book-back {
+  width: 100%;
+  height: 100%;
+  background-color: rgb(0, 0, 0, 0.5);
+}
+
+.title {
+  display: column;
+  width: 100%;
+  height: 550rpx;
+  background-color: white;
+  position: fixed;
+  bottom: 0;
+  /* margin-left: 2%;
 		margin-right: 2%;
 		border-radius: 10rpx 10rpx 0 0; */
-	}
-
-	.top {
-		width: 100%;
-		height: 50rpx;
-		line-height: 60rpx;
-		/** 垂直居中 **/
-		text-align: center;
-		/** 水平居中 **/
-	}
-
-	.topImage {
-		margin-left: 47%;
-		width: 10%;
-		height: 50rpx;
-	}
-
-	.dw {
-		display: flex;
-		width: 100%;
-		height: 100rpx;
-		margin-top: 20rpx;
-	}
-
-	.weizhi {
-		display: flex;
-		width: 100%;
-		height: 100rpx;
-	}
-
-	.imgs {
-		width: 10%;
-		height: 70rpx;
-		/* margin-top: 20rpx; */
-		margin-left: 30rpx;
-	}
-
-	.dimin {
-		width: 23%;
-		margin-top: 10rpx;
-		margin-left: 5rpx;
-		color: #636363;
-	}
-
-	.xianshi {
-		display: inline;
-		white-space: pre-line;
-		width: 60%;
-		color: #000;
-		font-size: 35rpx;
-		height: 100rpx;
-		padding-top: 5rpx;
-		margin-left: 20rpx;
-		margin-top: 5rpx;
-		margin-right: 5rpx;
-	}
-
-	.xinxi {
-		display: flex;
-	}
-
-	.nei {
-		display: row;
-		width: 35%;
-		height: 400rpx;
-	}
-
-	.tupian {
-		width: 95%;
-		height: 350rpx;
-		margin-left: 30rpx;
-	}
-
-	.book-name {
-		margin-left: 40rpx;
-		margin-right: 20rpx;
-		/* margin-top: 30rpx; */
-		height: 45rpx;
-		width: 90%;
-		font-size: 30rpx;
-		color: #6C40F3;
-	}
-
-	.book-name1 {
-		margin-left: 40rpx;
-		margin-top: 20rpx;
-		margin-right: 20rpx;
-		font-size: 28rpx;
-		color: #636363;
-		display: -webkit-box;
-		word-break: break-all;
-		text-overflow: ellipsis;
-		/*自适应字体*/
-		overflow: hidden;
-		-webkit-box-orient: vertical;
-		-webkit-line-clamp: 1;
-	}
-
-	.book-add {
-		margin-top: 30rpx;
-		margin-right: 20rpx;
-		border-radius: 10rpx;
-		float: right;
-		width: 50%;
-		height: 60rpx;
-		text-align: center;
-		color: #fff;
-		line-height: 60rpx;
-		/** 垂直居中 **/
-		text-align: center;
-		/** 水平居中 **/
-		background-color: #6C40F3;
-	}
-
-	.img {
-		margin-top: 30rpx;
-		margin-left: 5rpx;
-		width: 100rpx;
-		height: 100rpx;
-		border-radius: 50%;
-	}
-
-	.book-body {
-		display: row;
-		margin-top: 15rpx;
-		height: 400rpx;
-		width: 63%;
-		color: #636363;
-	}
-
-	.juli {
-		width: 70%;
-		margin-top: 40rpx;
-		margin-left: 70rpx;
-	}
-
-	.item {
-		padding-left: 10rpx;
-		margin-top: 20rpx;
-		border-radius: 10rpx;
-		width: 150rpx;
-		height: 60rpx;
-		color: #255BBA;
-	}
-	.text-color{
-		color: #6C40F3;
-	}
+}
+
+.top {
+  width: 100%;
+  height: 50rpx;
+  line-height: 60rpx;
+  /** 垂直居中 **/
+  text-align: center;
+  /** 水平居中 **/
+}
+
+.topImage {
+  margin-left: 47%;
+  width: 10%;
+  height: 50rpx;
+}
+
+.dw {
+  display: flex;
+  width: 100%;
+  height: 100rpx;
+  margin-top: 20rpx;
+}
+
+.weizhi {
+  display: flex;
+  width: 100%;
+  height: 100rpx;
+}
+
+.imgs {
+  width: 10%;
+  height: 70rpx;
+  /* margin-top: 20rpx; */
+  margin-left: 30rpx;
+}
+
+.dimin {
+  width: 23%;
+  margin-top: 10rpx;
+  margin-left: 5rpx;
+  color: #636363;
+}
+
+.xianshi {
+  display: inline;
+  white-space: pre-line;
+  width: 60%;
+  color: #000;
+  font-size: 35rpx;
+  height: 100rpx;
+  padding-top: 5rpx;
+  margin-left: 20rpx;
+  margin-top: 5rpx;
+  margin-right: 5rpx;
+}
+
+.xinxi {
+  display: flex;
+}
+
+.nei {
+  display: row;
+  width: 35%;
+  height: 400rpx;
+}
+
+.tupian {
+  width: 95%;
+  height: 350rpx;
+  margin-left: 30rpx;
+}
+
+.book-name {
+  margin-left: 40rpx;
+  margin-right: 20rpx;
+  /* margin-top: 30rpx; */
+  height: 45rpx;
+  width: 90%;
+  font-size: 30rpx;
+  color: #6c40f3;
+}
+
+.book-name1 {
+  margin-left: 40rpx;
+  margin-top: 20rpx;
+  margin-right: 20rpx;
+  font-size: 28rpx;
+  color: #636363;
+  display: -webkit-box;
+  word-break: break-all;
+  text-overflow: ellipsis;
+  /*自适应字体*/
+  overflow: hidden;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 1;
+}
+
+.book-add {
+  margin-top: 30rpx;
+  margin-right: 20rpx;
+  border-radius: 10rpx;
+  float: right;
+  width: 50%;
+  height: 60rpx;
+  text-align: center;
+  color: #fff;
+  line-height: 60rpx;
+  /** 垂直居中 **/
+  text-align: center;
+  /** 水平居中 **/
+  background-color: #6c40f3;
+}
+
+.img {
+  margin-top: 30rpx;
+  margin-left: 5rpx;
+  width: 100rpx;
+  height: 100rpx;
+  border-radius: 50%;
+}
+
+.book-body {
+  display: row;
+  margin-top: 15rpx;
+  height: 400rpx;
+  width: 63%;
+  color: #636363;
+}
+
+.juli {
+  width: 70%;
+  margin-top: 40rpx;
+  margin-left: 70rpx;
+}
+
+.item {
+  padding-left: 10rpx;
+  margin-top: 20rpx;
+  border-radius: 10rpx;
+  width: 150rpx;
+  height: 60rpx;
+  color: #255bba;
+}
+.text-color {
+  color: #6c40f3;
+}
 </style>
diff --git a/pages/sousuo/fujinB.vue b/pages/sousuo/fujinB.vue
index 24082c7cc2bf0b10e2ef7eb71cd96617da4992eb..c1235b213bd594fc0e28cf61d314ce519fdf1911 100644
--- a/pages/sousuo/fujinB.vue
+++ b/pages/sousuo/fujinB.vue
@@ -1,194 +1,214 @@
 <template>
-	<view>
-		<!-- 导航栏 -->
-		<!-- #ifdef APP-PLUS -->
-		<view class="tr3"></view>
-		<view class="tab1" style="width: 100%; height: 90rpx;">
-		<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 60rpx; height: 60rpx;"></image>
-			<view class="tit1">选定位置的书</view>
-			<image class="im"  src="../../static/images/nearby_location.png" style="width: 48rpx; height: 48rpx;"></image>
-			<view class="te">1024m</view>
-			</view>
-		<!-- #endif -->
-		<!-- #ifdef MP-WEIXIN -->
-		<view class="tr3"></view>
-		<view class="tab1" style="width: 100%; height: 90rpx;">
-		<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 60rpx; height: 60rpx;"></image>
-			<view class="tit3">选定位置的书</view>
-			<image class="im1"  src="../../static/images/nearby_location.png" style="width: 48rpx; height: 48rpx;"></image>
-			<view class="te1">1024m</view>
-			</view>
-		<!-- #endif -->
-			<!-- 分类选择 -->
-			<view class="list1">
-				<view class="td">中文</view>
-				<view class="td">英文</view>
-				<view class="td" >借阅量</view>
-				<view class="td">出版时间</view>
-				<view class="td">在馆</view>
-				<view class="td">书易流通</view>
-			</view>
-			<view class="tab2"></view>
-			<view class="list">
-				<!-- #ifdef APP-PLUS -->
-				<image class="ima" src="../../static/images/封面.png"></image>
-				<!-- #endif -->
-				<!-- #ifdef MP-WEIXIN -->
-				<image class="im3" src="../../static/images/封面.png"></image>
-				<!-- #endif -->
-				<view>
-					<view class="name">书名....</view>
-					<view class="tex">作者 ：哈哈</view>
-					<view class="tex">出版社 ：浙江大学出版社</view>
-					<view class="tex">出版时间 ：2020-09</view>
-					<view class="tex1">广东省图书馆、广东中山图书馆</view>
-				</view>
-			</view>
-			<view class="list">
-				<!-- #ifdef APP-PLUS -->
-				<image class="ima" src="../../static/images/封面.png"></image>
-				<!-- #endif -->
-				<!-- #ifdef MP-WEIXIN -->
-				<image class="im3" src="../../static/images/封面.png"></image>
-				<!-- #endif -->
-				<view>
-					<view class="name">书名....</view>
-					<view class="tex">作者 ：哈哈</view>
-					<view class="tex">出版社 ：浙江大学出版社</view>
-					<view class="tex">出版时间 ：2020-09</view>
-					<view class="tex1">广东省图书馆、广东中山图书馆</view>
-				</view>
-			</view>
-			<image class="top" src="../../static/images/top.png" style="width: 80rpx; height: 80rpx;"></image>
-	</view>
+  <view>
+    <!-- 导航栏 -->
+    <!-- #ifdef APP-PLUS -->
+    <view class="tr3"></view>
+    <view class="tab1" style="width: 100%; height: 90rpx">
+      <image
+        @click="back"
+        class="back"
+        src="/static/images/向左箭头.二级.返回@2x.png"
+        style="width: 60rpx; height: 60rpx"
+      ></image>
+      <view class="tit1">选定位置的书</view>
+      <image
+        class="im"
+        src="/static/images/nearby_location.png"
+        style="width: 48rpx; height: 48rpx"
+      ></image>
+      <view class="te">1024m</view>
+    </view>
+    <!-- #endif -->
+    <!-- #ifdef MP-WEIXIN -->
+    <view class="tr3"></view>
+    <view class="tab1" style="width: 100%; height: 90rpx">
+      <image
+        @click="back"
+        class="back"
+        src="/static/images/向左箭头.二级.返回@2x.png"
+        style="width: 60rpx; height: 60rpx"
+      ></image>
+      <view class="tit3">选定位置的书</view>
+      <image
+        class="im1"
+        src="/static/images/nearby_location.png"
+        style="width: 48rpx; height: 48rpx"
+      ></image>
+      <view class="te1">1024m</view>
+    </view>
+    <!-- #endif -->
+    <!-- 分类选择 -->
+    <view class="list1">
+      <view class="td">中文</view>
+      <view class="td">英文</view>
+      <view class="td">借阅量</view>
+      <view class="td">出版时间</view>
+      <view class="td">在馆</view>
+      <view class="td">书易流通</view>
+    </view>
+    <view class="tab2"></view>
+    <view class="list">
+      <!-- #ifdef APP-PLUS -->
+      <image class="ima" src="/static/images/封面.png"></image>
+      <!-- #endif -->
+      <!-- #ifdef MP-WEIXIN -->
+      <image class="im3" src="/static/images/封面.png"></image>
+      <!-- #endif -->
+      <view>
+        <view class="name">书名....</view>
+        <view class="tex">作者 ：哈哈</view>
+        <view class="tex">出版社 ：浙江大学出版社</view>
+        <view class="tex">出版时间 ：2020-09</view>
+        <view class="tex1">广东省图书馆、广东中山图书馆</view>
+      </view>
+    </view>
+    <view class="list">
+      <!-- #ifdef APP-PLUS -->
+      <image class="ima" src="/static/images/封面.png"></image>
+      <!-- #endif -->
+      <!-- #ifdef MP-WEIXIN -->
+      <image class="im3" src="/static/images/封面.png"></image>
+      <!-- #endif -->
+      <view>
+        <view class="name">书名....</view>
+        <view class="tex">作者 ：哈哈</view>
+        <view class="tex">出版社 ：浙江大学出版社</view>
+        <view class="tex">出版时间 ：2020-09</view>
+        <view class="tex1">广东省图书馆、广东中山图书馆</view>
+      </view>
+    </view>
+    <image
+      class="top"
+      src="/static/images/top.png"
+      style="width: 80rpx; height: 80rpx"
+    ></image>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			back(){
-				uni.navigateBack({
-					delta:1
-				})
-			}
-		}
-	}
+export default {
+  data() {
+    return {};
+  },
+  methods: {
+    back() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+  },
+};
 </script>
 
 <style>
-.tr3{
-		height: 70rpx;
-		background-color:#6C40F3;
-	}
-	.tab1 {
-		/* margin-top: 79rpx; */
-		background-color:#6C40F3;
-		display: flex;
-	}
+.tr3 {
+  height: 70rpx;
+  background-color: #6c40f3;
+}
+.tab1 {
+  /* margin-top: 79rpx; */
+  background-color: #6c40f3;
+  display: flex;
+}
 
-	.tit1 {
-		margin-top: 8rpx;
-		/* color: #555555; */
-		/* margin-left: 215rpx; */
-		font-size: 45rpx;
-		color: #FFFFFF;
-		width: 40%;
-	}
-	.tit3 {
-		margin-top: 8rpx;
-		/* color: #555555; */
-		/* margin-left: 215rpx; */
-		font-size: 45rpx;
-		color: #FFFFFF;
-		width: 50%;
-	}
-	.back {
-		margin-top: 8rpx;
-		margin-left: 10rpx;
-	}
-	.im{
-		margin-top: 23rpx;
-		margin-left: 180rpx;
-	}
-	.te{
-		font-size: 35rpx;
-		margin-top: 25rpx;
-		margin-left: 10rpx;
-		color:#FFFFFF ;
-	}
-	.im1{
-		margin-top: 23rpx;
-		margin-left: 140rpx;
-	}
-	.te1{
-		font-size: 35rpx;
-		margin-top: 25rpx;
-		margin-left: 0rpx;
-		color:#FFFFFF ;
-	}
-	.list1{
-		display: flex;
-		height: 70rpx;
-		background-color: #F8F8F8;
-	}
-	.tab2 {
-			display: flex;
-		}
-	.td{
-		width: 160rpx;
-		font-size: 25rpx;
-		text-align: center;
-		height: 40rpx;
-		margin: 10rpx 10rpx;
-		border: 1rpx solid #C8C7CC;
-		border-radius: 15rpx;
-		/* background-color: #00AAFF; */
-		margin-top: 15rpx;
-		color: #999999;
-	}
-	.list {
-		height: 290rpx;
-		border-bottom: 1rpx solid #C8C7CC;
-		display: flex;
-	}
-	
-	.ima {
-		margin: 40rpx 40rpx;
-		width: 150rpx;
-		height: 200rpx;
-	}
-	.im3 {
-		margin: 40rpx 40rpx;
-		width: 150rpx;
-		height: 200rpx;
-	}
-	.name {
-		margin-top: 30rpx;
-		font-size: 40rpx;
-	}
-	
-	.tex {
-		font-size: 28rpx;
-		margin-top: 5rpx;
-		color: #808080;
-	}
-	
-	.tex1 {
-		margin-top: 15rpx;
-		font-size: 35rpx;
-		color: #F0AD4E;
-	}
-	
-	.top {
-		top: -170rpx;
-		margin-left: 680rpx;
-	}
-	.fenl{
-		display: flex;
-	}
+.tit1 {
+  margin-top: 8rpx;
+  /* color: #555555; */
+  /* margin-left: 215rpx; */
+  font-size: 45rpx;
+  color: #ffffff;
+  width: 40%;
+}
+.tit3 {
+  margin-top: 8rpx;
+  /* color: #555555; */
+  /* margin-left: 215rpx; */
+  font-size: 45rpx;
+  color: #ffffff;
+  width: 50%;
+}
+.back {
+  margin-top: 8rpx;
+  margin-left: 10rpx;
+}
+.im {
+  margin-top: 23rpx;
+  margin-left: 180rpx;
+}
+.te {
+  font-size: 35rpx;
+  margin-top: 25rpx;
+  margin-left: 10rpx;
+  color: #ffffff;
+}
+.im1 {
+  margin-top: 23rpx;
+  margin-left: 140rpx;
+}
+.te1 {
+  font-size: 35rpx;
+  margin-top: 25rpx;
+  margin-left: 0rpx;
+  color: #ffffff;
+}
+.list1 {
+  display: flex;
+  height: 70rpx;
+  background-color: #f8f8f8;
+}
+.tab2 {
+  display: flex;
+}
+.td {
+  width: 160rpx;
+  font-size: 25rpx;
+  text-align: center;
+  height: 40rpx;
+  margin: 10rpx 10rpx;
+  border: 1rpx solid #c8c7cc;
+  border-radius: 15rpx;
+  /* background-color: #00AAFF; */
+  margin-top: 15rpx;
+  color: #999999;
+}
+.list {
+  height: 290rpx;
+  border-bottom: 1rpx solid #c8c7cc;
+  display: flex;
+}
+
+.ima {
+  margin: 40rpx 40rpx;
+  width: 150rpx;
+  height: 200rpx;
+}
+.im3 {
+  margin: 40rpx 40rpx;
+  width: 150rpx;
+  height: 200rpx;
+}
+.name {
+  margin-top: 30rpx;
+  font-size: 40rpx;
+}
+
+.tex {
+  font-size: 28rpx;
+  margin-top: 5rpx;
+  color: #808080;
+}
+
+.tex1 {
+  margin-top: 15rpx;
+  font-size: 35rpx;
+  color: #f0ad4e;
+}
+
+.top {
+  top: -170rpx;
+  margin-left: 680rpx;
+}
+.fenl {
+  display: flex;
+}
 </style>
diff --git a/pages/sousuo/sousuo.vue b/pages/sousuo/sousuo.vue
index a4672cab7bc9c03423c5e5e159b0d106913a3a33..4e562fdb45f24e957998dd3a2e03293030e35388 100644
--- a/pages/sousuo/sousuo.vue
+++ b/pages/sousuo/sousuo.vue
@@ -1,55 +1,34 @@
 <template>
 	<view>
 		<!-- 导航栏 -->
-		<!-- #ifdef APP-PLUS -->
-		<view class="ta"></view>
-		<view class="tab1" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-			<view class="tit1">图书搜索</view>
-			<image class="im"  src="../../static/images/nearby_location.png" style="width: 48rpx; height: 48rpx;"></image>
-			<navigator url="fujin">
-			<view class="tit2">附近的书</view>
-			</navigator>
+		<u-navbar zhead="65rpx" height="44" title="图书搜索" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view style="display: flex;" slot="right">
+				<image src="/static/images/nearby_location.png" style="width: 48rpx; height: 48rpx"></image>
+				<navigator url="fujin">
+					<view style="color: #FFFFFF;font-size: 28rpx;padding-top: 6rpx;">附近的书</view>
+				</navigator>
 			</view>
-		<!-- #endif -->
-	<!-- #ifdef MP-WEIXIN -->
-	<view class="ta"></view>
-	<view class="tab1" style="width: 100%; height: 90rpx;">
-		<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
-		<view class="tit1">图书搜索</view>
-		<image class="im1"  src="../../static/images/nearby_location.png" style="width: 48rpx; height: 48rpx;"></image>
-		<navigator url="fujin">
-		<view class="tit2">附近的书</view>
-		</navigator>
-		</view>
-	<!-- #endif -->
-			
-			<!-- 搜索框 -->
-			<view class="tit">
-			
+		</u-navbar>
+
+		<!-- 搜索框 -->
+		<view class="tit">
 			<view class="titi">
 				<view class="h-input">
-					<image src="../../static/images/search_icon2x.png" class="image"></image>
-				<!-- #ifdef MP-WEIXIN -->
-					<input class="input"  @input="goToSearch" placeholder="请输入关键字" placeholderStyle="color:#BBBBBB "  type="text"/>
-				<!-- #endif -->
-				<!-- #ifdef APP-PLUS -->
-				<view>
-				<input class="input1" @input="goToSearch" placeholder="请输入关键字" placeholderStyle="color:#BBBBBB "  type="text"/>
+					<image src="/static/images/search_icon2x.png" class="image"></image>
+					<input @blur="loseFocus" class="input1" @click="bindSearchBook" @input="goToSearch" placeholder="请输入关键字" placeholderStyle="color:#BBBBBB "
+					 type="text" />
 				</view>
-				<!-- #endif -->
-				</view>
-				<navigator url="book">
-				<view class="tab">搜索</view>
-				</navigator>
-			</view>
+				<!-- <navigator :url="'book?message='+message"> -->
+				<view class="tab" @click="searchBook">搜索</view>
+				<!-- </navigator> -->
 			</view>
+		</view>
+		<block v-if="index === 0">
 			<!-- 热搜内容 -->
-			<!-- #ifdef APP-PLUS -->
 			<view class="list">
-				<!-- <image class="hot" src="../../static/images/top_search.png"style="width: 40rpx; height: 40rpx;"></image> -->
+				<!-- <image class="hot" src="/static/images/top_search.png"style="width: 40rpx; height: 40rpx;"></image> -->
 				<view class="tex">热门搜索</view>
-				
 			</view>
 			<view class="list">
 				<view class="tex2">深度学习</view>
@@ -60,110 +39,149 @@
 			<view class="list">
 				<view class="tex2">深度学习</view>
 				<view class="tex2">深度学习</view>
-				
 			</view>
 			<view class="list1">
 				<view class="tex">历史记录</view>
-				<image class="more" src="../../static/images/empty.png"style="width: 40rpx; height: 40rpx;"></image>
-			</view>
-			<view class="list">
-				<view class="tex2">深度学习</view>
-			</view>
-			<!-- #endif -->
-			<!-- #ifdef MP-WEIXIN -->
-			<view class="list">
-				<!-- <image class="hot" src="../../static/images/top_search.png"style="width: 40rpx; height: 40rpx;"></image> -->
-				<view class="tex">热门搜索</view>
-				
-			</view>
-			<view class="list">
-				<view class="tex2">深度学习</view>
-				<view class="tex2">财富号历</view>
-				<view class="tex2">深度学习</view>
-				<view class="tex2">深度学习</view>
+				<image class="more" src="/static/images/empty.png" style="width: 40rpx; height: 40rpx"></image>
 			</view>
 			<view class="list">
 				<view class="tex2">深度学习</view>
-				<view class="tex2">深度学习</view>
-				
 			</view>
-			<view class="list1">
-				<view class="tex">历史记录</view>
-				<image class="more" src="../../static/images/empty.png"style="width: 40rpx; height: 40rpx;"></image>
+		</block>
+		<block v-if="index === 1">
+			<view v-if="bookList !== undefined && bookList.length > 0">
+				<view class="liste" v-for="(item,index) in bookList" :key="index">
+					<image class="imae1" :src="item.picturePath" @error="imageError(item)"></image>
+					<view>
+						<navigator :url="'book?isbn=' + item.isbn">
+							<view class="title_name">{{ item.bookName }}</view>
+							<view class="text_tex">作者 ：{{ item.author }}</view>
+							<view class="text_tex">出版社 ：{{ item.publisher }}</view>
+						</navigator>
+					</view>
+				</view>
 			</view>
-			<view class="list">
-				<view class="tex2">深度学习</view>
+			<view v-if="bookList == undefined || bookList.length <= 0">
+				<view style="width: 100%;height: 100rpx;font-size: 40rpx;color: red;text-align: center;margin-top: 60rpx;">
+					暂时没有该类书籍哦,换换其它的吧~
+				</view>
 			</view>
-			<!-- #endif -->
+		</block>
 	</view>
 </template>
 
 <script>
+	let app = getApp();
 	export default {
 		data() {
 			return {
-				
-			}
+				background: {
+					background: "#6C40F3",
+				},
+				message: "",
+				index: 0, //状态0.显示，1隐形
+				bookList: [],	//书籍列表
+			};
 		},
 		methods: {
-			back(){
-				uni.navigateBack({
-					delta:1
-				})
-			}
-		}
-	}
+			//输入内容
+			goToSearch(e) {
+				let that = this;
+				that.message = e.detail.value;
+			},
+			//点击输入框
+			bindSearchBook() {
+				let that = this;
+				that.index = 0;
+			},
+			// 失去焦点触发
+			loseFocus(){
+				let that = this;
+				that.index = 1;
+			},
+			//点击搜索
+			async searchBook() {
+				let that = this;
+				that.index = 1;
+				uni.showLoading({
+				    title: '加载中'
+				});
+				setTimeout(function () {
+				    uni.hideLoading();
+				}, 8000);
+				var params = {
+					url: "book?page=0&size=10&bookmark=" + that.message,
+					type: 'GET'
+				}
+				const res = await app.myRequest(params)
+				console.log(res.content);
+				that.bookList = res.content;
+				uni.hideLoading();
+			},
+			//图片加载失败
+			imageError(index) {
+				let that = this;
+				index.picturePath = "/static/images/temporary.jpg"
+			},
+		},
+	};
 </script>
 
 <style>
-	.ta{
+	.ta {
 		height: 70rpx;
-		background-color:#6C40F3;
+		background-color: #6c40f3;
 	}
-.tab1 {
+
+	.tab1 {
 		display: flex;
-		background-color:#6C40F3;
+		background-color: #6c40f3;
 	}
-	.tit{
+
+	.tit {
 		margin-top: 19rpx;
 		/* display: flex; */
-		
 	}
+
 	.tit1 {
 		margin-top: 9rpx;
-		color:#FFFFFF ;
+		color: #ffffff;
 		margin-left: 230rpx;
 		display: flex;
 		font-size: 40rpx;
 		width: 30%;
 	}
-	
+
 	.back {
 		margin-top: 15rpx;
 		margin-left: 10rpx;
 	}
-	.im{
+
+	.im {
 		margin-top: 23rpx;
 		margin-left: 40rpx;
 	}
-	.im1{
+
+	.im1 {
 		margin-top: 23rpx;
 		margin-left: -10rpx;
 	}
-	.tit2{
+
+	.tit2 {
 		margin-top: 27rpx;
 		font-size: 30rpx;
-		color: #FFFFFF;
+		color: #ffffff;
 		margin-left: 0rpx;
-		
 	}
-	.tit3{
+
+	.tit3 {
 		margin-top: 5rpx;
 		font-size: 30rpx;
 		color: #808080;
 		margin-left: 13rpx;
 	}
-	.tab{
+
+	.tab {
 		display: flex;
 		margin-left: 20rpx;
 		color: #646464;
@@ -171,24 +189,28 @@
 		margin-top: 8rpx;
 		width: 100rpx;
 	}
-	.ima{
+
+	.ima {
 		margin-top: 10rpx;
 		margin-left: 10rpx;
 	}
-	.titi{
+
+	.titi {
 		height: 100rpx;
 		display: flex;
 	}
-	.h-input{
+
+	.h-input {
 		margin-left: 20rpx;
 		/* margin-top: 20rpx; */
 		width: 600rpx;
 		height: 80rpx;
 		border-radius: 36rpx;
-		background-color: #F1F1F1;
+		background-color: #f1f1f1;
 		display: flex;
 		flex-direction: row;
 	}
+
 	/* .h-input input{
 		margin-left: -70rpx;
 		width: 450rpx;
@@ -196,9 +218,9 @@
 		line-height: 60rpx;
 		display: flex;
 		font-size: 30rpx;
-		
+
 	} */
-	.input{
+	.input {
 		margin-left: 0rpx;
 		/* width: 450rpx; */
 		height: 80rpx;
@@ -206,7 +228,8 @@
 		display: flex;
 		font-size: 30rpx;
 	}
-	.input1{
+
+	.input1 {
 		margin-left: 0rpx;
 		/* width: 450rpx; */
 		height: 80rpx;
@@ -214,65 +237,115 @@
 		display: flex;
 		font-size: 30rpx;
 	}
-	.h-input view{
+
+	.h-input view {
 		width: 90rpx;
-		
-		
 	}
-	.image{
+
+	.image {
 		margin-left: 10rpx;
 		margin-top: 8rpx;
 		width: 65rpx;
 		height: 65rpx;
 	}
-	.list{
+
+	.list {
 		display: flex;
 		margin-top: 20rpx;
 		height: 60rpx;
 	}
-	.tex{
+
+	.tex {
 		font-size: 42rpx;
-		color: #E2E2E2;
+		color: #e2e2e2;
 		margin-left: 20rpx;
 		margin-top: 20rpx;
 		width: 30%;
 	}
-	.tex1{
+
+	.tex1 {
 		font-size: 30rpx;
 		color: #808080;
 		margin-left: 470rpx;
 	}
-	.hot{
+
+	.hot {
 		margin: 8rpx 15rpx;
 	}
-	.tex2{
+
+	.tex2 {
 		font-size: 32rpx;
-		color: #7D7D7D;
+		color: #7d7d7d;
 		margin-left: 22rpx;
 		/* margin-top: 20rpx; */
 		border-radius: 20rpx;
 		text-align: center;
 		align-items: center;
-		background-color: #EBEBEB;
+		background-color: #ebebeb;
 		width: 150rpx;
 		line-height: 50rpx;
 		height: 45rpx;
 		-webkit-line-clamp: 1;
 	}
-	.list1{
+
+	.list1 {
 		display: flex;
 		margin-top: 60rpx;
 		height: 60rpx;
 		/* -webkit-line-clamp: 2; */
 	}
-	.tex3{
+
+	.tex3 {
 		font-size: 30rpx;
 		color: #808080;
 		margin-left: 400rpx;
 	}
-	.more{
-		margin-top:30rpx;
+
+	.more {
+		margin-top: 30rpx;
 		margin-left: 400rpx;
 	}
 	
+	.liste {
+		height: 330rpx;
+		border-bottom: 1rpx solid #c8c7cc;
+		display: flex;
+	}
+	
+	.imae1 {
+		margin: 40rpx 40rpx;
+		width: 200rpx;
+		height: 250rpx;
+	}
+	.title_name {
+		width: 400rpx;
+		margin-left: 10rpx;
+		margin-top: 50rpx;
+		font-size: 40rpx;
+		display: -webkit-box;
+		word-break: break-all;
+		text-overflow: ellipsis;
+		/*自适应字体*/
+		overflow: hidden;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 2;
+		/*设置 需要显示的行数*/
+	}
+	
+	.text_tex {
+		width: 450rpx;
+		/* height: 30rpx; */
+		text-align: left;
+		font-size: 28rpx;
+		margin-top: 15rpx;
+		color: #808080;
+		display: -webkit-box;
+		word-break: break-all;
+		text-overflow: ellipsis;
+		/*自适应字体*/
+		overflow: hidden;
+		-webkit-box-orient: vertical;
+		-webkit-line-clamp: 1;
+		/*设置 需要显示的行数*/
+	}
 </style>
diff --git a/pages/yind/yind.vue b/pages/yind/yind.vue
index 26cfd2ae5d9897844b30f8d7c49c38cc84b653eb..16f566e70bb7edbf3fea58ce2b15405852e7feb6 100644
--- a/pages/yind/yind.vue
+++ b/pages/yind/yind.vue
@@ -1,27 +1,23 @@
 <template>
-	<view class="all">
-		<navigator url="../login/login">
-		<image class="ima" src="../../static/images/导航页.jpg"></image>
-	</navigator>
-	</view>
+  <view class="all">
+    <navigator url="../login/login">
+      <image class="ima" src="/static/images/导航页.jpg"></image>
+    </navigator>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			
-		}
-	}
+export default {
+  data() {
+    return {};
+  },
+  methods: {},
+};
 </script>
 
 <style>
-	.ima{
-		width: 100%;
-		height: 1245rpx;
-	}
+.ima {
+  width: 100%;
+  height: 1245rpx;
+}
 </style>
diff --git a/pages/zhaob/blist.vue b/pages/zhaob/blist.vue
index 75f1ae5edfdf7f2ef21d4b0a33174debb69015e0..d5b8c0c19181a03ff9cf7981b367fb9b875780ba 100644
--- a/pages/zhaob/blist.vue
+++ b/pages/zhaob/blist.vue
@@ -1,149 +1,155 @@
 <template>
-	<view>
-		<!-- 头部 -->
-		<view class="head">
-			<view class="head-tab">
-				<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 60rpx; height: 60rpx;"></image>
-				<view class="tit1">找书</view>
-				<navigator url="../sousuo/sousuo">
-					<image class="im" src="../../static/images/search_icon2x.png"style="width: 80rpx; height: 80rpx;"></image>
-				</navigator>
-			</view>
-
-		</view>
-		<!-- 分类选择 -->
-		<view class="list1">
-			<view class="td">中文</view>
-			<view class="td">英文</view>
-			<view class="td">借阅量</view>
-			<view class="td">出版时间</view>
-			<view class="td">在馆</view>
-			<view class="td">书易流通</view>
-		</view>
-		<view class="tab1"></view>
-		<view class="list">
-			<image class="im1" src="../../static/images/封面.png" ></image>
-			<view>
-				<view class="name">书名....</view>
-				<view class="tex">作者 ：哈哈</view>
-				<view class="tex">出版社 ：浙江大学出版社</view>
-				<view class="tex">出版时间 ：2020-09</view>
-				<view class="tex1">广东省图书馆、广东中山图书馆</view>
-			</view>
-		</view>
-		<view class="list">
-			<image class="im1" src="../../static/images/封面.png" ></image>
-			<view>
-				<view class="name">书名....</view>
-				<view class="tex">作者 ：哈哈</view>
-				<view class="tex">出版社 ：浙江大学出版社</view>
-				<view class="tex">出版时间 ：2020-09</view>
-				<view class="tex1">广东省图书馆、广东中山图书馆</view>
-			</view>
-		</view>
-		<image class="top" src="../../static/images/top.png" style="width: 80rpx; height: 80rpx;"></image>
-	</view>
+  <view>
+    <!-- 头部 -->
+    <u-navbar zhead="65rpx" height="44" title="找书" title-color="white" title-size="40" :background="background"
+     back-icon-color="white" back-icon-size="50">
+    	<view class="navbar-right" slot="right">
+    		<navigator url="../sousuo/sousuo">
+    			<image style="height: 50rpx; width: 50rpx;margin-right: 20rpx;" src="/static/images/Fsearch.png"></image>
+    		</navigator>
+    	</view>
+    </u-navbar>
+    <!-- 分类选择 -->
+    <view class="list1">
+      <view class="td">中文</view>
+      <view class="td">英文</view>
+      <view class="td">借阅量</view>
+      <view class="td">出版时间</view>
+      <view class="td">在馆</view>
+      <view class="td">书易流通</view>
+    </view>
+    <view class="tab1"></view>
+    <view class="list">
+      <image class="im1" src="/static/images/封面.png"></image>
+      <view>
+        <view class="name">书名....</view>
+        <view class="tex">作者 ：哈哈</view>
+        <view class="tex">出版社 ：浙江大学出版社</view>
+        <view class="tex">出版时间 ：2020-09</view>
+        <view class="tex1">广东省图书馆、广东中山图书馆</view>
+      </view>
+    </view>
+    <view class="list">
+      <image class="im1" src="/static/images/封面.png"></image>
+      <view>
+        <view class="name">书名....</view>
+        <view class="tex">作者 ：哈哈</view>
+        <view class="tex">出版社 ：浙江大学出版社</view>
+        <view class="tex">出版时间 ：2020-09</view>
+        <view class="tex1">广东省图书馆、广东中山图书馆</view>
+      </view>
+    </view>
+    <image
+      class="top"
+      src="/static/images/top.png"
+      style="width: 80rpx; height: 80rpx"
+    ></image>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {}
+export default {
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
 		},
-		methods: {
-			back(){
-				uni.navigateBack({
-					delta:1
-				})
-			}
-		}
-	}
+	};
+  },
+  methods: {
+    back() {
+      uni.navigateBack({
+        delta: 1,
+      });
+    },
+  },
+};
 </script>
 
 <style lang="scss">
-	.tab1 {
-		display: flex;
-	}
-
-	.head-tab {
-		background-color: #6C40F3;
-		// margin-top: 50rpx;
-		display: flex;
-	}
-
-	.tit1 {
-		margin-top: 49rpx;
-		/* color: #555555; */
-		margin-left: 15rpx;
-		font-size: 45rpx;
-		color: #FFFFFF;
-		width: 20%;
-	}
-
-	.back {
-		margin-top: 50rpx;
-		margin-left: 10rpx;
-	}
-
-	.im{
-		margin-top: 40rpx;
-		margin-left: 400rpx;
-	}
-
-	.list1 {
-		display: flex;
-		height: 70rpx;
-		background-color: #F8F8F8;
-	}
-
-	.td {
-		width: 160rpx;
-		font-size: 25rpx;
-		text-align: center;
-		height: 40rpx;
-		margin: 10rpx 10rpx;
-		border: 1rpx solid #C8C7CC;
-		border-radius: 15rpx;
-		/* background-color: #00AAFF; */
-		margin-top: 15rpx;
-		color: #999999;
-	}
-
-	.list {
-		height: 290rpx;
-		border-bottom: 1rpx solid #C8C7CC;
-		display: flex;
-	}
-
-	.im1 {
-		margin: 40rpx 40rpx;
-		width: 150rpx;
-		height: 200rpx;
-	}
-
-	.name {
-		margin-top: 30rpx;
-		font-size: 40rpx;
-	}
-
-	.tex {
-		font-size: 28rpx;
-		margin-top: 5rpx;
-		color: #808080;
-	}
-
-	.tex1 {
-		margin-top: 15rpx;
-		font-size: 35rpx;
-		color: #F0AD4E;
-	}
-
-	.top {
-		top: -170rpx;
-		margin-left: 680rpx;
-	}
-
-	.fenl {
-		display: flex;
-	}
+.tab1 {
+  display: flex;
+}
+
+.head-tab {
+  background-color: #6c40f3;
+  // margin-top: 50rpx;
+  display: flex;
+}
+
+.tit1 {
+  margin-top: 49rpx;
+  /* color: #555555; */
+  margin-left: 15rpx;
+  font-size: 45rpx;
+  color: #ffffff;
+  width: 20%;
+}
+
+.back {
+  margin-top: 50rpx;
+  margin-left: 10rpx;
+}
+
+.im {
+  margin-top: 40rpx;
+  margin-left: 400rpx;
+}
+
+.list1 {
+  display: flex;
+  height: 70rpx;
+  background-color: #f8f8f8;
+}
+
+.td {
+  width: 160rpx;
+  font-size: 25rpx;
+  text-align: center;
+  height: 40rpx;
+  margin: 10rpx 10rpx;
+  border: 1rpx solid #c8c7cc;
+  border-radius: 15rpx;
+  /* background-color: #00AAFF; */
+  margin-top: 15rpx;
+  color: #999999;
+}
+
+.list {
+  height: 290rpx;
+  border-bottom: 1rpx solid #c8c7cc;
+  display: flex;
+}
+
+.im1 {
+  margin: 40rpx 40rpx;
+  width: 150rpx;
+  height: 200rpx;
+}
+
+.name {
+  margin-top: 30rpx;
+  font-size: 40rpx;
+}
+
+.tex {
+  font-size: 28rpx;
+  margin-top: 5rpx;
+  color: #808080;
+}
+
+.tex1 {
+  margin-top: 15rpx;
+  font-size: 35rpx;
+  color: #f0ad4e;
+}
+
+.top {
+  top: -170rpx;
+  margin-left: 680rpx;
+}
+
+.fenl {
+  display: flex;
+}
 </style>
diff --git a/pages/zhaob/zhaob.vue b/pages/zhaob/zhaob.vue
index 4b66ab677a6054e33775ddbf3d1aa3f83b75a02e..7bf39611b664827d21b4ce31c7c92564b8d91ea1 100644
--- a/pages/zhaob/zhaob.vue
+++ b/pages/zhaob/zhaob.vue
@@ -1,191 +1,218 @@
 <template>
-	<view>
-		<!-- 导航栏 -->
-		<view class="tab1" style="width: 100%; height: 90rpx;">
-			<image class="back" src="../../static/images/back.png" style="width: 60rpx; height: 60rpx;"></image>
-			<view class="tit1">图书搜索</view>
-			<image class="im"  src="../../static/images/nearby.png" style="width: 25rpx; height: 35rpx;"></image>
-			<navigator url="../sousuo/fujin">
-			<view class="tit2">附近的书</view>
-			</navigator>
-			</view>
-			<!-- 搜索框 -->
-			<view class="tit">
-			<view class="tab">
-				<view class="tit3">中文库</view>
-				<image class="ima" src="../../static/images/pull_down.png"style="width: 30rpx; height: 30rpx;"></image>
-			</view>
-			<view class="titi">
-				<view class="h-input">
-					<image src="../../static/images/search_one.png" class="image"></image>
-					<input @input="goToSearch" placeholder="人民的名义" placeholderStyle="color:#BBBBBB "  type="text"/>
-				</view>
-				<view class="tab">搜索</view>
-			</view>
-			</view>
-			<!-- 热搜内容 -->
-			<view class="list">
-				<image class="hot" src="../../static/images/top_search.png"style="width: 40rpx; height: 40rpx;"></image>
-				<view class="tex">热搜</view>
-				<view class="tex1">更多</view>
-				<image class="more" src="../../static/images/more.png"style="width: 40rpx; height: 40rpx;"></image>
-			</view>
-			<view class="list">
-				<view class="tex2">财富</view>
-			</view>
-			<view class="list1">
-				<image class="hot" src="../../static/images/history.png"style="width: 40rpx; height: 40rpx;"></image>
-				<view class="tex">搜索历史</view>
-				<view class="tex3">更多</view>
-				<image class="more1" src="../../static/images/more.png"style="width: 40rpx; height: 40rpx;"></image>
-			</view>
-			<view class="list">
-				<view class="tex2">设计</view>
-			</view>
-			<button class="btn">清除历史搜索记录</button>
-	</view>
+  <view>
+    <!-- 导航栏 -->
+    <view class="tab1" style="width: 100%; height: 90rpx">
+      <image
+        class="back"
+        src="/static/images/back.png"
+        style="width: 60rpx; height: 60rpx"
+      ></image>
+      <view class="tit1">图书搜索</view>
+      <image
+        class="im"
+        src="/static/images/nearby.png"
+        style="width: 25rpx; height: 35rpx"
+      ></image>
+      <navigator url="../sousuo/fujin">
+        <view class="tit2">附近的书</view>
+      </navigator>
+    </view>
+    <!-- 搜索框 -->
+    <view class="tit">
+      <view class="tab">
+        <view class="tit3">中文库</view>
+        <image
+          class="ima"
+          src="/static/images/pull_down.png"
+          style="width: 30rpx; height: 30rpx"
+        ></image>
+      </view>
+      <view class="titi">
+        <view class="h-input">
+          <image src="/static/images/search_one.png" class="image"></image>
+          <input
+            @input="goToSearch"
+            placeholder="人民的名义"
+            placeholderStyle="color:#BBBBBB "
+            type="text"
+          />
+        </view>
+        <view class="tab">搜索</view>
+      </view>
+    </view>
+    <!-- 热搜内容 -->
+    <view class="list">
+      <image
+        class="hot"
+        src="/static/images/top_search.png"
+        style="width: 40rpx; height: 40rpx"
+      ></image>
+      <view class="tex">热搜</view>
+      <view class="tex1">更多</view>
+      <image
+        class="more"
+        src="/static/images/more.png"
+        style="width: 40rpx; height: 40rpx"
+      ></image>
+    </view>
+    <view class="list">
+      <view class="tex2">财富</view>
+    </view>
+    <view class="list1">
+      <image
+        class="hot"
+        src="/static/images/history.png"
+        style="width: 40rpx; height: 40rpx"
+      ></image>
+      <view class="tex">搜索历史</view>
+      <view class="tex3">更多</view>
+      <image
+        class="more1"
+        src="/static/images/more.png"
+        style="width: 40rpx; height: 40rpx"
+      ></image>
+    </view>
+    <view class="list">
+      <view class="tex2">设计</view>
+    </view>
+    <button class="btn">清除历史搜索记录</button>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			
-		}
-	}
+export default {
+  data() {
+    return {};
+  },
+  methods: {},
+};
 </script>
 
 <style>
 .tab1 {
-	margin-top: 60rpx;
-		display: flex;
-	}
-	.tit{
-		display: flex;
-		margin-top: 20rpx;
-	}
-	.tit1 {
-		margin-top: 9rpx;
-		color: #555555 ;
-		font-size: 45rpx;
-	}
-	.sou{
-		margin-left: 200rpx;
-	}
-	.back {
-		margin-top: 15rpx;
-		margin-left: 10rpx;		
-	}
-	.im{
-		margin-top: 28rpx;
-		margin-left: 320rpx;
-	}
-	.tit2{
-		margin-top: 27rpx;
-		font-size: 30rpx;
-		color: #808080;
-		margin-left: 10rpx;
-	}
-	.tit3{
-		margin-top: 5rpx;
-		font-size: 35rpx;
-		color: #808080;
-		margin-left: 13rpx;
-	}
-	.tab{
-		display: flex;
-		margin-left: 20rpx;
-		color: #808080;
-		margin-top: 8rpx;
-	}
-	.ima{
-		margin-top: 13rpx;
-		margin-left: 10rpx;
-	}
-	.titi{
-		height: 100rpx;
-		display: flex;
-	}
-	.h-input{
-		margin-left: 18rpx;
-		/* margin-top: 20rpx; */
-		width: 430rpx;
-		height: 70rpx;
-		border-radius: 36rpx;
-		background-color: #F1F1F1;
-		border: 1rpx solid #C8C7CC;
-		display: flex;
-		flex-direction: row;
-	}
-	.h-input input{
-		margin-left: 10rpx;
-		width: 450rpx;
-		height: 70rpx;
-		line-height: 60rpx;
-		font-size: 30rpx;
-		
-	}
-	.h-input view{
-		width: 90rpx;
-		
-	}
-	.image{
-		margin-left: 10rpx;
-		/* margin-top: 10rpx; */
-		width: 65rpx;
-		height: 65rpx;
-	}
-	.list{
-		display: flex;
-		margin-top: 20rpx;
-		height: 60rpx;
-		border-bottom: 1rpx solid #C8C7CC;
-	}
-	.tex{
-		font-size: 40rpx;
-		color: #555555;
-	}
-	.tex1{
-		font-size: 30rpx;
-		color: #808080;
-		margin-left: 470rpx;
-	}
-	.more{
-		margin-top: 7rpx;
-	}
-	.hot{
-		margin: 8rpx 15rpx;
-	}
-	.tex2{
-		font-size: 36rpx;
-		color: #555555;
-		margin-left: 20rpx;
-		/* margin-left: 470rpx; */
-	}
-	.list1{
-		display: flex;
-		margin-top: 60rpx;
-		height: 60rpx;
-		border-bottom: 1rpx solid #C8C7CC;
-	}
-	.tex3{
-		font-size: 30rpx;
-		color: #808080;
-		margin-left: 400rpx;
-	}
-	.more1{
-		margin-top: 7rpx;
-	}
-	.btn{
-		background-color: #FFFFFF;
-		font-size: 26rpx;
-		border:1rpx solid #00AAFF;
-		width: 400rpx;
-		border-radius: 36rpx;
-		margin-top: 20rpx;
-	}
+  margin-top: 60rpx;
+  display: flex;
+}
+.tit {
+  display: flex;
+  margin-top: 20rpx;
+}
+.tit1 {
+  margin-top: 9rpx;
+  color: #555555;
+  font-size: 45rpx;
+}
+.sou {
+  margin-left: 200rpx;
+}
+.back {
+  margin-top: 15rpx;
+  margin-left: 10rpx;
+}
+.im {
+  margin-top: 28rpx;
+  margin-left: 320rpx;
+}
+.tit2 {
+  margin-top: 27rpx;
+  font-size: 30rpx;
+  color: #808080;
+  margin-left: 10rpx;
+}
+.tit3 {
+  margin-top: 5rpx;
+  font-size: 35rpx;
+  color: #808080;
+  margin-left: 13rpx;
+}
+.tab {
+  display: flex;
+  margin-left: 20rpx;
+  color: #808080;
+  margin-top: 8rpx;
+}
+.ima {
+  margin-top: 13rpx;
+  margin-left: 10rpx;
+}
+.titi {
+  height: 100rpx;
+  display: flex;
+}
+.h-input {
+  margin-left: 18rpx;
+  /* margin-top: 20rpx; */
+  width: 430rpx;
+  height: 70rpx;
+  border-radius: 36rpx;
+  background-color: #f1f1f1;
+  border: 1rpx solid #c8c7cc;
+  display: flex;
+  flex-direction: row;
+}
+.h-input input {
+  margin-left: 10rpx;
+  width: 450rpx;
+  height: 70rpx;
+  line-height: 60rpx;
+  font-size: 30rpx;
+}
+.h-input view {
+  width: 90rpx;
+}
+.image {
+  margin-left: 10rpx;
+  /* margin-top: 10rpx; */
+  width: 65rpx;
+  height: 65rpx;
+}
+.list {
+  display: flex;
+  margin-top: 20rpx;
+  height: 60rpx;
+  border-bottom: 1rpx solid #c8c7cc;
+}
+.tex {
+  font-size: 40rpx;
+  color: #555555;
+}
+.tex1 {
+  font-size: 30rpx;
+  color: #808080;
+  margin-left: 470rpx;
+}
+.more {
+  margin-top: 7rpx;
+}
+.hot {
+  margin: 8rpx 15rpx;
+}
+.tex2 {
+  font-size: 36rpx;
+  color: #555555;
+  margin-left: 20rpx;
+  /* margin-left: 470rpx; */
+}
+.list1 {
+  display: flex;
+  margin-top: 60rpx;
+  height: 60rpx;
+  border-bottom: 1rpx solid #c8c7cc;
+}
+.tex3 {
+  font-size: 30rpx;
+  color: #808080;
+  margin-left: 400rpx;
+}
+.more1 {
+  margin-top: 7rpx;
+}
+.btn {
+  background-color: #ffffff;
+  font-size: 26rpx;
+  border: 1rpx solid #00aaff;
+  width: 400rpx;
+  border-radius: 36rpx;
+  margin-top: 20rpx;
+}
 </style>
diff --git a/pages_borrow_books/components/mpvue-citypicker/city-data/area.js b/pages_borrow_books/components/mpvue-citypicker/city-data/area.js
new file mode 100644
index 0000000000000000000000000000000000000000..92dfc30a177544d80dd69b980843f119a15abd87
--- /dev/null
+++ b/pages_borrow_books/components/mpvue-citypicker/city-data/area.js
@@ -0,0 +1,12542 @@
+/* eslint-disable */
+var areaData = [
+  [
+    [{
+        "label": "东城区",
+        "value": "110101"
+      },
+      {
+        "label": "西城区",
+        "value": "110102"
+      },
+      {
+        "label": "朝阳区",
+        "value": "110105"
+      },
+      {
+        "label": "丰台区",
+        "value": "110106"
+      },
+      {
+        "label": "石景山区",
+        "value": "110107"
+      },
+      {
+        "label": "海淀区",
+        "value": "110108"
+      },
+      {
+        "label": "门头沟区",
+        "value": "110109"
+      },
+      {
+        "label": "房山区",
+        "value": "110111"
+      },
+      {
+        "label": "通州区",
+        "value": "110112"
+      },
+      {
+        "label": "顺义区",
+        "value": "110113"
+      },
+      {
+        "label": "昌平区",
+        "value": "110114"
+      },
+      {
+        "label": "大兴区",
+        "value": "110115"
+      },
+      {
+        "label": "怀柔区",
+        "value": "110116"
+      },
+      {
+        "label": "平谷区",
+        "value": "110117"
+      },
+      {
+        "label": "密云区",
+        "value": "110118"
+      },
+      {
+        "label": "延庆区",
+        "value": "110119"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "和平区",
+        "value": "120101"
+      },
+      {
+        "label": "河东区",
+        "value": "120102"
+      },
+      {
+        "label": "河西区",
+        "value": "120103"
+      },
+      {
+        "label": "南开区",
+        "value": "120104"
+      },
+      {
+        "label": "河北区",
+        "value": "120105"
+      },
+      {
+        "label": "红桥区",
+        "value": "120106"
+      },
+      {
+        "label": "东丽区",
+        "value": "120110"
+      },
+      {
+        "label": "西青区",
+        "value": "120111"
+      },
+      {
+        "label": "津南区",
+        "value": "120112"
+      },
+      {
+        "label": "北辰区",
+        "value": "120113"
+      },
+      {
+        "label": "武清区",
+        "value": "120114"
+      },
+      {
+        "label": "宝坻区",
+        "value": "120115"
+      },
+      {
+        "label": "滨海新区",
+        "value": "120116"
+      },
+      {
+        "label": "宁河区",
+        "value": "120117"
+      },
+      {
+        "label": "静海区",
+        "value": "120118"
+      },
+      {
+        "label": "蓟州区",
+        "value": "120119"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "长安区",
+        "value": "130102"
+      },
+      {
+        "label": "桥西区",
+        "value": "130104"
+      },
+      {
+        "label": "新华区",
+        "value": "130105"
+      },
+      {
+        "label": "井陉矿区",
+        "value": "130107"
+      },
+      {
+        "label": "裕华区",
+        "value": "130108"
+      },
+      {
+        "label": "藁城区",
+        "value": "130109"
+      },
+      {
+        "label": "鹿泉区",
+        "value": "130110"
+      },
+      {
+        "label": "栾城区",
+        "value": "130111"
+      },
+      {
+        "label": "井陉县",
+        "value": "130121"
+      },
+      {
+        "label": "正定县",
+        "value": "130123"
+      },
+      {
+        "label": "行唐县",
+        "value": "130125"
+      },
+      {
+        "label": "灵寿县",
+        "value": "130126"
+      },
+      {
+        "label": "高邑县",
+        "value": "130127"
+      },
+      {
+        "label": "深泽县",
+        "value": "130128"
+      },
+      {
+        "label": "赞皇县",
+        "value": "130129"
+      },
+      {
+        "label": "无极县",
+        "value": "130130"
+      },
+      {
+        "label": "平山县",
+        "value": "130131"
+      },
+      {
+        "label": "元氏县",
+        "value": "130132"
+      },
+      {
+        "label": "赵县",
+        "value": "130133"
+      },
+      {
+        "label": "石家庄高新技术产业开发区",
+        "value": "130171"
+      },
+      {
+        "label": "石家庄循环化工园区",
+        "value": "130172"
+      },
+      {
+        "label": "辛集市",
+        "value": "130181"
+      },
+      {
+        "label": "晋州市",
+        "value": "130183"
+      },
+      {
+        "label": "新乐市",
+        "value": "130184"
+      }
+    ],
+    [{
+        "label": "路南区",
+        "value": "130202"
+      },
+      {
+        "label": "路北区",
+        "value": "130203"
+      },
+      {
+        "label": "古冶区",
+        "value": "130204"
+      },
+      {
+        "label": "开平区",
+        "value": "130205"
+      },
+      {
+        "label": "丰南区",
+        "value": "130207"
+      },
+      {
+        "label": "丰润区",
+        "value": "130208"
+      },
+      {
+        "label": "曹妃甸区",
+        "value": "130209"
+      },
+      {
+        "label": "滦县",
+        "value": "130223"
+      },
+      {
+        "label": "滦南县",
+        "value": "130224"
+      },
+      {
+        "label": "乐亭县",
+        "value": "130225"
+      },
+      {
+        "label": "迁西县",
+        "value": "130227"
+      },
+      {
+        "label": "玉田县",
+        "value": "130229"
+      },
+      {
+        "label": "唐山市芦台经济技术开发区",
+        "value": "130271"
+      },
+      {
+        "label": "唐山市汉沽管理区",
+        "value": "130272"
+      },
+      {
+        "label": "唐山高新技术产业开发区",
+        "value": "130273"
+      },
+      {
+        "label": "河北唐山海港经济开发区",
+        "value": "130274"
+      },
+      {
+        "label": "遵化市",
+        "value": "130281"
+      },
+      {
+        "label": "迁安市",
+        "value": "130283"
+      }
+    ],
+    [{
+        "label": "海港区",
+        "value": "130302"
+      },
+      {
+        "label": "山海关区",
+        "value": "130303"
+      },
+      {
+        "label": "北戴河区",
+        "value": "130304"
+      },
+      {
+        "label": "抚宁区",
+        "value": "130306"
+      },
+      {
+        "label": "青龙满族自治县",
+        "value": "130321"
+      },
+      {
+        "label": "昌黎县",
+        "value": "130322"
+      },
+      {
+        "label": "卢龙县",
+        "value": "130324"
+      },
+      {
+        "label": "秦皇岛市经济技术开发区",
+        "value": "130371"
+      },
+      {
+        "label": "北戴河新区",
+        "value": "130372"
+      }
+    ],
+    [{
+        "label": "邯山区",
+        "value": "130402"
+      },
+      {
+        "label": "丛台区",
+        "value": "130403"
+      },
+      {
+        "label": "复兴区",
+        "value": "130404"
+      },
+      {
+        "label": "峰峰矿区",
+        "value": "130406"
+      },
+      {
+        "label": "肥乡区",
+        "value": "130407"
+      },
+      {
+        "label": "永年区",
+        "value": "130408"
+      },
+      {
+        "label": "临漳县",
+        "value": "130423"
+      },
+      {
+        "label": "成安县",
+        "value": "130424"
+      },
+      {
+        "label": "大名县",
+        "value": "130425"
+      },
+      {
+        "label": "涉县",
+        "value": "130426"
+      },
+      {
+        "label": "磁县",
+        "value": "130427"
+      },
+      {
+        "label": "邱县",
+        "value": "130430"
+      },
+      {
+        "label": "鸡泽县",
+        "value": "130431"
+      },
+      {
+        "label": "广平县",
+        "value": "130432"
+      },
+      {
+        "label": "馆陶县",
+        "value": "130433"
+      },
+      {
+        "label": "魏县",
+        "value": "130434"
+      },
+      {
+        "label": "曲周县",
+        "value": "130435"
+      },
+      {
+        "label": "邯郸经济技术开发区",
+        "value": "130471"
+      },
+      {
+        "label": "邯郸冀南新区",
+        "value": "130473"
+      },
+      {
+        "label": "武安市",
+        "value": "130481"
+      }
+    ],
+    [{
+        "label": "桥东区",
+        "value": "130502"
+      },
+      {
+        "label": "桥西区",
+        "value": "130503"
+      },
+      {
+        "label": "邢台县",
+        "value": "130521"
+      },
+      {
+        "label": "临城县",
+        "value": "130522"
+      },
+      {
+        "label": "内丘县",
+        "value": "130523"
+      },
+      {
+        "label": "柏乡县",
+        "value": "130524"
+      },
+      {
+        "label": "隆尧县",
+        "value": "130525"
+      },
+      {
+        "label": "任县",
+        "value": "130526"
+      },
+      {
+        "label": "南和县",
+        "value": "130527"
+      },
+      {
+        "label": "宁晋县",
+        "value": "130528"
+      },
+      {
+        "label": "巨鹿县",
+        "value": "130529"
+      },
+      {
+        "label": "新河县",
+        "value": "130530"
+      },
+      {
+        "label": "广宗县",
+        "value": "130531"
+      },
+      {
+        "label": "平乡县",
+        "value": "130532"
+      },
+      {
+        "label": "威县",
+        "value": "130533"
+      },
+      {
+        "label": "清河县",
+        "value": "130534"
+      },
+      {
+        "label": "临西县",
+        "value": "130535"
+      },
+      {
+        "label": "河北邢台经济开发区",
+        "value": "130571"
+      },
+      {
+        "label": "南宫市",
+        "value": "130581"
+      },
+      {
+        "label": "沙河市",
+        "value": "130582"
+      }
+    ],
+    [{
+        "label": "竞秀区",
+        "value": "130602"
+      },
+      {
+        "label": "莲池区",
+        "value": "130606"
+      },
+      {
+        "label": "满城区",
+        "value": "130607"
+      },
+      {
+        "label": "清苑区",
+        "value": "130608"
+      },
+      {
+        "label": "徐水区",
+        "value": "130609"
+      },
+      {
+        "label": "涞水县",
+        "value": "130623"
+      },
+      {
+        "label": "阜平县",
+        "value": "130624"
+      },
+      {
+        "label": "定兴县",
+        "value": "130626"
+      },
+      {
+        "label": "唐县",
+        "value": "130627"
+      },
+      {
+        "label": "高阳县",
+        "value": "130628"
+      },
+      {
+        "label": "容城县",
+        "value": "130629"
+      },
+      {
+        "label": "涞源县",
+        "value": "130630"
+      },
+      {
+        "label": "望都县",
+        "value": "130631"
+      },
+      {
+        "label": "安新县",
+        "value": "130632"
+      },
+      {
+        "label": "易县",
+        "value": "130633"
+      },
+      {
+        "label": "曲阳县",
+        "value": "130634"
+      },
+      {
+        "label": "蠡县",
+        "value": "130635"
+      },
+      {
+        "label": "顺平县",
+        "value": "130636"
+      },
+      {
+        "label": "博野县",
+        "value": "130637"
+      },
+      {
+        "label": "雄县",
+        "value": "130638"
+      },
+      {
+        "label": "保定高新技术产业开发区",
+        "value": "130671"
+      },
+      {
+        "label": "保定白沟新城",
+        "value": "130672"
+      },
+      {
+        "label": "涿州市",
+        "value": "130681"
+      },
+      {
+        "label": "定州市",
+        "value": "130682"
+      },
+      {
+        "label": "安国市",
+        "value": "130683"
+      },
+      {
+        "label": "高碑店市",
+        "value": "130684"
+      }
+    ],
+    [{
+        "label": "桥东区",
+        "value": "130702"
+      },
+      {
+        "label": "桥西区",
+        "value": "130703"
+      },
+      {
+        "label": "宣化区",
+        "value": "130705"
+      },
+      {
+        "label": "下花园区",
+        "value": "130706"
+      },
+      {
+        "label": "万全区",
+        "value": "130708"
+      },
+      {
+        "label": "崇礼区",
+        "value": "130709"
+      },
+      {
+        "label": "张北县",
+        "value": "130722"
+      },
+      {
+        "label": "康保县",
+        "value": "130723"
+      },
+      {
+        "label": "沽源县",
+        "value": "130724"
+      },
+      {
+        "label": "尚义县",
+        "value": "130725"
+      },
+      {
+        "label": "蔚县",
+        "value": "130726"
+      },
+      {
+        "label": "阳原县",
+        "value": "130727"
+      },
+      {
+        "label": "怀安县",
+        "value": "130728"
+      },
+      {
+        "label": "怀来县",
+        "value": "130730"
+      },
+      {
+        "label": "涿鹿县",
+        "value": "130731"
+      },
+      {
+        "label": "赤城县",
+        "value": "130732"
+      },
+      {
+        "label": "张家口市高新技术产业开发区",
+        "value": "130771"
+      },
+      {
+        "label": "张家口市察北管理区",
+        "value": "130772"
+      },
+      {
+        "label": "张家口市塞北管理区",
+        "value": "130773"
+      }
+    ],
+    [{
+        "label": "双桥区",
+        "value": "130802"
+      },
+      {
+        "label": "双滦区",
+        "value": "130803"
+      },
+      {
+        "label": "鹰手营子矿区",
+        "value": "130804"
+      },
+      {
+        "label": "承德县",
+        "value": "130821"
+      },
+      {
+        "label": "兴隆县",
+        "value": "130822"
+      },
+      {
+        "label": "滦平县",
+        "value": "130824"
+      },
+      {
+        "label": "隆化县",
+        "value": "130825"
+      },
+      {
+        "label": "丰宁满族自治县",
+        "value": "130826"
+      },
+      {
+        "label": "宽城满族自治县",
+        "value": "130827"
+      },
+      {
+        "label": "围场满族蒙古族自治县",
+        "value": "130828"
+      },
+      {
+        "label": "承德高新技术产业开发区",
+        "value": "130871"
+      },
+      {
+        "label": "平泉市",
+        "value": "130881"
+      }
+    ],
+    [{
+        "label": "新华区",
+        "value": "130902"
+      },
+      {
+        "label": "运河区",
+        "value": "130903"
+      },
+      {
+        "label": "沧县",
+        "value": "130921"
+      },
+      {
+        "label": "青县",
+        "value": "130922"
+      },
+      {
+        "label": "东光县",
+        "value": "130923"
+      },
+      {
+        "label": "海兴县",
+        "value": "130924"
+      },
+      {
+        "label": "盐山县",
+        "value": "130925"
+      },
+      {
+        "label": "肃宁县",
+        "value": "130926"
+      },
+      {
+        "label": "南皮县",
+        "value": "130927"
+      },
+      {
+        "label": "吴桥县",
+        "value": "130928"
+      },
+      {
+        "label": "献县",
+        "value": "130929"
+      },
+      {
+        "label": "孟村回族自治县",
+        "value": "130930"
+      },
+      {
+        "label": "河北沧州经济开发区",
+        "value": "130971"
+      },
+      {
+        "label": "沧州高新技术产业开发区",
+        "value": "130972"
+      },
+      {
+        "label": "沧州渤海新区",
+        "value": "130973"
+      },
+      {
+        "label": "泊头市",
+        "value": "130981"
+      },
+      {
+        "label": "任丘市",
+        "value": "130982"
+      },
+      {
+        "label": "黄骅市",
+        "value": "130983"
+      },
+      {
+        "label": "河间市",
+        "value": "130984"
+      }
+    ],
+    [{
+        "label": "安次区",
+        "value": "131002"
+      },
+      {
+        "label": "广阳区",
+        "value": "131003"
+      },
+      {
+        "label": "固安县",
+        "value": "131022"
+      },
+      {
+        "label": "永清县",
+        "value": "131023"
+      },
+      {
+        "label": "香河县",
+        "value": "131024"
+      },
+      {
+        "label": "大城县",
+        "value": "131025"
+      },
+      {
+        "label": "文安县",
+        "value": "131026"
+      },
+      {
+        "label": "大厂回族自治县",
+        "value": "131028"
+      },
+      {
+        "label": "廊坊经济技术开发区",
+        "value": "131071"
+      },
+      {
+        "label": "霸州市",
+        "value": "131081"
+      },
+      {
+        "label": "三河市",
+        "value": "131082"
+      }
+    ],
+    [{
+        "label": "桃城区",
+        "value": "131102"
+      },
+      {
+        "label": "冀州区",
+        "value": "131103"
+      },
+      {
+        "label": "枣强县",
+        "value": "131121"
+      },
+      {
+        "label": "武邑县",
+        "value": "131122"
+      },
+      {
+        "label": "武强县",
+        "value": "131123"
+      },
+      {
+        "label": "饶阳县",
+        "value": "131124"
+      },
+      {
+        "label": "安平县",
+        "value": "131125"
+      },
+      {
+        "label": "故城县",
+        "value": "131126"
+      },
+      {
+        "label": "景县",
+        "value": "131127"
+      },
+      {
+        "label": "阜城县",
+        "value": "131128"
+      },
+      {
+        "label": "河北衡水经济开发区",
+        "value": "131171"
+      },
+      {
+        "label": "衡水滨湖新区",
+        "value": "131172"
+      },
+      {
+        "label": "深州市",
+        "value": "131182"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "小店区",
+        "value": "140105"
+      },
+      {
+        "label": "迎泽区",
+        "value": "140106"
+      },
+      {
+        "label": "杏花岭区",
+        "value": "140107"
+      },
+      {
+        "label": "尖草坪区",
+        "value": "140108"
+      },
+      {
+        "label": "万柏林区",
+        "value": "140109"
+      },
+      {
+        "label": "晋源区",
+        "value": "140110"
+      },
+      {
+        "label": "清徐县",
+        "value": "140121"
+      },
+      {
+        "label": "阳曲县",
+        "value": "140122"
+      },
+      {
+        "label": "娄烦县",
+        "value": "140123"
+      },
+      {
+        "label": "山西转型综合改革示范区",
+        "value": "140171"
+      },
+      {
+        "label": "古交市",
+        "value": "140181"
+      }
+    ],
+    [{
+        "label": "城区",
+        "value": "140202"
+      },
+      {
+        "label": "矿区",
+        "value": "140203"
+      },
+      {
+        "label": "南郊区",
+        "value": "140211"
+      },
+      {
+        "label": "新荣区",
+        "value": "140212"
+      },
+      {
+        "label": "阳高县",
+        "value": "140221"
+      },
+      {
+        "label": "天镇县",
+        "value": "140222"
+      },
+      {
+        "label": "广灵县",
+        "value": "140223"
+      },
+      {
+        "label": "灵丘县",
+        "value": "140224"
+      },
+      {
+        "label": "浑源县",
+        "value": "140225"
+      },
+      {
+        "label": "左云县",
+        "value": "140226"
+      },
+      {
+        "label": "大同县",
+        "value": "140227"
+      },
+      {
+        "label": "山西大同经济开发区",
+        "value": "140271"
+      }
+    ],
+    [{
+        "label": "城区",
+        "value": "140302"
+      },
+      {
+        "label": "矿区",
+        "value": "140303"
+      },
+      {
+        "label": "郊区",
+        "value": "140311"
+      },
+      {
+        "label": "平定县",
+        "value": "140321"
+      },
+      {
+        "label": "盂县",
+        "value": "140322"
+      },
+      {
+        "label": "山西阳泉经济开发区",
+        "value": "140371"
+      }
+    ],
+    [{
+        "label": "城区",
+        "value": "140402"
+      },
+      {
+        "label": "郊区",
+        "value": "140411"
+      },
+      {
+        "label": "长治县",
+        "value": "140421"
+      },
+      {
+        "label": "襄垣县",
+        "value": "140423"
+      },
+      {
+        "label": "屯留县",
+        "value": "140424"
+      },
+      {
+        "label": "平顺县",
+        "value": "140425"
+      },
+      {
+        "label": "黎城县",
+        "value": "140426"
+      },
+      {
+        "label": "壶关县",
+        "value": "140427"
+      },
+      {
+        "label": "长子县",
+        "value": "140428"
+      },
+      {
+        "label": "武乡县",
+        "value": "140429"
+      },
+      {
+        "label": "沁县",
+        "value": "140430"
+      },
+      {
+        "label": "沁源县",
+        "value": "140431"
+      },
+      {
+        "label": "山西长治高新技术产业园区",
+        "value": "140471"
+      },
+      {
+        "label": "潞城市",
+        "value": "140481"
+      }
+    ],
+    [{
+        "label": "城区",
+        "value": "140502"
+      },
+      {
+        "label": "沁水县",
+        "value": "140521"
+      },
+      {
+        "label": "阳城县",
+        "value": "140522"
+      },
+      {
+        "label": "陵川县",
+        "value": "140524"
+      },
+      {
+        "label": "泽州县",
+        "value": "140525"
+      },
+      {
+        "label": "高平市",
+        "value": "140581"
+      }
+    ],
+    [{
+        "label": "朔城区",
+        "value": "140602"
+      },
+      {
+        "label": "平鲁区",
+        "value": "140603"
+      },
+      {
+        "label": "山阴县",
+        "value": "140621"
+      },
+      {
+        "label": "应县",
+        "value": "140622"
+      },
+      {
+        "label": "右玉县",
+        "value": "140623"
+      },
+      {
+        "label": "怀仁县",
+        "value": "140624"
+      },
+      {
+        "label": "山西朔州经济开发区",
+        "value": "140671"
+      }
+    ],
+    [{
+        "label": "榆次区",
+        "value": "140702"
+      },
+      {
+        "label": "榆社县",
+        "value": "140721"
+      },
+      {
+        "label": "左权县",
+        "value": "140722"
+      },
+      {
+        "label": "和顺县",
+        "value": "140723"
+      },
+      {
+        "label": "昔阳县",
+        "value": "140724"
+      },
+      {
+        "label": "寿阳县",
+        "value": "140725"
+      },
+      {
+        "label": "太谷县",
+        "value": "140726"
+      },
+      {
+        "label": "祁县",
+        "value": "140727"
+      },
+      {
+        "label": "平遥县",
+        "value": "140728"
+      },
+      {
+        "label": "灵石县",
+        "value": "140729"
+      },
+      {
+        "label": "介休市",
+        "value": "140781"
+      }
+    ],
+    [{
+        "label": "盐湖区",
+        "value": "140802"
+      },
+      {
+        "label": "临猗县",
+        "value": "140821"
+      },
+      {
+        "label": "万荣县",
+        "value": "140822"
+      },
+      {
+        "label": "闻喜县",
+        "value": "140823"
+      },
+      {
+        "label": "稷山县",
+        "value": "140824"
+      },
+      {
+        "label": "新绛县",
+        "value": "140825"
+      },
+      {
+        "label": "绛县",
+        "value": "140826"
+      },
+      {
+        "label": "垣曲县",
+        "value": "140827"
+      },
+      {
+        "label": "夏县",
+        "value": "140828"
+      },
+      {
+        "label": "平陆县",
+        "value": "140829"
+      },
+      {
+        "label": "芮城县",
+        "value": "140830"
+      },
+      {
+        "label": "永济市",
+        "value": "140881"
+      },
+      {
+        "label": "河津市",
+        "value": "140882"
+      }
+    ],
+    [{
+        "label": "忻府区",
+        "value": "140902"
+      },
+      {
+        "label": "定襄县",
+        "value": "140921"
+      },
+      {
+        "label": "五台县",
+        "value": "140922"
+      },
+      {
+        "label": "代县",
+        "value": "140923"
+      },
+      {
+        "label": "繁峙县",
+        "value": "140924"
+      },
+      {
+        "label": "宁武县",
+        "value": "140925"
+      },
+      {
+        "label": "静乐县",
+        "value": "140926"
+      },
+      {
+        "label": "神池县",
+        "value": "140927"
+      },
+      {
+        "label": "五寨县",
+        "value": "140928"
+      },
+      {
+        "label": "岢岚县",
+        "value": "140929"
+      },
+      {
+        "label": "河曲县",
+        "value": "140930"
+      },
+      {
+        "label": "保德县",
+        "value": "140931"
+      },
+      {
+        "label": "偏关县",
+        "value": "140932"
+      },
+      {
+        "label": "五台山风景名胜区",
+        "value": "140971"
+      },
+      {
+        "label": "原平市",
+        "value": "140981"
+      }
+    ],
+    [{
+        "label": "尧都区",
+        "value": "141002"
+      },
+      {
+        "label": "曲沃县",
+        "value": "141021"
+      },
+      {
+        "label": "翼城县",
+        "value": "141022"
+      },
+      {
+        "label": "襄汾县",
+        "value": "141023"
+      },
+      {
+        "label": "洪洞县",
+        "value": "141024"
+      },
+      {
+        "label": "古县",
+        "value": "141025"
+      },
+      {
+        "label": "安泽县",
+        "value": "141026"
+      },
+      {
+        "label": "浮山县",
+        "value": "141027"
+      },
+      {
+        "label": "吉县",
+        "value": "141028"
+      },
+      {
+        "label": "乡宁县",
+        "value": "141029"
+      },
+      {
+        "label": "大宁县",
+        "value": "141030"
+      },
+      {
+        "label": "隰县",
+        "value": "141031"
+      },
+      {
+        "label": "永和县",
+        "value": "141032"
+      },
+      {
+        "label": "蒲县",
+        "value": "141033"
+      },
+      {
+        "label": "汾西县",
+        "value": "141034"
+      },
+      {
+        "label": "侯马市",
+        "value": "141081"
+      },
+      {
+        "label": "霍州市",
+        "value": "141082"
+      }
+    ],
+    [{
+        "label": "离石区",
+        "value": "141102"
+      },
+      {
+        "label": "文水县",
+        "value": "141121"
+      },
+      {
+        "label": "交城县",
+        "value": "141122"
+      },
+      {
+        "label": "兴县",
+        "value": "141123"
+      },
+      {
+        "label": "临县",
+        "value": "141124"
+      },
+      {
+        "label": "柳林县",
+        "value": "141125"
+      },
+      {
+        "label": "石楼县",
+        "value": "141126"
+      },
+      {
+        "label": "岚县",
+        "value": "141127"
+      },
+      {
+        "label": "方山县",
+        "value": "141128"
+      },
+      {
+        "label": "中阳县",
+        "value": "141129"
+      },
+      {
+        "label": "交口县",
+        "value": "141130"
+      },
+      {
+        "label": "孝义市",
+        "value": "141181"
+      },
+      {
+        "label": "汾阳市",
+        "value": "141182"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "新城区",
+        "value": "150102"
+      },
+      {
+        "label": "回民区",
+        "value": "150103"
+      },
+      {
+        "label": "玉泉区",
+        "value": "150104"
+      },
+      {
+        "label": "赛罕区",
+        "value": "150105"
+      },
+      {
+        "label": "土默特左旗",
+        "value": "150121"
+      },
+      {
+        "label": "托克托县",
+        "value": "150122"
+      },
+      {
+        "label": "和林格尔县",
+        "value": "150123"
+      },
+      {
+        "label": "清水河县",
+        "value": "150124"
+      },
+      {
+        "label": "武川县",
+        "value": "150125"
+      },
+      {
+        "label": "呼和浩特金海工业园区",
+        "value": "150171"
+      },
+      {
+        "label": "呼和浩特经济技术开发区",
+        "value": "150172"
+      }
+    ],
+    [{
+        "label": "东河区",
+        "value": "150202"
+      },
+      {
+        "label": "昆都仑区",
+        "value": "150203"
+      },
+      {
+        "label": "青山区",
+        "value": "150204"
+      },
+      {
+        "label": "石拐区",
+        "value": "150205"
+      },
+      {
+        "label": "白云鄂博矿区",
+        "value": "150206"
+      },
+      {
+        "label": "九原区",
+        "value": "150207"
+      },
+      {
+        "label": "土默特右旗",
+        "value": "150221"
+      },
+      {
+        "label": "固阳县",
+        "value": "150222"
+      },
+      {
+        "label": "达尔罕茂明安联合旗",
+        "value": "150223"
+      },
+      {
+        "label": "包头稀土高新技术产业开发区",
+        "value": "150271"
+      }
+    ],
+    [{
+        "label": "海勃湾区",
+        "value": "150302"
+      },
+      {
+        "label": "海南区",
+        "value": "150303"
+      },
+      {
+        "label": "乌达区",
+        "value": "150304"
+      }
+    ],
+    [{
+        "label": "红山区",
+        "value": "150402"
+      },
+      {
+        "label": "元宝山区",
+        "value": "150403"
+      },
+      {
+        "label": "松山区",
+        "value": "150404"
+      },
+      {
+        "label": "阿鲁科尔沁旗",
+        "value": "150421"
+      },
+      {
+        "label": "巴林左旗",
+        "value": "150422"
+      },
+      {
+        "label": "巴林右旗",
+        "value": "150423"
+      },
+      {
+        "label": "林西县",
+        "value": "150424"
+      },
+      {
+        "label": "克什克腾旗",
+        "value": "150425"
+      },
+      {
+        "label": "翁牛特旗",
+        "value": "150426"
+      },
+      {
+        "label": "喀喇沁旗",
+        "value": "150428"
+      },
+      {
+        "label": "宁城县",
+        "value": "150429"
+      },
+      {
+        "label": "敖汉旗",
+        "value": "150430"
+      }
+    ],
+    [{
+        "label": "科尔沁区",
+        "value": "150502"
+      },
+      {
+        "label": "科尔沁左翼中旗",
+        "value": "150521"
+      },
+      {
+        "label": "科尔沁左翼后旗",
+        "value": "150522"
+      },
+      {
+        "label": "开鲁县",
+        "value": "150523"
+      },
+      {
+        "label": "库伦旗",
+        "value": "150524"
+      },
+      {
+        "label": "奈曼旗",
+        "value": "150525"
+      },
+      {
+        "label": "扎鲁特旗",
+        "value": "150526"
+      },
+      {
+        "label": "通辽经济技术开发区",
+        "value": "150571"
+      },
+      {
+        "label": "霍林郭勒市",
+        "value": "150581"
+      }
+    ],
+    [{
+        "label": "东胜区",
+        "value": "150602"
+      },
+      {
+        "label": "康巴什区",
+        "value": "150603"
+      },
+      {
+        "label": "达拉特旗",
+        "value": "150621"
+      },
+      {
+        "label": "准格尔旗",
+        "value": "150622"
+      },
+      {
+        "label": "鄂托克前旗",
+        "value": "150623"
+      },
+      {
+        "label": "鄂托克旗",
+        "value": "150624"
+      },
+      {
+        "label": "杭锦旗",
+        "value": "150625"
+      },
+      {
+        "label": "乌审旗",
+        "value": "150626"
+      },
+      {
+        "label": "伊金霍洛旗",
+        "value": "150627"
+      }
+    ],
+    [{
+        "label": "海拉尔区",
+        "value": "150702"
+      },
+      {
+        "label": "扎赉诺尔区",
+        "value": "150703"
+      },
+      {
+        "label": "阿荣旗",
+        "value": "150721"
+      },
+      {
+        "label": "莫力达瓦达斡尔族自治旗",
+        "value": "150722"
+      },
+      {
+        "label": "鄂伦春自治旗",
+        "value": "150723"
+      },
+      {
+        "label": "鄂温克族自治旗",
+        "value": "150724"
+      },
+      {
+        "label": "陈巴尔虎旗",
+        "value": "150725"
+      },
+      {
+        "label": "新巴尔虎左旗",
+        "value": "150726"
+      },
+      {
+        "label": "新巴尔虎右旗",
+        "value": "150727"
+      },
+      {
+        "label": "满洲里市",
+        "value": "150781"
+      },
+      {
+        "label": "牙克石市",
+        "value": "150782"
+      },
+      {
+        "label": "扎兰屯市",
+        "value": "150783"
+      },
+      {
+        "label": "额尔古纳市",
+        "value": "150784"
+      },
+      {
+        "label": "根河市",
+        "value": "150785"
+      }
+    ],
+    [{
+        "label": "临河区",
+        "value": "150802"
+      },
+      {
+        "label": "五原县",
+        "value": "150821"
+      },
+      {
+        "label": "磴口县",
+        "value": "150822"
+      },
+      {
+        "label": "乌拉特前旗",
+        "value": "150823"
+      },
+      {
+        "label": "乌拉特中旗",
+        "value": "150824"
+      },
+      {
+        "label": "乌拉特后旗",
+        "value": "150825"
+      },
+      {
+        "label": "杭锦后旗",
+        "value": "150826"
+      }
+    ],
+    [{
+        "label": "集宁区",
+        "value": "150902"
+      },
+      {
+        "label": "卓资县",
+        "value": "150921"
+      },
+      {
+        "label": "化德县",
+        "value": "150922"
+      },
+      {
+        "label": "商都县",
+        "value": "150923"
+      },
+      {
+        "label": "兴和县",
+        "value": "150924"
+      },
+      {
+        "label": "凉城县",
+        "value": "150925"
+      },
+      {
+        "label": "察哈尔右翼前旗",
+        "value": "150926"
+      },
+      {
+        "label": "察哈尔右翼中旗",
+        "value": "150927"
+      },
+      {
+        "label": "察哈尔右翼后旗",
+        "value": "150928"
+      },
+      {
+        "label": "四子王旗",
+        "value": "150929"
+      },
+      {
+        "label": "丰镇市",
+        "value": "150981"
+      }
+    ],
+    [{
+        "label": "乌兰浩特市",
+        "value": "152201"
+      },
+      {
+        "label": "阿尔山市",
+        "value": "152202"
+      },
+      {
+        "label": "科尔沁右翼前旗",
+        "value": "152221"
+      },
+      {
+        "label": "科尔沁右翼中旗",
+        "value": "152222"
+      },
+      {
+        "label": "扎赉特旗",
+        "value": "152223"
+      },
+      {
+        "label": "突泉县",
+        "value": "152224"
+      }
+    ],
+    [{
+        "label": "二连浩特市",
+        "value": "152501"
+      },
+      {
+        "label": "锡林浩特市",
+        "value": "152502"
+      },
+      {
+        "label": "阿巴嘎旗",
+        "value": "152522"
+      },
+      {
+        "label": "苏尼特左旗",
+        "value": "152523"
+      },
+      {
+        "label": "苏尼特右旗",
+        "value": "152524"
+      },
+      {
+        "label": "东乌珠穆沁旗",
+        "value": "152525"
+      },
+      {
+        "label": "西乌珠穆沁旗",
+        "value": "152526"
+      },
+      {
+        "label": "太仆寺旗",
+        "value": "152527"
+      },
+      {
+        "label": "镶黄旗",
+        "value": "152528"
+      },
+      {
+        "label": "正镶白旗",
+        "value": "152529"
+      },
+      {
+        "label": "正蓝旗",
+        "value": "152530"
+      },
+      {
+        "label": "多伦县",
+        "value": "152531"
+      },
+      {
+        "label": "乌拉盖管委会",
+        "value": "152571"
+      }
+    ],
+    [{
+        "label": "阿拉善左旗",
+        "value": "152921"
+      },
+      {
+        "label": "阿拉善右旗",
+        "value": "152922"
+      },
+      {
+        "label": "额济纳旗",
+        "value": "152923"
+      },
+      {
+        "label": "内蒙古阿拉善经济开发区",
+        "value": "152971"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "和平区",
+        "value": "210102"
+      },
+      {
+        "label": "沈河区",
+        "value": "210103"
+      },
+      {
+        "label": "大东区",
+        "value": "210104"
+      },
+      {
+        "label": "皇姑区",
+        "value": "210105"
+      },
+      {
+        "label": "铁西区",
+        "value": "210106"
+      },
+      {
+        "label": "苏家屯区",
+        "value": "210111"
+      },
+      {
+        "label": "浑南区",
+        "value": "210112"
+      },
+      {
+        "label": "沈北新区",
+        "value": "210113"
+      },
+      {
+        "label": "于洪区",
+        "value": "210114"
+      },
+      {
+        "label": "辽中区",
+        "value": "210115"
+      },
+      {
+        "label": "康平县",
+        "value": "210123"
+      },
+      {
+        "label": "法库县",
+        "value": "210124"
+      },
+      {
+        "label": "新民市",
+        "value": "210181"
+      }
+    ],
+    [{
+        "label": "中山区",
+        "value": "210202"
+      },
+      {
+        "label": "西岗区",
+        "value": "210203"
+      },
+      {
+        "label": "沙河口区",
+        "value": "210204"
+      },
+      {
+        "label": "甘井子区",
+        "value": "210211"
+      },
+      {
+        "label": "旅顺口区",
+        "value": "210212"
+      },
+      {
+        "label": "金州区",
+        "value": "210213"
+      },
+      {
+        "label": "普兰店区",
+        "value": "210214"
+      },
+      {
+        "label": "长海县",
+        "value": "210224"
+      },
+      {
+        "label": "瓦房店市",
+        "value": "210281"
+      },
+      {
+        "label": "庄河市",
+        "value": "210283"
+      }
+    ],
+    [{
+        "label": "铁东区",
+        "value": "210302"
+      },
+      {
+        "label": "铁西区",
+        "value": "210303"
+      },
+      {
+        "label": "立山区",
+        "value": "210304"
+      },
+      {
+        "label": "千山区",
+        "value": "210311"
+      },
+      {
+        "label": "台安县",
+        "value": "210321"
+      },
+      {
+        "label": "岫岩满族自治县",
+        "value": "210323"
+      },
+      {
+        "label": "海城市",
+        "value": "210381"
+      }
+    ],
+    [{
+        "label": "新抚区",
+        "value": "210402"
+      },
+      {
+        "label": "东洲区",
+        "value": "210403"
+      },
+      {
+        "label": "望花区",
+        "value": "210404"
+      },
+      {
+        "label": "顺城区",
+        "value": "210411"
+      },
+      {
+        "label": "抚顺县",
+        "value": "210421"
+      },
+      {
+        "label": "新宾满族自治县",
+        "value": "210422"
+      },
+      {
+        "label": "清原满族自治县",
+        "value": "210423"
+      }
+    ],
+    [{
+        "label": "平山区",
+        "value": "210502"
+      },
+      {
+        "label": "溪湖区",
+        "value": "210503"
+      },
+      {
+        "label": "明山区",
+        "value": "210504"
+      },
+      {
+        "label": "南芬区",
+        "value": "210505"
+      },
+      {
+        "label": "本溪满族自治县",
+        "value": "210521"
+      },
+      {
+        "label": "桓仁满族自治县",
+        "value": "210522"
+      }
+    ],
+    [{
+        "label": "元宝区",
+        "value": "210602"
+      },
+      {
+        "label": "振兴区",
+        "value": "210603"
+      },
+      {
+        "label": "振安区",
+        "value": "210604"
+      },
+      {
+        "label": "宽甸满族自治县",
+        "value": "210624"
+      },
+      {
+        "label": "东港市",
+        "value": "210681"
+      },
+      {
+        "label": "凤城市",
+        "value": "210682"
+      }
+    ],
+    [{
+        "label": "古塔区",
+        "value": "210702"
+      },
+      {
+        "label": "凌河区",
+        "value": "210703"
+      },
+      {
+        "label": "太和区",
+        "value": "210711"
+      },
+      {
+        "label": "黑山县",
+        "value": "210726"
+      },
+      {
+        "label": "义县",
+        "value": "210727"
+      },
+      {
+        "label": "凌海市",
+        "value": "210781"
+      },
+      {
+        "label": "北镇市",
+        "value": "210782"
+      }
+    ],
+    [{
+        "label": "站前区",
+        "value": "210802"
+      },
+      {
+        "label": "西市区",
+        "value": "210803"
+      },
+      {
+        "label": "鲅鱼圈区",
+        "value": "210804"
+      },
+      {
+        "label": "老边区",
+        "value": "210811"
+      },
+      {
+        "label": "盖州市",
+        "value": "210881"
+      },
+      {
+        "label": "大石桥市",
+        "value": "210882"
+      }
+    ],
+    [{
+        "label": "海州区",
+        "value": "210902"
+      },
+      {
+        "label": "新邱区",
+        "value": "210903"
+      },
+      {
+        "label": "太平区",
+        "value": "210904"
+      },
+      {
+        "label": "清河门区",
+        "value": "210905"
+      },
+      {
+        "label": "细河区",
+        "value": "210911"
+      },
+      {
+        "label": "阜新蒙古族自治县",
+        "value": "210921"
+      },
+      {
+        "label": "彰武县",
+        "value": "210922"
+      }
+    ],
+    [{
+        "label": "白塔区",
+        "value": "211002"
+      },
+      {
+        "label": "文圣区",
+        "value": "211003"
+      },
+      {
+        "label": "宏伟区",
+        "value": "211004"
+      },
+      {
+        "label": "弓长岭区",
+        "value": "211005"
+      },
+      {
+        "label": "太子河区",
+        "value": "211011"
+      },
+      {
+        "label": "辽阳县",
+        "value": "211021"
+      },
+      {
+        "label": "灯塔市",
+        "value": "211081"
+      }
+    ],
+    [{
+        "label": "双台子区",
+        "value": "211102"
+      },
+      {
+        "label": "兴隆台区",
+        "value": "211103"
+      },
+      {
+        "label": "大洼区",
+        "value": "211104"
+      },
+      {
+        "label": "盘山县",
+        "value": "211122"
+      }
+    ],
+    [{
+        "label": "银州区",
+        "value": "211202"
+      },
+      {
+        "label": "清河区",
+        "value": "211204"
+      },
+      {
+        "label": "铁岭县",
+        "value": "211221"
+      },
+      {
+        "label": "西丰县",
+        "value": "211223"
+      },
+      {
+        "label": "昌图县",
+        "value": "211224"
+      },
+      {
+        "label": "调兵山市",
+        "value": "211281"
+      },
+      {
+        "label": "开原市",
+        "value": "211282"
+      }
+    ],
+    [{
+        "label": "双塔区",
+        "value": "211302"
+      },
+      {
+        "label": "龙城区",
+        "value": "211303"
+      },
+      {
+        "label": "朝阳县",
+        "value": "211321"
+      },
+      {
+        "label": "建平县",
+        "value": "211322"
+      },
+      {
+        "label": "喀喇沁左翼蒙古族自治县",
+        "value": "211324"
+      },
+      {
+        "label": "北票市",
+        "value": "211381"
+      },
+      {
+        "label": "凌源市",
+        "value": "211382"
+      }
+    ],
+    [{
+        "label": "连山区",
+        "value": "211402"
+      },
+      {
+        "label": "龙港区",
+        "value": "211403"
+      },
+      {
+        "label": "南票区",
+        "value": "211404"
+      },
+      {
+        "label": "绥中县",
+        "value": "211421"
+      },
+      {
+        "label": "建昌县",
+        "value": "211422"
+      },
+      {
+        "label": "兴城市",
+        "value": "211481"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "南关区",
+        "value": "220102"
+      },
+      {
+        "label": "宽城区",
+        "value": "220103"
+      },
+      {
+        "label": "朝阳区",
+        "value": "220104"
+      },
+      {
+        "label": "二道区",
+        "value": "220105"
+      },
+      {
+        "label": "绿园区",
+        "value": "220106"
+      },
+      {
+        "label": "双阳区",
+        "value": "220112"
+      },
+      {
+        "label": "九台区",
+        "value": "220113"
+      },
+      {
+        "label": "农安县",
+        "value": "220122"
+      },
+      {
+        "label": "长春经济技术开发区",
+        "value": "220171"
+      },
+      {
+        "label": "长春净月高新技术产业开发区",
+        "value": "220172"
+      },
+      {
+        "label": "长春高新技术产业开发区",
+        "value": "220173"
+      },
+      {
+        "label": "长春汽车经济技术开发区",
+        "value": "220174"
+      },
+      {
+        "label": "榆树市",
+        "value": "220182"
+      },
+      {
+        "label": "德惠市",
+        "value": "220183"
+      }
+    ],
+    [{
+        "label": "昌邑区",
+        "value": "220202"
+      },
+      {
+        "label": "龙潭区",
+        "value": "220203"
+      },
+      {
+        "label": "船营区",
+        "value": "220204"
+      },
+      {
+        "label": "丰满区",
+        "value": "220211"
+      },
+      {
+        "label": "永吉县",
+        "value": "220221"
+      },
+      {
+        "label": "吉林经济开发区",
+        "value": "220271"
+      },
+      {
+        "label": "吉林高新技术产业开发区",
+        "value": "220272"
+      },
+      {
+        "label": "吉林中国新加坡食品区",
+        "value": "220273"
+      },
+      {
+        "label": "蛟河市",
+        "value": "220281"
+      },
+      {
+        "label": "桦甸市",
+        "value": "220282"
+      },
+      {
+        "label": "舒兰市",
+        "value": "220283"
+      },
+      {
+        "label": "磐石市",
+        "value": "220284"
+      }
+    ],
+    [{
+        "label": "铁西区",
+        "value": "220302"
+      },
+      {
+        "label": "铁东区",
+        "value": "220303"
+      },
+      {
+        "label": "梨树县",
+        "value": "220322"
+      },
+      {
+        "label": "伊通满族自治县",
+        "value": "220323"
+      },
+      {
+        "label": "公主岭市",
+        "value": "220381"
+      },
+      {
+        "label": "双辽市",
+        "value": "220382"
+      }
+    ],
+    [{
+        "label": "龙山区",
+        "value": "220402"
+      },
+      {
+        "label": "西安区",
+        "value": "220403"
+      },
+      {
+        "label": "东丰县",
+        "value": "220421"
+      },
+      {
+        "label": "东辽县",
+        "value": "220422"
+      }
+    ],
+    [{
+        "label": "东昌区",
+        "value": "220502"
+      },
+      {
+        "label": "二道江区",
+        "value": "220503"
+      },
+      {
+        "label": "通化县",
+        "value": "220521"
+      },
+      {
+        "label": "辉南县",
+        "value": "220523"
+      },
+      {
+        "label": "柳河县",
+        "value": "220524"
+      },
+      {
+        "label": "梅河口市",
+        "value": "220581"
+      },
+      {
+        "label": "集安市",
+        "value": "220582"
+      }
+    ],
+    [{
+        "label": "浑江区",
+        "value": "220602"
+      },
+      {
+        "label": "江源区",
+        "value": "220605"
+      },
+      {
+        "label": "抚松县",
+        "value": "220621"
+      },
+      {
+        "label": "靖宇县",
+        "value": "220622"
+      },
+      {
+        "label": "长白朝鲜族自治县",
+        "value": "220623"
+      },
+      {
+        "label": "临江市",
+        "value": "220681"
+      }
+    ],
+    [{
+        "label": "宁江区",
+        "value": "220702"
+      },
+      {
+        "label": "前郭尔罗斯蒙古族自治县",
+        "value": "220721"
+      },
+      {
+        "label": "长岭县",
+        "value": "220722"
+      },
+      {
+        "label": "乾安县",
+        "value": "220723"
+      },
+      {
+        "label": "吉林松原经济开发区",
+        "value": "220771"
+      },
+      {
+        "label": "扶余市",
+        "value": "220781"
+      }
+    ],
+    [{
+        "label": "洮北区",
+        "value": "220802"
+      },
+      {
+        "label": "镇赉县",
+        "value": "220821"
+      },
+      {
+        "label": "通榆县",
+        "value": "220822"
+      },
+      {
+        "label": "吉林白城经济开发区",
+        "value": "220871"
+      },
+      {
+        "label": "洮南市",
+        "value": "220881"
+      },
+      {
+        "label": "大安市",
+        "value": "220882"
+      }
+    ],
+    [{
+        "label": "延吉市",
+        "value": "222401"
+      },
+      {
+        "label": "图们市",
+        "value": "222402"
+      },
+      {
+        "label": "敦化市",
+        "value": "222403"
+      },
+      {
+        "label": "珲春市",
+        "value": "222404"
+      },
+      {
+        "label": "龙井市",
+        "value": "222405"
+      },
+      {
+        "label": "和龙市",
+        "value": "222406"
+      },
+      {
+        "label": "汪清县",
+        "value": "222424"
+      },
+      {
+        "label": "安图县",
+        "value": "222426"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "道里区",
+        "value": "230102"
+      },
+      {
+        "label": "南岗区",
+        "value": "230103"
+      },
+      {
+        "label": "道外区",
+        "value": "230104"
+      },
+      {
+        "label": "平房区",
+        "value": "230108"
+      },
+      {
+        "label": "松北区",
+        "value": "230109"
+      },
+      {
+        "label": "香坊区",
+        "value": "230110"
+      },
+      {
+        "label": "呼兰区",
+        "value": "230111"
+      },
+      {
+        "label": "阿城区",
+        "value": "230112"
+      },
+      {
+        "label": "双城区",
+        "value": "230113"
+      },
+      {
+        "label": "依兰县",
+        "value": "230123"
+      },
+      {
+        "label": "方正县",
+        "value": "230124"
+      },
+      {
+        "label": "宾县",
+        "value": "230125"
+      },
+      {
+        "label": "巴彦县",
+        "value": "230126"
+      },
+      {
+        "label": "木兰县",
+        "value": "230127"
+      },
+      {
+        "label": "通河县",
+        "value": "230128"
+      },
+      {
+        "label": "延寿县",
+        "value": "230129"
+      },
+      {
+        "label": "尚志市",
+        "value": "230183"
+      },
+      {
+        "label": "五常市",
+        "value": "230184"
+      }
+    ],
+    [{
+        "label": "龙沙区",
+        "value": "230202"
+      },
+      {
+        "label": "建华区",
+        "value": "230203"
+      },
+      {
+        "label": "铁锋区",
+        "value": "230204"
+      },
+      {
+        "label": "昂昂溪区",
+        "value": "230205"
+      },
+      {
+        "label": "富拉尔基区",
+        "value": "230206"
+      },
+      {
+        "label": "碾子山区",
+        "value": "230207"
+      },
+      {
+        "label": "梅里斯达斡尔族区",
+        "value": "230208"
+      },
+      {
+        "label": "龙江县",
+        "value": "230221"
+      },
+      {
+        "label": "依安县",
+        "value": "230223"
+      },
+      {
+        "label": "泰来县",
+        "value": "230224"
+      },
+      {
+        "label": "甘南县",
+        "value": "230225"
+      },
+      {
+        "label": "富裕县",
+        "value": "230227"
+      },
+      {
+        "label": "克山县",
+        "value": "230229"
+      },
+      {
+        "label": "克东县",
+        "value": "230230"
+      },
+      {
+        "label": "拜泉县",
+        "value": "230231"
+      },
+      {
+        "label": "讷河市",
+        "value": "230281"
+      }
+    ],
+    [{
+        "label": "鸡冠区",
+        "value": "230302"
+      },
+      {
+        "label": "恒山区",
+        "value": "230303"
+      },
+      {
+        "label": "滴道区",
+        "value": "230304"
+      },
+      {
+        "label": "梨树区",
+        "value": "230305"
+      },
+      {
+        "label": "城子河区",
+        "value": "230306"
+      },
+      {
+        "label": "麻山区",
+        "value": "230307"
+      },
+      {
+        "label": "鸡东县",
+        "value": "230321"
+      },
+      {
+        "label": "虎林市",
+        "value": "230381"
+      },
+      {
+        "label": "密山市",
+        "value": "230382"
+      }
+    ],
+    [{
+        "label": "向阳区",
+        "value": "230402"
+      },
+      {
+        "label": "工农区",
+        "value": "230403"
+      },
+      {
+        "label": "南山区",
+        "value": "230404"
+      },
+      {
+        "label": "兴安区",
+        "value": "230405"
+      },
+      {
+        "label": "东山区",
+        "value": "230406"
+      },
+      {
+        "label": "兴山区",
+        "value": "230407"
+      },
+      {
+        "label": "萝北县",
+        "value": "230421"
+      },
+      {
+        "label": "绥滨县",
+        "value": "230422"
+      }
+    ],
+    [{
+        "label": "尖山区",
+        "value": "230502"
+      },
+      {
+        "label": "岭东区",
+        "value": "230503"
+      },
+      {
+        "label": "四方台区",
+        "value": "230505"
+      },
+      {
+        "label": "宝山区",
+        "value": "230506"
+      },
+      {
+        "label": "集贤县",
+        "value": "230521"
+      },
+      {
+        "label": "友谊县",
+        "value": "230522"
+      },
+      {
+        "label": "宝清县",
+        "value": "230523"
+      },
+      {
+        "label": "饶河县",
+        "value": "230524"
+      }
+    ],
+    [{
+        "label": "萨尔图区",
+        "value": "230602"
+      },
+      {
+        "label": "龙凤区",
+        "value": "230603"
+      },
+      {
+        "label": "让胡路区",
+        "value": "230604"
+      },
+      {
+        "label": "红岗区",
+        "value": "230605"
+      },
+      {
+        "label": "大同区",
+        "value": "230606"
+      },
+      {
+        "label": "肇州县",
+        "value": "230621"
+      },
+      {
+        "label": "肇源县",
+        "value": "230622"
+      },
+      {
+        "label": "林甸县",
+        "value": "230623"
+      },
+      {
+        "label": "杜尔伯特蒙古族自治县",
+        "value": "230624"
+      },
+      {
+        "label": "大庆高新技术产业开发区",
+        "value": "230671"
+      }
+    ],
+    [{
+        "label": "伊春区",
+        "value": "230702"
+      },
+      {
+        "label": "南岔区",
+        "value": "230703"
+      },
+      {
+        "label": "友好区",
+        "value": "230704"
+      },
+      {
+        "label": "西林区",
+        "value": "230705"
+      },
+      {
+        "label": "翠峦区",
+        "value": "230706"
+      },
+      {
+        "label": "新青区",
+        "value": "230707"
+      },
+      {
+        "label": "美溪区",
+        "value": "230708"
+      },
+      {
+        "label": "金山屯区",
+        "value": "230709"
+      },
+      {
+        "label": "五营区",
+        "value": "230710"
+      },
+      {
+        "label": "乌马河区",
+        "value": "230711"
+      },
+      {
+        "label": "汤旺河区",
+        "value": "230712"
+      },
+      {
+        "label": "带岭区",
+        "value": "230713"
+      },
+      {
+        "label": "乌伊岭区",
+        "value": "230714"
+      },
+      {
+        "label": "红星区",
+        "value": "230715"
+      },
+      {
+        "label": "上甘岭区",
+        "value": "230716"
+      },
+      {
+        "label": "嘉荫县",
+        "value": "230722"
+      },
+      {
+        "label": "铁力市",
+        "value": "230781"
+      }
+    ],
+    [{
+        "label": "向阳区",
+        "value": "230803"
+      },
+      {
+        "label": "前进区",
+        "value": "230804"
+      },
+      {
+        "label": "东风区",
+        "value": "230805"
+      },
+      {
+        "label": "郊区",
+        "value": "230811"
+      },
+      {
+        "label": "桦南县",
+        "value": "230822"
+      },
+      {
+        "label": "桦川县",
+        "value": "230826"
+      },
+      {
+        "label": "汤原县",
+        "value": "230828"
+      },
+      {
+        "label": "同江市",
+        "value": "230881"
+      },
+      {
+        "label": "富锦市",
+        "value": "230882"
+      },
+      {
+        "label": "抚远市",
+        "value": "230883"
+      }
+    ],
+    [{
+        "label": "新兴区",
+        "value": "230902"
+      },
+      {
+        "label": "桃山区",
+        "value": "230903"
+      },
+      {
+        "label": "茄子河区",
+        "value": "230904"
+      },
+      {
+        "label": "勃利县",
+        "value": "230921"
+      }
+    ],
+    [{
+        "label": "东安区",
+        "value": "231002"
+      },
+      {
+        "label": "阳明区",
+        "value": "231003"
+      },
+      {
+        "label": "爱民区",
+        "value": "231004"
+      },
+      {
+        "label": "西安区",
+        "value": "231005"
+      },
+      {
+        "label": "林口县",
+        "value": "231025"
+      },
+      {
+        "label": "牡丹江经济技术开发区",
+        "value": "231071"
+      },
+      {
+        "label": "绥芬河市",
+        "value": "231081"
+      },
+      {
+        "label": "海林市",
+        "value": "231083"
+      },
+      {
+        "label": "宁安市",
+        "value": "231084"
+      },
+      {
+        "label": "穆棱市",
+        "value": "231085"
+      },
+      {
+        "label": "东宁市",
+        "value": "231086"
+      }
+    ],
+    [{
+        "label": "爱辉区",
+        "value": "231102"
+      },
+      {
+        "label": "嫩江县",
+        "value": "231121"
+      },
+      {
+        "label": "逊克县",
+        "value": "231123"
+      },
+      {
+        "label": "孙吴县",
+        "value": "231124"
+      },
+      {
+        "label": "北安市",
+        "value": "231181"
+      },
+      {
+        "label": "五大连池市",
+        "value": "231182"
+      }
+    ],
+    [{
+        "label": "北林区",
+        "value": "231202"
+      },
+      {
+        "label": "望奎县",
+        "value": "231221"
+      },
+      {
+        "label": "兰西县",
+        "value": "231222"
+      },
+      {
+        "label": "青冈县",
+        "value": "231223"
+      },
+      {
+        "label": "庆安县",
+        "value": "231224"
+      },
+      {
+        "label": "明水县",
+        "value": "231225"
+      },
+      {
+        "label": "绥棱县",
+        "value": "231226"
+      },
+      {
+        "label": "安达市",
+        "value": "231281"
+      },
+      {
+        "label": "肇东市",
+        "value": "231282"
+      },
+      {
+        "label": "海伦市",
+        "value": "231283"
+      }
+    ],
+    [{
+        "label": "加格达奇区",
+        "value": "232701"
+      },
+      {
+        "label": "松岭区",
+        "value": "232702"
+      },
+      {
+        "label": "新林区",
+        "value": "232703"
+      },
+      {
+        "label": "呼中区",
+        "value": "232704"
+      },
+      {
+        "label": "呼玛县",
+        "value": "232721"
+      },
+      {
+        "label": "塔河县",
+        "value": "232722"
+      },
+      {
+        "label": "漠河县",
+        "value": "232723"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "黄浦区",
+        "value": "310101"
+      },
+      {
+        "label": "徐汇区",
+        "value": "310104"
+      },
+      {
+        "label": "长宁区",
+        "value": "310105"
+      },
+      {
+        "label": "静安区",
+        "value": "310106"
+      },
+      {
+        "label": "普陀区",
+        "value": "310107"
+      },
+      {
+        "label": "虹口区",
+        "value": "310109"
+      },
+      {
+        "label": "杨浦区",
+        "value": "310110"
+      },
+      {
+        "label": "闵行区",
+        "value": "310112"
+      },
+      {
+        "label": "宝山区",
+        "value": "310113"
+      },
+      {
+        "label": "嘉定区",
+        "value": "310114"
+      },
+      {
+        "label": "浦东新区",
+        "value": "310115"
+      },
+      {
+        "label": "金山区",
+        "value": "310116"
+      },
+      {
+        "label": "松江区",
+        "value": "310117"
+      },
+      {
+        "label": "青浦区",
+        "value": "310118"
+      },
+      {
+        "label": "奉贤区",
+        "value": "310120"
+      },
+      {
+        "label": "崇明区",
+        "value": "310151"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "玄武区",
+        "value": "320102"
+      },
+      {
+        "label": "秦淮区",
+        "value": "320104"
+      },
+      {
+        "label": "建邺区",
+        "value": "320105"
+      },
+      {
+        "label": "鼓楼区",
+        "value": "320106"
+      },
+      {
+        "label": "浦口区",
+        "value": "320111"
+      },
+      {
+        "label": "栖霞区",
+        "value": "320113"
+      },
+      {
+        "label": "雨花台区",
+        "value": "320114"
+      },
+      {
+        "label": "江宁区",
+        "value": "320115"
+      },
+      {
+        "label": "六合区",
+        "value": "320116"
+      },
+      {
+        "label": "溧水区",
+        "value": "320117"
+      },
+      {
+        "label": "高淳区",
+        "value": "320118"
+      }
+    ],
+    [{
+        "label": "锡山区",
+        "value": "320205"
+      },
+      {
+        "label": "惠山区",
+        "value": "320206"
+      },
+      {
+        "label": "滨湖区",
+        "value": "320211"
+      },
+      {
+        "label": "梁溪区",
+        "value": "320213"
+      },
+      {
+        "label": "新吴区",
+        "value": "320214"
+      },
+      {
+        "label": "江阴市",
+        "value": "320281"
+      },
+      {
+        "label": "宜兴市",
+        "value": "320282"
+      }
+    ],
+    [{
+        "label": "鼓楼区",
+        "value": "320302"
+      },
+      {
+        "label": "云龙区",
+        "value": "320303"
+      },
+      {
+        "label": "贾汪区",
+        "value": "320305"
+      },
+      {
+        "label": "泉山区",
+        "value": "320311"
+      },
+      {
+        "label": "铜山区",
+        "value": "320312"
+      },
+      {
+        "label": "丰县",
+        "value": "320321"
+      },
+      {
+        "label": "沛县",
+        "value": "320322"
+      },
+      {
+        "label": "睢宁县",
+        "value": "320324"
+      },
+      {
+        "label": "徐州经济技术开发区",
+        "value": "320371"
+      },
+      {
+        "label": "新沂市",
+        "value": "320381"
+      },
+      {
+        "label": "邳州市",
+        "value": "320382"
+      }
+    ],
+    [{
+        "label": "天宁区",
+        "value": "320402"
+      },
+      {
+        "label": "钟楼区",
+        "value": "320404"
+      },
+      {
+        "label": "新北区",
+        "value": "320411"
+      },
+      {
+        "label": "武进区",
+        "value": "320412"
+      },
+      {
+        "label": "金坛区",
+        "value": "320413"
+      },
+      {
+        "label": "溧阳市",
+        "value": "320481"
+      }
+    ],
+    [{
+        "label": "虎丘区",
+        "value": "320505"
+      },
+      {
+        "label": "吴中区",
+        "value": "320506"
+      },
+      {
+        "label": "相城区",
+        "value": "320507"
+      },
+      {
+        "label": "姑苏区",
+        "value": "320508"
+      },
+      {
+        "label": "吴江区",
+        "value": "320509"
+      },
+      {
+        "label": "苏州工业园区",
+        "value": "320571"
+      },
+      {
+        "label": "常熟市",
+        "value": "320581"
+      },
+      {
+        "label": "张家港市",
+        "value": "320582"
+      },
+      {
+        "label": "昆山市",
+        "value": "320583"
+      },
+      {
+        "label": "太仓市",
+        "value": "320585"
+      }
+    ],
+    [{
+        "label": "崇川区",
+        "value": "320602"
+      },
+      {
+        "label": "港闸区",
+        "value": "320611"
+      },
+      {
+        "label": "通州区",
+        "value": "320612"
+      },
+      {
+        "label": "海安县",
+        "value": "320621"
+      },
+      {
+        "label": "如东县",
+        "value": "320623"
+      },
+      {
+        "label": "南通经济技术开发区",
+        "value": "320671"
+      },
+      {
+        "label": "启东市",
+        "value": "320681"
+      },
+      {
+        "label": "如皋市",
+        "value": "320682"
+      },
+      {
+        "label": "海门市",
+        "value": "320684"
+      }
+    ],
+    [{
+        "label": "连云区",
+        "value": "320703"
+      },
+      {
+        "label": "海州区",
+        "value": "320706"
+      },
+      {
+        "label": "赣榆区",
+        "value": "320707"
+      },
+      {
+        "label": "东海县",
+        "value": "320722"
+      },
+      {
+        "label": "灌云县",
+        "value": "320723"
+      },
+      {
+        "label": "灌南县",
+        "value": "320724"
+      },
+      {
+        "label": "连云港经济技术开发区",
+        "value": "320771"
+      },
+      {
+        "label": "连云港高新技术产业开发区",
+        "value": "320772"
+      }
+    ],
+    [{
+        "label": "淮安区",
+        "value": "320803"
+      },
+      {
+        "label": "淮阴区",
+        "value": "320804"
+      },
+      {
+        "label": "清江浦区",
+        "value": "320812"
+      },
+      {
+        "label": "洪泽区",
+        "value": "320813"
+      },
+      {
+        "label": "涟水县",
+        "value": "320826"
+      },
+      {
+        "label": "盱眙县",
+        "value": "320830"
+      },
+      {
+        "label": "金湖县",
+        "value": "320831"
+      },
+      {
+        "label": "淮安经济技术开发区",
+        "value": "320871"
+      }
+    ],
+    [{
+        "label": "亭湖区",
+        "value": "320902"
+      },
+      {
+        "label": "盐都区",
+        "value": "320903"
+      },
+      {
+        "label": "大丰区",
+        "value": "320904"
+      },
+      {
+        "label": "响水县",
+        "value": "320921"
+      },
+      {
+        "label": "滨海县",
+        "value": "320922"
+      },
+      {
+        "label": "阜宁县",
+        "value": "320923"
+      },
+      {
+        "label": "射阳县",
+        "value": "320924"
+      },
+      {
+        "label": "建湖县",
+        "value": "320925"
+      },
+      {
+        "label": "盐城经济技术开发区",
+        "value": "320971"
+      },
+      {
+        "label": "东台市",
+        "value": "320981"
+      }
+    ],
+    [{
+        "label": "广陵区",
+        "value": "321002"
+      },
+      {
+        "label": "邗江区",
+        "value": "321003"
+      },
+      {
+        "label": "江都区",
+        "value": "321012"
+      },
+      {
+        "label": "宝应县",
+        "value": "321023"
+      },
+      {
+        "label": "扬州经济技术开发区",
+        "value": "321071"
+      },
+      {
+        "label": "仪征市",
+        "value": "321081"
+      },
+      {
+        "label": "高邮市",
+        "value": "321084"
+      }
+    ],
+    [{
+        "label": "京口区",
+        "value": "321102"
+      },
+      {
+        "label": "润州区",
+        "value": "321111"
+      },
+      {
+        "label": "丹徒区",
+        "value": "321112"
+      },
+      {
+        "label": "镇江新区",
+        "value": "321171"
+      },
+      {
+        "label": "丹阳市",
+        "value": "321181"
+      },
+      {
+        "label": "扬中市",
+        "value": "321182"
+      },
+      {
+        "label": "句容市",
+        "value": "321183"
+      }
+    ],
+    [{
+        "label": "海陵区",
+        "value": "321202"
+      },
+      {
+        "label": "高港区",
+        "value": "321203"
+      },
+      {
+        "label": "姜堰区",
+        "value": "321204"
+      },
+      {
+        "label": "泰州医药高新技术产业开发区",
+        "value": "321271"
+      },
+      {
+        "label": "兴化市",
+        "value": "321281"
+      },
+      {
+        "label": "靖江市",
+        "value": "321282"
+      },
+      {
+        "label": "泰兴市",
+        "value": "321283"
+      }
+    ],
+    [{
+        "label": "宿城区",
+        "value": "321302"
+      },
+      {
+        "label": "宿豫区",
+        "value": "321311"
+      },
+      {
+        "label": "沭阳县",
+        "value": "321322"
+      },
+      {
+        "label": "泗阳县",
+        "value": "321323"
+      },
+      {
+        "label": "泗洪县",
+        "value": "321324"
+      },
+      {
+        "label": "宿迁经济技术开发区",
+        "value": "321371"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "上城区",
+        "value": "330102"
+      },
+      {
+        "label": "下城区",
+        "value": "330103"
+      },
+      {
+        "label": "江干区",
+        "value": "330104"
+      },
+      {
+        "label": "拱墅区",
+        "value": "330105"
+      },
+      {
+        "label": "西湖区",
+        "value": "330106"
+      },
+      {
+        "label": "滨江区",
+        "value": "330108"
+      },
+      {
+        "label": "萧山区",
+        "value": "330109"
+      },
+      {
+        "label": "余杭区",
+        "value": "330110"
+      },
+      {
+        "label": "富阳区",
+        "value": "330111"
+      },
+      {
+        "label": "临安区",
+        "value": "330112"
+      },
+      {
+        "label": "桐庐县",
+        "value": "330122"
+      },
+      {
+        "label": "淳安县",
+        "value": "330127"
+      },
+      {
+        "label": "建德市",
+        "value": "330182"
+      }
+    ],
+    [{
+        "label": "海曙区",
+        "value": "330203"
+      },
+      {
+        "label": "江北区",
+        "value": "330205"
+      },
+      {
+        "label": "北仑区",
+        "value": "330206"
+      },
+      {
+        "label": "镇海区",
+        "value": "330211"
+      },
+      {
+        "label": "鄞州区",
+        "value": "330212"
+      },
+      {
+        "label": "奉化区",
+        "value": "330213"
+      },
+      {
+        "label": "象山县",
+        "value": "330225"
+      },
+      {
+        "label": "宁海县",
+        "value": "330226"
+      },
+      {
+        "label": "余姚市",
+        "value": "330281"
+      },
+      {
+        "label": "慈溪市",
+        "value": "330282"
+      }
+    ],
+    [{
+        "label": "鹿城区",
+        "value": "330302"
+      },
+      {
+        "label": "龙湾区",
+        "value": "330303"
+      },
+      {
+        "label": "瓯海区",
+        "value": "330304"
+      },
+      {
+        "label": "洞头区",
+        "value": "330305"
+      },
+      {
+        "label": "永嘉县",
+        "value": "330324"
+      },
+      {
+        "label": "平阳县",
+        "value": "330326"
+      },
+      {
+        "label": "苍南县",
+        "value": "330327"
+      },
+      {
+        "label": "文成县",
+        "value": "330328"
+      },
+      {
+        "label": "泰顺县",
+        "value": "330329"
+      },
+      {
+        "label": "温州经济技术开发区",
+        "value": "330371"
+      },
+      {
+        "label": "瑞安市",
+        "value": "330381"
+      },
+      {
+        "label": "乐清市",
+        "value": "330382"
+      }
+    ],
+    [{
+        "label": "南湖区",
+        "value": "330402"
+      },
+      {
+        "label": "秀洲区",
+        "value": "330411"
+      },
+      {
+        "label": "嘉善县",
+        "value": "330421"
+      },
+      {
+        "label": "海盐县",
+        "value": "330424"
+      },
+      {
+        "label": "海宁市",
+        "value": "330481"
+      },
+      {
+        "label": "平湖市",
+        "value": "330482"
+      },
+      {
+        "label": "桐乡市",
+        "value": "330483"
+      }
+    ],
+    [{
+        "label": "吴兴区",
+        "value": "330502"
+      },
+      {
+        "label": "南浔区",
+        "value": "330503"
+      },
+      {
+        "label": "德清县",
+        "value": "330521"
+      },
+      {
+        "label": "长兴县",
+        "value": "330522"
+      },
+      {
+        "label": "安吉县",
+        "value": "330523"
+      }
+    ],
+    [{
+        "label": "越城区",
+        "value": "330602"
+      },
+      {
+        "label": "柯桥区",
+        "value": "330603"
+      },
+      {
+        "label": "上虞区",
+        "value": "330604"
+      },
+      {
+        "label": "新昌县",
+        "value": "330624"
+      },
+      {
+        "label": "诸暨市",
+        "value": "330681"
+      },
+      {
+        "label": "嵊州市",
+        "value": "330683"
+      }
+    ],
+    [{
+        "label": "婺城区",
+        "value": "330702"
+      },
+      {
+        "label": "金东区",
+        "value": "330703"
+      },
+      {
+        "label": "武义县",
+        "value": "330723"
+      },
+      {
+        "label": "浦江县",
+        "value": "330726"
+      },
+      {
+        "label": "磐安县",
+        "value": "330727"
+      },
+      {
+        "label": "兰溪市",
+        "value": "330781"
+      },
+      {
+        "label": "义乌市",
+        "value": "330782"
+      },
+      {
+        "label": "东阳市",
+        "value": "330783"
+      },
+      {
+        "label": "永康市",
+        "value": "330784"
+      }
+    ],
+    [{
+        "label": "柯城区",
+        "value": "330802"
+      },
+      {
+        "label": "衢江区",
+        "value": "330803"
+      },
+      {
+        "label": "常山县",
+        "value": "330822"
+      },
+      {
+        "label": "开化县",
+        "value": "330824"
+      },
+      {
+        "label": "龙游县",
+        "value": "330825"
+      },
+      {
+        "label": "江山市",
+        "value": "330881"
+      }
+    ],
+    [{
+        "label": "定海区",
+        "value": "330902"
+      },
+      {
+        "label": "普陀区",
+        "value": "330903"
+      },
+      {
+        "label": "岱山县",
+        "value": "330921"
+      },
+      {
+        "label": "嵊泗县",
+        "value": "330922"
+      }
+    ],
+    [{
+        "label": "椒江区",
+        "value": "331002"
+      },
+      {
+        "label": "黄岩区",
+        "value": "331003"
+      },
+      {
+        "label": "路桥区",
+        "value": "331004"
+      },
+      {
+        "label": "三门县",
+        "value": "331022"
+      },
+      {
+        "label": "天台县",
+        "value": "331023"
+      },
+      {
+        "label": "仙居县",
+        "value": "331024"
+      },
+      {
+        "label": "温岭市",
+        "value": "331081"
+      },
+      {
+        "label": "临海市",
+        "value": "331082"
+      },
+      {
+        "label": "玉环市",
+        "value": "331083"
+      }
+    ],
+    [{
+        "label": "莲都区",
+        "value": "331102"
+      },
+      {
+        "label": "青田县",
+        "value": "331121"
+      },
+      {
+        "label": "缙云县",
+        "value": "331122"
+      },
+      {
+        "label": "遂昌县",
+        "value": "331123"
+      },
+      {
+        "label": "松阳县",
+        "value": "331124"
+      },
+      {
+        "label": "云和县",
+        "value": "331125"
+      },
+      {
+        "label": "庆元县",
+        "value": "331126"
+      },
+      {
+        "label": "景宁畲族自治县",
+        "value": "331127"
+      },
+      {
+        "label": "龙泉市",
+        "value": "331181"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "瑶海区",
+        "value": "340102"
+      },
+      {
+        "label": "庐阳区",
+        "value": "340103"
+      },
+      {
+        "label": "蜀山区",
+        "value": "340104"
+      },
+      {
+        "label": "包河区",
+        "value": "340111"
+      },
+      {
+        "label": "长丰县",
+        "value": "340121"
+      },
+      {
+        "label": "肥东县",
+        "value": "340122"
+      },
+      {
+        "label": "肥西县",
+        "value": "340123"
+      },
+      {
+        "label": "庐江县",
+        "value": "340124"
+      },
+      {
+        "label": "合肥高新技术产业开发区",
+        "value": "340171"
+      },
+      {
+        "label": "合肥经济技术开发区",
+        "value": "340172"
+      },
+      {
+        "label": "合肥新站高新技术产业开发区",
+        "value": "340173"
+      },
+      {
+        "label": "巢湖市",
+        "value": "340181"
+      }
+    ],
+    [{
+        "label": "镜湖区",
+        "value": "340202"
+      },
+      {
+        "label": "弋江区",
+        "value": "340203"
+      },
+      {
+        "label": "鸠江区",
+        "value": "340207"
+      },
+      {
+        "label": "三山区",
+        "value": "340208"
+      },
+      {
+        "label": "芜湖县",
+        "value": "340221"
+      },
+      {
+        "label": "繁昌县",
+        "value": "340222"
+      },
+      {
+        "label": "南陵县",
+        "value": "340223"
+      },
+      {
+        "label": "无为县",
+        "value": "340225"
+      },
+      {
+        "label": "芜湖经济技术开发区",
+        "value": "340271"
+      },
+      {
+        "label": "安徽芜湖长江大桥经济开发区",
+        "value": "340272"
+      }
+    ],
+    [{
+        "label": "龙子湖区",
+        "value": "340302"
+      },
+      {
+        "label": "蚌山区",
+        "value": "340303"
+      },
+      {
+        "label": "禹会区",
+        "value": "340304"
+      },
+      {
+        "label": "淮上区",
+        "value": "340311"
+      },
+      {
+        "label": "怀远县",
+        "value": "340321"
+      },
+      {
+        "label": "五河县",
+        "value": "340322"
+      },
+      {
+        "label": "固镇县",
+        "value": "340323"
+      },
+      {
+        "label": "蚌埠市高新技术开发区",
+        "value": "340371"
+      },
+      {
+        "label": "蚌埠市经济开发区",
+        "value": "340372"
+      }
+    ],
+    [{
+        "label": "大通区",
+        "value": "340402"
+      },
+      {
+        "label": "田家庵区",
+        "value": "340403"
+      },
+      {
+        "label": "谢家集区",
+        "value": "340404"
+      },
+      {
+        "label": "八公山区",
+        "value": "340405"
+      },
+      {
+        "label": "潘集区",
+        "value": "340406"
+      },
+      {
+        "label": "凤台县",
+        "value": "340421"
+      },
+      {
+        "label": "寿县",
+        "value": "340422"
+      }
+    ],
+    [{
+        "label": "花山区",
+        "value": "340503"
+      },
+      {
+        "label": "雨山区",
+        "value": "340504"
+      },
+      {
+        "label": "博望区",
+        "value": "340506"
+      },
+      {
+        "label": "当涂县",
+        "value": "340521"
+      },
+      {
+        "label": "含山县",
+        "value": "340522"
+      },
+      {
+        "label": "和县",
+        "value": "340523"
+      }
+    ],
+    [{
+        "label": "杜集区",
+        "value": "340602"
+      },
+      {
+        "label": "相山区",
+        "value": "340603"
+      },
+      {
+        "label": "烈山区",
+        "value": "340604"
+      },
+      {
+        "label": "濉溪县",
+        "value": "340621"
+      }
+    ],
+    [{
+        "label": "铜官区",
+        "value": "340705"
+      },
+      {
+        "label": "义安区",
+        "value": "340706"
+      },
+      {
+        "label": "郊区",
+        "value": "340711"
+      },
+      {
+        "label": "枞阳县",
+        "value": "340722"
+      }
+    ],
+    [{
+        "label": "迎江区",
+        "value": "340802"
+      },
+      {
+        "label": "大观区",
+        "value": "340803"
+      },
+      {
+        "label": "宜秀区",
+        "value": "340811"
+      },
+      {
+        "label": "怀宁县",
+        "value": "340822"
+      },
+      {
+        "label": "潜山县",
+        "value": "340824"
+      },
+      {
+        "label": "太湖县",
+        "value": "340825"
+      },
+      {
+        "label": "宿松县",
+        "value": "340826"
+      },
+      {
+        "label": "望江县",
+        "value": "340827"
+      },
+      {
+        "label": "岳西县",
+        "value": "340828"
+      },
+      {
+        "label": "安徽安庆经济开发区",
+        "value": "340871"
+      },
+      {
+        "label": "桐城市",
+        "value": "340881"
+      }
+    ],
+    [{
+        "label": "屯溪区",
+        "value": "341002"
+      },
+      {
+        "label": "黄山区",
+        "value": "341003"
+      },
+      {
+        "label": "徽州区",
+        "value": "341004"
+      },
+      {
+        "label": "歙县",
+        "value": "341021"
+      },
+      {
+        "label": "休宁县",
+        "value": "341022"
+      },
+      {
+        "label": "黟县",
+        "value": "341023"
+      },
+      {
+        "label": "祁门县",
+        "value": "341024"
+      }
+    ],
+    [{
+        "label": "琅琊区",
+        "value": "341102"
+      },
+      {
+        "label": "南谯区",
+        "value": "341103"
+      },
+      {
+        "label": "来安县",
+        "value": "341122"
+      },
+      {
+        "label": "全椒县",
+        "value": "341124"
+      },
+      {
+        "label": "定远县",
+        "value": "341125"
+      },
+      {
+        "label": "凤阳县",
+        "value": "341126"
+      },
+      {
+        "label": "苏滁现代产业园",
+        "value": "341171"
+      },
+      {
+        "label": "滁州经济技术开发区",
+        "value": "341172"
+      },
+      {
+        "label": "天长市",
+        "value": "341181"
+      },
+      {
+        "label": "明光市",
+        "value": "341182"
+      }
+    ],
+    [{
+        "label": "颍州区",
+        "value": "341202"
+      },
+      {
+        "label": "颍东区",
+        "value": "341203"
+      },
+      {
+        "label": "颍泉区",
+        "value": "341204"
+      },
+      {
+        "label": "临泉县",
+        "value": "341221"
+      },
+      {
+        "label": "太和县",
+        "value": "341222"
+      },
+      {
+        "label": "阜南县",
+        "value": "341225"
+      },
+      {
+        "label": "颍上县",
+        "value": "341226"
+      },
+      {
+        "label": "阜阳合肥现代产业园区",
+        "value": "341271"
+      },
+      {
+        "label": "阜阳经济技术开发区",
+        "value": "341272"
+      },
+      {
+        "label": "界首市",
+        "value": "341282"
+      }
+    ],
+    [{
+        "label": "埇桥区",
+        "value": "341302"
+      },
+      {
+        "label": "砀山县",
+        "value": "341321"
+      },
+      {
+        "label": "萧县",
+        "value": "341322"
+      },
+      {
+        "label": "灵璧县",
+        "value": "341323"
+      },
+      {
+        "label": "泗县",
+        "value": "341324"
+      },
+      {
+        "label": "宿州马鞍山现代产业园区",
+        "value": "341371"
+      },
+      {
+        "label": "宿州经济技术开发区",
+        "value": "341372"
+      }
+    ],
+    [{
+        "label": "金安区",
+        "value": "341502"
+      },
+      {
+        "label": "裕安区",
+        "value": "341503"
+      },
+      {
+        "label": "叶集区",
+        "value": "341504"
+      },
+      {
+        "label": "霍邱县",
+        "value": "341522"
+      },
+      {
+        "label": "舒城县",
+        "value": "341523"
+      },
+      {
+        "label": "金寨县",
+        "value": "341524"
+      },
+      {
+        "label": "霍山县",
+        "value": "341525"
+      }
+    ],
+    [{
+        "label": "谯城区",
+        "value": "341602"
+      },
+      {
+        "label": "涡阳县",
+        "value": "341621"
+      },
+      {
+        "label": "蒙城县",
+        "value": "341622"
+      },
+      {
+        "label": "利辛县",
+        "value": "341623"
+      }
+    ],
+    [{
+        "label": "贵池区",
+        "value": "341702"
+      },
+      {
+        "label": "东至县",
+        "value": "341721"
+      },
+      {
+        "label": "石台县",
+        "value": "341722"
+      },
+      {
+        "label": "青阳县",
+        "value": "341723"
+      }
+    ],
+    [{
+        "label": "宣州区",
+        "value": "341802"
+      },
+      {
+        "label": "郎溪县",
+        "value": "341821"
+      },
+      {
+        "label": "广德县",
+        "value": "341822"
+      },
+      {
+        "label": "泾县",
+        "value": "341823"
+      },
+      {
+        "label": "绩溪县",
+        "value": "341824"
+      },
+      {
+        "label": "旌德县",
+        "value": "341825"
+      },
+      {
+        "label": "宣城市经济开发区",
+        "value": "341871"
+      },
+      {
+        "label": "宁国市",
+        "value": "341881"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "鼓楼区",
+        "value": "350102"
+      },
+      {
+        "label": "台江区",
+        "value": "350103"
+      },
+      {
+        "label": "仓山区",
+        "value": "350104"
+      },
+      {
+        "label": "马尾区",
+        "value": "350105"
+      },
+      {
+        "label": "晋安区",
+        "value": "350111"
+      },
+      {
+        "label": "闽侯县",
+        "value": "350121"
+      },
+      {
+        "label": "连江县",
+        "value": "350122"
+      },
+      {
+        "label": "罗源县",
+        "value": "350123"
+      },
+      {
+        "label": "闽清县",
+        "value": "350124"
+      },
+      {
+        "label": "永泰县",
+        "value": "350125"
+      },
+      {
+        "label": "平潭县",
+        "value": "350128"
+      },
+      {
+        "label": "福清市",
+        "value": "350181"
+      },
+      {
+        "label": "长乐市",
+        "value": "350182"
+      }
+    ],
+    [{
+        "label": "思明区",
+        "value": "350203"
+      },
+      {
+        "label": "海沧区",
+        "value": "350205"
+      },
+      {
+        "label": "湖里区",
+        "value": "350206"
+      },
+      {
+        "label": "集美区",
+        "value": "350211"
+      },
+      {
+        "label": "同安区",
+        "value": "350212"
+      },
+      {
+        "label": "翔安区",
+        "value": "350213"
+      }
+    ],
+    [{
+        "label": "城厢区",
+        "value": "350302"
+      },
+      {
+        "label": "涵江区",
+        "value": "350303"
+      },
+      {
+        "label": "荔城区",
+        "value": "350304"
+      },
+      {
+        "label": "秀屿区",
+        "value": "350305"
+      },
+      {
+        "label": "仙游县",
+        "value": "350322"
+      }
+    ],
+    [{
+        "label": "梅列区",
+        "value": "350402"
+      },
+      {
+        "label": "三元区",
+        "value": "350403"
+      },
+      {
+        "label": "明溪县",
+        "value": "350421"
+      },
+      {
+        "label": "清流县",
+        "value": "350423"
+      },
+      {
+        "label": "宁化县",
+        "value": "350424"
+      },
+      {
+        "label": "大田县",
+        "value": "350425"
+      },
+      {
+        "label": "尤溪县",
+        "value": "350426"
+      },
+      {
+        "label": "沙县",
+        "value": "350427"
+      },
+      {
+        "label": "将乐县",
+        "value": "350428"
+      },
+      {
+        "label": "泰宁县",
+        "value": "350429"
+      },
+      {
+        "label": "建宁县",
+        "value": "350430"
+      },
+      {
+        "label": "永安市",
+        "value": "350481"
+      }
+    ],
+    [{
+        "label": "鲤城区",
+        "value": "350502"
+      },
+      {
+        "label": "丰泽区",
+        "value": "350503"
+      },
+      {
+        "label": "洛江区",
+        "value": "350504"
+      },
+      {
+        "label": "泉港区",
+        "value": "350505"
+      },
+      {
+        "label": "惠安县",
+        "value": "350521"
+      },
+      {
+        "label": "安溪县",
+        "value": "350524"
+      },
+      {
+        "label": "永春县",
+        "value": "350525"
+      },
+      {
+        "label": "德化县",
+        "value": "350526"
+      },
+      {
+        "label": "金门县",
+        "value": "350527"
+      },
+      {
+        "label": "石狮市",
+        "value": "350581"
+      },
+      {
+        "label": "晋江市",
+        "value": "350582"
+      },
+      {
+        "label": "南安市",
+        "value": "350583"
+      }
+    ],
+    [{
+        "label": "芗城区",
+        "value": "350602"
+      },
+      {
+        "label": "龙文区",
+        "value": "350603"
+      },
+      {
+        "label": "云霄县",
+        "value": "350622"
+      },
+      {
+        "label": "漳浦县",
+        "value": "350623"
+      },
+      {
+        "label": "诏安县",
+        "value": "350624"
+      },
+      {
+        "label": "长泰县",
+        "value": "350625"
+      },
+      {
+        "label": "东山县",
+        "value": "350626"
+      },
+      {
+        "label": "南靖县",
+        "value": "350627"
+      },
+      {
+        "label": "平和县",
+        "value": "350628"
+      },
+      {
+        "label": "华安县",
+        "value": "350629"
+      },
+      {
+        "label": "龙海市",
+        "value": "350681"
+      }
+    ],
+    [{
+        "label": "延平区",
+        "value": "350702"
+      },
+      {
+        "label": "建阳区",
+        "value": "350703"
+      },
+      {
+        "label": "顺昌县",
+        "value": "350721"
+      },
+      {
+        "label": "浦城县",
+        "value": "350722"
+      },
+      {
+        "label": "光泽县",
+        "value": "350723"
+      },
+      {
+        "label": "松溪县",
+        "value": "350724"
+      },
+      {
+        "label": "政和县",
+        "value": "350725"
+      },
+      {
+        "label": "邵武市",
+        "value": "350781"
+      },
+      {
+        "label": "武夷山市",
+        "value": "350782"
+      },
+      {
+        "label": "建瓯市",
+        "value": "350783"
+      }
+    ],
+    [{
+        "label": "新罗区",
+        "value": "350802"
+      },
+      {
+        "label": "永定区",
+        "value": "350803"
+      },
+      {
+        "label": "长汀县",
+        "value": "350821"
+      },
+      {
+        "label": "上杭县",
+        "value": "350823"
+      },
+      {
+        "label": "武平县",
+        "value": "350824"
+      },
+      {
+        "label": "连城县",
+        "value": "350825"
+      },
+      {
+        "label": "漳平市",
+        "value": "350881"
+      }
+    ],
+    [{
+        "label": "蕉城区",
+        "value": "350902"
+      },
+      {
+        "label": "霞浦县",
+        "value": "350921"
+      },
+      {
+        "label": "古田县",
+        "value": "350922"
+      },
+      {
+        "label": "屏南县",
+        "value": "350923"
+      },
+      {
+        "label": "寿宁县",
+        "value": "350924"
+      },
+      {
+        "label": "周宁县",
+        "value": "350925"
+      },
+      {
+        "label": "柘荣县",
+        "value": "350926"
+      },
+      {
+        "label": "福安市",
+        "value": "350981"
+      },
+      {
+        "label": "福鼎市",
+        "value": "350982"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "东湖区",
+        "value": "360102"
+      },
+      {
+        "label": "西湖区",
+        "value": "360103"
+      },
+      {
+        "label": "青云谱区",
+        "value": "360104"
+      },
+      {
+        "label": "湾里区",
+        "value": "360105"
+      },
+      {
+        "label": "青山湖区",
+        "value": "360111"
+      },
+      {
+        "label": "新建区",
+        "value": "360112"
+      },
+      {
+        "label": "南昌县",
+        "value": "360121"
+      },
+      {
+        "label": "安义县",
+        "value": "360123"
+      },
+      {
+        "label": "进贤县",
+        "value": "360124"
+      }
+    ],
+    [{
+        "label": "昌江区",
+        "value": "360202"
+      },
+      {
+        "label": "珠山区",
+        "value": "360203"
+      },
+      {
+        "label": "浮梁县",
+        "value": "360222"
+      },
+      {
+        "label": "乐平市",
+        "value": "360281"
+      }
+    ],
+    [{
+        "label": "安源区",
+        "value": "360302"
+      },
+      {
+        "label": "湘东区",
+        "value": "360313"
+      },
+      {
+        "label": "莲花县",
+        "value": "360321"
+      },
+      {
+        "label": "上栗县",
+        "value": "360322"
+      },
+      {
+        "label": "芦溪县",
+        "value": "360323"
+      }
+    ],
+    [{
+        "label": "濂溪区",
+        "value": "360402"
+      },
+      {
+        "label": "浔阳区",
+        "value": "360403"
+      },
+      {
+        "label": "柴桑区",
+        "value": "360404"
+      },
+      {
+        "label": "武宁县",
+        "value": "360423"
+      },
+      {
+        "label": "修水县",
+        "value": "360424"
+      },
+      {
+        "label": "永修县",
+        "value": "360425"
+      },
+      {
+        "label": "德安县",
+        "value": "360426"
+      },
+      {
+        "label": "都昌县",
+        "value": "360428"
+      },
+      {
+        "label": "湖口县",
+        "value": "360429"
+      },
+      {
+        "label": "彭泽县",
+        "value": "360430"
+      },
+      {
+        "label": "瑞昌市",
+        "value": "360481"
+      },
+      {
+        "label": "共青城市",
+        "value": "360482"
+      },
+      {
+        "label": "庐山市",
+        "value": "360483"
+      }
+    ],
+    [{
+        "label": "渝水区",
+        "value": "360502"
+      },
+      {
+        "label": "分宜县",
+        "value": "360521"
+      }
+    ],
+    [{
+        "label": "月湖区",
+        "value": "360602"
+      },
+      {
+        "label": "余江县",
+        "value": "360622"
+      },
+      {
+        "label": "贵溪市",
+        "value": "360681"
+      }
+    ],
+    [{
+        "label": "章贡区",
+        "value": "360702"
+      },
+      {
+        "label": "南康区",
+        "value": "360703"
+      },
+      {
+        "label": "赣县区",
+        "value": "360704"
+      },
+      {
+        "label": "信丰县",
+        "value": "360722"
+      },
+      {
+        "label": "大余县",
+        "value": "360723"
+      },
+      {
+        "label": "上犹县",
+        "value": "360724"
+      },
+      {
+        "label": "崇义县",
+        "value": "360725"
+      },
+      {
+        "label": "安远县",
+        "value": "360726"
+      },
+      {
+        "label": "龙南县",
+        "value": "360727"
+      },
+      {
+        "label": "定南县",
+        "value": "360728"
+      },
+      {
+        "label": "全南县",
+        "value": "360729"
+      },
+      {
+        "label": "宁都县",
+        "value": "360730"
+      },
+      {
+        "label": "于都县",
+        "value": "360731"
+      },
+      {
+        "label": "兴国县",
+        "value": "360732"
+      },
+      {
+        "label": "会昌县",
+        "value": "360733"
+      },
+      {
+        "label": "寻乌县",
+        "value": "360734"
+      },
+      {
+        "label": "石城县",
+        "value": "360735"
+      },
+      {
+        "label": "瑞金市",
+        "value": "360781"
+      }
+    ],
+    [{
+        "label": "吉州区",
+        "value": "360802"
+      },
+      {
+        "label": "青原区",
+        "value": "360803"
+      },
+      {
+        "label": "吉安县",
+        "value": "360821"
+      },
+      {
+        "label": "吉水县",
+        "value": "360822"
+      },
+      {
+        "label": "峡江县",
+        "value": "360823"
+      },
+      {
+        "label": "新干县",
+        "value": "360824"
+      },
+      {
+        "label": "永丰县",
+        "value": "360825"
+      },
+      {
+        "label": "泰和县",
+        "value": "360826"
+      },
+      {
+        "label": "遂川县",
+        "value": "360827"
+      },
+      {
+        "label": "万安县",
+        "value": "360828"
+      },
+      {
+        "label": "安福县",
+        "value": "360829"
+      },
+      {
+        "label": "永新县",
+        "value": "360830"
+      },
+      {
+        "label": "井冈山市",
+        "value": "360881"
+      }
+    ],
+    [{
+        "label": "袁州区",
+        "value": "360902"
+      },
+      {
+        "label": "奉新县",
+        "value": "360921"
+      },
+      {
+        "label": "万载县",
+        "value": "360922"
+      },
+      {
+        "label": "上高县",
+        "value": "360923"
+      },
+      {
+        "label": "宜丰县",
+        "value": "360924"
+      },
+      {
+        "label": "靖安县",
+        "value": "360925"
+      },
+      {
+        "label": "铜鼓县",
+        "value": "360926"
+      },
+      {
+        "label": "丰城市",
+        "value": "360981"
+      },
+      {
+        "label": "樟树市",
+        "value": "360982"
+      },
+      {
+        "label": "高安市",
+        "value": "360983"
+      }
+    ],
+    [{
+        "label": "临川区",
+        "value": "361002"
+      },
+      {
+        "label": "东乡区",
+        "value": "361003"
+      },
+      {
+        "label": "南城县",
+        "value": "361021"
+      },
+      {
+        "label": "黎川县",
+        "value": "361022"
+      },
+      {
+        "label": "南丰县",
+        "value": "361023"
+      },
+      {
+        "label": "崇仁县",
+        "value": "361024"
+      },
+      {
+        "label": "乐安县",
+        "value": "361025"
+      },
+      {
+        "label": "宜黄县",
+        "value": "361026"
+      },
+      {
+        "label": "金溪县",
+        "value": "361027"
+      },
+      {
+        "label": "资溪县",
+        "value": "361028"
+      },
+      {
+        "label": "广昌县",
+        "value": "361030"
+      }
+    ],
+    [{
+        "label": "信州区",
+        "value": "361102"
+      },
+      {
+        "label": "广丰区",
+        "value": "361103"
+      },
+      {
+        "label": "上饶县",
+        "value": "361121"
+      },
+      {
+        "label": "玉山县",
+        "value": "361123"
+      },
+      {
+        "label": "铅山县",
+        "value": "361124"
+      },
+      {
+        "label": "横峰县",
+        "value": "361125"
+      },
+      {
+        "label": "弋阳县",
+        "value": "361126"
+      },
+      {
+        "label": "余干县",
+        "value": "361127"
+      },
+      {
+        "label": "鄱阳县",
+        "value": "361128"
+      },
+      {
+        "label": "万年县",
+        "value": "361129"
+      },
+      {
+        "label": "婺源县",
+        "value": "361130"
+      },
+      {
+        "label": "德兴市",
+        "value": "361181"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "历下区",
+        "value": "370102"
+      },
+      {
+        "label": "市中区",
+        "value": "370103"
+      },
+      {
+        "label": "槐荫区",
+        "value": "370104"
+      },
+      {
+        "label": "天桥区",
+        "value": "370105"
+      },
+      {
+        "label": "历城区",
+        "value": "370112"
+      },
+      {
+        "label": "长清区",
+        "value": "370113"
+      },
+      {
+        "label": "章丘区",
+        "value": "370114"
+      },
+      {
+        "label": "平阴县",
+        "value": "370124"
+      },
+      {
+        "label": "济阳县",
+        "value": "370125"
+      },
+      {
+        "label": "商河县",
+        "value": "370126"
+      },
+      {
+        "label": "济南高新技术产业开发区",
+        "value": "370171"
+      }
+    ],
+    [{
+        "label": "市南区",
+        "value": "370202"
+      },
+      {
+        "label": "市北区",
+        "value": "370203"
+      },
+      {
+        "label": "黄岛区",
+        "value": "370211"
+      },
+      {
+        "label": "崂山区",
+        "value": "370212"
+      },
+      {
+        "label": "李沧区",
+        "value": "370213"
+      },
+      {
+        "label": "城阳区",
+        "value": "370214"
+      },
+      {
+        "label": "即墨区",
+        "value": "370215"
+      },
+      {
+        "label": "青岛高新技术产业开发区",
+        "value": "370271"
+      },
+      {
+        "label": "胶州市",
+        "value": "370281"
+      },
+      {
+        "label": "平度市",
+        "value": "370283"
+      },
+      {
+        "label": "莱西市",
+        "value": "370285"
+      }
+    ],
+    [{
+        "label": "淄川区",
+        "value": "370302"
+      },
+      {
+        "label": "张店区",
+        "value": "370303"
+      },
+      {
+        "label": "博山区",
+        "value": "370304"
+      },
+      {
+        "label": "临淄区",
+        "value": "370305"
+      },
+      {
+        "label": "周村区",
+        "value": "370306"
+      },
+      {
+        "label": "桓台县",
+        "value": "370321"
+      },
+      {
+        "label": "高青县",
+        "value": "370322"
+      },
+      {
+        "label": "沂源县",
+        "value": "370323"
+      }
+    ],
+    [{
+        "label": "市中区",
+        "value": "370402"
+      },
+      {
+        "label": "薛城区",
+        "value": "370403"
+      },
+      {
+        "label": "峄城区",
+        "value": "370404"
+      },
+      {
+        "label": "台儿庄区",
+        "value": "370405"
+      },
+      {
+        "label": "山亭区",
+        "value": "370406"
+      },
+      {
+        "label": "滕州市",
+        "value": "370481"
+      }
+    ],
+    [{
+        "label": "东营区",
+        "value": "370502"
+      },
+      {
+        "label": "河口区",
+        "value": "370503"
+      },
+      {
+        "label": "垦利区",
+        "value": "370505"
+      },
+      {
+        "label": "利津县",
+        "value": "370522"
+      },
+      {
+        "label": "广饶县",
+        "value": "370523"
+      },
+      {
+        "label": "东营经济技术开发区",
+        "value": "370571"
+      },
+      {
+        "label": "东营港经济开发区",
+        "value": "370572"
+      }
+    ],
+    [{
+        "label": "芝罘区",
+        "value": "370602"
+      },
+      {
+        "label": "福山区",
+        "value": "370611"
+      },
+      {
+        "label": "牟平区",
+        "value": "370612"
+      },
+      {
+        "label": "莱山区",
+        "value": "370613"
+      },
+      {
+        "label": "长岛县",
+        "value": "370634"
+      },
+      {
+        "label": "烟台高新技术产业开发区",
+        "value": "370671"
+      },
+      {
+        "label": "烟台经济技术开发区",
+        "value": "370672"
+      },
+      {
+        "label": "龙口市",
+        "value": "370681"
+      },
+      {
+        "label": "莱阳市",
+        "value": "370682"
+      },
+      {
+        "label": "莱州市",
+        "value": "370683"
+      },
+      {
+        "label": "蓬莱市",
+        "value": "370684"
+      },
+      {
+        "label": "招远市",
+        "value": "370685"
+      },
+      {
+        "label": "栖霞市",
+        "value": "370686"
+      },
+      {
+        "label": "海阳市",
+        "value": "370687"
+      }
+    ],
+    [{
+        "label": "潍城区",
+        "value": "370702"
+      },
+      {
+        "label": "寒亭区",
+        "value": "370703"
+      },
+      {
+        "label": "坊子区",
+        "value": "370704"
+      },
+      {
+        "label": "奎文区",
+        "value": "370705"
+      },
+      {
+        "label": "临朐县",
+        "value": "370724"
+      },
+      {
+        "label": "昌乐县",
+        "value": "370725"
+      },
+      {
+        "label": "潍坊滨海经济技术开发区",
+        "value": "370772"
+      },
+      {
+        "label": "青州市",
+        "value": "370781"
+      },
+      {
+        "label": "诸城市",
+        "value": "370782"
+      },
+      {
+        "label": "寿光市",
+        "value": "370783"
+      },
+      {
+        "label": "安丘市",
+        "value": "370784"
+      },
+      {
+        "label": "高密市",
+        "value": "370785"
+      },
+      {
+        "label": "昌邑市",
+        "value": "370786"
+      }
+    ],
+    [{
+        "label": "任城区",
+        "value": "370811"
+      },
+      {
+        "label": "兖州区",
+        "value": "370812"
+      },
+      {
+        "label": "微山县",
+        "value": "370826"
+      },
+      {
+        "label": "鱼台县",
+        "value": "370827"
+      },
+      {
+        "label": "金乡县",
+        "value": "370828"
+      },
+      {
+        "label": "嘉祥县",
+        "value": "370829"
+      },
+      {
+        "label": "汶上县",
+        "value": "370830"
+      },
+      {
+        "label": "泗水县",
+        "value": "370831"
+      },
+      {
+        "label": "梁山县",
+        "value": "370832"
+      },
+      {
+        "label": "济宁高新技术产业开发区",
+        "value": "370871"
+      },
+      {
+        "label": "曲阜市",
+        "value": "370881"
+      },
+      {
+        "label": "邹城市",
+        "value": "370883"
+      }
+    ],
+    [{
+        "label": "泰山区",
+        "value": "370902"
+      },
+      {
+        "label": "岱岳区",
+        "value": "370911"
+      },
+      {
+        "label": "宁阳县",
+        "value": "370921"
+      },
+      {
+        "label": "东平县",
+        "value": "370923"
+      },
+      {
+        "label": "新泰市",
+        "value": "370982"
+      },
+      {
+        "label": "肥城市",
+        "value": "370983"
+      }
+    ],
+    [{
+        "label": "环翠区",
+        "value": "371002"
+      },
+      {
+        "label": "文登区",
+        "value": "371003"
+      },
+      {
+        "label": "威海火炬高技术产业开发区",
+        "value": "371071"
+      },
+      {
+        "label": "威海经济技术开发区",
+        "value": "371072"
+      },
+      {
+        "label": "威海临港经济技术开发区",
+        "value": "371073"
+      },
+      {
+        "label": "荣成市",
+        "value": "371082"
+      },
+      {
+        "label": "乳山市",
+        "value": "371083"
+      }
+    ],
+    [{
+        "label": "东港区",
+        "value": "371102"
+      },
+      {
+        "label": "岚山区",
+        "value": "371103"
+      },
+      {
+        "label": "五莲县",
+        "value": "371121"
+      },
+      {
+        "label": "莒县",
+        "value": "371122"
+      },
+      {
+        "label": "日照经济技术开发区",
+        "value": "371171"
+      },
+      {
+        "label": "日照国际海洋城",
+        "value": "371172"
+      }
+    ],
+    [{
+        "label": "莱城区",
+        "value": "371202"
+      },
+      {
+        "label": "钢城区",
+        "value": "371203"
+      }
+    ],
+    [{
+        "label": "兰山区",
+        "value": "371302"
+      },
+      {
+        "label": "罗庄区",
+        "value": "371311"
+      },
+      {
+        "label": "河东区",
+        "value": "371312"
+      },
+      {
+        "label": "沂南县",
+        "value": "371321"
+      },
+      {
+        "label": "郯城县",
+        "value": "371322"
+      },
+      {
+        "label": "沂水县",
+        "value": "371323"
+      },
+      {
+        "label": "兰陵县",
+        "value": "371324"
+      },
+      {
+        "label": "费县",
+        "value": "371325"
+      },
+      {
+        "label": "平邑县",
+        "value": "371326"
+      },
+      {
+        "label": "莒南县",
+        "value": "371327"
+      },
+      {
+        "label": "蒙阴县",
+        "value": "371328"
+      },
+      {
+        "label": "临沭县",
+        "value": "371329"
+      },
+      {
+        "label": "临沂高新技术产业开发区",
+        "value": "371371"
+      },
+      {
+        "label": "临沂经济技术开发区",
+        "value": "371372"
+      },
+      {
+        "label": "临沂临港经济开发区",
+        "value": "371373"
+      }
+    ],
+    [{
+        "label": "德城区",
+        "value": "371402"
+      },
+      {
+        "label": "陵城区",
+        "value": "371403"
+      },
+      {
+        "label": "宁津县",
+        "value": "371422"
+      },
+      {
+        "label": "庆云县",
+        "value": "371423"
+      },
+      {
+        "label": "临邑县",
+        "value": "371424"
+      },
+      {
+        "label": "齐河县",
+        "value": "371425"
+      },
+      {
+        "label": "平原县",
+        "value": "371426"
+      },
+      {
+        "label": "夏津县",
+        "value": "371427"
+      },
+      {
+        "label": "武城县",
+        "value": "371428"
+      },
+      {
+        "label": "德州经济技术开发区",
+        "value": "371471"
+      },
+      {
+        "label": "德州运河经济开发区",
+        "value": "371472"
+      },
+      {
+        "label": "乐陵市",
+        "value": "371481"
+      },
+      {
+        "label": "禹城市",
+        "value": "371482"
+      }
+    ],
+    [{
+        "label": "东昌府区",
+        "value": "371502"
+      },
+      {
+        "label": "阳谷县",
+        "value": "371521"
+      },
+      {
+        "label": "莘县",
+        "value": "371522"
+      },
+      {
+        "label": "茌平县",
+        "value": "371523"
+      },
+      {
+        "label": "东阿县",
+        "value": "371524"
+      },
+      {
+        "label": "冠县",
+        "value": "371525"
+      },
+      {
+        "label": "高唐县",
+        "value": "371526"
+      },
+      {
+        "label": "临清市",
+        "value": "371581"
+      }
+    ],
+    [{
+        "label": "滨城区",
+        "value": "371602"
+      },
+      {
+        "label": "沾化区",
+        "value": "371603"
+      },
+      {
+        "label": "惠民县",
+        "value": "371621"
+      },
+      {
+        "label": "阳信县",
+        "value": "371622"
+      },
+      {
+        "label": "无棣县",
+        "value": "371623"
+      },
+      {
+        "label": "博兴县",
+        "value": "371625"
+      },
+      {
+        "label": "邹平县",
+        "value": "371626"
+      }
+    ],
+    [{
+        "label": "牡丹区",
+        "value": "371702"
+      },
+      {
+        "label": "定陶区",
+        "value": "371703"
+      },
+      {
+        "label": "曹县",
+        "value": "371721"
+      },
+      {
+        "label": "单县",
+        "value": "371722"
+      },
+      {
+        "label": "成武县",
+        "value": "371723"
+      },
+      {
+        "label": "巨野县",
+        "value": "371724"
+      },
+      {
+        "label": "郓城县",
+        "value": "371725"
+      },
+      {
+        "label": "鄄城县",
+        "value": "371726"
+      },
+      {
+        "label": "东明县",
+        "value": "371728"
+      },
+      {
+        "label": "菏泽经济技术开发区",
+        "value": "371771"
+      },
+      {
+        "label": "菏泽高新技术开发区",
+        "value": "371772"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "中原区",
+        "value": "410102"
+      },
+      {
+        "label": "二七区",
+        "value": "410103"
+      },
+      {
+        "label": "管城回族区",
+        "value": "410104"
+      },
+      {
+        "label": "金水区",
+        "value": "410105"
+      },
+      {
+        "label": "上街区",
+        "value": "410106"
+      },
+      {
+        "label": "惠济区",
+        "value": "410108"
+      },
+      {
+        "label": "中牟县",
+        "value": "410122"
+      },
+      {
+        "label": "郑州经济技术开发区",
+        "value": "410171"
+      },
+      {
+        "label": "郑州高新技术产业开发区",
+        "value": "410172"
+      },
+      {
+        "label": "郑州航空港经济综合实验区",
+        "value": "410173"
+      },
+      {
+        "label": "巩义市",
+        "value": "410181"
+      },
+      {
+        "label": "荥阳市",
+        "value": "410182"
+      },
+      {
+        "label": "新密市",
+        "value": "410183"
+      },
+      {
+        "label": "新郑市",
+        "value": "410184"
+      },
+      {
+        "label": "登封市",
+        "value": "410185"
+      }
+    ],
+    [{
+        "label": "龙亭区",
+        "value": "410202"
+      },
+      {
+        "label": "顺河回族区",
+        "value": "410203"
+      },
+      {
+        "label": "鼓楼区",
+        "value": "410204"
+      },
+      {
+        "label": "禹王台区",
+        "value": "410205"
+      },
+      {
+        "label": "祥符区",
+        "value": "410212"
+      },
+      {
+        "label": "杞县",
+        "value": "410221"
+      },
+      {
+        "label": "通许县",
+        "value": "410222"
+      },
+      {
+        "label": "尉氏县",
+        "value": "410223"
+      },
+      {
+        "label": "兰考县",
+        "value": "410225"
+      }
+    ],
+    [{
+        "label": "老城区",
+        "value": "410302"
+      },
+      {
+        "label": "西工区",
+        "value": "410303"
+      },
+      {
+        "label": "瀍河回族区",
+        "value": "410304"
+      },
+      {
+        "label": "涧西区",
+        "value": "410305"
+      },
+      {
+        "label": "吉利区",
+        "value": "410306"
+      },
+      {
+        "label": "洛龙区",
+        "value": "410311"
+      },
+      {
+        "label": "孟津县",
+        "value": "410322"
+      },
+      {
+        "label": "新安县",
+        "value": "410323"
+      },
+      {
+        "label": "栾川县",
+        "value": "410324"
+      },
+      {
+        "label": "嵩县",
+        "value": "410325"
+      },
+      {
+        "label": "汝阳县",
+        "value": "410326"
+      },
+      {
+        "label": "宜阳县",
+        "value": "410327"
+      },
+      {
+        "label": "洛宁县",
+        "value": "410328"
+      },
+      {
+        "label": "伊川县",
+        "value": "410329"
+      },
+      {
+        "label": "洛阳高新技术产业开发区",
+        "value": "410371"
+      },
+      {
+        "label": "偃师市",
+        "value": "410381"
+      }
+    ],
+    [{
+        "label": "新华区",
+        "value": "410402"
+      },
+      {
+        "label": "卫东区",
+        "value": "410403"
+      },
+      {
+        "label": "石龙区",
+        "value": "410404"
+      },
+      {
+        "label": "湛河区",
+        "value": "410411"
+      },
+      {
+        "label": "宝丰县",
+        "value": "410421"
+      },
+      {
+        "label": "叶县",
+        "value": "410422"
+      },
+      {
+        "label": "鲁山县",
+        "value": "410423"
+      },
+      {
+        "label": "郏县",
+        "value": "410425"
+      },
+      {
+        "label": "平顶山高新技术产业开发区",
+        "value": "410471"
+      },
+      {
+        "label": "平顶山市新城区",
+        "value": "410472"
+      },
+      {
+        "label": "舞钢市",
+        "value": "410481"
+      },
+      {
+        "label": "汝州市",
+        "value": "410482"
+      }
+    ],
+    [{
+        "label": "文峰区",
+        "value": "410502"
+      },
+      {
+        "label": "北关区",
+        "value": "410503"
+      },
+      {
+        "label": "殷都区",
+        "value": "410505"
+      },
+      {
+        "label": "龙安区",
+        "value": "410506"
+      },
+      {
+        "label": "安阳县",
+        "value": "410522"
+      },
+      {
+        "label": "汤阴县",
+        "value": "410523"
+      },
+      {
+        "label": "滑县",
+        "value": "410526"
+      },
+      {
+        "label": "内黄县",
+        "value": "410527"
+      },
+      {
+        "label": "安阳高新技术产业开发区",
+        "value": "410571"
+      },
+      {
+        "label": "林州市",
+        "value": "410581"
+      }
+    ],
+    [{
+        "label": "鹤山区",
+        "value": "410602"
+      },
+      {
+        "label": "山城区",
+        "value": "410603"
+      },
+      {
+        "label": "淇滨区",
+        "value": "410611"
+      },
+      {
+        "label": "浚县",
+        "value": "410621"
+      },
+      {
+        "label": "淇县",
+        "value": "410622"
+      },
+      {
+        "label": "鹤壁经济技术开发区",
+        "value": "410671"
+      }
+    ],
+    [{
+        "label": "红旗区",
+        "value": "410702"
+      },
+      {
+        "label": "卫滨区",
+        "value": "410703"
+      },
+      {
+        "label": "凤泉区",
+        "value": "410704"
+      },
+      {
+        "label": "牧野区",
+        "value": "410711"
+      },
+      {
+        "label": "新乡县",
+        "value": "410721"
+      },
+      {
+        "label": "获嘉县",
+        "value": "410724"
+      },
+      {
+        "label": "原阳县",
+        "value": "410725"
+      },
+      {
+        "label": "延津县",
+        "value": "410726"
+      },
+      {
+        "label": "封丘县",
+        "value": "410727"
+      },
+      {
+        "label": "长垣县",
+        "value": "410728"
+      },
+      {
+        "label": "新乡高新技术产业开发区",
+        "value": "410771"
+      },
+      {
+        "label": "新乡经济技术开发区",
+        "value": "410772"
+      },
+      {
+        "label": "新乡市平原城乡一体化示范区",
+        "value": "410773"
+      },
+      {
+        "label": "卫辉市",
+        "value": "410781"
+      },
+      {
+        "label": "辉县市",
+        "value": "410782"
+      }
+    ],
+    [{
+        "label": "解放区",
+        "value": "410802"
+      },
+      {
+        "label": "中站区",
+        "value": "410803"
+      },
+      {
+        "label": "马村区",
+        "value": "410804"
+      },
+      {
+        "label": "山阳区",
+        "value": "410811"
+      },
+      {
+        "label": "修武县",
+        "value": "410821"
+      },
+      {
+        "label": "博爱县",
+        "value": "410822"
+      },
+      {
+        "label": "武陟县",
+        "value": "410823"
+      },
+      {
+        "label": "温县",
+        "value": "410825"
+      },
+      {
+        "label": "焦作城乡一体化示范区",
+        "value": "410871"
+      },
+      {
+        "label": "沁阳市",
+        "value": "410882"
+      },
+      {
+        "label": "孟州市",
+        "value": "410883"
+      }
+    ],
+    [{
+        "label": "华龙区",
+        "value": "410902"
+      },
+      {
+        "label": "清丰县",
+        "value": "410922"
+      },
+      {
+        "label": "南乐县",
+        "value": "410923"
+      },
+      {
+        "label": "范县",
+        "value": "410926"
+      },
+      {
+        "label": "台前县",
+        "value": "410927"
+      },
+      {
+        "label": "濮阳县",
+        "value": "410928"
+      },
+      {
+        "label": "河南濮阳工业园区",
+        "value": "410971"
+      },
+      {
+        "label": "濮阳经济技术开发区",
+        "value": "410972"
+      }
+    ],
+    [{
+        "label": "魏都区",
+        "value": "411002"
+      },
+      {
+        "label": "建安区",
+        "value": "411003"
+      },
+      {
+        "label": "鄢陵县",
+        "value": "411024"
+      },
+      {
+        "label": "襄城县",
+        "value": "411025"
+      },
+      {
+        "label": "许昌经济技术开发区",
+        "value": "411071"
+      },
+      {
+        "label": "禹州市",
+        "value": "411081"
+      },
+      {
+        "label": "长葛市",
+        "value": "411082"
+      }
+    ],
+    [{
+        "label": "源汇区",
+        "value": "411102"
+      },
+      {
+        "label": "郾城区",
+        "value": "411103"
+      },
+      {
+        "label": "召陵区",
+        "value": "411104"
+      },
+      {
+        "label": "舞阳县",
+        "value": "411121"
+      },
+      {
+        "label": "临颍县",
+        "value": "411122"
+      },
+      {
+        "label": "漯河经济技术开发区",
+        "value": "411171"
+      }
+    ],
+    [{
+        "label": "湖滨区",
+        "value": "411202"
+      },
+      {
+        "label": "陕州区",
+        "value": "411203"
+      },
+      {
+        "label": "渑池县",
+        "value": "411221"
+      },
+      {
+        "label": "卢氏县",
+        "value": "411224"
+      },
+      {
+        "label": "河南三门峡经济开发区",
+        "value": "411271"
+      },
+      {
+        "label": "义马市",
+        "value": "411281"
+      },
+      {
+        "label": "灵宝市",
+        "value": "411282"
+      }
+    ],
+    [{
+        "label": "宛城区",
+        "value": "411302"
+      },
+      {
+        "label": "卧龙区",
+        "value": "411303"
+      },
+      {
+        "label": "南召县",
+        "value": "411321"
+      },
+      {
+        "label": "方城县",
+        "value": "411322"
+      },
+      {
+        "label": "西峡县",
+        "value": "411323"
+      },
+      {
+        "label": "镇平县",
+        "value": "411324"
+      },
+      {
+        "label": "内乡县",
+        "value": "411325"
+      },
+      {
+        "label": "淅川县",
+        "value": "411326"
+      },
+      {
+        "label": "社旗县",
+        "value": "411327"
+      },
+      {
+        "label": "唐河县",
+        "value": "411328"
+      },
+      {
+        "label": "新野县",
+        "value": "411329"
+      },
+      {
+        "label": "桐柏县",
+        "value": "411330"
+      },
+      {
+        "label": "南阳高新技术产业开发区",
+        "value": "411371"
+      },
+      {
+        "label": "南阳市城乡一体化示范区",
+        "value": "411372"
+      },
+      {
+        "label": "邓州市",
+        "value": "411381"
+      }
+    ],
+    [{
+        "label": "梁园区",
+        "value": "411402"
+      },
+      {
+        "label": "睢阳区",
+        "value": "411403"
+      },
+      {
+        "label": "民权县",
+        "value": "411421"
+      },
+      {
+        "label": "睢县",
+        "value": "411422"
+      },
+      {
+        "label": "宁陵县",
+        "value": "411423"
+      },
+      {
+        "label": "柘城县",
+        "value": "411424"
+      },
+      {
+        "label": "虞城县",
+        "value": "411425"
+      },
+      {
+        "label": "夏邑县",
+        "value": "411426"
+      },
+      {
+        "label": "豫东综合物流产业聚集区",
+        "value": "411471"
+      },
+      {
+        "label": "河南商丘经济开发区",
+        "value": "411472"
+      },
+      {
+        "label": "永城市",
+        "value": "411481"
+      }
+    ],
+    [{
+        "label": "浉河区",
+        "value": "411502"
+      },
+      {
+        "label": "平桥区",
+        "value": "411503"
+      },
+      {
+        "label": "罗山县",
+        "value": "411521"
+      },
+      {
+        "label": "光山县",
+        "value": "411522"
+      },
+      {
+        "label": "新县",
+        "value": "411523"
+      },
+      {
+        "label": "商城县",
+        "value": "411524"
+      },
+      {
+        "label": "固始县",
+        "value": "411525"
+      },
+      {
+        "label": "潢川县",
+        "value": "411526"
+      },
+      {
+        "label": "淮滨县",
+        "value": "411527"
+      },
+      {
+        "label": "息县",
+        "value": "411528"
+      },
+      {
+        "label": "信阳高新技术产业开发区",
+        "value": "411571"
+      }
+    ],
+    [{
+        "label": "川汇区",
+        "value": "411602"
+      },
+      {
+        "label": "扶沟县",
+        "value": "411621"
+      },
+      {
+        "label": "西华县",
+        "value": "411622"
+      },
+      {
+        "label": "商水县",
+        "value": "411623"
+      },
+      {
+        "label": "沈丘县",
+        "value": "411624"
+      },
+      {
+        "label": "郸城县",
+        "value": "411625"
+      },
+      {
+        "label": "淮阳县",
+        "value": "411626"
+      },
+      {
+        "label": "太康县",
+        "value": "411627"
+      },
+      {
+        "label": "鹿邑县",
+        "value": "411628"
+      },
+      {
+        "label": "河南周口经济开发区",
+        "value": "411671"
+      },
+      {
+        "label": "项城市",
+        "value": "411681"
+      }
+    ],
+    [{
+        "label": "驿城区",
+        "value": "411702"
+      },
+      {
+        "label": "西平县",
+        "value": "411721"
+      },
+      {
+        "label": "上蔡县",
+        "value": "411722"
+      },
+      {
+        "label": "平舆县",
+        "value": "411723"
+      },
+      {
+        "label": "正阳县",
+        "value": "411724"
+      },
+      {
+        "label": "确山县",
+        "value": "411725"
+      },
+      {
+        "label": "泌阳县",
+        "value": "411726"
+      },
+      {
+        "label": "汝南县",
+        "value": "411727"
+      },
+      {
+        "label": "遂平县",
+        "value": "411728"
+      },
+      {
+        "label": "新蔡县",
+        "value": "411729"
+      },
+      {
+        "label": "河南驻马店经济开发区",
+        "value": "411771"
+      }
+    ],
+    [{
+      "label": "济源市",
+      "value": "419001"
+    }]
+  ],
+  [
+    [{
+        "label": "江岸区",
+        "value": "420102"
+      },
+      {
+        "label": "江汉区",
+        "value": "420103"
+      },
+      {
+        "label": "硚口区",
+        "value": "420104"
+      },
+      {
+        "label": "汉阳区",
+        "value": "420105"
+      },
+      {
+        "label": "武昌区",
+        "value": "420106"
+      },
+      {
+        "label": "青山区",
+        "value": "420107"
+      },
+      {
+        "label": "洪山区",
+        "value": "420111"
+      },
+      {
+        "label": "东西湖区",
+        "value": "420112"
+      },
+      {
+        "label": "汉南区",
+        "value": "420113"
+      },
+      {
+        "label": "蔡甸区",
+        "value": "420114"
+      },
+      {
+        "label": "江夏区",
+        "value": "420115"
+      },
+      {
+        "label": "黄陂区",
+        "value": "420116"
+      },
+      {
+        "label": "新洲区",
+        "value": "420117"
+      }
+    ],
+    [{
+        "label": "黄石港区",
+        "value": "420202"
+      },
+      {
+        "label": "西塞山区",
+        "value": "420203"
+      },
+      {
+        "label": "下陆区",
+        "value": "420204"
+      },
+      {
+        "label": "铁山区",
+        "value": "420205"
+      },
+      {
+        "label": "阳新县",
+        "value": "420222"
+      },
+      {
+        "label": "大冶市",
+        "value": "420281"
+      }
+    ],
+    [{
+        "label": "茅箭区",
+        "value": "420302"
+      },
+      {
+        "label": "张湾区",
+        "value": "420303"
+      },
+      {
+        "label": "郧阳区",
+        "value": "420304"
+      },
+      {
+        "label": "郧西县",
+        "value": "420322"
+      },
+      {
+        "label": "竹山县",
+        "value": "420323"
+      },
+      {
+        "label": "竹溪县",
+        "value": "420324"
+      },
+      {
+        "label": "房县",
+        "value": "420325"
+      },
+      {
+        "label": "丹江口市",
+        "value": "420381"
+      }
+    ],
+    [{
+        "label": "西陵区",
+        "value": "420502"
+      },
+      {
+        "label": "伍家岗区",
+        "value": "420503"
+      },
+      {
+        "label": "点军区",
+        "value": "420504"
+      },
+      {
+        "label": "猇亭区",
+        "value": "420505"
+      },
+      {
+        "label": "夷陵区",
+        "value": "420506"
+      },
+      {
+        "label": "远安县",
+        "value": "420525"
+      },
+      {
+        "label": "兴山县",
+        "value": "420526"
+      },
+      {
+        "label": "秭归县",
+        "value": "420527"
+      },
+      {
+        "label": "长阳土家族自治县",
+        "value": "420528"
+      },
+      {
+        "label": "五峰土家族自治县",
+        "value": "420529"
+      },
+      {
+        "label": "宜都市",
+        "value": "420581"
+      },
+      {
+        "label": "当阳市",
+        "value": "420582"
+      },
+      {
+        "label": "枝江市",
+        "value": "420583"
+      }
+    ],
+    [{
+        "label": "襄城区",
+        "value": "420602"
+      },
+      {
+        "label": "樊城区",
+        "value": "420606"
+      },
+      {
+        "label": "襄州区",
+        "value": "420607"
+      },
+      {
+        "label": "南漳县",
+        "value": "420624"
+      },
+      {
+        "label": "谷城县",
+        "value": "420625"
+      },
+      {
+        "label": "保康县",
+        "value": "420626"
+      },
+      {
+        "label": "老河口市",
+        "value": "420682"
+      },
+      {
+        "label": "枣阳市",
+        "value": "420683"
+      },
+      {
+        "label": "宜城市",
+        "value": "420684"
+      }
+    ],
+    [{
+        "label": "梁子湖区",
+        "value": "420702"
+      },
+      {
+        "label": "华容区",
+        "value": "420703"
+      },
+      {
+        "label": "鄂城区",
+        "value": "420704"
+      }
+    ],
+    [{
+        "label": "东宝区",
+        "value": "420802"
+      },
+      {
+        "label": "掇刀区",
+        "value": "420804"
+      },
+      {
+        "label": "京山县",
+        "value": "420821"
+      },
+      {
+        "label": "沙洋县",
+        "value": "420822"
+      },
+      {
+        "label": "钟祥市",
+        "value": "420881"
+      }
+    ],
+    [{
+        "label": "孝南区",
+        "value": "420902"
+      },
+      {
+        "label": "孝昌县",
+        "value": "420921"
+      },
+      {
+        "label": "大悟县",
+        "value": "420922"
+      },
+      {
+        "label": "云梦县",
+        "value": "420923"
+      },
+      {
+        "label": "应城市",
+        "value": "420981"
+      },
+      {
+        "label": "安陆市",
+        "value": "420982"
+      },
+      {
+        "label": "汉川市",
+        "value": "420984"
+      }
+    ],
+    [{
+        "label": "沙市区",
+        "value": "421002"
+      },
+      {
+        "label": "荆州区",
+        "value": "421003"
+      },
+      {
+        "label": "公安县",
+        "value": "421022"
+      },
+      {
+        "label": "监利县",
+        "value": "421023"
+      },
+      {
+        "label": "江陵县",
+        "value": "421024"
+      },
+      {
+        "label": "荆州经济技术开发区",
+        "value": "421071"
+      },
+      {
+        "label": "石首市",
+        "value": "421081"
+      },
+      {
+        "label": "洪湖市",
+        "value": "421083"
+      },
+      {
+        "label": "松滋市",
+        "value": "421087"
+      }
+    ],
+    [{
+        "label": "黄州区",
+        "value": "421102"
+      },
+      {
+        "label": "团风县",
+        "value": "421121"
+      },
+      {
+        "label": "红安县",
+        "value": "421122"
+      },
+      {
+        "label": "罗田县",
+        "value": "421123"
+      },
+      {
+        "label": "英山县",
+        "value": "421124"
+      },
+      {
+        "label": "浠水县",
+        "value": "421125"
+      },
+      {
+        "label": "蕲春县",
+        "value": "421126"
+      },
+      {
+        "label": "黄梅县",
+        "value": "421127"
+      },
+      {
+        "label": "龙感湖管理区",
+        "value": "421171"
+      },
+      {
+        "label": "麻城市",
+        "value": "421181"
+      },
+      {
+        "label": "武穴市",
+        "value": "421182"
+      }
+    ],
+    [{
+        "label": "咸安区",
+        "value": "421202"
+      },
+      {
+        "label": "嘉鱼县",
+        "value": "421221"
+      },
+      {
+        "label": "通城县",
+        "value": "421222"
+      },
+      {
+        "label": "崇阳县",
+        "value": "421223"
+      },
+      {
+        "label": "通山县",
+        "value": "421224"
+      },
+      {
+        "label": "赤壁市",
+        "value": "421281"
+      }
+    ],
+    [{
+        "label": "曾都区",
+        "value": "421303"
+      },
+      {
+        "label": "随县",
+        "value": "421321"
+      },
+      {
+        "label": "广水市",
+        "value": "421381"
+      }
+    ],
+    [{
+        "label": "恩施市",
+        "value": "422801"
+      },
+      {
+        "label": "利川市",
+        "value": "422802"
+      },
+      {
+        "label": "建始县",
+        "value": "422822"
+      },
+      {
+        "label": "巴东县",
+        "value": "422823"
+      },
+      {
+        "label": "宣恩县",
+        "value": "422825"
+      },
+      {
+        "label": "咸丰县",
+        "value": "422826"
+      },
+      {
+        "label": "来凤县",
+        "value": "422827"
+      },
+      {
+        "label": "鹤峰县",
+        "value": "422828"
+      }
+    ],
+    [{
+        "label": "仙桃市",
+        "value": "429004"
+      },
+      {
+        "label": "潜江市",
+        "value": "429005"
+      },
+      {
+        "label": "天门市",
+        "value": "429006"
+      },
+      {
+        "label": "神农架林区",
+        "value": "429021"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "芙蓉区",
+        "value": "430102"
+      },
+      {
+        "label": "天心区",
+        "value": "430103"
+      },
+      {
+        "label": "岳麓区",
+        "value": "430104"
+      },
+      {
+        "label": "开福区",
+        "value": "430105"
+      },
+      {
+        "label": "雨花区",
+        "value": "430111"
+      },
+      {
+        "label": "望城区",
+        "value": "430112"
+      },
+      {
+        "label": "长沙县",
+        "value": "430121"
+      },
+      {
+        "label": "浏阳市",
+        "value": "430181"
+      },
+      {
+        "label": "宁乡市",
+        "value": "430182"
+      }
+    ],
+    [{
+        "label": "荷塘区",
+        "value": "430202"
+      },
+      {
+        "label": "芦淞区",
+        "value": "430203"
+      },
+      {
+        "label": "石峰区",
+        "value": "430204"
+      },
+      {
+        "label": "天元区",
+        "value": "430211"
+      },
+      {
+        "label": "株洲县",
+        "value": "430221"
+      },
+      {
+        "label": "攸县",
+        "value": "430223"
+      },
+      {
+        "label": "茶陵县",
+        "value": "430224"
+      },
+      {
+        "label": "炎陵县",
+        "value": "430225"
+      },
+      {
+        "label": "云龙示范区",
+        "value": "430271"
+      },
+      {
+        "label": "醴陵市",
+        "value": "430281"
+      }
+    ],
+    [{
+        "label": "雨湖区",
+        "value": "430302"
+      },
+      {
+        "label": "岳塘区",
+        "value": "430304"
+      },
+      {
+        "label": "湘潭县",
+        "value": "430321"
+      },
+      {
+        "label": "湖南湘潭高新技术产业园区",
+        "value": "430371"
+      },
+      {
+        "label": "湘潭昭山示范区",
+        "value": "430372"
+      },
+      {
+        "label": "湘潭九华示范区",
+        "value": "430373"
+      },
+      {
+        "label": "湘乡市",
+        "value": "430381"
+      },
+      {
+        "label": "韶山市",
+        "value": "430382"
+      }
+    ],
+    [{
+        "label": "珠晖区",
+        "value": "430405"
+      },
+      {
+        "label": "雁峰区",
+        "value": "430406"
+      },
+      {
+        "label": "石鼓区",
+        "value": "430407"
+      },
+      {
+        "label": "蒸湘区",
+        "value": "430408"
+      },
+      {
+        "label": "南岳区",
+        "value": "430412"
+      },
+      {
+        "label": "衡阳县",
+        "value": "430421"
+      },
+      {
+        "label": "衡南县",
+        "value": "430422"
+      },
+      {
+        "label": "衡山县",
+        "value": "430423"
+      },
+      {
+        "label": "衡东县",
+        "value": "430424"
+      },
+      {
+        "label": "祁东县",
+        "value": "430426"
+      },
+      {
+        "label": "衡阳综合保税区",
+        "value": "430471"
+      },
+      {
+        "label": "湖南衡阳高新技术产业园区",
+        "value": "430472"
+      },
+      {
+        "label": "湖南衡阳松木经济开发区",
+        "value": "430473"
+      },
+      {
+        "label": "耒阳市",
+        "value": "430481"
+      },
+      {
+        "label": "常宁市",
+        "value": "430482"
+      }
+    ],
+    [{
+        "label": "双清区",
+        "value": "430502"
+      },
+      {
+        "label": "大祥区",
+        "value": "430503"
+      },
+      {
+        "label": "北塔区",
+        "value": "430511"
+      },
+      {
+        "label": "邵东县",
+        "value": "430521"
+      },
+      {
+        "label": "新邵县",
+        "value": "430522"
+      },
+      {
+        "label": "邵阳县",
+        "value": "430523"
+      },
+      {
+        "label": "隆回县",
+        "value": "430524"
+      },
+      {
+        "label": "洞口县",
+        "value": "430525"
+      },
+      {
+        "label": "绥宁县",
+        "value": "430527"
+      },
+      {
+        "label": "新宁县",
+        "value": "430528"
+      },
+      {
+        "label": "城步苗族自治县",
+        "value": "430529"
+      },
+      {
+        "label": "武冈市",
+        "value": "430581"
+      }
+    ],
+    [{
+        "label": "岳阳楼区",
+        "value": "430602"
+      },
+      {
+        "label": "云溪区",
+        "value": "430603"
+      },
+      {
+        "label": "君山区",
+        "value": "430611"
+      },
+      {
+        "label": "岳阳县",
+        "value": "430621"
+      },
+      {
+        "label": "华容县",
+        "value": "430623"
+      },
+      {
+        "label": "湘阴县",
+        "value": "430624"
+      },
+      {
+        "label": "平江县",
+        "value": "430626"
+      },
+      {
+        "label": "岳阳市屈原管理区",
+        "value": "430671"
+      },
+      {
+        "label": "汨罗市",
+        "value": "430681"
+      },
+      {
+        "label": "临湘市",
+        "value": "430682"
+      }
+    ],
+    [{
+        "label": "武陵区",
+        "value": "430702"
+      },
+      {
+        "label": "鼎城区",
+        "value": "430703"
+      },
+      {
+        "label": "安乡县",
+        "value": "430721"
+      },
+      {
+        "label": "汉寿县",
+        "value": "430722"
+      },
+      {
+        "label": "澧县",
+        "value": "430723"
+      },
+      {
+        "label": "临澧县",
+        "value": "430724"
+      },
+      {
+        "label": "桃源县",
+        "value": "430725"
+      },
+      {
+        "label": "石门县",
+        "value": "430726"
+      },
+      {
+        "label": "常德市西洞庭管理区",
+        "value": "430771"
+      },
+      {
+        "label": "津市市",
+        "value": "430781"
+      }
+    ],
+    [{
+        "label": "永定区",
+        "value": "430802"
+      },
+      {
+        "label": "武陵源区",
+        "value": "430811"
+      },
+      {
+        "label": "慈利县",
+        "value": "430821"
+      },
+      {
+        "label": "桑植县",
+        "value": "430822"
+      }
+    ],
+    [{
+        "label": "资阳区",
+        "value": "430902"
+      },
+      {
+        "label": "赫山区",
+        "value": "430903"
+      },
+      {
+        "label": "南县",
+        "value": "430921"
+      },
+      {
+        "label": "桃江县",
+        "value": "430922"
+      },
+      {
+        "label": "安化县",
+        "value": "430923"
+      },
+      {
+        "label": "益阳市大通湖管理区",
+        "value": "430971"
+      },
+      {
+        "label": "湖南益阳高新技术产业园区",
+        "value": "430972"
+      },
+      {
+        "label": "沅江市",
+        "value": "430981"
+      }
+    ],
+    [{
+        "label": "北湖区",
+        "value": "431002"
+      },
+      {
+        "label": "苏仙区",
+        "value": "431003"
+      },
+      {
+        "label": "桂阳县",
+        "value": "431021"
+      },
+      {
+        "label": "宜章县",
+        "value": "431022"
+      },
+      {
+        "label": "永兴县",
+        "value": "431023"
+      },
+      {
+        "label": "嘉禾县",
+        "value": "431024"
+      },
+      {
+        "label": "临武县",
+        "value": "431025"
+      },
+      {
+        "label": "汝城县",
+        "value": "431026"
+      },
+      {
+        "label": "桂东县",
+        "value": "431027"
+      },
+      {
+        "label": "安仁县",
+        "value": "431028"
+      },
+      {
+        "label": "资兴市",
+        "value": "431081"
+      }
+    ],
+    [{
+        "label": "零陵区",
+        "value": "431102"
+      },
+      {
+        "label": "冷水滩区",
+        "value": "431103"
+      },
+      {
+        "label": "祁阳县",
+        "value": "431121"
+      },
+      {
+        "label": "东安县",
+        "value": "431122"
+      },
+      {
+        "label": "双牌县",
+        "value": "431123"
+      },
+      {
+        "label": "道县",
+        "value": "431124"
+      },
+      {
+        "label": "江永县",
+        "value": "431125"
+      },
+      {
+        "label": "宁远县",
+        "value": "431126"
+      },
+      {
+        "label": "蓝山县",
+        "value": "431127"
+      },
+      {
+        "label": "新田县",
+        "value": "431128"
+      },
+      {
+        "label": "江华瑶族自治县",
+        "value": "431129"
+      },
+      {
+        "label": "永州经济技术开发区",
+        "value": "431171"
+      },
+      {
+        "label": "永州市金洞管理区",
+        "value": "431172"
+      },
+      {
+        "label": "永州市回龙圩管理区",
+        "value": "431173"
+      }
+    ],
+    [{
+        "label": "鹤城区",
+        "value": "431202"
+      },
+      {
+        "label": "中方县",
+        "value": "431221"
+      },
+      {
+        "label": "沅陵县",
+        "value": "431222"
+      },
+      {
+        "label": "辰溪县",
+        "value": "431223"
+      },
+      {
+        "label": "溆浦县",
+        "value": "431224"
+      },
+      {
+        "label": "会同县",
+        "value": "431225"
+      },
+      {
+        "label": "麻阳苗族自治县",
+        "value": "431226"
+      },
+      {
+        "label": "新晃侗族自治县",
+        "value": "431227"
+      },
+      {
+        "label": "芷江侗族自治县",
+        "value": "431228"
+      },
+      {
+        "label": "靖州苗族侗族自治县",
+        "value": "431229"
+      },
+      {
+        "label": "通道侗族自治县",
+        "value": "431230"
+      },
+      {
+        "label": "怀化市洪江管理区",
+        "value": "431271"
+      },
+      {
+        "label": "洪江市",
+        "value": "431281"
+      }
+    ],
+    [{
+        "label": "娄星区",
+        "value": "431302"
+      },
+      {
+        "label": "双峰县",
+        "value": "431321"
+      },
+      {
+        "label": "新化县",
+        "value": "431322"
+      },
+      {
+        "label": "冷水江市",
+        "value": "431381"
+      },
+      {
+        "label": "涟源市",
+        "value": "431382"
+      }
+    ],
+    [{
+        "label": "吉首市",
+        "value": "433101"
+      },
+      {
+        "label": "泸溪县",
+        "value": "433122"
+      },
+      {
+        "label": "凤凰县",
+        "value": "433123"
+      },
+      {
+        "label": "花垣县",
+        "value": "433124"
+      },
+      {
+        "label": "保靖县",
+        "value": "433125"
+      },
+      {
+        "label": "古丈县",
+        "value": "433126"
+      },
+      {
+        "label": "永顺县",
+        "value": "433127"
+      },
+      {
+        "label": "龙山县",
+        "value": "433130"
+      },
+      {
+        "label": "湖南吉首经济开发区",
+        "value": "433172"
+      },
+      {
+        "label": "湖南永顺经济开发区",
+        "value": "433173"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "荔湾区",
+        "value": "440103"
+      },
+      {
+        "label": "越秀区",
+        "value": "440104"
+      },
+      {
+        "label": "海珠区",
+        "value": "440105"
+      },
+      {
+        "label": "天河区",
+        "value": "440106"
+      },
+      {
+        "label": "白云区",
+        "value": "440111"
+      },
+      {
+        "label": "黄埔区",
+        "value": "440112"
+      },
+      {
+        "label": "番禺区",
+        "value": "440113"
+      },
+      {
+        "label": "花都区",
+        "value": "440114"
+      },
+      {
+        "label": "南沙区",
+        "value": "440115"
+      },
+      {
+        "label": "从化区",
+        "value": "440117"
+      },
+      {
+        "label": "增城区",
+        "value": "440118"
+      }
+    ],
+    [{
+        "label": "武江区",
+        "value": "440203"
+      },
+      {
+        "label": "浈江区",
+        "value": "440204"
+      },
+      {
+        "label": "曲江区",
+        "value": "440205"
+      },
+      {
+        "label": "始兴县",
+        "value": "440222"
+      },
+      {
+        "label": "仁化县",
+        "value": "440224"
+      },
+      {
+        "label": "翁源县",
+        "value": "440229"
+      },
+      {
+        "label": "乳源瑶族自治县",
+        "value": "440232"
+      },
+      {
+        "label": "新丰县",
+        "value": "440233"
+      },
+      {
+        "label": "乐昌市",
+        "value": "440281"
+      },
+      {
+        "label": "南雄市",
+        "value": "440282"
+      }
+    ],
+    [{
+        "label": "罗湖区",
+        "value": "440303"
+      },
+      {
+        "label": "福田区",
+        "value": "440304"
+      },
+      {
+        "label": "南山区",
+        "value": "440305"
+      },
+      {
+        "label": "宝安区",
+        "value": "440306"
+      },
+      {
+        "label": "龙岗区",
+        "value": "440307"
+      },
+      {
+        "label": "盐田区",
+        "value": "440308"
+      },
+      {
+        "label": "龙华区",
+        "value": "440309"
+      },
+      {
+        "label": "坪山区",
+        "value": "440310"
+      }
+    ],
+    [{
+        "label": "香洲区",
+        "value": "440402"
+      },
+      {
+        "label": "斗门区",
+        "value": "440403"
+      },
+      {
+        "label": "金湾区",
+        "value": "440404"
+      }
+    ],
+    [{
+        "label": "龙湖区",
+        "value": "440507"
+      },
+      {
+        "label": "金平区",
+        "value": "440511"
+      },
+      {
+        "label": "濠江区",
+        "value": "440512"
+      },
+      {
+        "label": "潮阳区",
+        "value": "440513"
+      },
+      {
+        "label": "潮南区",
+        "value": "440514"
+      },
+      {
+        "label": "澄海区",
+        "value": "440515"
+      },
+      {
+        "label": "南澳县",
+        "value": "440523"
+      }
+    ],
+    [{
+        "label": "禅城区",
+        "value": "440604"
+      },
+      {
+        "label": "南海区",
+        "value": "440605"
+      },
+      {
+        "label": "顺德区",
+        "value": "440606"
+      },
+      {
+        "label": "三水区",
+        "value": "440607"
+      },
+      {
+        "label": "高明区",
+        "value": "440608"
+      }
+    ],
+    [{
+        "label": "蓬江区",
+        "value": "440703"
+      },
+      {
+        "label": "江海区",
+        "value": "440704"
+      },
+      {
+        "label": "新会区",
+        "value": "440705"
+      },
+      {
+        "label": "台山市",
+        "value": "440781"
+      },
+      {
+        "label": "开平市",
+        "value": "440783"
+      },
+      {
+        "label": "鹤山市",
+        "value": "440784"
+      },
+      {
+        "label": "恩平市",
+        "value": "440785"
+      }
+    ],
+    [{
+        "label": "赤坎区",
+        "value": "440802"
+      },
+      {
+        "label": "霞山区",
+        "value": "440803"
+      },
+      {
+        "label": "坡头区",
+        "value": "440804"
+      },
+      {
+        "label": "麻章区",
+        "value": "440811"
+      },
+      {
+        "label": "遂溪县",
+        "value": "440823"
+      },
+      {
+        "label": "徐闻县",
+        "value": "440825"
+      },
+      {
+        "label": "廉江市",
+        "value": "440881"
+      },
+      {
+        "label": "雷州市",
+        "value": "440882"
+      },
+      {
+        "label": "吴川市",
+        "value": "440883"
+      }
+    ],
+    [{
+        "label": "茂南区",
+        "value": "440902"
+      },
+      {
+        "label": "电白区",
+        "value": "440904"
+      },
+      {
+        "label": "高州市",
+        "value": "440981"
+      },
+      {
+        "label": "化州市",
+        "value": "440982"
+      },
+      {
+        "label": "信宜市",
+        "value": "440983"
+      }
+    ],
+    [{
+        "label": "端州区",
+        "value": "441202"
+      },
+      {
+        "label": "鼎湖区",
+        "value": "441203"
+      },
+      {
+        "label": "高要区",
+        "value": "441204"
+      },
+      {
+        "label": "广宁县",
+        "value": "441223"
+      },
+      {
+        "label": "怀集县",
+        "value": "441224"
+      },
+      {
+        "label": "封开县",
+        "value": "441225"
+      },
+      {
+        "label": "德庆县",
+        "value": "441226"
+      },
+      {
+        "label": "四会市",
+        "value": "441284"
+      }
+    ],
+    [{
+        "label": "惠城区",
+        "value": "441302"
+      },
+      {
+        "label": "惠阳区",
+        "value": "441303"
+      },
+      {
+        "label": "博罗县",
+        "value": "441322"
+      },
+      {
+        "label": "惠东县",
+        "value": "441323"
+      },
+      {
+        "label": "龙门县",
+        "value": "441324"
+      }
+    ],
+    [{
+        "label": "梅江区",
+        "value": "441402"
+      },
+      {
+        "label": "梅县区",
+        "value": "441403"
+      },
+      {
+        "label": "大埔县",
+        "value": "441422"
+      },
+      {
+        "label": "丰顺县",
+        "value": "441423"
+      },
+      {
+        "label": "五华县",
+        "value": "441424"
+      },
+      {
+        "label": "平远县",
+        "value": "441426"
+      },
+      {
+        "label": "蕉岭县",
+        "value": "441427"
+      },
+      {
+        "label": "兴宁市",
+        "value": "441481"
+      }
+    ],
+    [{
+        "label": "城区",
+        "value": "441502"
+      },
+      {
+        "label": "海丰县",
+        "value": "441521"
+      },
+      {
+        "label": "陆河县",
+        "value": "441523"
+      },
+      {
+        "label": "陆丰市",
+        "value": "441581"
+      }
+    ],
+    [{
+        "label": "源城区",
+        "value": "441602"
+      },
+      {
+        "label": "紫金县",
+        "value": "441621"
+      },
+      {
+        "label": "龙川县",
+        "value": "441622"
+      },
+      {
+        "label": "连平县",
+        "value": "441623"
+      },
+      {
+        "label": "和平县",
+        "value": "441624"
+      },
+      {
+        "label": "东源县",
+        "value": "441625"
+      }
+    ],
+    [{
+        "label": "江城区",
+        "value": "441702"
+      },
+      {
+        "label": "阳东区",
+        "value": "441704"
+      },
+      {
+        "label": "阳西县",
+        "value": "441721"
+      },
+      {
+        "label": "阳春市",
+        "value": "441781"
+      }
+    ],
+    [{
+        "label": "清城区",
+        "value": "441802"
+      },
+      {
+        "label": "清新区",
+        "value": "441803"
+      },
+      {
+        "label": "佛冈县",
+        "value": "441821"
+      },
+      {
+        "label": "阳山县",
+        "value": "441823"
+      },
+      {
+        "label": "连山壮族瑶族自治县",
+        "value": "441825"
+      },
+      {
+        "label": "连南瑶族自治县",
+        "value": "441826"
+      },
+      {
+        "label": "英德市",
+        "value": "441881"
+      },
+      {
+        "label": "连州市",
+        "value": "441882"
+      }
+    ],
+    [{
+      "label": "东莞市",
+      "value": "441900"
+    }],
+    [{
+      "label": "中山市",
+      "value": "442000"
+    }],
+    [{
+        "label": "湘桥区",
+        "value": "445102"
+      },
+      {
+        "label": "潮安区",
+        "value": "445103"
+      },
+      {
+        "label": "饶平县",
+        "value": "445122"
+      }
+    ],
+    [{
+        "label": "榕城区",
+        "value": "445202"
+      },
+      {
+        "label": "揭东区",
+        "value": "445203"
+      },
+      {
+        "label": "揭西县",
+        "value": "445222"
+      },
+      {
+        "label": "惠来县",
+        "value": "445224"
+      },
+      {
+        "label": "普宁市",
+        "value": "445281"
+      }
+    ],
+    [{
+        "label": "云城区",
+        "value": "445302"
+      },
+      {
+        "label": "云安区",
+        "value": "445303"
+      },
+      {
+        "label": "新兴县",
+        "value": "445321"
+      },
+      {
+        "label": "郁南县",
+        "value": "445322"
+      },
+      {
+        "label": "罗定市",
+        "value": "445381"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "兴宁区",
+        "value": "450102"
+      },
+      {
+        "label": "青秀区",
+        "value": "450103"
+      },
+      {
+        "label": "江南区",
+        "value": "450105"
+      },
+      {
+        "label": "西乡塘区",
+        "value": "450107"
+      },
+      {
+        "label": "良庆区",
+        "value": "450108"
+      },
+      {
+        "label": "邕宁区",
+        "value": "450109"
+      },
+      {
+        "label": "武鸣区",
+        "value": "450110"
+      },
+      {
+        "label": "隆安县",
+        "value": "450123"
+      },
+      {
+        "label": "马山县",
+        "value": "450124"
+      },
+      {
+        "label": "上林县",
+        "value": "450125"
+      },
+      {
+        "label": "宾阳县",
+        "value": "450126"
+      },
+      {
+        "label": "横县",
+        "value": "450127"
+      }
+    ],
+    [{
+        "label": "城中区",
+        "value": "450202"
+      },
+      {
+        "label": "鱼峰区",
+        "value": "450203"
+      },
+      {
+        "label": "柳南区",
+        "value": "450204"
+      },
+      {
+        "label": "柳北区",
+        "value": "450205"
+      },
+      {
+        "label": "柳江区",
+        "value": "450206"
+      },
+      {
+        "label": "柳城县",
+        "value": "450222"
+      },
+      {
+        "label": "鹿寨县",
+        "value": "450223"
+      },
+      {
+        "label": "融安县",
+        "value": "450224"
+      },
+      {
+        "label": "融水苗族自治县",
+        "value": "450225"
+      },
+      {
+        "label": "三江侗族自治县",
+        "value": "450226"
+      }
+    ],
+    [{
+        "label": "秀峰区",
+        "value": "450302"
+      },
+      {
+        "label": "叠彩区",
+        "value": "450303"
+      },
+      {
+        "label": "象山区",
+        "value": "450304"
+      },
+      {
+        "label": "七星区",
+        "value": "450305"
+      },
+      {
+        "label": "雁山区",
+        "value": "450311"
+      },
+      {
+        "label": "临桂区",
+        "value": "450312"
+      },
+      {
+        "label": "阳朔县",
+        "value": "450321"
+      },
+      {
+        "label": "灵川县",
+        "value": "450323"
+      },
+      {
+        "label": "全州县",
+        "value": "450324"
+      },
+      {
+        "label": "兴安县",
+        "value": "450325"
+      },
+      {
+        "label": "永福县",
+        "value": "450326"
+      },
+      {
+        "label": "灌阳县",
+        "value": "450327"
+      },
+      {
+        "label": "龙胜各族自治县",
+        "value": "450328"
+      },
+      {
+        "label": "资源县",
+        "value": "450329"
+      },
+      {
+        "label": "平乐县",
+        "value": "450330"
+      },
+      {
+        "label": "荔浦县",
+        "value": "450331"
+      },
+      {
+        "label": "恭城瑶族自治县",
+        "value": "450332"
+      }
+    ],
+    [{
+        "label": "万秀区",
+        "value": "450403"
+      },
+      {
+        "label": "长洲区",
+        "value": "450405"
+      },
+      {
+        "label": "龙圩区",
+        "value": "450406"
+      },
+      {
+        "label": "苍梧县",
+        "value": "450421"
+      },
+      {
+        "label": "藤县",
+        "value": "450422"
+      },
+      {
+        "label": "蒙山县",
+        "value": "450423"
+      },
+      {
+        "label": "岑溪市",
+        "value": "450481"
+      }
+    ],
+    [{
+        "label": "海城区",
+        "value": "450502"
+      },
+      {
+        "label": "银海区",
+        "value": "450503"
+      },
+      {
+        "label": "铁山港区",
+        "value": "450512"
+      },
+      {
+        "label": "合浦县",
+        "value": "450521"
+      }
+    ],
+    [{
+        "label": "港口区",
+        "value": "450602"
+      },
+      {
+        "label": "防城区",
+        "value": "450603"
+      },
+      {
+        "label": "上思县",
+        "value": "450621"
+      },
+      {
+        "label": "东兴市",
+        "value": "450681"
+      }
+    ],
+    [{
+        "label": "钦南区",
+        "value": "450702"
+      },
+      {
+        "label": "钦北区",
+        "value": "450703"
+      },
+      {
+        "label": "灵山县",
+        "value": "450721"
+      },
+      {
+        "label": "浦北县",
+        "value": "450722"
+      }
+    ],
+    [{
+        "label": "港北区",
+        "value": "450802"
+      },
+      {
+        "label": "港南区",
+        "value": "450803"
+      },
+      {
+        "label": "覃塘区",
+        "value": "450804"
+      },
+      {
+        "label": "平南县",
+        "value": "450821"
+      },
+      {
+        "label": "桂平市",
+        "value": "450881"
+      }
+    ],
+    [{
+        "label": "玉州区",
+        "value": "450902"
+      },
+      {
+        "label": "福绵区",
+        "value": "450903"
+      },
+      {
+        "label": "容县",
+        "value": "450921"
+      },
+      {
+        "label": "陆川县",
+        "value": "450922"
+      },
+      {
+        "label": "博白县",
+        "value": "450923"
+      },
+      {
+        "label": "兴业县",
+        "value": "450924"
+      },
+      {
+        "label": "北流市",
+        "value": "450981"
+      }
+    ],
+    [{
+        "label": "右江区",
+        "value": "451002"
+      },
+      {
+        "label": "田阳县",
+        "value": "451021"
+      },
+      {
+        "label": "田东县",
+        "value": "451022"
+      },
+      {
+        "label": "平果县",
+        "value": "451023"
+      },
+      {
+        "label": "德保县",
+        "value": "451024"
+      },
+      {
+        "label": "那坡县",
+        "value": "451026"
+      },
+      {
+        "label": "凌云县",
+        "value": "451027"
+      },
+      {
+        "label": "乐业县",
+        "value": "451028"
+      },
+      {
+        "label": "田林县",
+        "value": "451029"
+      },
+      {
+        "label": "西林县",
+        "value": "451030"
+      },
+      {
+        "label": "隆林各族自治县",
+        "value": "451031"
+      },
+      {
+        "label": "靖西市",
+        "value": "451081"
+      }
+    ],
+    [{
+        "label": "八步区",
+        "value": "451102"
+      },
+      {
+        "label": "平桂区",
+        "value": "451103"
+      },
+      {
+        "label": "昭平县",
+        "value": "451121"
+      },
+      {
+        "label": "钟山县",
+        "value": "451122"
+      },
+      {
+        "label": "富川瑶族自治县",
+        "value": "451123"
+      }
+    ],
+    [{
+        "label": "金城江区",
+        "value": "451202"
+      },
+      {
+        "label": "宜州区",
+        "value": "451203"
+      },
+      {
+        "label": "南丹县",
+        "value": "451221"
+      },
+      {
+        "label": "天峨县",
+        "value": "451222"
+      },
+      {
+        "label": "凤山县",
+        "value": "451223"
+      },
+      {
+        "label": "东兰县",
+        "value": "451224"
+      },
+      {
+        "label": "罗城仫佬族自治县",
+        "value": "451225"
+      },
+      {
+        "label": "环江毛南族自治县",
+        "value": "451226"
+      },
+      {
+        "label": "巴马瑶族自治县",
+        "value": "451227"
+      },
+      {
+        "label": "都安瑶族自治县",
+        "value": "451228"
+      },
+      {
+        "label": "大化瑶族自治县",
+        "value": "451229"
+      }
+    ],
+    [{
+        "label": "兴宾区",
+        "value": "451302"
+      },
+      {
+        "label": "忻城县",
+        "value": "451321"
+      },
+      {
+        "label": "象州县",
+        "value": "451322"
+      },
+      {
+        "label": "武宣县",
+        "value": "451323"
+      },
+      {
+        "label": "金秀瑶族自治县",
+        "value": "451324"
+      },
+      {
+        "label": "合山市",
+        "value": "451381"
+      }
+    ],
+    [{
+        "label": "江州区",
+        "value": "451402"
+      },
+      {
+        "label": "扶绥县",
+        "value": "451421"
+      },
+      {
+        "label": "宁明县",
+        "value": "451422"
+      },
+      {
+        "label": "龙州县",
+        "value": "451423"
+      },
+      {
+        "label": "大新县",
+        "value": "451424"
+      },
+      {
+        "label": "天等县",
+        "value": "451425"
+      },
+      {
+        "label": "凭祥市",
+        "value": "451481"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "秀英区",
+        "value": "460105"
+      },
+      {
+        "label": "龙华区",
+        "value": "460106"
+      },
+      {
+        "label": "琼山区",
+        "value": "460107"
+      },
+      {
+        "label": "美兰区",
+        "value": "460108"
+      }
+    ],
+    [{
+        "label": "海棠区",
+        "value": "460202"
+      },
+      {
+        "label": "吉阳区",
+        "value": "460203"
+      },
+      {
+        "label": "天涯区",
+        "value": "460204"
+      },
+      {
+        "label": "崖州区",
+        "value": "460205"
+      }
+    ],
+    [{
+        "label": "西沙群岛",
+        "value": "460321"
+      },
+      {
+        "label": "南沙群岛",
+        "value": "460322"
+      },
+      {
+        "label": "中沙群岛的岛礁及其海域",
+        "value": "460323"
+      }
+    ],
+    [{
+      "label": "儋州市",
+      "value": "460400"
+    }],
+    [{
+        "label": "五指山市",
+        "value": "469001"
+      },
+      {
+        "label": "琼海市",
+        "value": "469002"
+      },
+      {
+        "label": "文昌市",
+        "value": "469005"
+      },
+      {
+        "label": "万宁市",
+        "value": "469006"
+      },
+      {
+        "label": "东方市",
+        "value": "469007"
+      },
+      {
+        "label": "定安县",
+        "value": "469021"
+      },
+      {
+        "label": "屯昌县",
+        "value": "469022"
+      },
+      {
+        "label": "澄迈县",
+        "value": "469023"
+      },
+      {
+        "label": "临高县",
+        "value": "469024"
+      },
+      {
+        "label": "白沙黎族自治县",
+        "value": "469025"
+      },
+      {
+        "label": "昌江黎族自治县",
+        "value": "469026"
+      },
+      {
+        "label": "乐东黎族自治县",
+        "value": "469027"
+      },
+      {
+        "label": "陵水黎族自治县",
+        "value": "469028"
+      },
+      {
+        "label": "保亭黎族苗族自治县",
+        "value": "469029"
+      },
+      {
+        "label": "琼中黎族苗族自治县",
+        "value": "469030"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "万州区",
+        "value": "500101"
+      },
+      {
+        "label": "涪陵区",
+        "value": "500102"
+      },
+      {
+        "label": "渝中区",
+        "value": "500103"
+      },
+      {
+        "label": "大渡口区",
+        "value": "500104"
+      },
+      {
+        "label": "江北区",
+        "value": "500105"
+      },
+      {
+        "label": "沙坪坝区",
+        "value": "500106"
+      },
+      {
+        "label": "九龙坡区",
+        "value": "500107"
+      },
+      {
+        "label": "南岸区",
+        "value": "500108"
+      },
+      {
+        "label": "北碚区",
+        "value": "500109"
+      },
+      {
+        "label": "綦江区",
+        "value": "500110"
+      },
+      {
+        "label": "大足区",
+        "value": "500111"
+      },
+      {
+        "label": "渝北区",
+        "value": "500112"
+      },
+      {
+        "label": "巴南区",
+        "value": "500113"
+      },
+      {
+        "label": "黔江区",
+        "value": "500114"
+      },
+      {
+        "label": "长寿区",
+        "value": "500115"
+      },
+      {
+        "label": "江津区",
+        "value": "500116"
+      },
+      {
+        "label": "合川区",
+        "value": "500117"
+      },
+      {
+        "label": "永川区",
+        "value": "500118"
+      },
+      {
+        "label": "南川区",
+        "value": "500119"
+      },
+      {
+        "label": "璧山区",
+        "value": "500120"
+      },
+      {
+        "label": "铜梁区",
+        "value": "500151"
+      },
+      {
+        "label": "潼南区",
+        "value": "500152"
+      },
+      {
+        "label": "荣昌区",
+        "value": "500153"
+      },
+      {
+        "label": "开州区",
+        "value": "500154"
+      },
+      {
+        "label": "梁平区",
+        "value": "500155"
+      },
+      {
+        "label": "武隆区",
+        "value": "500156"
+      }
+    ],
+    [{
+        "label": "城口县",
+        "value": "500229"
+      },
+      {
+        "label": "丰都县",
+        "value": "500230"
+      },
+      {
+        "label": "垫江县",
+        "value": "500231"
+      },
+      {
+        "label": "忠县",
+        "value": "500233"
+      },
+      {
+        "label": "云阳县",
+        "value": "500235"
+      },
+      {
+        "label": "奉节县",
+        "value": "500236"
+      },
+      {
+        "label": "巫山县",
+        "value": "500237"
+      },
+      {
+        "label": "巫溪县",
+        "value": "500238"
+      },
+      {
+        "label": "石柱土家族自治县",
+        "value": "500240"
+      },
+      {
+        "label": "秀山土家族苗族自治县",
+        "value": "500241"
+      },
+      {
+        "label": "酉阳土家族苗族自治县",
+        "value": "500242"
+      },
+      {
+        "label": "彭水苗族土家族自治县",
+        "value": "500243"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "锦江区",
+        "value": "510104"
+      },
+      {
+        "label": "青羊区",
+        "value": "510105"
+      },
+      {
+        "label": "金牛区",
+        "value": "510106"
+      },
+      {
+        "label": "武侯区",
+        "value": "510107"
+      },
+      {
+        "label": "成华区",
+        "value": "510108"
+      },
+      {
+        "label": "龙泉驿区",
+        "value": "510112"
+      },
+      {
+        "label": "青白江区",
+        "value": "510113"
+      },
+      {
+        "label": "新都区",
+        "value": "510114"
+      },
+      {
+        "label": "温江区",
+        "value": "510115"
+      },
+      {
+        "label": "双流区",
+        "value": "510116"
+      },
+      {
+        "label": "郫都区",
+        "value": "510117"
+      },
+      {
+        "label": "金堂县",
+        "value": "510121"
+      },
+      {
+        "label": "大邑县",
+        "value": "510129"
+      },
+      {
+        "label": "蒲江县",
+        "value": "510131"
+      },
+      {
+        "label": "新津县",
+        "value": "510132"
+      },
+      {
+        "label": "都江堰市",
+        "value": "510181"
+      },
+      {
+        "label": "彭州市",
+        "value": "510182"
+      },
+      {
+        "label": "邛崃市",
+        "value": "510183"
+      },
+      {
+        "label": "崇州市",
+        "value": "510184"
+      },
+      {
+        "label": "简阳市",
+        "value": "510185"
+      }
+    ],
+    [{
+        "label": "自流井区",
+        "value": "510302"
+      },
+      {
+        "label": "贡井区",
+        "value": "510303"
+      },
+      {
+        "label": "大安区",
+        "value": "510304"
+      },
+      {
+        "label": "沿滩区",
+        "value": "510311"
+      },
+      {
+        "label": "荣县",
+        "value": "510321"
+      },
+      {
+        "label": "富顺县",
+        "value": "510322"
+      }
+    ],
+    [{
+        "label": "东区",
+        "value": "510402"
+      },
+      {
+        "label": "西区",
+        "value": "510403"
+      },
+      {
+        "label": "仁和区",
+        "value": "510411"
+      },
+      {
+        "label": "米易县",
+        "value": "510421"
+      },
+      {
+        "label": "盐边县",
+        "value": "510422"
+      }
+    ],
+    [{
+        "label": "江阳区",
+        "value": "510502"
+      },
+      {
+        "label": "纳溪区",
+        "value": "510503"
+      },
+      {
+        "label": "龙马潭区",
+        "value": "510504"
+      },
+      {
+        "label": "泸县",
+        "value": "510521"
+      },
+      {
+        "label": "合江县",
+        "value": "510522"
+      },
+      {
+        "label": "叙永县",
+        "value": "510524"
+      },
+      {
+        "label": "古蔺县",
+        "value": "510525"
+      }
+    ],
+    [{
+        "label": "旌阳区",
+        "value": "510603"
+      },
+      {
+        "label": "罗江区",
+        "value": "510604"
+      },
+      {
+        "label": "中江县",
+        "value": "510623"
+      },
+      {
+        "label": "广汉市",
+        "value": "510681"
+      },
+      {
+        "label": "什邡市",
+        "value": "510682"
+      },
+      {
+        "label": "绵竹市",
+        "value": "510683"
+      }
+    ],
+    [{
+        "label": "涪城区",
+        "value": "510703"
+      },
+      {
+        "label": "游仙区",
+        "value": "510704"
+      },
+      {
+        "label": "安州区",
+        "value": "510705"
+      },
+      {
+        "label": "三台县",
+        "value": "510722"
+      },
+      {
+        "label": "盐亭县",
+        "value": "510723"
+      },
+      {
+        "label": "梓潼县",
+        "value": "510725"
+      },
+      {
+        "label": "北川羌族自治县",
+        "value": "510726"
+      },
+      {
+        "label": "平武县",
+        "value": "510727"
+      },
+      {
+        "label": "江油市",
+        "value": "510781"
+      }
+    ],
+    [{
+        "label": "利州区",
+        "value": "510802"
+      },
+      {
+        "label": "昭化区",
+        "value": "510811"
+      },
+      {
+        "label": "朝天区",
+        "value": "510812"
+      },
+      {
+        "label": "旺苍县",
+        "value": "510821"
+      },
+      {
+        "label": "青川县",
+        "value": "510822"
+      },
+      {
+        "label": "剑阁县",
+        "value": "510823"
+      },
+      {
+        "label": "苍溪县",
+        "value": "510824"
+      }
+    ],
+    [{
+        "label": "船山区",
+        "value": "510903"
+      },
+      {
+        "label": "安居区",
+        "value": "510904"
+      },
+      {
+        "label": "蓬溪县",
+        "value": "510921"
+      },
+      {
+        "label": "射洪县",
+        "value": "510922"
+      },
+      {
+        "label": "大英县",
+        "value": "510923"
+      }
+    ],
+    [{
+        "label": "市中区",
+        "value": "511002"
+      },
+      {
+        "label": "东兴区",
+        "value": "511011"
+      },
+      {
+        "label": "威远县",
+        "value": "511024"
+      },
+      {
+        "label": "资中县",
+        "value": "511025"
+      },
+      {
+        "label": "内江经济开发区",
+        "value": "511071"
+      },
+      {
+        "label": "隆昌市",
+        "value": "511083"
+      }
+    ],
+    [{
+        "label": "市中区",
+        "value": "511102"
+      },
+      {
+        "label": "沙湾区",
+        "value": "511111"
+      },
+      {
+        "label": "五通桥区",
+        "value": "511112"
+      },
+      {
+        "label": "金口河区",
+        "value": "511113"
+      },
+      {
+        "label": "犍为县",
+        "value": "511123"
+      },
+      {
+        "label": "井研县",
+        "value": "511124"
+      },
+      {
+        "label": "夹江县",
+        "value": "511126"
+      },
+      {
+        "label": "沐川县",
+        "value": "511129"
+      },
+      {
+        "label": "峨边彝族自治县",
+        "value": "511132"
+      },
+      {
+        "label": "马边彝族自治县",
+        "value": "511133"
+      },
+      {
+        "label": "峨眉山市",
+        "value": "511181"
+      }
+    ],
+    [{
+        "label": "顺庆区",
+        "value": "511302"
+      },
+      {
+        "label": "高坪区",
+        "value": "511303"
+      },
+      {
+        "label": "嘉陵区",
+        "value": "511304"
+      },
+      {
+        "label": "南部县",
+        "value": "511321"
+      },
+      {
+        "label": "营山县",
+        "value": "511322"
+      },
+      {
+        "label": "蓬安县",
+        "value": "511323"
+      },
+      {
+        "label": "仪陇县",
+        "value": "511324"
+      },
+      {
+        "label": "西充县",
+        "value": "511325"
+      },
+      {
+        "label": "阆中市",
+        "value": "511381"
+      }
+    ],
+    [{
+        "label": "东坡区",
+        "value": "511402"
+      },
+      {
+        "label": "彭山区",
+        "value": "511403"
+      },
+      {
+        "label": "仁寿县",
+        "value": "511421"
+      },
+      {
+        "label": "洪雅县",
+        "value": "511423"
+      },
+      {
+        "label": "丹棱县",
+        "value": "511424"
+      },
+      {
+        "label": "青神县",
+        "value": "511425"
+      }
+    ],
+    [{
+        "label": "翠屏区",
+        "value": "511502"
+      },
+      {
+        "label": "南溪区",
+        "value": "511503"
+      },
+      {
+        "label": "宜宾县",
+        "value": "511521"
+      },
+      {
+        "label": "江安县",
+        "value": "511523"
+      },
+      {
+        "label": "长宁县",
+        "value": "511524"
+      },
+      {
+        "label": "高县",
+        "value": "511525"
+      },
+      {
+        "label": "珙县",
+        "value": "511526"
+      },
+      {
+        "label": "筠连县",
+        "value": "511527"
+      },
+      {
+        "label": "兴文县",
+        "value": "511528"
+      },
+      {
+        "label": "屏山县",
+        "value": "511529"
+      }
+    ],
+    [{
+        "label": "广安区",
+        "value": "511602"
+      },
+      {
+        "label": "前锋区",
+        "value": "511603"
+      },
+      {
+        "label": "岳池县",
+        "value": "511621"
+      },
+      {
+        "label": "武胜县",
+        "value": "511622"
+      },
+      {
+        "label": "邻水县",
+        "value": "511623"
+      },
+      {
+        "label": "华蓥市",
+        "value": "511681"
+      }
+    ],
+    [{
+        "label": "通川区",
+        "value": "511702"
+      },
+      {
+        "label": "达川区",
+        "value": "511703"
+      },
+      {
+        "label": "宣汉县",
+        "value": "511722"
+      },
+      {
+        "label": "开江县",
+        "value": "511723"
+      },
+      {
+        "label": "大竹县",
+        "value": "511724"
+      },
+      {
+        "label": "渠县",
+        "value": "511725"
+      },
+      {
+        "label": "达州经济开发区",
+        "value": "511771"
+      },
+      {
+        "label": "万源市",
+        "value": "511781"
+      }
+    ],
+    [{
+        "label": "雨城区",
+        "value": "511802"
+      },
+      {
+        "label": "名山区",
+        "value": "511803"
+      },
+      {
+        "label": "荥经县",
+        "value": "511822"
+      },
+      {
+        "label": "汉源县",
+        "value": "511823"
+      },
+      {
+        "label": "石棉县",
+        "value": "511824"
+      },
+      {
+        "label": "天全县",
+        "value": "511825"
+      },
+      {
+        "label": "芦山县",
+        "value": "511826"
+      },
+      {
+        "label": "宝兴县",
+        "value": "511827"
+      }
+    ],
+    [{
+        "label": "巴州区",
+        "value": "511902"
+      },
+      {
+        "label": "恩阳区",
+        "value": "511903"
+      },
+      {
+        "label": "通江县",
+        "value": "511921"
+      },
+      {
+        "label": "南江县",
+        "value": "511922"
+      },
+      {
+        "label": "平昌县",
+        "value": "511923"
+      },
+      {
+        "label": "巴中经济开发区",
+        "value": "511971"
+      }
+    ],
+    [{
+        "label": "雁江区",
+        "value": "512002"
+      },
+      {
+        "label": "安岳县",
+        "value": "512021"
+      },
+      {
+        "label": "乐至县",
+        "value": "512022"
+      }
+    ],
+    [{
+        "label": "马尔康市",
+        "value": "513201"
+      },
+      {
+        "label": "汶川县",
+        "value": "513221"
+      },
+      {
+        "label": "理县",
+        "value": "513222"
+      },
+      {
+        "label": "茂县",
+        "value": "513223"
+      },
+      {
+        "label": "松潘县",
+        "value": "513224"
+      },
+      {
+        "label": "九寨沟县",
+        "value": "513225"
+      },
+      {
+        "label": "金川县",
+        "value": "513226"
+      },
+      {
+        "label": "小金县",
+        "value": "513227"
+      },
+      {
+        "label": "黑水县",
+        "value": "513228"
+      },
+      {
+        "label": "壤塘县",
+        "value": "513230"
+      },
+      {
+        "label": "阿坝县",
+        "value": "513231"
+      },
+      {
+        "label": "若尔盖县",
+        "value": "513232"
+      },
+      {
+        "label": "红原县",
+        "value": "513233"
+      }
+    ],
+    [{
+        "label": "康定市",
+        "value": "513301"
+      },
+      {
+        "label": "泸定县",
+        "value": "513322"
+      },
+      {
+        "label": "丹巴县",
+        "value": "513323"
+      },
+      {
+        "label": "九龙县",
+        "value": "513324"
+      },
+      {
+        "label": "雅江县",
+        "value": "513325"
+      },
+      {
+        "label": "道孚县",
+        "value": "513326"
+      },
+      {
+        "label": "炉霍县",
+        "value": "513327"
+      },
+      {
+        "label": "甘孜县",
+        "value": "513328"
+      },
+      {
+        "label": "新龙县",
+        "value": "513329"
+      },
+      {
+        "label": "德格县",
+        "value": "513330"
+      },
+      {
+        "label": "白玉县",
+        "value": "513331"
+      },
+      {
+        "label": "石渠县",
+        "value": "513332"
+      },
+      {
+        "label": "色达县",
+        "value": "513333"
+      },
+      {
+        "label": "理塘县",
+        "value": "513334"
+      },
+      {
+        "label": "巴塘县",
+        "value": "513335"
+      },
+      {
+        "label": "乡城县",
+        "value": "513336"
+      },
+      {
+        "label": "稻城县",
+        "value": "513337"
+      },
+      {
+        "label": "得荣县",
+        "value": "513338"
+      }
+    ],
+    [{
+        "label": "西昌市",
+        "value": "513401"
+      },
+      {
+        "label": "木里藏族自治县",
+        "value": "513422"
+      },
+      {
+        "label": "盐源县",
+        "value": "513423"
+      },
+      {
+        "label": "德昌县",
+        "value": "513424"
+      },
+      {
+        "label": "会理县",
+        "value": "513425"
+      },
+      {
+        "label": "会东县",
+        "value": "513426"
+      },
+      {
+        "label": "宁南县",
+        "value": "513427"
+      },
+      {
+        "label": "普格县",
+        "value": "513428"
+      },
+      {
+        "label": "布拖县",
+        "value": "513429"
+      },
+      {
+        "label": "金阳县",
+        "value": "513430"
+      },
+      {
+        "label": "昭觉县",
+        "value": "513431"
+      },
+      {
+        "label": "喜德县",
+        "value": "513432"
+      },
+      {
+        "label": "冕宁县",
+        "value": "513433"
+      },
+      {
+        "label": "越西县",
+        "value": "513434"
+      },
+      {
+        "label": "甘洛县",
+        "value": "513435"
+      },
+      {
+        "label": "美姑县",
+        "value": "513436"
+      },
+      {
+        "label": "雷波县",
+        "value": "513437"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "南明区",
+        "value": "520102"
+      },
+      {
+        "label": "云岩区",
+        "value": "520103"
+      },
+      {
+        "label": "花溪区",
+        "value": "520111"
+      },
+      {
+        "label": "乌当区",
+        "value": "520112"
+      },
+      {
+        "label": "白云区",
+        "value": "520113"
+      },
+      {
+        "label": "观山湖区",
+        "value": "520115"
+      },
+      {
+        "label": "开阳县",
+        "value": "520121"
+      },
+      {
+        "label": "息烽县",
+        "value": "520122"
+      },
+      {
+        "label": "修文县",
+        "value": "520123"
+      },
+      {
+        "label": "清镇市",
+        "value": "520181"
+      }
+    ],
+    [{
+        "label": "钟山区",
+        "value": "520201"
+      },
+      {
+        "label": "六枝特区",
+        "value": "520203"
+      },
+      {
+        "label": "水城县",
+        "value": "520221"
+      },
+      {
+        "label": "盘州市",
+        "value": "520281"
+      }
+    ],
+    [{
+        "label": "红花岗区",
+        "value": "520302"
+      },
+      {
+        "label": "汇川区",
+        "value": "520303"
+      },
+      {
+        "label": "播州区",
+        "value": "520304"
+      },
+      {
+        "label": "桐梓县",
+        "value": "520322"
+      },
+      {
+        "label": "绥阳县",
+        "value": "520323"
+      },
+      {
+        "label": "正安县",
+        "value": "520324"
+      },
+      {
+        "label": "道真仡佬族苗族自治县",
+        "value": "520325"
+      },
+      {
+        "label": "务川仡佬族苗族自治县",
+        "value": "520326"
+      },
+      {
+        "label": "凤冈县",
+        "value": "520327"
+      },
+      {
+        "label": "湄潭县",
+        "value": "520328"
+      },
+      {
+        "label": "余庆县",
+        "value": "520329"
+      },
+      {
+        "label": "习水县",
+        "value": "520330"
+      },
+      {
+        "label": "赤水市",
+        "value": "520381"
+      },
+      {
+        "label": "仁怀市",
+        "value": "520382"
+      }
+    ],
+    [{
+        "label": "西秀区",
+        "value": "520402"
+      },
+      {
+        "label": "平坝区",
+        "value": "520403"
+      },
+      {
+        "label": "普定县",
+        "value": "520422"
+      },
+      {
+        "label": "镇宁布依族苗族自治县",
+        "value": "520423"
+      },
+      {
+        "label": "关岭布依族苗族自治县",
+        "value": "520424"
+      },
+      {
+        "label": "紫云苗族布依族自治县",
+        "value": "520425"
+      }
+    ],
+    [{
+        "label": "七星关区",
+        "value": "520502"
+      },
+      {
+        "label": "大方县",
+        "value": "520521"
+      },
+      {
+        "label": "黔西县",
+        "value": "520522"
+      },
+      {
+        "label": "金沙县",
+        "value": "520523"
+      },
+      {
+        "label": "织金县",
+        "value": "520524"
+      },
+      {
+        "label": "纳雍县",
+        "value": "520525"
+      },
+      {
+        "label": "威宁彝族回族苗族自治县",
+        "value": "520526"
+      },
+      {
+        "label": "赫章县",
+        "value": "520527"
+      }
+    ],
+    [{
+        "label": "碧江区",
+        "value": "520602"
+      },
+      {
+        "label": "万山区",
+        "value": "520603"
+      },
+      {
+        "label": "江口县",
+        "value": "520621"
+      },
+      {
+        "label": "玉屏侗族自治县",
+        "value": "520622"
+      },
+      {
+        "label": "石阡县",
+        "value": "520623"
+      },
+      {
+        "label": "思南县",
+        "value": "520624"
+      },
+      {
+        "label": "印江土家族苗族自治县",
+        "value": "520625"
+      },
+      {
+        "label": "德江县",
+        "value": "520626"
+      },
+      {
+        "label": "沿河土家族自治县",
+        "value": "520627"
+      },
+      {
+        "label": "松桃苗族自治县",
+        "value": "520628"
+      }
+    ],
+    [{
+        "label": "兴义市",
+        "value": "522301"
+      },
+      {
+        "label": "兴仁县",
+        "value": "522322"
+      },
+      {
+        "label": "普安县",
+        "value": "522323"
+      },
+      {
+        "label": "晴隆县",
+        "value": "522324"
+      },
+      {
+        "label": "贞丰县",
+        "value": "522325"
+      },
+      {
+        "label": "望谟县",
+        "value": "522326"
+      },
+      {
+        "label": "册亨县",
+        "value": "522327"
+      },
+      {
+        "label": "安龙县",
+        "value": "522328"
+      }
+    ],
+    [{
+        "label": "凯里市",
+        "value": "522601"
+      },
+      {
+        "label": "黄平县",
+        "value": "522622"
+      },
+      {
+        "label": "施秉县",
+        "value": "522623"
+      },
+      {
+        "label": "三穗县",
+        "value": "522624"
+      },
+      {
+        "label": "镇远县",
+        "value": "522625"
+      },
+      {
+        "label": "岑巩县",
+        "value": "522626"
+      },
+      {
+        "label": "天柱县",
+        "value": "522627"
+      },
+      {
+        "label": "锦屏县",
+        "value": "522628"
+      },
+      {
+        "label": "剑河县",
+        "value": "522629"
+      },
+      {
+        "label": "台江县",
+        "value": "522630"
+      },
+      {
+        "label": "黎平县",
+        "value": "522631"
+      },
+      {
+        "label": "榕江县",
+        "value": "522632"
+      },
+      {
+        "label": "从江县",
+        "value": "522633"
+      },
+      {
+        "label": "雷山县",
+        "value": "522634"
+      },
+      {
+        "label": "麻江县",
+        "value": "522635"
+      },
+      {
+        "label": "丹寨县",
+        "value": "522636"
+      }
+    ],
+    [{
+        "label": "都匀市",
+        "value": "522701"
+      },
+      {
+        "label": "福泉市",
+        "value": "522702"
+      },
+      {
+        "label": "荔波县",
+        "value": "522722"
+      },
+      {
+        "label": "贵定县",
+        "value": "522723"
+      },
+      {
+        "label": "瓮安县",
+        "value": "522725"
+      },
+      {
+        "label": "独山县",
+        "value": "522726"
+      },
+      {
+        "label": "平塘县",
+        "value": "522727"
+      },
+      {
+        "label": "罗甸县",
+        "value": "522728"
+      },
+      {
+        "label": "长顺县",
+        "value": "522729"
+      },
+      {
+        "label": "龙里县",
+        "value": "522730"
+      },
+      {
+        "label": "惠水县",
+        "value": "522731"
+      },
+      {
+        "label": "三都水族自治县",
+        "value": "522732"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "五华区",
+        "value": "530102"
+      },
+      {
+        "label": "盘龙区",
+        "value": "530103"
+      },
+      {
+        "label": "官渡区",
+        "value": "530111"
+      },
+      {
+        "label": "西山区",
+        "value": "530112"
+      },
+      {
+        "label": "东川区",
+        "value": "530113"
+      },
+      {
+        "label": "呈贡区",
+        "value": "530114"
+      },
+      {
+        "label": "晋宁区",
+        "value": "530115"
+      },
+      {
+        "label": "富民县",
+        "value": "530124"
+      },
+      {
+        "label": "宜良县",
+        "value": "530125"
+      },
+      {
+        "label": "石林彝族自治县",
+        "value": "530126"
+      },
+      {
+        "label": "嵩明县",
+        "value": "530127"
+      },
+      {
+        "label": "禄劝彝族苗族自治县",
+        "value": "530128"
+      },
+      {
+        "label": "寻甸回族彝族自治县",
+        "value": "530129"
+      },
+      {
+        "label": "安宁市",
+        "value": "530181"
+      }
+    ],
+    [{
+        "label": "麒麟区",
+        "value": "530302"
+      },
+      {
+        "label": "沾益区",
+        "value": "530303"
+      },
+      {
+        "label": "马龙县",
+        "value": "530321"
+      },
+      {
+        "label": "陆良县",
+        "value": "530322"
+      },
+      {
+        "label": "师宗县",
+        "value": "530323"
+      },
+      {
+        "label": "罗平县",
+        "value": "530324"
+      },
+      {
+        "label": "富源县",
+        "value": "530325"
+      },
+      {
+        "label": "会泽县",
+        "value": "530326"
+      },
+      {
+        "label": "宣威市",
+        "value": "530381"
+      }
+    ],
+    [{
+        "label": "红塔区",
+        "value": "530402"
+      },
+      {
+        "label": "江川区",
+        "value": "530403"
+      },
+      {
+        "label": "澄江县",
+        "value": "530422"
+      },
+      {
+        "label": "通海县",
+        "value": "530423"
+      },
+      {
+        "label": "华宁县",
+        "value": "530424"
+      },
+      {
+        "label": "易门县",
+        "value": "530425"
+      },
+      {
+        "label": "峨山彝族自治县",
+        "value": "530426"
+      },
+      {
+        "label": "新平彝族傣族自治县",
+        "value": "530427"
+      },
+      {
+        "label": "元江哈尼族彝族傣族自治县",
+        "value": "530428"
+      }
+    ],
+    [{
+        "label": "隆阳区",
+        "value": "530502"
+      },
+      {
+        "label": "施甸县",
+        "value": "530521"
+      },
+      {
+        "label": "龙陵县",
+        "value": "530523"
+      },
+      {
+        "label": "昌宁县",
+        "value": "530524"
+      },
+      {
+        "label": "腾冲市",
+        "value": "530581"
+      }
+    ],
+    [{
+        "label": "昭阳区",
+        "value": "530602"
+      },
+      {
+        "label": "鲁甸县",
+        "value": "530621"
+      },
+      {
+        "label": "巧家县",
+        "value": "530622"
+      },
+      {
+        "label": "盐津县",
+        "value": "530623"
+      },
+      {
+        "label": "大关县",
+        "value": "530624"
+      },
+      {
+        "label": "永善县",
+        "value": "530625"
+      },
+      {
+        "label": "绥江县",
+        "value": "530626"
+      },
+      {
+        "label": "镇雄县",
+        "value": "530627"
+      },
+      {
+        "label": "彝良县",
+        "value": "530628"
+      },
+      {
+        "label": "威信县",
+        "value": "530629"
+      },
+      {
+        "label": "水富县",
+        "value": "530630"
+      }
+    ],
+    [{
+        "label": "古城区",
+        "value": "530702"
+      },
+      {
+        "label": "玉龙纳西族自治县",
+        "value": "530721"
+      },
+      {
+        "label": "永胜县",
+        "value": "530722"
+      },
+      {
+        "label": "华坪县",
+        "value": "530723"
+      },
+      {
+        "label": "宁蒗彝族自治县",
+        "value": "530724"
+      }
+    ],
+    [{
+        "label": "思茅区",
+        "value": "530802"
+      },
+      {
+        "label": "宁洱哈尼族彝族自治县",
+        "value": "530821"
+      },
+      {
+        "label": "墨江哈尼族自治县",
+        "value": "530822"
+      },
+      {
+        "label": "景东彝族自治县",
+        "value": "530823"
+      },
+      {
+        "label": "景谷傣族彝族自治县",
+        "value": "530824"
+      },
+      {
+        "label": "镇沅彝族哈尼族拉祜族自治县",
+        "value": "530825"
+      },
+      {
+        "label": "江城哈尼族彝族自治县",
+        "value": "530826"
+      },
+      {
+        "label": "孟连傣族拉祜族佤族自治县",
+        "value": "530827"
+      },
+      {
+        "label": "澜沧拉祜族自治县",
+        "value": "530828"
+      },
+      {
+        "label": "西盟佤族自治县",
+        "value": "530829"
+      }
+    ],
+    [{
+        "label": "临翔区",
+        "value": "530902"
+      },
+      {
+        "label": "凤庆县",
+        "value": "530921"
+      },
+      {
+        "label": "云县",
+        "value": "530922"
+      },
+      {
+        "label": "永德县",
+        "value": "530923"
+      },
+      {
+        "label": "镇康县",
+        "value": "530924"
+      },
+      {
+        "label": "双江拉祜族佤族布朗族傣族自治县",
+        "value": "530925"
+      },
+      {
+        "label": "耿马傣族佤族自治县",
+        "value": "530926"
+      },
+      {
+        "label": "沧源佤族自治县",
+        "value": "530927"
+      }
+    ],
+    [{
+        "label": "楚雄市",
+        "value": "532301"
+      },
+      {
+        "label": "双柏县",
+        "value": "532322"
+      },
+      {
+        "label": "牟定县",
+        "value": "532323"
+      },
+      {
+        "label": "南华县",
+        "value": "532324"
+      },
+      {
+        "label": "姚安县",
+        "value": "532325"
+      },
+      {
+        "label": "大姚县",
+        "value": "532326"
+      },
+      {
+        "label": "永仁县",
+        "value": "532327"
+      },
+      {
+        "label": "元谋县",
+        "value": "532328"
+      },
+      {
+        "label": "武定县",
+        "value": "532329"
+      },
+      {
+        "label": "禄丰县",
+        "value": "532331"
+      }
+    ],
+    [{
+        "label": "个旧市",
+        "value": "532501"
+      },
+      {
+        "label": "开远市",
+        "value": "532502"
+      },
+      {
+        "label": "蒙自市",
+        "value": "532503"
+      },
+      {
+        "label": "弥勒市",
+        "value": "532504"
+      },
+      {
+        "label": "屏边苗族自治县",
+        "value": "532523"
+      },
+      {
+        "label": "建水县",
+        "value": "532524"
+      },
+      {
+        "label": "石屏县",
+        "value": "532525"
+      },
+      {
+        "label": "泸西县",
+        "value": "532527"
+      },
+      {
+        "label": "元阳县",
+        "value": "532528"
+      },
+      {
+        "label": "红河县",
+        "value": "532529"
+      },
+      {
+        "label": "金平苗族瑶族傣族自治县",
+        "value": "532530"
+      },
+      {
+        "label": "绿春县",
+        "value": "532531"
+      },
+      {
+        "label": "河口瑶族自治县",
+        "value": "532532"
+      }
+    ],
+    [{
+        "label": "文山市",
+        "value": "532601"
+      },
+      {
+        "label": "砚山县",
+        "value": "532622"
+      },
+      {
+        "label": "西畴县",
+        "value": "532623"
+      },
+      {
+        "label": "麻栗坡县",
+        "value": "532624"
+      },
+      {
+        "label": "马关县",
+        "value": "532625"
+      },
+      {
+        "label": "丘北县",
+        "value": "532626"
+      },
+      {
+        "label": "广南县",
+        "value": "532627"
+      },
+      {
+        "label": "富宁县",
+        "value": "532628"
+      }
+    ],
+    [{
+        "label": "景洪市",
+        "value": "532801"
+      },
+      {
+        "label": "勐海县",
+        "value": "532822"
+      },
+      {
+        "label": "勐腊县",
+        "value": "532823"
+      }
+    ],
+    [{
+        "label": "大理市",
+        "value": "532901"
+      },
+      {
+        "label": "漾濞彝族自治县",
+        "value": "532922"
+      },
+      {
+        "label": "祥云县",
+        "value": "532923"
+      },
+      {
+        "label": "宾川县",
+        "value": "532924"
+      },
+      {
+        "label": "弥渡县",
+        "value": "532925"
+      },
+      {
+        "label": "南涧彝族自治县",
+        "value": "532926"
+      },
+      {
+        "label": "巍山彝族回族自治县",
+        "value": "532927"
+      },
+      {
+        "label": "永平县",
+        "value": "532928"
+      },
+      {
+        "label": "云龙县",
+        "value": "532929"
+      },
+      {
+        "label": "洱源县",
+        "value": "532930"
+      },
+      {
+        "label": "剑川县",
+        "value": "532931"
+      },
+      {
+        "label": "鹤庆县",
+        "value": "532932"
+      }
+    ],
+    [{
+        "label": "瑞丽市",
+        "value": "533102"
+      },
+      {
+        "label": "芒市",
+        "value": "533103"
+      },
+      {
+        "label": "梁河县",
+        "value": "533122"
+      },
+      {
+        "label": "盈江县",
+        "value": "533123"
+      },
+      {
+        "label": "陇川县",
+        "value": "533124"
+      }
+    ],
+    [{
+        "label": "泸水市",
+        "value": "533301"
+      },
+      {
+        "label": "福贡县",
+        "value": "533323"
+      },
+      {
+        "label": "贡山独龙族怒族自治县",
+        "value": "533324"
+      },
+      {
+        "label": "兰坪白族普米族自治县",
+        "value": "533325"
+      }
+    ],
+    [{
+        "label": "香格里拉市",
+        "value": "533401"
+      },
+      {
+        "label": "德钦县",
+        "value": "533422"
+      },
+      {
+        "label": "维西傈僳族自治县",
+        "value": "533423"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "城关区",
+        "value": "540102"
+      },
+      {
+        "label": "堆龙德庆区",
+        "value": "540103"
+      },
+      {
+        "label": "林周县",
+        "value": "540121"
+      },
+      {
+        "label": "当雄县",
+        "value": "540122"
+      },
+      {
+        "label": "尼木县",
+        "value": "540123"
+      },
+      {
+        "label": "曲水县",
+        "value": "540124"
+      },
+      {
+        "label": "达孜县",
+        "value": "540126"
+      },
+      {
+        "label": "墨竹工卡县",
+        "value": "540127"
+      },
+      {
+        "label": "格尔木藏青工业园区",
+        "value": "540171"
+      },
+      {
+        "label": "拉萨经济技术开发区",
+        "value": "540172"
+      },
+      {
+        "label": "西藏文化旅游创意园区",
+        "value": "540173"
+      },
+      {
+        "label": "达孜工业园区",
+        "value": "540174"
+      }
+    ],
+    [{
+        "label": "桑珠孜区",
+        "value": "540202"
+      },
+      {
+        "label": "南木林县",
+        "value": "540221"
+      },
+      {
+        "label": "江孜县",
+        "value": "540222"
+      },
+      {
+        "label": "定日县",
+        "value": "540223"
+      },
+      {
+        "label": "萨迦县",
+        "value": "540224"
+      },
+      {
+        "label": "拉孜县",
+        "value": "540225"
+      },
+      {
+        "label": "昂仁县",
+        "value": "540226"
+      },
+      {
+        "label": "谢通门县",
+        "value": "540227"
+      },
+      {
+        "label": "白朗县",
+        "value": "540228"
+      },
+      {
+        "label": "仁布县",
+        "value": "540229"
+      },
+      {
+        "label": "康马县",
+        "value": "540230"
+      },
+      {
+        "label": "定结县",
+        "value": "540231"
+      },
+      {
+        "label": "仲巴县",
+        "value": "540232"
+      },
+      {
+        "label": "亚东县",
+        "value": "540233"
+      },
+      {
+        "label": "吉隆县",
+        "value": "540234"
+      },
+      {
+        "label": "聂拉木县",
+        "value": "540235"
+      },
+      {
+        "label": "萨嘎县",
+        "value": "540236"
+      },
+      {
+        "label": "岗巴县",
+        "value": "540237"
+      }
+    ],
+    [{
+        "label": "卡若区",
+        "value": "540302"
+      },
+      {
+        "label": "江达县",
+        "value": "540321"
+      },
+      {
+        "label": "贡觉县",
+        "value": "540322"
+      },
+      {
+        "label": "类乌齐县",
+        "value": "540323"
+      },
+      {
+        "label": "丁青县",
+        "value": "540324"
+      },
+      {
+        "label": "察雅县",
+        "value": "540325"
+      },
+      {
+        "label": "八宿县",
+        "value": "540326"
+      },
+      {
+        "label": "左贡县",
+        "value": "540327"
+      },
+      {
+        "label": "芒康县",
+        "value": "540328"
+      },
+      {
+        "label": "洛隆县",
+        "value": "540329"
+      },
+      {
+        "label": "边坝县",
+        "value": "540330"
+      }
+    ],
+    [{
+        "label": "巴宜区",
+        "value": "540402"
+      },
+      {
+        "label": "工布江达县",
+        "value": "540421"
+      },
+      {
+        "label": "米林县",
+        "value": "540422"
+      },
+      {
+        "label": "墨脱县",
+        "value": "540423"
+      },
+      {
+        "label": "波密县",
+        "value": "540424"
+      },
+      {
+        "label": "察隅县",
+        "value": "540425"
+      },
+      {
+        "label": "朗县",
+        "value": "540426"
+      }
+    ],
+    [{
+        "label": "乃东区",
+        "value": "540502"
+      },
+      {
+        "label": "扎囊县",
+        "value": "540521"
+      },
+      {
+        "label": "贡嘎县",
+        "value": "540522"
+      },
+      {
+        "label": "桑日县",
+        "value": "540523"
+      },
+      {
+        "label": "琼结县",
+        "value": "540524"
+      },
+      {
+        "label": "曲松县",
+        "value": "540525"
+      },
+      {
+        "label": "措美县",
+        "value": "540526"
+      },
+      {
+        "label": "洛扎县",
+        "value": "540527"
+      },
+      {
+        "label": "加查县",
+        "value": "540528"
+      },
+      {
+        "label": "隆子县",
+        "value": "540529"
+      },
+      {
+        "label": "错那县",
+        "value": "540530"
+      },
+      {
+        "label": "浪卡子县",
+        "value": "540531"
+      }
+    ],
+    [{
+        "label": "那曲县",
+        "value": "542421"
+      },
+      {
+        "label": "嘉黎县",
+        "value": "542422"
+      },
+      {
+        "label": "比如县",
+        "value": "542423"
+      },
+      {
+        "label": "聂荣县",
+        "value": "542424"
+      },
+      {
+        "label": "安多县",
+        "value": "542425"
+      },
+      {
+        "label": "申扎县",
+        "value": "542426"
+      },
+      {
+        "label": "索县",
+        "value": "542427"
+      },
+      {
+        "label": "班戈县",
+        "value": "542428"
+      },
+      {
+        "label": "巴青县",
+        "value": "542429"
+      },
+      {
+        "label": "尼玛县",
+        "value": "542430"
+      },
+      {
+        "label": "双湖县",
+        "value": "542431"
+      }
+    ],
+    [{
+        "label": "普兰县",
+        "value": "542521"
+      },
+      {
+        "label": "札达县",
+        "value": "542522"
+      },
+      {
+        "label": "噶尔县",
+        "value": "542523"
+      },
+      {
+        "label": "日土县",
+        "value": "542524"
+      },
+      {
+        "label": "革吉县",
+        "value": "542525"
+      },
+      {
+        "label": "改则县",
+        "value": "542526"
+      },
+      {
+        "label": "措勤县",
+        "value": "542527"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "新城区",
+        "value": "610102"
+      },
+      {
+        "label": "碑林区",
+        "value": "610103"
+      },
+      {
+        "label": "莲湖区",
+        "value": "610104"
+      },
+      {
+        "label": "灞桥区",
+        "value": "610111"
+      },
+      {
+        "label": "未央区",
+        "value": "610112"
+      },
+      {
+        "label": "雁塔区",
+        "value": "610113"
+      },
+      {
+        "label": "阎良区",
+        "value": "610114"
+      },
+      {
+        "label": "临潼区",
+        "value": "610115"
+      },
+      {
+        "label": "长安区",
+        "value": "610116"
+      },
+      {
+        "label": "高陵区",
+        "value": "610117"
+      },
+      {
+        "label": "鄠邑区",
+        "value": "610118"
+      },
+      {
+        "label": "蓝田县",
+        "value": "610122"
+      },
+      {
+        "label": "周至县",
+        "value": "610124"
+      }
+    ],
+    [{
+        "label": "王益区",
+        "value": "610202"
+      },
+      {
+        "label": "印台区",
+        "value": "610203"
+      },
+      {
+        "label": "耀州区",
+        "value": "610204"
+      },
+      {
+        "label": "宜君县",
+        "value": "610222"
+      }
+    ],
+    [{
+        "label": "渭滨区",
+        "value": "610302"
+      },
+      {
+        "label": "金台区",
+        "value": "610303"
+      },
+      {
+        "label": "陈仓区",
+        "value": "610304"
+      },
+      {
+        "label": "凤翔县",
+        "value": "610322"
+      },
+      {
+        "label": "岐山县",
+        "value": "610323"
+      },
+      {
+        "label": "扶风县",
+        "value": "610324"
+      },
+      {
+        "label": "眉县",
+        "value": "610326"
+      },
+      {
+        "label": "陇县",
+        "value": "610327"
+      },
+      {
+        "label": "千阳县",
+        "value": "610328"
+      },
+      {
+        "label": "麟游县",
+        "value": "610329"
+      },
+      {
+        "label": "凤县",
+        "value": "610330"
+      },
+      {
+        "label": "太白县",
+        "value": "610331"
+      }
+    ],
+    [{
+        "label": "秦都区",
+        "value": "610402"
+      },
+      {
+        "label": "杨陵区",
+        "value": "610403"
+      },
+      {
+        "label": "渭城区",
+        "value": "610404"
+      },
+      {
+        "label": "三原县",
+        "value": "610422"
+      },
+      {
+        "label": "泾阳县",
+        "value": "610423"
+      },
+      {
+        "label": "乾县",
+        "value": "610424"
+      },
+      {
+        "label": "礼泉县",
+        "value": "610425"
+      },
+      {
+        "label": "永寿县",
+        "value": "610426"
+      },
+      {
+        "label": "彬县",
+        "value": "610427"
+      },
+      {
+        "label": "长武县",
+        "value": "610428"
+      },
+      {
+        "label": "旬邑县",
+        "value": "610429"
+      },
+      {
+        "label": "淳化县",
+        "value": "610430"
+      },
+      {
+        "label": "武功县",
+        "value": "610431"
+      },
+      {
+        "label": "兴平市",
+        "value": "610481"
+      }
+    ],
+    [{
+        "label": "临渭区",
+        "value": "610502"
+      },
+      {
+        "label": "华州区",
+        "value": "610503"
+      },
+      {
+        "label": "潼关县",
+        "value": "610522"
+      },
+      {
+        "label": "大荔县",
+        "value": "610523"
+      },
+      {
+        "label": "合阳县",
+        "value": "610524"
+      },
+      {
+        "label": "澄城县",
+        "value": "610525"
+      },
+      {
+        "label": "蒲城县",
+        "value": "610526"
+      },
+      {
+        "label": "白水县",
+        "value": "610527"
+      },
+      {
+        "label": "富平县",
+        "value": "610528"
+      },
+      {
+        "label": "韩城市",
+        "value": "610581"
+      },
+      {
+        "label": "华阴市",
+        "value": "610582"
+      }
+    ],
+    [{
+        "label": "宝塔区",
+        "value": "610602"
+      },
+      {
+        "label": "安塞区",
+        "value": "610603"
+      },
+      {
+        "label": "延长县",
+        "value": "610621"
+      },
+      {
+        "label": "延川县",
+        "value": "610622"
+      },
+      {
+        "label": "子长县",
+        "value": "610623"
+      },
+      {
+        "label": "志丹县",
+        "value": "610625"
+      },
+      {
+        "label": "吴起县",
+        "value": "610626"
+      },
+      {
+        "label": "甘泉县",
+        "value": "610627"
+      },
+      {
+        "label": "富县",
+        "value": "610628"
+      },
+      {
+        "label": "洛川县",
+        "value": "610629"
+      },
+      {
+        "label": "宜川县",
+        "value": "610630"
+      },
+      {
+        "label": "黄龙县",
+        "value": "610631"
+      },
+      {
+        "label": "黄陵县",
+        "value": "610632"
+      }
+    ],
+    [{
+        "label": "汉台区",
+        "value": "610702"
+      },
+      {
+        "label": "南郑区",
+        "value": "610703"
+      },
+      {
+        "label": "城固县",
+        "value": "610722"
+      },
+      {
+        "label": "洋县",
+        "value": "610723"
+      },
+      {
+        "label": "西乡县",
+        "value": "610724"
+      },
+      {
+        "label": "勉县",
+        "value": "610725"
+      },
+      {
+        "label": "宁强县",
+        "value": "610726"
+      },
+      {
+        "label": "略阳县",
+        "value": "610727"
+      },
+      {
+        "label": "镇巴县",
+        "value": "610728"
+      },
+      {
+        "label": "留坝县",
+        "value": "610729"
+      },
+      {
+        "label": "佛坪县",
+        "value": "610730"
+      }
+    ],
+    [{
+        "label": "榆阳区",
+        "value": "610802"
+      },
+      {
+        "label": "横山区",
+        "value": "610803"
+      },
+      {
+        "label": "府谷县",
+        "value": "610822"
+      },
+      {
+        "label": "靖边县",
+        "value": "610824"
+      },
+      {
+        "label": "定边县",
+        "value": "610825"
+      },
+      {
+        "label": "绥德县",
+        "value": "610826"
+      },
+      {
+        "label": "米脂县",
+        "value": "610827"
+      },
+      {
+        "label": "佳县",
+        "value": "610828"
+      },
+      {
+        "label": "吴堡县",
+        "value": "610829"
+      },
+      {
+        "label": "清涧县",
+        "value": "610830"
+      },
+      {
+        "label": "子洲县",
+        "value": "610831"
+      },
+      {
+        "label": "神木市",
+        "value": "610881"
+      }
+    ],
+    [{
+        "label": "汉滨区",
+        "value": "610902"
+      },
+      {
+        "label": "汉阴县",
+        "value": "610921"
+      },
+      {
+        "label": "石泉县",
+        "value": "610922"
+      },
+      {
+        "label": "宁陕县",
+        "value": "610923"
+      },
+      {
+        "label": "紫阳县",
+        "value": "610924"
+      },
+      {
+        "label": "岚皋县",
+        "value": "610925"
+      },
+      {
+        "label": "平利县",
+        "value": "610926"
+      },
+      {
+        "label": "镇坪县",
+        "value": "610927"
+      },
+      {
+        "label": "旬阳县",
+        "value": "610928"
+      },
+      {
+        "label": "白河县",
+        "value": "610929"
+      }
+    ],
+    [{
+        "label": "商州区",
+        "value": "611002"
+      },
+      {
+        "label": "洛南县",
+        "value": "611021"
+      },
+      {
+        "label": "丹凤县",
+        "value": "611022"
+      },
+      {
+        "label": "商南县",
+        "value": "611023"
+      },
+      {
+        "label": "山阳县",
+        "value": "611024"
+      },
+      {
+        "label": "镇安县",
+        "value": "611025"
+      },
+      {
+        "label": "柞水县",
+        "value": "611026"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "城关区",
+        "value": "620102"
+      },
+      {
+        "label": "七里河区",
+        "value": "620103"
+      },
+      {
+        "label": "西固区",
+        "value": "620104"
+      },
+      {
+        "label": "安宁区",
+        "value": "620105"
+      },
+      {
+        "label": "红古区",
+        "value": "620111"
+      },
+      {
+        "label": "永登县",
+        "value": "620121"
+      },
+      {
+        "label": "皋兰县",
+        "value": "620122"
+      },
+      {
+        "label": "榆中县",
+        "value": "620123"
+      },
+      {
+        "label": "兰州新区",
+        "value": "620171"
+      }
+    ],
+    [{
+      "label": "嘉峪关市",
+      "value": "620201"
+    }],
+    [{
+        "label": "金川区",
+        "value": "620302"
+      },
+      {
+        "label": "永昌县",
+        "value": "620321"
+      }
+    ],
+    [{
+        "label": "白银区",
+        "value": "620402"
+      },
+      {
+        "label": "平川区",
+        "value": "620403"
+      },
+      {
+        "label": "靖远县",
+        "value": "620421"
+      },
+      {
+        "label": "会宁县",
+        "value": "620422"
+      },
+      {
+        "label": "景泰县",
+        "value": "620423"
+      }
+    ],
+    [{
+        "label": "秦州区",
+        "value": "620502"
+      },
+      {
+        "label": "麦积区",
+        "value": "620503"
+      },
+      {
+        "label": "清水县",
+        "value": "620521"
+      },
+      {
+        "label": "秦安县",
+        "value": "620522"
+      },
+      {
+        "label": "甘谷县",
+        "value": "620523"
+      },
+      {
+        "label": "武山县",
+        "value": "620524"
+      },
+      {
+        "label": "张家川回族自治县",
+        "value": "620525"
+      }
+    ],
+    [{
+        "label": "凉州区",
+        "value": "620602"
+      },
+      {
+        "label": "民勤县",
+        "value": "620621"
+      },
+      {
+        "label": "古浪县",
+        "value": "620622"
+      },
+      {
+        "label": "天祝藏族自治县",
+        "value": "620623"
+      }
+    ],
+    [{
+        "label": "甘州区",
+        "value": "620702"
+      },
+      {
+        "label": "肃南裕固族自治县",
+        "value": "620721"
+      },
+      {
+        "label": "民乐县",
+        "value": "620722"
+      },
+      {
+        "label": "临泽县",
+        "value": "620723"
+      },
+      {
+        "label": "高台县",
+        "value": "620724"
+      },
+      {
+        "label": "山丹县",
+        "value": "620725"
+      }
+    ],
+    [{
+        "label": "崆峒区",
+        "value": "620802"
+      },
+      {
+        "label": "泾川县",
+        "value": "620821"
+      },
+      {
+        "label": "灵台县",
+        "value": "620822"
+      },
+      {
+        "label": "崇信县",
+        "value": "620823"
+      },
+      {
+        "label": "华亭县",
+        "value": "620824"
+      },
+      {
+        "label": "庄浪县",
+        "value": "620825"
+      },
+      {
+        "label": "静宁县",
+        "value": "620826"
+      },
+      {
+        "label": "平凉工业园区",
+        "value": "620871"
+      }
+    ],
+    [{
+        "label": "肃州区",
+        "value": "620902"
+      },
+      {
+        "label": "金塔县",
+        "value": "620921"
+      },
+      {
+        "label": "瓜州县",
+        "value": "620922"
+      },
+      {
+        "label": "肃北蒙古族自治县",
+        "value": "620923"
+      },
+      {
+        "label": "阿克塞哈萨克族自治县",
+        "value": "620924"
+      },
+      {
+        "label": "玉门市",
+        "value": "620981"
+      },
+      {
+        "label": "敦煌市",
+        "value": "620982"
+      }
+    ],
+    [{
+        "label": "西峰区",
+        "value": "621002"
+      },
+      {
+        "label": "庆城县",
+        "value": "621021"
+      },
+      {
+        "label": "环县",
+        "value": "621022"
+      },
+      {
+        "label": "华池县",
+        "value": "621023"
+      },
+      {
+        "label": "合水县",
+        "value": "621024"
+      },
+      {
+        "label": "正宁县",
+        "value": "621025"
+      },
+      {
+        "label": "宁县",
+        "value": "621026"
+      },
+      {
+        "label": "镇原县",
+        "value": "621027"
+      }
+    ],
+    [{
+        "label": "安定区",
+        "value": "621102"
+      },
+      {
+        "label": "通渭县",
+        "value": "621121"
+      },
+      {
+        "label": "陇西县",
+        "value": "621122"
+      },
+      {
+        "label": "渭源县",
+        "value": "621123"
+      },
+      {
+        "label": "临洮县",
+        "value": "621124"
+      },
+      {
+        "label": "漳县",
+        "value": "621125"
+      },
+      {
+        "label": "岷县",
+        "value": "621126"
+      }
+    ],
+    [{
+        "label": "武都区",
+        "value": "621202"
+      },
+      {
+        "label": "成县",
+        "value": "621221"
+      },
+      {
+        "label": "文县",
+        "value": "621222"
+      },
+      {
+        "label": "宕昌县",
+        "value": "621223"
+      },
+      {
+        "label": "康县",
+        "value": "621224"
+      },
+      {
+        "label": "西和县",
+        "value": "621225"
+      },
+      {
+        "label": "礼县",
+        "value": "621226"
+      },
+      {
+        "label": "徽县",
+        "value": "621227"
+      },
+      {
+        "label": "两当县",
+        "value": "621228"
+      }
+    ],
+    [{
+        "label": "临夏市",
+        "value": "622901"
+      },
+      {
+        "label": "临夏县",
+        "value": "622921"
+      },
+      {
+        "label": "康乐县",
+        "value": "622922"
+      },
+      {
+        "label": "永靖县",
+        "value": "622923"
+      },
+      {
+        "label": "广河县",
+        "value": "622924"
+      },
+      {
+        "label": "和政县",
+        "value": "622925"
+      },
+      {
+        "label": "东乡族自治县",
+        "value": "622926"
+      },
+      {
+        "label": "积石山保安族东乡族撒拉族自治县",
+        "value": "622927"
+      }
+    ],
+    [{
+        "label": "合作市",
+        "value": "623001"
+      },
+      {
+        "label": "临潭县",
+        "value": "623021"
+      },
+      {
+        "label": "卓尼县",
+        "value": "623022"
+      },
+      {
+        "label": "舟曲县",
+        "value": "623023"
+      },
+      {
+        "label": "迭部县",
+        "value": "623024"
+      },
+      {
+        "label": "玛曲县",
+        "value": "623025"
+      },
+      {
+        "label": "碌曲县",
+        "value": "623026"
+      },
+      {
+        "label": "夏河县",
+        "value": "623027"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "城东区",
+        "value": "630102"
+      },
+      {
+        "label": "城中区",
+        "value": "630103"
+      },
+      {
+        "label": "城西区",
+        "value": "630104"
+      },
+      {
+        "label": "城北区",
+        "value": "630105"
+      },
+      {
+        "label": "大通回族土族自治县",
+        "value": "630121"
+      },
+      {
+        "label": "湟中县",
+        "value": "630122"
+      },
+      {
+        "label": "湟源县",
+        "value": "630123"
+      }
+    ],
+    [{
+        "label": "乐都区",
+        "value": "630202"
+      },
+      {
+        "label": "平安区",
+        "value": "630203"
+      },
+      {
+        "label": "民和回族土族自治县",
+        "value": "630222"
+      },
+      {
+        "label": "互助土族自治县",
+        "value": "630223"
+      },
+      {
+        "label": "化隆回族自治县",
+        "value": "630224"
+      },
+      {
+        "label": "循化撒拉族自治县",
+        "value": "630225"
+      }
+    ],
+    [{
+        "label": "门源回族自治县",
+        "value": "632221"
+      },
+      {
+        "label": "祁连县",
+        "value": "632222"
+      },
+      {
+        "label": "海晏县",
+        "value": "632223"
+      },
+      {
+        "label": "刚察县",
+        "value": "632224"
+      }
+    ],
+    [{
+        "label": "同仁县",
+        "value": "632321"
+      },
+      {
+        "label": "尖扎县",
+        "value": "632322"
+      },
+      {
+        "label": "泽库县",
+        "value": "632323"
+      },
+      {
+        "label": "河南蒙古族自治县",
+        "value": "632324"
+      }
+    ],
+    [{
+        "label": "共和县",
+        "value": "632521"
+      },
+      {
+        "label": "同德县",
+        "value": "632522"
+      },
+      {
+        "label": "贵德县",
+        "value": "632523"
+      },
+      {
+        "label": "兴海县",
+        "value": "632524"
+      },
+      {
+        "label": "贵南县",
+        "value": "632525"
+      }
+    ],
+    [{
+        "label": "玛沁县",
+        "value": "632621"
+      },
+      {
+        "label": "班玛县",
+        "value": "632622"
+      },
+      {
+        "label": "甘德县",
+        "value": "632623"
+      },
+      {
+        "label": "达日县",
+        "value": "632624"
+      },
+      {
+        "label": "久治县",
+        "value": "632625"
+      },
+      {
+        "label": "玛多县",
+        "value": "632626"
+      }
+    ],
+    [{
+        "label": "玉树市",
+        "value": "632701"
+      },
+      {
+        "label": "杂多县",
+        "value": "632722"
+      },
+      {
+        "label": "称多县",
+        "value": "632723"
+      },
+      {
+        "label": "治多县",
+        "value": "632724"
+      },
+      {
+        "label": "囊谦县",
+        "value": "632725"
+      },
+      {
+        "label": "曲麻莱县",
+        "value": "632726"
+      }
+    ],
+    [{
+        "label": "格尔木市",
+        "value": "632801"
+      },
+      {
+        "label": "德令哈市",
+        "value": "632802"
+      },
+      {
+        "label": "乌兰县",
+        "value": "632821"
+      },
+      {
+        "label": "都兰县",
+        "value": "632822"
+      },
+      {
+        "label": "天峻县",
+        "value": "632823"
+      },
+      {
+        "label": "大柴旦行政委员会",
+        "value": "632857"
+      },
+      {
+        "label": "冷湖行政委员会",
+        "value": "632858"
+      },
+      {
+        "label": "茫崖行政委员会",
+        "value": "632859"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "兴庆区",
+        "value": "640104"
+      },
+      {
+        "label": "西夏区",
+        "value": "640105"
+      },
+      {
+        "label": "金凤区",
+        "value": "640106"
+      },
+      {
+        "label": "永宁县",
+        "value": "640121"
+      },
+      {
+        "label": "贺兰县",
+        "value": "640122"
+      },
+      {
+        "label": "灵武市",
+        "value": "640181"
+      }
+    ],
+    [{
+        "label": "大武口区",
+        "value": "640202"
+      },
+      {
+        "label": "惠农区",
+        "value": "640205"
+      },
+      {
+        "label": "平罗县",
+        "value": "640221"
+      }
+    ],
+    [{
+        "label": "利通区",
+        "value": "640302"
+      },
+      {
+        "label": "红寺堡区",
+        "value": "640303"
+      },
+      {
+        "label": "盐池县",
+        "value": "640323"
+      },
+      {
+        "label": "同心县",
+        "value": "640324"
+      },
+      {
+        "label": "青铜峡市",
+        "value": "640381"
+      }
+    ],
+    [{
+        "label": "原州区",
+        "value": "640402"
+      },
+      {
+        "label": "西吉县",
+        "value": "640422"
+      },
+      {
+        "label": "隆德县",
+        "value": "640423"
+      },
+      {
+        "label": "泾源县",
+        "value": "640424"
+      },
+      {
+        "label": "彭阳县",
+        "value": "640425"
+      }
+    ],
+    [{
+        "label": "沙坡头区",
+        "value": "640502"
+      },
+      {
+        "label": "中宁县",
+        "value": "640521"
+      },
+      {
+        "label": "海原县",
+        "value": "640522"
+      }
+    ]
+  ],
+  [
+    [{
+        "label": "天山区",
+        "value": "650102"
+      },
+      {
+        "label": "沙依巴克区",
+        "value": "650103"
+      },
+      {
+        "label": "新市区",
+        "value": "650104"
+      },
+      {
+        "label": "水磨沟区",
+        "value": "650105"
+      },
+      {
+        "label": "头屯河区",
+        "value": "650106"
+      },
+      {
+        "label": "达坂城区",
+        "value": "650107"
+      },
+      {
+        "label": "米东区",
+        "value": "650109"
+      },
+      {
+        "label": "乌鲁木齐县",
+        "value": "650121"
+      },
+      {
+        "label": "乌鲁木齐经济技术开发区",
+        "value": "650171"
+      },
+      {
+        "label": "乌鲁木齐高新技术产业开发区",
+        "value": "650172"
+      }
+    ],
+    [{
+        "label": "独山子区",
+        "value": "650202"
+      },
+      {
+        "label": "克拉玛依区",
+        "value": "650203"
+      },
+      {
+        "label": "白碱滩区",
+        "value": "650204"
+      },
+      {
+        "label": "乌尔禾区",
+        "value": "650205"
+      }
+    ],
+    [{
+        "label": "高昌区",
+        "value": "650402"
+      },
+      {
+        "label": "鄯善县",
+        "value": "650421"
+      },
+      {
+        "label": "托克逊县",
+        "value": "650422"
+      }
+    ],
+    [{
+        "label": "伊州区",
+        "value": "650502"
+      },
+      {
+        "label": "巴里坤哈萨克自治县",
+        "value": "650521"
+      },
+      {
+        "label": "伊吾县",
+        "value": "650522"
+      }
+    ],
+    [{
+        "label": "昌吉市",
+        "value": "652301"
+      },
+      {
+        "label": "阜康市",
+        "value": "652302"
+      },
+      {
+        "label": "呼图壁县",
+        "value": "652323"
+      },
+      {
+        "label": "玛纳斯县",
+        "value": "652324"
+      },
+      {
+        "label": "奇台县",
+        "value": "652325"
+      },
+      {
+        "label": "吉木萨尔县",
+        "value": "652327"
+      },
+      {
+        "label": "木垒哈萨克自治县",
+        "value": "652328"
+      }
+    ],
+    [{
+        "label": "博乐市",
+        "value": "652701"
+      },
+      {
+        "label": "阿拉山口市",
+        "value": "652702"
+      },
+      {
+        "label": "精河县",
+        "value": "652722"
+      },
+      {
+        "label": "温泉县",
+        "value": "652723"
+      }
+    ],
+    [{
+        "label": "库尔勒市",
+        "value": "652801"
+      },
+      {
+        "label": "轮台县",
+        "value": "652822"
+      },
+      {
+        "label": "尉犁县",
+        "value": "652823"
+      },
+      {
+        "label": "若羌县",
+        "value": "652824"
+      },
+      {
+        "label": "且末县",
+        "value": "652825"
+      },
+      {
+        "label": "焉耆回族自治县",
+        "value": "652826"
+      },
+      {
+        "label": "和静县",
+        "value": "652827"
+      },
+      {
+        "label": "和硕县",
+        "value": "652828"
+      },
+      {
+        "label": "博湖县",
+        "value": "652829"
+      },
+      {
+        "label": "库尔勒经济技术开发区",
+        "value": "652871"
+      }
+    ],
+    [{
+        "label": "阿克苏市",
+        "value": "652901"
+      },
+      {
+        "label": "温宿县",
+        "value": "652922"
+      },
+      {
+        "label": "库车县",
+        "value": "652923"
+      },
+      {
+        "label": "沙雅县",
+        "value": "652924"
+      },
+      {
+        "label": "新和县",
+        "value": "652925"
+      },
+      {
+        "label": "拜城县",
+        "value": "652926"
+      },
+      {
+        "label": "乌什县",
+        "value": "652927"
+      },
+      {
+        "label": "阿瓦提县",
+        "value": "652928"
+      },
+      {
+        "label": "柯坪县",
+        "value": "652929"
+      }
+    ],
+    [{
+        "label": "阿图什市",
+        "value": "653001"
+      },
+      {
+        "label": "阿克陶县",
+        "value": "653022"
+      },
+      {
+        "label": "阿合奇县",
+        "value": "653023"
+      },
+      {
+        "label": "乌恰县",
+        "value": "653024"
+      }
+    ],
+    [{
+        "label": "喀什市",
+        "value": "653101"
+      },
+      {
+        "label": "疏附县",
+        "value": "653121"
+      },
+      {
+        "label": "疏勒县",
+        "value": "653122"
+      },
+      {
+        "label": "英吉沙县",
+        "value": "653123"
+      },
+      {
+        "label": "泽普县",
+        "value": "653124"
+      },
+      {
+        "label": "莎车县",
+        "value": "653125"
+      },
+      {
+        "label": "叶城县",
+        "value": "653126"
+      },
+      {
+        "label": "麦盖提县",
+        "value": "653127"
+      },
+      {
+        "label": "岳普湖县",
+        "value": "653128"
+      },
+      {
+        "label": "伽师县",
+        "value": "653129"
+      },
+      {
+        "label": "巴楚县",
+        "value": "653130"
+      },
+      {
+        "label": "塔什库尔干塔吉克自治县",
+        "value": "653131"
+      }
+    ],
+    [{
+        "label": "和田市",
+        "value": "653201"
+      },
+      {
+        "label": "和田县",
+        "value": "653221"
+      },
+      {
+        "label": "墨玉县",
+        "value": "653222"
+      },
+      {
+        "label": "皮山县",
+        "value": "653223"
+      },
+      {
+        "label": "洛浦县",
+        "value": "653224"
+      },
+      {
+        "label": "策勒县",
+        "value": "653225"
+      },
+      {
+        "label": "于田县",
+        "value": "653226"
+      },
+      {
+        "label": "民丰县",
+        "value": "653227"
+      }
+    ],
+    [{
+        "label": "伊宁市",
+        "value": "654002"
+      },
+      {
+        "label": "奎屯市",
+        "value": "654003"
+      },
+      {
+        "label": "霍尔果斯市",
+        "value": "654004"
+      },
+      {
+        "label": "伊宁县",
+        "value": "654021"
+      },
+      {
+        "label": "察布查尔锡伯自治县",
+        "value": "654022"
+      },
+      {
+        "label": "霍城县",
+        "value": "654023"
+      },
+      {
+        "label": "巩留县",
+        "value": "654024"
+      },
+      {
+        "label": "新源县",
+        "value": "654025"
+      },
+      {
+        "label": "昭苏县",
+        "value": "654026"
+      },
+      {
+        "label": "特克斯县",
+        "value": "654027"
+      },
+      {
+        "label": "尼勒克县",
+        "value": "654028"
+      }
+    ],
+    [{
+        "label": "塔城市",
+        "value": "654201"
+      },
+      {
+        "label": "乌苏市",
+        "value": "654202"
+      },
+      {
+        "label": "额敏县",
+        "value": "654221"
+      },
+      {
+        "label": "沙湾县",
+        "value": "654223"
+      },
+      {
+        "label": "托里县",
+        "value": "654224"
+      },
+      {
+        "label": "裕民县",
+        "value": "654225"
+      },
+      {
+        "label": "和布克赛尔蒙古自治县",
+        "value": "654226"
+      }
+    ],
+    [{
+        "label": "阿勒泰市",
+        "value": "654301"
+      },
+      {
+        "label": "布尔津县",
+        "value": "654321"
+      },
+      {
+        "label": "富蕴县",
+        "value": "654322"
+      },
+      {
+        "label": "福海县",
+        "value": "654323"
+      },
+      {
+        "label": "哈巴河县",
+        "value": "654324"
+      },
+      {
+        "label": "青河县",
+        "value": "654325"
+      },
+      {
+        "label": "吉木乃县",
+        "value": "654326"
+      }
+    ],
+    [{
+        "label": "石河子市",
+        "value": "659001"
+      },
+      {
+        "label": "阿拉尔市",
+        "value": "659002"
+      },
+      {
+        "label": "图木舒克市",
+        "value": "659003"
+      },
+      {
+        "label": "五家渠市",
+        "value": "659004"
+      },
+      {
+        "label": "铁门关市",
+        "value": "659006"
+      }
+    ]
+  ],
+  [
+    [{
+      "label": "台北",
+      "value": "660101"
+    }],
+    [{
+      "label": "高雄",
+      "value": "660201"
+    }],
+    [{
+      "label": "基隆",
+      "value": "660301"
+    }],
+    [{
+      "label": "台中",
+      "value": "660401"
+    }],
+    [{
+      "label": "台南",
+      "value": "660501"
+    }],
+    [{
+      "label": "新竹",
+      "value": "660601"
+    }],
+    [{
+      "label": "嘉义",
+      "value": "660701"
+    }],
+    [{
+      "label": "宜兰",
+      "value": "660801"
+    }],
+    [{
+      "label": "桃园",
+      "value": "660901"
+    }],
+    [{
+      "label": "苗栗",
+      "value": "661001"
+    }],
+    [{
+      "label": "彰化",
+      "value": "661101"
+    }],
+    [{
+      "label": "南投",
+      "value": "661201"
+    }],
+    [{
+      "label": "云林",
+      "value": "661301"
+    }],
+    [{
+      "label": "屏东",
+      "value": "661401"
+    }],
+    [{
+      "label": "台东",
+      "value": "661501"
+    }],
+    [{
+      "label": "花莲",
+      "value": "661601"
+    }],
+    [{
+      "label": "澎湖",
+      "value": "661701"
+    }]
+  ],
+  [
+    [{
+      "label": "香港岛",
+      "value": "670101"
+    }],
+    [{
+      "label": "九龙",
+      "value": "670201"
+    }],
+    [{
+      "label": "新界",
+      "value": "670301"
+    }]
+  ],
+  [
+    [{
+      "label": "澳门半岛",
+      "value": "680101"
+    }],
+    [{
+      "label": "氹仔岛",
+      "value": "680201"
+    }],
+    [{
+      "label": "路环岛",
+      "value": "680301"
+    }],
+    [{
+      "label": "路氹城",
+      "value": "680401"
+    }]
+  ]
+]
+export default areaData;
diff --git a/pages_borrow_books/components/mpvue-citypicker/city-data/city.js b/pages_borrow_books/components/mpvue-citypicker/city-data/city.js
new file mode 100644
index 0000000000000000000000000000000000000000..8c1dc262f93e350212b45fa09dadf35e7f563203
--- /dev/null
+++ b/pages_borrow_books/components/mpvue-citypicker/city-data/city.js
@@ -0,0 +1,1503 @@
+/* eslint-disable */
+var cityData = [
+  [{
+    "label": "市辖区",
+    "value": "1101"
+  }],
+  [{
+    "label": "市辖区",
+    "value": "1201"
+  }],
+  [{
+      "label": "石家庄市",
+      "value": "1301"
+    },
+    {
+      "label": "唐山市",
+      "value": "1302"
+    },
+    {
+      "label": "秦皇岛市",
+      "value": "1303"
+    },
+    {
+      "label": "邯郸市",
+      "value": "1304"
+    },
+    {
+      "label": "邢台市",
+      "value": "1305"
+    },
+    {
+      "label": "保定市",
+      "value": "1306"
+    },
+    {
+      "label": "张家口市",
+      "value": "1307"
+    },
+    {
+      "label": "承德市",
+      "value": "1308"
+    },
+    {
+      "label": "沧州市",
+      "value": "1309"
+    },
+    {
+      "label": "廊坊市",
+      "value": "1310"
+    },
+    {
+      "label": "衡水市",
+      "value": "1311"
+    }
+  ],
+  [{
+      "label": "太原市",
+      "value": "1401"
+    },
+    {
+      "label": "大同市",
+      "value": "1402"
+    },
+    {
+      "label": "阳泉市",
+      "value": "1403"
+    },
+    {
+      "label": "长治市",
+      "value": "1404"
+    },
+    {
+      "label": "晋城市",
+      "value": "1405"
+    },
+    {
+      "label": "朔州市",
+      "value": "1406"
+    },
+    {
+      "label": "晋中市",
+      "value": "1407"
+    },
+    {
+      "label": "运城市",
+      "value": "1408"
+    },
+    {
+      "label": "忻州市",
+      "value": "1409"
+    },
+    {
+      "label": "临汾市",
+      "value": "1410"
+    },
+    {
+      "label": "吕梁市",
+      "value": "1411"
+    }
+  ],
+  [{
+      "label": "呼和浩特市",
+      "value": "1501"
+    },
+    {
+      "label": "包头市",
+      "value": "1502"
+    },
+    {
+      "label": "乌海市",
+      "value": "1503"
+    },
+    {
+      "label": "赤峰市",
+      "value": "1504"
+    },
+    {
+      "label": "通辽市",
+      "value": "1505"
+    },
+    {
+      "label": "鄂尔多斯市",
+      "value": "1506"
+    },
+    {
+      "label": "呼伦贝尔市",
+      "value": "1507"
+    },
+    {
+      "label": "巴彦淖尔市",
+      "value": "1508"
+    },
+    {
+      "label": "乌兰察布市",
+      "value": "1509"
+    },
+    {
+      "label": "兴安盟",
+      "value": "1522"
+    },
+    {
+      "label": "锡林郭勒盟",
+      "value": "1525"
+    },
+    {
+      "label": "阿拉善盟",
+      "value": "1529"
+    }
+  ],
+  [{
+      "label": "沈阳市",
+      "value": "2101"
+    },
+    {
+      "label": "大连市",
+      "value": "2102"
+    },
+    {
+      "label": "鞍山市",
+      "value": "2103"
+    },
+    {
+      "label": "抚顺市",
+      "value": "2104"
+    },
+    {
+      "label": "本溪市",
+      "value": "2105"
+    },
+    {
+      "label": "丹东市",
+      "value": "2106"
+    },
+    {
+      "label": "锦州市",
+      "value": "2107"
+    },
+    {
+      "label": "营口市",
+      "value": "2108"
+    },
+    {
+      "label": "阜新市",
+      "value": "2109"
+    },
+    {
+      "label": "辽阳市",
+      "value": "2110"
+    },
+    {
+      "label": "盘锦市",
+      "value": "2111"
+    },
+    {
+      "label": "铁岭市",
+      "value": "2112"
+    },
+    {
+      "label": "朝阳市",
+      "value": "2113"
+    },
+    {
+      "label": "葫芦岛市",
+      "value": "2114"
+    }
+  ],
+  [{
+      "label": "长春市",
+      "value": "2201"
+    },
+    {
+      "label": "吉林市",
+      "value": "2202"
+    },
+    {
+      "label": "四平市",
+      "value": "2203"
+    },
+    {
+      "label": "辽源市",
+      "value": "2204"
+    },
+    {
+      "label": "通化市",
+      "value": "2205"
+    },
+    {
+      "label": "白山市",
+      "value": "2206"
+    },
+    {
+      "label": "松原市",
+      "value": "2207"
+    },
+    {
+      "label": "白城市",
+      "value": "2208"
+    },
+    {
+      "label": "延边朝鲜族自治州",
+      "value": "2224"
+    }
+  ],
+  [{
+      "label": "哈尔滨市",
+      "value": "2301"
+    },
+    {
+      "label": "齐齐哈尔市",
+      "value": "2302"
+    },
+    {
+      "label": "鸡西市",
+      "value": "2303"
+    },
+    {
+      "label": "鹤岗市",
+      "value": "2304"
+    },
+    {
+      "label": "双鸭山市",
+      "value": "2305"
+    },
+    {
+      "label": "大庆市",
+      "value": "2306"
+    },
+    {
+      "label": "伊春市",
+      "value": "2307"
+    },
+    {
+      "label": "佳木斯市",
+      "value": "2308"
+    },
+    {
+      "label": "七台河市",
+      "value": "2309"
+    },
+    {
+      "label": "牡丹江市",
+      "value": "2310"
+    },
+    {
+      "label": "黑河市",
+      "value": "2311"
+    },
+    {
+      "label": "绥化市",
+      "value": "2312"
+    },
+    {
+      "label": "大兴安岭地区",
+      "value": "2327"
+    }
+  ],
+  [{
+    "label": "市辖区",
+    "value": "3101"
+  }],
+  [{
+      "label": "南京市",
+      "value": "3201"
+    },
+    {
+      "label": "无锡市",
+      "value": "3202"
+    },
+    {
+      "label": "徐州市",
+      "value": "3203"
+    },
+    {
+      "label": "常州市",
+      "value": "3204"
+    },
+    {
+      "label": "苏州市",
+      "value": "3205"
+    },
+    {
+      "label": "南通市",
+      "value": "3206"
+    },
+    {
+      "label": "连云港市",
+      "value": "3207"
+    },
+    {
+      "label": "淮安市",
+      "value": "3208"
+    },
+    {
+      "label": "盐城市",
+      "value": "3209"
+    },
+    {
+      "label": "扬州市",
+      "value": "3210"
+    },
+    {
+      "label": "镇江市",
+      "value": "3211"
+    },
+    {
+      "label": "泰州市",
+      "value": "3212"
+    },
+    {
+      "label": "宿迁市",
+      "value": "3213"
+    }
+  ],
+  [{
+      "label": "杭州市",
+      "value": "3301"
+    },
+    {
+      "label": "宁波市",
+      "value": "3302"
+    },
+    {
+      "label": "温州市",
+      "value": "3303"
+    },
+    {
+      "label": "嘉兴市",
+      "value": "3304"
+    },
+    {
+      "label": "湖州市",
+      "value": "3305"
+    },
+    {
+      "label": "绍兴市",
+      "value": "3306"
+    },
+    {
+      "label": "金华市",
+      "value": "3307"
+    },
+    {
+      "label": "衢州市",
+      "value": "3308"
+    },
+    {
+      "label": "舟山市",
+      "value": "3309"
+    },
+    {
+      "label": "台州市",
+      "value": "3310"
+    },
+    {
+      "label": "丽水市",
+      "value": "3311"
+    }
+  ],
+  [{
+      "label": "合肥市",
+      "value": "3401"
+    },
+    {
+      "label": "芜湖市",
+      "value": "3402"
+    },
+    {
+      "label": "蚌埠市",
+      "value": "3403"
+    },
+    {
+      "label": "淮南市",
+      "value": "3404"
+    },
+    {
+      "label": "马鞍山市",
+      "value": "3405"
+    },
+    {
+      "label": "淮北市",
+      "value": "3406"
+    },
+    {
+      "label": "铜陵市",
+      "value": "3407"
+    },
+    {
+      "label": "安庆市",
+      "value": "3408"
+    },
+    {
+      "label": "黄山市",
+      "value": "3410"
+    },
+    {
+      "label": "滁州市",
+      "value": "3411"
+    },
+    {
+      "label": "阜阳市",
+      "value": "3412"
+    },
+    {
+      "label": "宿州市",
+      "value": "3413"
+    },
+    {
+      "label": "六安市",
+      "value": "3415"
+    },
+    {
+      "label": "亳州市",
+      "value": "3416"
+    },
+    {
+      "label": "池州市",
+      "value": "3417"
+    },
+    {
+      "label": "宣城市",
+      "value": "3418"
+    }
+  ],
+  [{
+      "label": "福州市",
+      "value": "3501"
+    },
+    {
+      "label": "厦门市",
+      "value": "3502"
+    },
+    {
+      "label": "莆田市",
+      "value": "3503"
+    },
+    {
+      "label": "三明市",
+      "value": "3504"
+    },
+    {
+      "label": "泉州市",
+      "value": "3505"
+    },
+    {
+      "label": "漳州市",
+      "value": "3506"
+    },
+    {
+      "label": "南平市",
+      "value": "3507"
+    },
+    {
+      "label": "龙岩市",
+      "value": "3508"
+    },
+    {
+      "label": "宁德市",
+      "value": "3509"
+    }
+  ],
+  [{
+      "label": "南昌市",
+      "value": "3601"
+    },
+    {
+      "label": "景德镇市",
+      "value": "3602"
+    },
+    {
+      "label": "萍乡市",
+      "value": "3603"
+    },
+    {
+      "label": "九江市",
+      "value": "3604"
+    },
+    {
+      "label": "新余市",
+      "value": "3605"
+    },
+    {
+      "label": "鹰潭市",
+      "value": "3606"
+    },
+    {
+      "label": "赣州市",
+      "value": "3607"
+    },
+    {
+      "label": "吉安市",
+      "value": "3608"
+    },
+    {
+      "label": "宜春市",
+      "value": "3609"
+    },
+    {
+      "label": "抚州市",
+      "value": "3610"
+    },
+    {
+      "label": "上饶市",
+      "value": "3611"
+    }
+  ],
+  [{
+      "label": "济南市",
+      "value": "3701"
+    },
+    {
+      "label": "青岛市",
+      "value": "3702"
+    },
+    {
+      "label": "淄博市",
+      "value": "3703"
+    },
+    {
+      "label": "枣庄市",
+      "value": "3704"
+    },
+    {
+      "label": "东营市",
+      "value": "3705"
+    },
+    {
+      "label": "烟台市",
+      "value": "3706"
+    },
+    {
+      "label": "潍坊市",
+      "value": "3707"
+    },
+    {
+      "label": "济宁市",
+      "value": "3708"
+    },
+    {
+      "label": "泰安市",
+      "value": "3709"
+    },
+    {
+      "label": "威海市",
+      "value": "3710"
+    },
+    {
+      "label": "日照市",
+      "value": "3711"
+    },
+    {
+      "label": "莱芜市",
+      "value": "3712"
+    },
+    {
+      "label": "临沂市",
+      "value": "3713"
+    },
+    {
+      "label": "德州市",
+      "value": "3714"
+    },
+    {
+      "label": "聊城市",
+      "value": "3715"
+    },
+    {
+      "label": "滨州市",
+      "value": "3716"
+    },
+    {
+      "label": "菏泽市",
+      "value": "3717"
+    }
+  ],
+  [{
+      "label": "郑州市",
+      "value": "4101"
+    },
+    {
+      "label": "开封市",
+      "value": "4102"
+    },
+    {
+      "label": "洛阳市",
+      "value": "4103"
+    },
+    {
+      "label": "平顶山市",
+      "value": "4104"
+    },
+    {
+      "label": "安阳市",
+      "value": "4105"
+    },
+    {
+      "label": "鹤壁市",
+      "value": "4106"
+    },
+    {
+      "label": "新乡市",
+      "value": "4107"
+    },
+    {
+      "label": "焦作市",
+      "value": "4108"
+    },
+    {
+      "label": "濮阳市",
+      "value": "4109"
+    },
+    {
+      "label": "许昌市",
+      "value": "4110"
+    },
+    {
+      "label": "漯河市",
+      "value": "4111"
+    },
+    {
+      "label": "三门峡市",
+      "value": "4112"
+    },
+    {
+      "label": "南阳市",
+      "value": "4113"
+    },
+    {
+      "label": "商丘市",
+      "value": "4114"
+    },
+    {
+      "label": "信阳市",
+      "value": "4115"
+    },
+    {
+      "label": "周口市",
+      "value": "4116"
+    },
+    {
+      "label": "驻马店市",
+      "value": "4117"
+    },
+    {
+      "label": "省直辖县级行政区划",
+      "value": "4190"
+    }
+  ],
+  [{
+      "label": "武汉市",
+      "value": "4201"
+    },
+    {
+      "label": "黄石市",
+      "value": "4202"
+    },
+    {
+      "label": "十堰市",
+      "value": "4203"
+    },
+    {
+      "label": "宜昌市",
+      "value": "4205"
+    },
+    {
+      "label": "襄阳市",
+      "value": "4206"
+    },
+    {
+      "label": "鄂州市",
+      "value": "4207"
+    },
+    {
+      "label": "荆门市",
+      "value": "4208"
+    },
+    {
+      "label": "孝感市",
+      "value": "4209"
+    },
+    {
+      "label": "荆州市",
+      "value": "4210"
+    },
+    {
+      "label": "黄冈市",
+      "value": "4211"
+    },
+    {
+      "label": "咸宁市",
+      "value": "4212"
+    },
+    {
+      "label": "随州市",
+      "value": "4213"
+    },
+    {
+      "label": "恩施土家族苗族自治州",
+      "value": "4228"
+    },
+    {
+      "label": "省直辖县级行政区划",
+      "value": "4290"
+    }
+  ],
+  [{
+      "label": "长沙市",
+      "value": "4301"
+    },
+    {
+      "label": "株洲市",
+      "value": "4302"
+    },
+    {
+      "label": "湘潭市",
+      "value": "4303"
+    },
+    {
+      "label": "衡阳市",
+      "value": "4304"
+    },
+    {
+      "label": "邵阳市",
+      "value": "4305"
+    },
+    {
+      "label": "岳阳市",
+      "value": "4306"
+    },
+    {
+      "label": "常德市",
+      "value": "4307"
+    },
+    {
+      "label": "张家界市",
+      "value": "4308"
+    },
+    {
+      "label": "益阳市",
+      "value": "4309"
+    },
+    {
+      "label": "郴州市",
+      "value": "4310"
+    },
+    {
+      "label": "永州市",
+      "value": "4311"
+    },
+    {
+      "label": "怀化市",
+      "value": "4312"
+    },
+    {
+      "label": "娄底市",
+      "value": "4313"
+    },
+    {
+      "label": "湘西土家族苗族自治州",
+      "value": "4331"
+    }
+  ],
+  [{
+      "label": "广州市",
+      "value": "4401"
+    },
+    {
+      "label": "韶关市",
+      "value": "4402"
+    },
+    {
+      "label": "深圳市",
+      "value": "4403"
+    },
+    {
+      "label": "珠海市",
+      "value": "4404"
+    },
+    {
+      "label": "汕头市",
+      "value": "4405"
+    },
+    {
+      "label": "佛山市",
+      "value": "4406"
+    },
+    {
+      "label": "江门市",
+      "value": "4407"
+    },
+    {
+      "label": "湛江市",
+      "value": "4408"
+    },
+    {
+      "label": "茂名市",
+      "value": "4409"
+    },
+    {
+      "label": "肇庆市",
+      "value": "4412"
+    },
+    {
+      "label": "惠州市",
+      "value": "4413"
+    },
+    {
+      "label": "梅州市",
+      "value": "4414"
+    },
+    {
+      "label": "汕尾市",
+      "value": "4415"
+    },
+    {
+      "label": "河源市",
+      "value": "4416"
+    },
+    {
+      "label": "阳江市",
+      "value": "4417"
+    },
+    {
+      "label": "清远市",
+      "value": "4418"
+    },
+    {
+      "label": "东莞市",
+      "value": "4419"
+    },
+    {
+      "label": "中山市",
+      "value": "4420"
+    },
+    {
+      "label": "潮州市",
+      "value": "4451"
+    },
+    {
+      "label": "揭阳市",
+      "value": "4452"
+    },
+    {
+      "label": "云浮市",
+      "value": "4453"
+    }
+  ],
+  [{
+      "label": "南宁市",
+      "value": "4501"
+    },
+    {
+      "label": "柳州市",
+      "value": "4502"
+    },
+    {
+      "label": "桂林市",
+      "value": "4503"
+    },
+    {
+      "label": "梧州市",
+      "value": "4504"
+    },
+    {
+      "label": "北海市",
+      "value": "4505"
+    },
+    {
+      "label": "防城港市",
+      "value": "4506"
+    },
+    {
+      "label": "钦州市",
+      "value": "4507"
+    },
+    {
+      "label": "贵港市",
+      "value": "4508"
+    },
+    {
+      "label": "玉林市",
+      "value": "4509"
+    },
+    {
+      "label": "百色市",
+      "value": "4510"
+    },
+    {
+      "label": "贺州市",
+      "value": "4511"
+    },
+    {
+      "label": "河池市",
+      "value": "4512"
+    },
+    {
+      "label": "来宾市",
+      "value": "4513"
+    },
+    {
+      "label": "崇左市",
+      "value": "4514"
+    }
+  ],
+  [{
+      "label": "海口市",
+      "value": "4601"
+    },
+    {
+      "label": "三亚市",
+      "value": "4602"
+    },
+    {
+      "label": "三沙市",
+      "value": "4603"
+    },
+    {
+      "label": "儋州市",
+      "value": "4604"
+    },
+    {
+      "label": "省直辖县级行政区划",
+      "value": "4690"
+    }
+  ],
+  [{
+      "label": "市辖区",
+      "value": "5001"
+    },
+    {
+      "label": "县",
+      "value": "5002"
+    }
+  ],
+  [{
+      "label": "成都市",
+      "value": "5101"
+    },
+    {
+      "label": "自贡市",
+      "value": "5103"
+    },
+    {
+      "label": "攀枝花市",
+      "value": "5104"
+    },
+    {
+      "label": "泸州市",
+      "value": "5105"
+    },
+    {
+      "label": "德阳市",
+      "value": "5106"
+    },
+    {
+      "label": "绵阳市",
+      "value": "5107"
+    },
+    {
+      "label": "广元市",
+      "value": "5108"
+    },
+    {
+      "label": "遂宁市",
+      "value": "5109"
+    },
+    {
+      "label": "内江市",
+      "value": "5110"
+    },
+    {
+      "label": "乐山市",
+      "value": "5111"
+    },
+    {
+      "label": "南充市",
+      "value": "5113"
+    },
+    {
+      "label": "眉山市",
+      "value": "5114"
+    },
+    {
+      "label": "宜宾市",
+      "value": "5115"
+    },
+    {
+      "label": "广安市",
+      "value": "5116"
+    },
+    {
+      "label": "达州市",
+      "value": "5117"
+    },
+    {
+      "label": "雅安市",
+      "value": "5118"
+    },
+    {
+      "label": "巴中市",
+      "value": "5119"
+    },
+    {
+      "label": "资阳市",
+      "value": "5120"
+    },
+    {
+      "label": "阿坝藏族羌族自治州",
+      "value": "5132"
+    },
+    {
+      "label": "甘孜藏族自治州",
+      "value": "5133"
+    },
+    {
+      "label": "凉山彝族自治州",
+      "value": "5134"
+    }
+  ],
+  [{
+      "label": "贵阳市",
+      "value": "5201"
+    },
+    {
+      "label": "六盘水市",
+      "value": "5202"
+    },
+    {
+      "label": "遵义市",
+      "value": "5203"
+    },
+    {
+      "label": "安顺市",
+      "value": "5204"
+    },
+    {
+      "label": "毕节市",
+      "value": "5205"
+    },
+    {
+      "label": "铜仁市",
+      "value": "5206"
+    },
+    {
+      "label": "黔西南布依族苗族自治州",
+      "value": "5223"
+    },
+    {
+      "label": "黔东南苗族侗族自治州",
+      "value": "5226"
+    },
+    {
+      "label": "黔南布依族苗族自治州",
+      "value": "5227"
+    }
+  ],
+  [{
+      "label": "昆明市",
+      "value": "5301"
+    },
+    {
+      "label": "曲靖市",
+      "value": "5303"
+    },
+    {
+      "label": "玉溪市",
+      "value": "5304"
+    },
+    {
+      "label": "保山市",
+      "value": "5305"
+    },
+    {
+      "label": "昭通市",
+      "value": "5306"
+    },
+    {
+      "label": "丽江市",
+      "value": "5307"
+    },
+    {
+      "label": "普洱市",
+      "value": "5308"
+    },
+    {
+      "label": "临沧市",
+      "value": "5309"
+    },
+    {
+      "label": "楚雄彝族自治州",
+      "value": "5323"
+    },
+    {
+      "label": "红河哈尼族彝族自治州",
+      "value": "5325"
+    },
+    {
+      "label": "文山壮族苗族自治州",
+      "value": "5326"
+    },
+    {
+      "label": "西双版纳傣族自治州",
+      "value": "5328"
+    },
+    {
+      "label": "大理白族自治州",
+      "value": "5329"
+    },
+    {
+      "label": "德宏傣族景颇族自治州",
+      "value": "5331"
+    },
+    {
+      "label": "怒江傈僳族自治州",
+      "value": "5333"
+    },
+    {
+      "label": "迪庆藏族自治州",
+      "value": "5334"
+    }
+  ],
+  [{
+      "label": "拉萨市",
+      "value": "5401"
+    },
+    {
+      "label": "日喀则市",
+      "value": "5402"
+    },
+    {
+      "label": "昌都市",
+      "value": "5403"
+    },
+    {
+      "label": "林芝市",
+      "value": "5404"
+    },
+    {
+      "label": "山南市",
+      "value": "5405"
+    },
+    {
+      "label": "那曲地区",
+      "value": "5424"
+    },
+    {
+      "label": "阿里地区",
+      "value": "5425"
+    }
+  ],
+  [{
+      "label": "西安市",
+      "value": "6101"
+    },
+    {
+      "label": "铜川市",
+      "value": "6102"
+    },
+    {
+      "label": "宝鸡市",
+      "value": "6103"
+    },
+    {
+      "label": "咸阳市",
+      "value": "6104"
+    },
+    {
+      "label": "渭南市",
+      "value": "6105"
+    },
+    {
+      "label": "延安市",
+      "value": "6106"
+    },
+    {
+      "label": "汉中市",
+      "value": "6107"
+    },
+    {
+      "label": "榆林市",
+      "value": "6108"
+    },
+    {
+      "label": "安康市",
+      "value": "6109"
+    },
+    {
+      "label": "商洛市",
+      "value": "6110"
+    }
+  ],
+  [{
+      "label": "兰州市",
+      "value": "6201"
+    },
+    {
+      "label": "嘉峪关市",
+      "value": "6202"
+    },
+    {
+      "label": "金昌市",
+      "value": "6203"
+    },
+    {
+      "label": "白银市",
+      "value": "6204"
+    },
+    {
+      "label": "天水市",
+      "value": "6205"
+    },
+    {
+      "label": "武威市",
+      "value": "6206"
+    },
+    {
+      "label": "张掖市",
+      "value": "6207"
+    },
+    {
+      "label": "平凉市",
+      "value": "6208"
+    },
+    {
+      "label": "酒泉市",
+      "value": "6209"
+    },
+    {
+      "label": "庆阳市",
+      "value": "6210"
+    },
+    {
+      "label": "定西市",
+      "value": "6211"
+    },
+    {
+      "label": "陇南市",
+      "value": "6212"
+    },
+    {
+      "label": "临夏回族自治州",
+      "value": "6229"
+    },
+    {
+      "label": "甘南藏族自治州",
+      "value": "6230"
+    }
+  ],
+  [{
+      "label": "西宁市",
+      "value": "6301"
+    },
+    {
+      "label": "海东市",
+      "value": "6302"
+    },
+    {
+      "label": "海北藏族自治州",
+      "value": "6322"
+    },
+    {
+      "label": "黄南藏族自治州",
+      "value": "6323"
+    },
+    {
+      "label": "海南藏族自治州",
+      "value": "6325"
+    },
+    {
+      "label": "果洛藏族自治州",
+      "value": "6326"
+    },
+    {
+      "label": "玉树藏族自治州",
+      "value": "6327"
+    },
+    {
+      "label": "海西蒙古族藏族自治州",
+      "value": "6328"
+    }
+  ],
+  [{
+      "label": "银川市",
+      "value": "6401"
+    },
+    {
+      "label": "石嘴山市",
+      "value": "6402"
+    },
+    {
+      "label": "吴忠市",
+      "value": "6403"
+    },
+    {
+      "label": "固原市",
+      "value": "6404"
+    },
+    {
+      "label": "中卫市",
+      "value": "6405"
+    }
+  ],
+  [{
+      "label": "乌鲁木齐市",
+      "value": "6501"
+    },
+    {
+      "label": "克拉玛依市",
+      "value": "6502"
+    },
+    {
+      "label": "吐鲁番市",
+      "value": "6504"
+    },
+    {
+      "label": "哈密市",
+      "value": "6505"
+    },
+    {
+      "label": "昌吉回族自治州",
+      "value": "6523"
+    },
+    {
+      "label": "博尔塔拉蒙古自治州",
+      "value": "6527"
+    },
+    {
+      "label": "巴音郭楞蒙古自治州",
+      "value": "6528"
+    },
+    {
+      "label": "阿克苏地区",
+      "value": "6529"
+    },
+    {
+      "label": "克孜勒苏柯尔克孜自治州",
+      "value": "6530"
+    },
+    {
+      "label": "喀什地区",
+      "value": "6531"
+    },
+    {
+      "label": "和田地区",
+      "value": "6532"
+    },
+    {
+      "label": "伊犁哈萨克自治州",
+      "value": "6540"
+    },
+    {
+      "label": "塔城地区",
+      "value": "6542"
+    },
+    {
+      "label": "阿勒泰地区",
+      "value": "6543"
+    },
+    {
+      "label": "自治区直辖县级行政区划",
+      "value": "6590"
+    }
+  ],
+  [{
+      "label": "台北",
+      "value": "6601"
+    },
+    {
+      "label": "高雄",
+      "value": "6602"
+    },
+    {
+      "label": "基隆",
+      "value": "6603"
+    },
+    {
+      "label": "台中",
+      "value": "6604"
+    },
+    {
+      "label": "台南",
+      "value": "6605"
+    },
+    {
+      "label": "新竹",
+      "value": "6606"
+    },
+    {
+      "label": "嘉义",
+      "value": "6607"
+    },
+    {
+      "label": "宜兰",
+      "value": "6608"
+    },
+    {
+      "label": "桃园",
+      "value": "6609"
+    },
+    {
+      "label": "苗栗",
+      "value": "6610"
+    },
+    {
+      "label": "彰化",
+      "value": "6611"
+    },
+    {
+      "label": "南投",
+      "value": "6612"
+    },
+    {
+      "label": "云林",
+      "value": "6613"
+    },
+    {
+      "label": "屏东",
+      "value": "6614"
+    },
+    {
+      "label": "台东",
+      "value": "6615"
+    },
+    {
+      "label": "花莲",
+      "value": "6616"
+    },
+    {
+      "label": "澎湖",
+      "value": "6617"
+    }
+  ],
+  [{
+      "label": "香港岛",
+      "value": "6701"
+    },
+    {
+      "label": "九龙",
+      "value": "6702"
+    },
+    {
+      "label": "新界",
+      "value": "6703"
+    }
+  ],
+  [{
+      "label": "澳门半岛",
+      "value": "6801"
+    },
+    {
+      "label": "氹仔岛",
+      "value": "6802"
+    },
+    {
+      "label": "路环岛",
+      "value": "6803"
+    },
+    {
+      "label": "路氹城",
+      "value": "6804"
+    }
+  ]
+]
+export default cityData;
diff --git a/pages_borrow_books/components/mpvue-citypicker/city-data/province.js b/pages_borrow_books/components/mpvue-citypicker/city-data/province.js
new file mode 100644
index 0000000000000000000000000000000000000000..1bd680e84fa81ad19ae33eb80b44c4e756469f96
--- /dev/null
+++ b/pages_borrow_books/components/mpvue-citypicker/city-data/province.js
@@ -0,0 +1,139 @@
+/* eslint-disable */
+var provinceData = [{
+    "label": "北京市",
+    "value": "11"
+  },
+  {
+    "label": "天津市",
+    "value": "12"
+  },
+  {
+    "label": "河北省",
+    "value": "13"
+  },
+  {
+    "label": "山西省",
+    "value": "14"
+  },
+  {
+    "label": "内蒙古自治区",
+    "value": "15"
+  },
+  {
+    "label": "辽宁省",
+    "value": "21"
+  },
+  {
+    "label": "吉林省",
+    "value": "22"
+  },
+  {
+    "label": "黑龙江省",
+    "value": "23"
+  },
+  {
+    "label": "上海市",
+    "value": "31"
+  },
+  {
+    "label": "江苏省",
+    "value": "32"
+  },
+  {
+    "label": "浙江省",
+    "value": "33"
+  },
+  {
+    "label": "安徽省",
+    "value": "34"
+  },
+  {
+    "label": "福建省",
+    "value": "35"
+  },
+  {
+    "label": "江西省",
+    "value": "36"
+  },
+  {
+    "label": "山东省",
+    "value": "37"
+  },
+  {
+    "label": "河南省",
+    "value": "41"
+  },
+  {
+    "label": "湖北省",
+    "value": "42"
+  },
+  {
+    "label": "湖南省",
+    "value": "43"
+  },
+  {
+    "label": "广东省",
+    "value": "44"
+  },
+  {
+    "label": "广西壮族自治区",
+    "value": "45"
+  },
+  {
+    "label": "海南省",
+    "value": "46"
+  },
+  {
+    "label": "重庆市",
+    "value": "50"
+  },
+  {
+    "label": "四川省",
+    "value": "51"
+  },
+  {
+    "label": "贵州省",
+    "value": "52"
+  },
+  {
+    "label": "云南省",
+    "value": "53"
+  },
+  {
+    "label": "西藏自治区",
+    "value": "54"
+  },
+  {
+    "label": "陕西省",
+    "value": "61"
+  },
+  {
+    "label": "甘肃省",
+    "value": "62"
+  },
+  {
+    "label": "青海省",
+    "value": "63"
+  },
+  {
+    "label": "宁夏回族自治区",
+    "value": "64"
+  },
+  {
+    "label": "新疆维吾尔自治区",
+    "value": "65"
+  },
+  {
+    "label": "台湾",
+    "value": "66"
+  },
+  {
+    "label": "香港",
+    "value": "67"
+  },
+  {
+    "label": "澳门",
+    "value": "68"
+  }
+]
+export default provinceData;
diff --git a/pages_borrow_books/components/mpvue-citypicker/mpvueCityPicker.vue b/pages_borrow_books/components/mpvue-citypicker/mpvueCityPicker.vue
new file mode 100644
index 0000000000000000000000000000000000000000..2a0416c31e138e35bec472974484f20a215f7549
--- /dev/null
+++ b/pages_borrow_books/components/mpvue-citypicker/mpvueCityPicker.vue
@@ -0,0 +1,210 @@
+<template>
+  <div class="mpvue-picker">
+    <div :class="{'pickerMask':showPicker}" @click="maskClick" catchtouchmove="true"></div>
+    <div class="mpvue-picker-content " :class="{'mpvue-picker-view-show':showPicker}">
+      <div class="mpvue-picker__hd" catchtouchmove="true">
+        <div class="mpvue-picker__action" @click="pickerCancel">取消</div>
+        <div class="mpvue-picker__action" :style="{color:themeColor}" @click="pickerConfirm">确定</div>
+      </div>
+      <picker-view indicator-style="height: 40px;" class="mpvue-picker-view" :value="pickerValue" @change="pickerChange">
+        <block>
+          <picker-view-column>
+            <div class="picker-item" v-for="(item,index) in provinceDataList" :key="index">{{item.label}}</div>
+          </picker-view-column>
+          <picker-view-column>
+            <div class="picker-item" v-for="(item,index) in cityDataList" :key="index">{{item.label}}</div>
+          </picker-view-column>
+          <picker-view-column>
+            <div class="picker-item" v-for="(item,index) in areaDataList" :key="index">{{item.label}}</div>
+          </picker-view-column>
+        </block>
+      </picker-view>
+    </div>
+  </div>
+</template>
+
+<script>
+import provinceData from './city-data/province.js';
+import cityData from './city-data/city.js';
+import areaData from './city-data/area.js';
+export default {
+  data() {
+    return {
+      pickerValue: [0, 0, 0],
+      provinceDataList: [],
+      cityDataList: [],
+      areaDataList: [],
+			/* 是否显示控件 */
+			showPicker: false,
+    };
+  },
+  created() {
+    this.init()
+  },
+  props: {
+    /* 默认值 */
+    pickerValueDefault: {
+      type: Array,
+      default(){
+				return [0, 0, 0]
+			}
+    },
+    /* 主题色 */
+    themeColor: String
+  },
+	watch:{
+		pickerValueDefault(){
+			this.init();
+		}
+	},
+  methods: {
+		init() {
+			this.handPickValueDefault(); // 对 pickerValueDefault 做兼容处理
+			this.provinceDataList = provinceData;
+			this.cityDataList = cityData[this.pickerValueDefault[0]];
+			this.areaDataList = areaData[this.pickerValueDefault[0]][this.pickerValueDefault[1]];
+			this.pickerValue = this.pickerValueDefault;
+		},
+    show() {
+      setTimeout(() => {
+        this.showPicker = true;
+      }, 0);
+    },
+    maskClick() {
+      this.pickerCancel();
+    },
+    pickerCancel() {
+      this.showPicker = false;
+      this._$emit('onCancel');
+    },
+    pickerConfirm(e) {
+      this.showPicker = false;
+      this._$emit('onConfirm');
+    },
+    showPickerView() {
+      this.showPicker = true;
+    },
+    handPickValueDefault() {
+      if (this.pickerValueDefault !== [0, 0, 0]) {
+        if (this.pickerValueDefault[0] > provinceData.length - 1) {
+          this.pickerValueDefault[0] = provinceData.length - 1;
+        }
+        if (this.pickerValueDefault[1] > cityData[this.pickerValueDefault[0]].length - 1) {
+          this.pickerValueDefault[1] = cityData[this.pickerValueDefault[0]].length - 1;
+        }
+        if (this.pickerValueDefault[2] > areaData[this.pickerValueDefault[0]][this.pickerValueDefault[1]].length - 1) {
+          this.pickerValueDefault[2] = areaData[this.pickerValueDefault[0]][this.pickerValueDefault[1]].length - 1;
+        }
+      }
+    },
+    pickerChange(e) {
+      let changePickerValue = e.mp.detail.value;
+      if (this.pickerValue[0] !== changePickerValue[0]) {
+        // 第一级发生滚动
+        this.cityDataList = cityData[changePickerValue[0]];
+        this.areaDataList = areaData[changePickerValue[0]][0];
+        changePickerValue[1] = 0;
+        changePickerValue[2] = 0;
+      } else if (this.pickerValue[1] !== changePickerValue[1]) {
+        // 第二级滚动
+        this.areaDataList =
+          areaData[changePickerValue[0]][changePickerValue[1]];
+        changePickerValue[2] = 0;
+      }
+      this.pickerValue = changePickerValue;
+      this._$emit('onChange');
+    },
+    _$emit(emitName) {
+      let pickObj = {
+        label: this._getLabel(),
+        value: this.pickerValue,
+        cityCode: this._getCityCode()
+      };
+      this.$emit(emitName, pickObj);
+    },
+    _getLabel() {
+      let pcikerLabel =
+        this.provinceDataList[this.pickerValue[0]].label +
+        '-' +
+        this.cityDataList[this.pickerValue[1]].label +
+        '-' +
+        this.areaDataList[this.pickerValue[2]].label;
+      return pcikerLabel;
+    },
+    _getCityCode() {
+      return this.areaDataList[this.pickerValue[2]].value;
+    }
+  }
+};
+</script>
+
+<style>
+.pickerMask {
+  position: fixed;
+  z-index: 1000;
+  top: 0;
+  right: 0;
+  left: 0;
+  bottom: 0;
+  background: rgba(0, 0, 0, 0.6);
+}
+.mpvue-picker-content {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  transition: all 0.3s ease;
+  transform: translateY(100%);
+  z-index: 3000;
+}
+.mpvue-picker-view-show {
+  transform: translateY(0);
+}
+.mpvue-picker__hd {
+  display: flex;
+  padding: 9px 15px;
+  background-color: #fff;
+  position: relative;
+  text-align: center;
+  font-size: 17px;
+}
+.mpvue-picker__hd:after {
+  content: ' ';
+  position: absolute;
+  left: 0;
+  bottom: 0;
+  right: 0;
+  height: 1px;
+  border-bottom: 1px solid #e5e5e5;
+  color: #e5e5e5;
+  transform-origin: 0 100%;
+  transform: scaleY(0.5);
+}
+.mpvue-picker__action {
+  display: block;
+  flex: 1;
+  color: #1aad19;
+}
+.mpvue-picker__action:first-child {
+  text-align: left;
+  color: #888;
+}
+.mpvue-picker__action:last-child {
+  text-align: right;
+}
+.picker-item {
+  text-align: center;
+  line-height: 40px;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  font-size: 16px;
+}
+.mpvue-picker-view {
+  position: relative;
+  bottom: 0;
+  left: 0;
+  width: 100%;
+  height: 238px;
+  background-color: rgba(255, 255, 255, 1);
+}
+</style>
diff --git a/pages_borrow_books/components/wxqrcode.js b/pages_borrow_books/components/wxqrcode.js
new file mode 100644
index 0000000000000000000000000000000000000000..9fe8a07a8218e02aa04c47dcf82677f2ff4f3005
--- /dev/null
+++ b/pages_borrow_books/components/wxqrcode.js
@@ -0,0 +1,1623 @@
+//---------------------------------------------------------------------
+//
+// QR Code Generator for JavaScript
+//
+// Copyright (c) 2009 Kazuhiko Arase
+//
+// URL: [url=http://www.d-project.com/]http://www.d-project.com/[/url]
+//
+// Licensed under the MIT license:
+//        [url=http://www.opensource.org/licenses/mit-license.php]http://www.opensource.org/licenses/mit-license.php[/url]
+//
+// The word 'QR Code' is registered trademark of
+// DENSO WAVE INCORPORATED
+//        [url=http://www.denso-wave.com/qrcode/faqpatent-e.html]http://www.denso-wave.com/qrcode/faqpatent-e.html[/url]
+//
+//---------------------------------------------------------------------
+ 
+//---------------------------------------------------------------------
+// qrcode
+//代码第1588行为补充代码
+//修改人：chenxing
+//2017-02-27 16:21:32
+//---------------------------------------------------------------------
+ 
+/**
+ * qrcode
+ * @param typeNumber 1 to 40
+ * @param errorCorrectLevel 'L','M','Q','H'
+ */
+var qrcode = function(typeNumber, errorCorrectLevel) {
+ 
+    var PAD0 = 0xEC;
+    var PAD1 = 0x11;
+ 
+    var _typeNumber = typeNumber;
+    var _errorCorrectLevel = QRErrorCorrectLevel[errorCorrectLevel];
+    var _modules = null;
+    var _moduleCount = 0;
+    var _dataCache = null;
+    var _dataList = new Array();
+ 
+    var _this = {};
+ 
+    var makeImpl = function(test, maskPattern) {
+ 
+        _moduleCount = _typeNumber * 4 + 17;
+        _modules = function(moduleCount) {
+            var modules = new Array(moduleCount);
+            for (var row = 0; row < moduleCount; row += 1) {
+                modules[row] = new Array(moduleCount);
+                for (var col = 0; col < moduleCount; col += 1) {
+                    modules[row][col] = null;
+                }
+            }
+            return modules;
+        }(_moduleCount);
+ 
+        setupPositionProbePattern(0, 0);
+        setupPositionProbePattern(_moduleCount - 7, 0);
+        setupPositionProbePattern(0, _moduleCount - 7);
+        setupPositionAdjustPattern();
+        setupTimingPattern();
+        setupTypeInfo(test, maskPattern);
+ 
+        if (_typeNumber >= 7) {
+            setupTypeNumber(test);
+        }
+ 
+        if (_dataCache == null) {
+            _dataCache = createData(_typeNumber, _errorCorrectLevel, _dataList);
+        }
+ 
+        mapData(_dataCache, maskPattern);
+    };
+ 
+    var setupPositionProbePattern = function(row, col) {
+ 
+        for (var r = -1; r <= 7; r += 1) {
+ 
+            if (row + r <= -1 || _moduleCount <= row + r) continue;
+ 
+            for (var c = -1; c <= 7; c += 1) {
+ 
+                if (col + c <= -1 || _moduleCount <= col + c) continue;
+ 
+                if ( (0 <= r && r <= 6 && (c == 0 || c == 6) )
+                     || (0 <= c && c <= 6 && (r == 0 || r == 6) )
+                     || (2 <= r && r <= 4 && 2 <= c && c <= 4) ) {
+                    _modules[row + r][col + c] = true;
+                } else {
+                    _modules[row + r][col + c] = false;
+                }
+            }
+        }
+    };
+ 
+    var getBestMaskPattern = function() {
+ 
+        var minLostPoint = 0;
+        var pattern = 0;
+ 
+        for (var i = 0; i < 8; i += 1) {
+ 
+            makeImpl(true, i);
+ 
+            var lostPoint = QRUtil.getLostPoint(_this);
+ 
+            if (i == 0 || minLostPoint > lostPoint) {
+                minLostPoint = lostPoint;
+                pattern = i;
+            }
+        }
+ 
+        return pattern;
+    };
+ 
+    var setupTimingPattern = function() {
+ 
+        for (var r = 8; r < _moduleCount - 8; r += 1) {
+            if (_modules[r][6] != null) {
+                continue;
+            }
+            _modules[r][6] = (r % 2 == 0);
+        }
+ 
+        for (var c = 8; c < _moduleCount - 8; c += 1) {
+            if (_modules[6][c] != null) {
+                continue;
+            }
+            _modules[6][c] = (c % 2 == 0);
+        }
+    };
+ 
+    var setupPositionAdjustPattern = function() {
+ 
+        var pos = QRUtil.getPatternPosition(_typeNumber);
+ 
+        for (var i = 0; i < pos.length; i += 1) {
+ 
+            for (var j = 0; j < pos.length; j += 1) {
+ 
+                var row = pos[i];
+                var col = pos[j];
+ 
+                if (_modules[row][col] != null) {
+                    continue;
+                }
+ 
+                for (var r = -2; r <= 2; r += 1) {
+ 
+                    for (var c = -2; c <= 2; c += 1) {
+ 
+                        if (r == -2 || r == 2 || c == -2 || c == 2
+                            || (r == 0 && c == 0) ) {
+                            _modules[row + r][col + c] = true;
+                        } else {
+                            _modules[row + r][col + c] = false;
+                        }
+                    }
+                }
+            }
+        }
+    };
+ 
+    var setupTypeNumber = function(test) {
+ 
+        var bits = QRUtil.getBCHTypeNumber(_typeNumber);
+ 
+        for (var i = 0; i < 18; i += 1) {
+            var mod = (!test && ( (bits >> i) & 1) == 1);
+            _modules[Math.floor(i / 3)][i % 3 + _moduleCount - 8 - 3] = mod;
+        }
+ 
+        for (var i = 0; i < 18; i += 1) {
+            var mod = (!test && ( (bits >> i) & 1) == 1);
+            _modules[i % 3 + _moduleCount - 8 - 3][Math.floor(i / 3)] = mod;
+        }
+    };
+ 
+    var setupTypeInfo = function(test, maskPattern) {
+ 
+        var data = (_errorCorrectLevel << 3) | maskPattern;
+        var bits = QRUtil.getBCHTypeInfo(data);
+ 
+        // vertical
+        for (var i = 0; i < 15; i += 1) {
+ 
+            var mod = (!test && ( (bits >> i) & 1) == 1);
+ 
+            if (i < 6) {
+                _modules[i][8] = mod;
+            } else if (i < 8) {
+                _modules[i + 1][8] = mod;
+            } else {
+                _modules[_moduleCount - 15 + i][8] = mod;
+            }
+        }
+ 
+        // horizontal
+        for (var i = 0; i < 15; i += 1) {
+ 
+            var mod = (!test && ( (bits >> i) & 1) == 1);
+ 
+            if (i < 8) {
+                _modules[8][_moduleCount - i - 1] = mod;
+            } else if (i < 9) {
+                _modules[8][15 - i - 1 + 1] = mod;
+            } else {
+                _modules[8][15 - i - 1] = mod;
+            }
+        }
+ 
+        // fixed module
+        _modules[_moduleCount - 8][8] = (!test);
+    };
+ 
+    var mapData = function(data, maskPattern) {
+ 
+        var inc = -1;
+        var row = _moduleCount - 1;
+        var bitIndex = 7;
+        var byteIndex = 0;
+        var maskFunc = QRUtil.getMaskFunction(maskPattern);
+ 
+        for (var col = _moduleCount - 1; col > 0; col -= 2) {
+ 
+            if (col == 6) col -= 1;
+ 
+            while (true) {
+ 
+                for (var c = 0; c < 2; c += 1) {
+ 
+                    if (_modules[row][col - c] == null) {
+ 
+                        var dark = false;
+ 
+                        if (byteIndex < data.length) {
+                            dark = ( ( (data[byteIndex] >>> bitIndex) & 1) == 1);
+                        }
+ 
+                        var mask = maskFunc(row, col - c);
+ 
+                        if (mask) {
+                            dark = !dark;
+                        }
+ 
+                        _modules[row][col - c] = dark;
+                        bitIndex -= 1;
+ 
+                        if (bitIndex == -1) {
+                            byteIndex += 1;
+                            bitIndex = 7;
+                        }
+                    }
+                }
+ 
+                row += inc;
+ 
+                if (row < 0 || _moduleCount <= row) {
+                    row -= inc;
+                    inc = -inc;
+                    break;
+                }
+            }
+        }
+    };
+ 
+    var createBytes = function(buffer, rsBlocks) {
+ 
+        var offset = 0;
+ 
+        var maxDcCount = 0;
+        var maxEcCount = 0;
+ 
+        var dcdata = new Array(rsBlocks.length);
+        var ecdata = new Array(rsBlocks.length);
+ 
+        for (var r = 0; r < rsBlocks.length; r += 1) {
+ 
+            var dcCount = rsBlocks[r].dataCount;
+            var ecCount = rsBlocks[r].totalCount - dcCount;
+ 
+            maxDcCount = Math.max(maxDcCount, dcCount);
+            maxEcCount = Math.max(maxEcCount, ecCount);
+ 
+            dcdata[r] = new Array(dcCount);
+ 
+            for (var i = 0; i < dcdata[r].length; i += 1) {
+                dcdata[r][i] = 0xff & buffer.getBuffer()[i + offset];
+            }
+            offset += dcCount;
+ 
+            var rsPoly = QRUtil.getErrorCorrectPolynomial(ecCount);
+            var rawPoly = qrPolynomial(dcdata[r], rsPoly.getLength() - 1);
+ 
+            var modPoly = rawPoly.mod(rsPoly);
+            ecdata[r] = new Array(rsPoly.getLength() - 1);
+            for (var i = 0; i < ecdata[r].length; i += 1) {
+                var modIndex = i + modPoly.getLength() - ecdata[r].length;
+                ecdata[r][i] = (modIndex >= 0)? modPoly.getAt(modIndex) : 0;
+            }
+        }
+ 
+        var totalCodeCount = 0;
+        for (var i = 0; i < rsBlocks.length; i += 1) {
+            totalCodeCount += rsBlocks[i].totalCount;
+        }
+ 
+        var data = new Array(totalCodeCount);
+        var index = 0;
+ 
+        for (var i = 0; i < maxDcCount; i += 1) {
+            for (var r = 0; r < rsBlocks.length; r += 1) {
+                if (i < dcdata[r].length) {
+                    data[index] = dcdata[r][i];
+                    index += 1;
+                }
+            }
+        }
+ 
+        for (var i = 0; i < maxEcCount; i += 1) {
+            for (var r = 0; r < rsBlocks.length; r += 1) {
+                if (i < ecdata[r].length) {
+                    data[index] = ecdata[r][i];
+                    index += 1;
+                }
+            }
+        }
+ 
+        return data;
+    };
+ 
+    var createData = function(typeNumber, errorCorrectLevel, dataList) {
+ 
+        var rsBlocks = QRRSBlock.getRSBlocks(typeNumber, errorCorrectLevel);
+ 
+        var buffer = qrBitBuffer();
+ 
+        for (var i = 0; i < dataList.length; i += 1) {
+            var data = dataList[i];
+            buffer.put(data.getMode(), 4);
+            buffer.put(data.getLength(), QRUtil.getLengthInBits(data.getMode(), typeNumber) );
+            data.write(buffer);
+        }
+ 
+        // calc num max data.
+        var totalDataCount = 0;
+        for (var i = 0; i < rsBlocks.length; i += 1) {
+            totalDataCount += rsBlocks[i].dataCount;
+        }
+ 
+        if (buffer.getLengthInBits() > totalDataCount * 8) {
+            throw new Error('code length overflow. ('
+                            + buffer.getLengthInBits()
+                            + '>'
+                            + totalDataCount * 8
+                            + ')');
+        }
+ 
+        // end code
+        if (buffer.getLengthInBits() + 4 <= totalDataCount * 8) {
+            buffer.put(0, 4);
+        }
+ 
+        // padding
+        while (buffer.getLengthInBits() % 8 != 0) {
+            buffer.putBit(false);
+        }
+ 
+        // padding
+        while (true) {
+ 
+            if (buffer.getLengthInBits() >= totalDataCount * 8) {
+                break;
+            }
+            buffer.put(PAD0, 8);
+ 
+            if (buffer.getLengthInBits() >= totalDataCount * 8) {
+                break;
+            }
+            buffer.put(PAD1, 8);
+        }
+ 
+        return createBytes(buffer, rsBlocks);
+    };
+ 
+    _this.addData = function(data) {
+        var newData = qr8BitByte(data);
+        _dataList.push(newData);
+        _dataCache = null;
+    };
+ 
+    _this.isDark = function(row, col) {
+        if (row < 0 || _moduleCount <= row || col < 0 || _moduleCount <= col) {
+            throw new Error(row + ',' + col);
+        }
+        return _modules[row][col];
+    };
+ 
+    _this.getModuleCount = function() {
+        return _moduleCount;
+    };
+ 
+    _this.make = function() {
+        makeImpl(false, getBestMaskPattern() );
+    };
+ 
+    _this.createTableTag = function(cellSize, margin) {
+ 
+        cellSize = cellSize || 2;
+        margin = (typeof margin == 'undefined')? cellSize * 4 : margin;
+ 
+        var qrHtml = '';
+ 
+        qrHtml += '<table style="';
+        qrHtml += ' border-width: 0px; border-style: none;';
+        qrHtml += ' border-collapse: collapse;';
+        qrHtml += ' padding: 0px; margin: ' + margin + 'px;';
+        qrHtml += '">';
+        qrHtml += '<tbody>';
+ 
+        for (var r = 0; r < _this.getModuleCount(); r += 1) {
+ 
+            qrHtml += '<tr>';
+ 
+            for (var c = 0; c < _this.getModuleCount(); c += 1) {
+                qrHtml += '<td style="';
+                qrHtml += ' border-width: 0px; border-style: none;';
+                qrHtml += ' border-collapse: collapse;';
+                qrHtml += ' padding: 0px; margin: 0px;';
+                qrHtml += ' width: ' + cellSize + 'px;';
+                qrHtml += ' height: ' + cellSize + 'px;';
+                qrHtml += ' background-color: ';
+                qrHtml += _this.isDark(r, c)? '#000000' : '#ffffff';
+                qrHtml += ';';
+                qrHtml += '"/>';
+            }
+ 
+            qrHtml += '</tr>';
+        }
+ 
+        qrHtml += '</tbody>';
+        qrHtml += '</table>';
+ 
+        return qrHtml;
+    };
+ 
+    _this.createImgTag = function(cellSize, margin, size) {
+ 
+        cellSize = cellSize || 2;
+        margin = (typeof margin == 'undefined')? cellSize * 4 : margin;
+ 
+        var min = margin;
+        var max = _this.getModuleCount() * cellSize + margin;
+ 
+        return createImgTag(size, size, function(x, y) {
+            if (min <= x && x < max && min <= y && y < max) {
+                var c = Math.floor( (x - min) / cellSize);
+                var r = Math.floor( (y - min) / cellSize);
+                return _this.isDark(r, c)? 0 : 1;
+            } else {
+                return 1;
+            }
+        } );
+    };
+ 
+    return _this;
+};
+ 
+//---------------------------------------------------------------------
+// qrcode.stringToBytes
+//---------------------------------------------------------------------
+ 
+qrcode.stringToBytes = function(s) {
+    var bytes = new Array();
+    for (var i = 0; i < s.length; i += 1) {
+        var c = s.charCodeAt(i);
+        bytes.push(c & 0xff);
+    }
+    return bytes;
+};
+ 
+//---------------------------------------------------------------------
+// qrcode.createStringToBytes
+//---------------------------------------------------------------------
+ 
+/**
+ * @param unicodeData base64 string of byte array.
+ * [16bit Unicode],[16bit Bytes], ...
+ * @param numChars
+ */
+qrcode.createStringToBytes = function(unicodeData, numChars) {
+ 
+    // create conversion map.
+ 
+    var unicodeMap = function() {
+ 
+        var bin = base64DecodeInputStream(unicodeData);
+        var read = function() {
+            var b = bin.read();
+            if (b == -1) throw new Error();
+            return b;
+        };
+ 
+        var count = 0;
+        var unicodeMap = {};
+        while (true) {
+            var b0 = bin.read();
+            if (b0 == -1) break;
+            var b1 = read();
+            var b2 = read();
+            var b3 = read();
+            var k = String.fromCharCode( (b0 << 8) | b1);
+            var v = (b2 << 8) | b3;
+            unicodeMap[k] = v;
+            count += 1;
+        }
+        if (count != numChars) {
+            throw new Error(count + ' != ' + numChars);
+        }
+ 
+        return unicodeMap;
+    }();
+ 
+    var unknownChar = '?'.charCodeAt(0);
+ 
+    return function(s) {
+        var bytes = new Array();
+        for (var i = 0; i < s.length; i += 1) {
+            var c = s.charCodeAt(i);
+            if (c < 128) {
+                bytes.push(c);
+            } else {
+                var b = unicodeMap[s.charAt(i)];
+                if (typeof b == 'number') {
+                    if ( (b & 0xff) == b) {
+                        // 1byte
+                        bytes.push(b);
+                    } else {
+                        // 2bytes
+                        bytes.push(b >>> 8);
+                        bytes.push(b & 0xff);
+                    }
+                } else {
+                    bytes.push(unknownChar);
+                }
+            }
+        }
+        return bytes;
+    };
+};
+ 
+//---------------------------------------------------------------------
+// QRMode
+//---------------------------------------------------------------------
+ 
+var QRMode = {
+    MODE_NUMBER :                1 << 0,
+    MODE_ALPHA_NUM :         1 << 1,
+    MODE_8BIT_BYTE :         1 << 2,
+    MODE_KANJI :                1 << 3
+};
+ 
+//---------------------------------------------------------------------
+// QRErrorCorrectLevel
+//---------------------------------------------------------------------
+ 
+var QRErrorCorrectLevel = {
+    L : 1,
+    M : 0,
+    Q : 3,
+    H : 2
+};
+ 
+//---------------------------------------------------------------------
+// QRMaskPattern
+//---------------------------------------------------------------------
+ 
+var QRMaskPattern = {
+    PATTERN000 : 0,
+    PATTERN001 : 1,
+    PATTERN010 : 2,
+    PATTERN011 : 3,
+    PATTERN100 : 4,
+    PATTERN101 : 5,
+    PATTERN110 : 6,
+    PATTERN111 : 7
+};
+ 
+//---------------------------------------------------------------------
+// QRUtil
+//---------------------------------------------------------------------
+ 
+var QRUtil = function() {
+ 
+    var PATTERN_POSITION_TABLE = [
+        [],
+        [6, 18],
+        [6, 22],
+        [6, 26],
+        [6, 30],
+        [6, 34],
+        [6, 22, 38],
+        [6, 24, 42],
+        [6, 26, 46],
+        [6, 28, 50],
+        [6, 30, 54],
+        [6, 32, 58],
+        [6, 34, 62],
+        [6, 26, 46, 66],
+        [6, 26, 48, 70],
+        [6, 26, 50, 74],
+        [6, 30, 54, 78],
+        [6, 30, 56, 82],
+        [6, 30, 58, 86],
+        [6, 34, 62, 90],
+        [6, 28, 50, 72, 94],
+        [6, 26, 50, 74, 98],
+        [6, 30, 54, 78, 102],
+        [6, 28, 54, 80, 106],
+        [6, 32, 58, 84, 110],
+        [6, 30, 58, 86, 114],
+        [6, 34, 62, 90, 118],
+        [6, 26, 50, 74, 98, 122],
+        [6, 30, 54, 78, 102, 126],
+        [6, 26, 52, 78, 104, 130],
+        [6, 30, 56, 82, 108, 134],
+        [6, 34, 60, 86, 112, 138],
+        [6, 30, 58, 86, 114, 142],
+        [6, 34, 62, 90, 118, 146],
+        [6, 30, 54, 78, 102, 126, 150],
+        [6, 24, 50, 76, 102, 128, 154],
+        [6, 28, 54, 80, 106, 132, 158],
+        [6, 32, 58, 84, 110, 136, 162],
+        [6, 26, 54, 82, 110, 138, 166],
+        [6, 30, 58, 86, 114, 142, 170]
+    ];
+    var G15 = (1 << 10) | (1 << 8) | (1 << 5) | (1 << 4) | (1 << 2) | (1 << 1) | (1 << 0);
+    var G18 = (1 << 12) | (1 << 11) | (1 << 10) | (1 << 9) | (1 << 8) | (1 << 5) | (1 << 2) | (1 << 0);
+    var G15_MASK = (1 << 14) | (1 << 12) | (1 << 10) | (1 << 4) | (1 << 1);
+ 
+    var _this = {};
+ 
+    var getBCHDigit = function(data) {
+        var digit = 0;
+        while (data != 0) {
+            digit += 1;
+            data >>>= 1;
+        }
+        return digit;
+    };
+ 
+    _this.getBCHTypeInfo = function(data) {
+        var d = data << 10;
+        while (getBCHDigit(d) - getBCHDigit(G15) >= 0) {
+            d ^= (G15 << (getBCHDigit(d) - getBCHDigit(G15) ) );
+        }
+        return ( (data << 10) | d) ^ G15_MASK;
+    };
+ 
+    _this.getBCHTypeNumber = function(data) {
+        var d = data << 12;
+        while (getBCHDigit(d) - getBCHDigit(G18) >= 0) {
+            d ^= (G18 << (getBCHDigit(d) - getBCHDigit(G18) ) );
+        }
+        return (data << 12) | d;
+    };
+ 
+    _this.getPatternPosition = function(typeNumber) {
+        return PATTERN_POSITION_TABLE[typeNumber - 1];
+    };
+ 
+    _this.getMaskFunction = function(maskPattern) {
+ 
+        switch (maskPattern) {
+ 
+            case QRMaskPattern.PATTERN000 :
+                return function(i, j) { return (i + j) % 2 == 0; };
+            case QRMaskPattern.PATTERN001 :
+                return function(i, j) { return i % 2 == 0; };
+            case QRMaskPattern.PATTERN010 :
+                return function(i, j) { return j % 3 == 0; };
+            case QRMaskPattern.PATTERN011 :
+                return function(i, j) { return (i + j) % 3 == 0; };
+            case QRMaskPattern.PATTERN100 :
+                return function(i, j) { return (Math.floor(i / 2) + Math.floor(j / 3) ) % 2 == 0; };
+            case QRMaskPattern.PATTERN101 :
+                return function(i, j) { return (i * j) % 2 + (i * j) % 3 == 0; };
+            case QRMaskPattern.PATTERN110 :
+                return function(i, j) { return ( (i * j) % 2 + (i * j) % 3) % 2 == 0; };
+            case QRMaskPattern.PATTERN111 :
+                return function(i, j) { return ( (i * j) % 3 + (i + j) % 2) % 2 == 0; };
+ 
+                default :
+                throw new Error('bad maskPattern:' + maskPattern);
+        }
+    };
+ 
+    _this.getErrorCorrectPolynomial = function(errorCorrectLength) {
+        var a = qrPolynomial([1], 0);
+        for (var i = 0; i < errorCorrectLength; i += 1) {
+            a = a.multiply(qrPolynomial([1, QRMath.gexp(i)], 0) );
+        }
+        return a;
+    };
+ 
+    _this.getLengthInBits = function(mode, type) {
+ 
+        if (1 <= type && type < 10) {
+ 
+            // 1 - 9
+ 
+            switch(mode) {
+                case QRMode.MODE_NUMBER         : return 10;
+                case QRMode.MODE_ALPHA_NUM         : return 9;
+                case QRMode.MODE_8BIT_BYTE        : return 8;
+                case QRMode.MODE_KANJI                : return 8;
+                    default :
+                    throw new Error('mode:' + mode);
+            }
+ 
+        } else if (type < 27) {
+ 
+            // 10 - 26
+ 
+            switch(mode) {
+                case QRMode.MODE_NUMBER         : return 12;
+                case QRMode.MODE_ALPHA_NUM         : return 11;
+                case QRMode.MODE_8BIT_BYTE        : return 16;
+                case QRMode.MODE_KANJI                : return 10;
+                    default :
+                    throw new Error('mode:' + mode);
+            }
+ 
+        } else if (type < 41) {
+ 
+            // 27 - 40
+ 
+            switch(mode) {
+                case QRMode.MODE_NUMBER         : return 14;
+                case QRMode.MODE_ALPHA_NUM        : return 13;
+                case QRMode.MODE_8BIT_BYTE        : return 16;
+                case QRMode.MODE_KANJI                : return 12;
+                    default :
+                    throw new Error('mode:' + mode);
+            }
+ 
+        } else {
+            throw new Error('type:' + type);
+        }
+    };
+ 
+    _this.getLostPoint = function(qrcode) {
+ 
+        var moduleCount = qrcode.getModuleCount();
+ 
+        var lostPoint = 0;
+ 
+        // LEVEL1
+ 
+        for (var row = 0; row < moduleCount; row += 1) {
+            for (var col = 0; col < moduleCount; col += 1) {
+ 
+                var sameCount = 0;
+                var dark = qrcode.isDark(row, col);
+ 
+                for (var r = -1; r <= 1; r += 1) {
+ 
+                    if (row + r < 0 || moduleCount <= row + r) {
+                        continue;
+                    }
+ 
+                    for (var c = -1; c <= 1; c += 1) {
+ 
+                        if (col + c < 0 || moduleCount <= col + c) {
+                            continue;
+                        }
+ 
+                        if (r == 0 && c == 0) {
+                            continue;
+                        }
+ 
+                        if (dark == qrcode.isDark(row + r, col + c) ) {
+                            sameCount += 1;
+                        }
+                    }
+                }
+ 
+                if (sameCount > 5) {
+                    lostPoint += (3 + sameCount - 5);
+                }
+            }
+        };
+ 
+        // LEVEL2
+ 
+        for (var row = 0; row < moduleCount - 1; row += 1) {
+            for (var col = 0; col < moduleCount - 1; col += 1) {
+                var count = 0;
+                if (qrcode.isDark(row, col) ) count += 1;
+                if (qrcode.isDark(row + 1, col) ) count += 1;
+                if (qrcode.isDark(row, col + 1) ) count += 1;
+                if (qrcode.isDark(row + 1, col + 1) ) count += 1;
+                if (count == 0 || count == 4) {
+                    lostPoint += 3;
+                }
+            }
+        }
+ 
+        // LEVEL3
+ 
+        for (var row = 0; row < moduleCount; row += 1) {
+            for (var col = 0; col < moduleCount - 6; col += 1) {
+                if (qrcode.isDark(row, col)
+                    && !qrcode.isDark(row, col + 1)
+                    &&  qrcode.isDark(row, col + 2)
+                    &&  qrcode.isDark(row, col + 3)
+                    &&  qrcode.isDark(row, col + 4)
+                    && !qrcode.isDark(row, col + 5)
+                    &&  qrcode.isDark(row, col + 6) ) {
+                    lostPoint += 40;
+                }
+            }
+        }
+ 
+        for (var col = 0; col < moduleCount; col += 1) {
+            for (var row = 0; row < moduleCount - 6; row += 1) {
+                if (qrcode.isDark(row, col)
+                    && !qrcode.isDark(row + 1, col)
+                    &&  qrcode.isDark(row + 2, col)
+                    &&  qrcode.isDark(row + 3, col)
+                    &&  qrcode.isDark(row + 4, col)
+                    && !qrcode.isDark(row + 5, col)
+                    &&  qrcode.isDark(row + 6, col) ) {
+                    lostPoint += 40;
+                }
+            }
+        }
+ 
+        // LEVEL4
+ 
+        var darkCount = 0;
+ 
+        for (var col = 0; col < moduleCount; col += 1) {
+            for (var row = 0; row < moduleCount; row += 1) {
+                if (qrcode.isDark(row, col) ) {
+                    darkCount += 1;
+                }
+            }
+        }
+ 
+        var ratio = Math.abs(100 * darkCount / moduleCount / moduleCount - 50) / 5;
+        lostPoint += ratio * 10;
+ 
+        return lostPoint;
+    };
+ 
+    return _this;
+}();
+ 
+//---------------------------------------------------------------------
+// QRMath
+//---------------------------------------------------------------------
+ 
+var QRMath = function() {
+ 
+    var EXP_TABLE = new Array(256);
+    var LOG_TABLE = new Array(256);
+ 
+    // initialize tables
+    for (var i = 0; i < 8; i += 1) {
+        EXP_TABLE[i] = 1 << i;
+    }
+    for (var i = 8; i < 256; i += 1) {
+        EXP_TABLE[i] = EXP_TABLE[i - 4]
+            ^ EXP_TABLE[i - 5]
+            ^ EXP_TABLE[i - 6]
+            ^ EXP_TABLE[i - 8];
+    }
+    for (var i = 0; i < 255; i += 1) {
+        LOG_TABLE[EXP_TABLE[i] ] = i;
+    }
+ 
+    var _this = {};
+ 
+    _this.glog = function(n) {
+ 
+        if (n < 1) {
+            throw new Error('glog(' + n + ')');
+        }
+ 
+        return LOG_TABLE[n];
+    };
+ 
+    _this.gexp = function(n) {
+ 
+        while (n < 0) {
+            n += 255;
+        }
+ 
+        while (n >= 256) {
+            n -= 255;
+        }
+ 
+        return EXP_TABLE[n];
+    };
+ 
+    return _this;
+}();
+ 
+//---------------------------------------------------------------------
+// qrPolynomial
+//---------------------------------------------------------------------
+ 
+function qrPolynomial(num, shift) {
+ 
+    if (typeof num.length == 'undefined') {
+        throw new Error(num.length + '/' + shift);
+    }
+ 
+    var _num = function() {
+        var offset = 0;
+        while (offset < num.length && num[offset] == 0) {
+            offset += 1;
+        }
+        var _num = new Array(num.length - offset + shift);
+        for (var i = 0; i < num.length - offset; i += 1) {
+            _num[i] = num[i + offset];
+        }
+        return _num;
+    }();
+ 
+    var _this = {};
+ 
+    _this.getAt = function(index) {
+        return _num[index];
+    };
+ 
+    _this.getLength = function() {
+        return _num.length;
+    };
+ 
+    _this.multiply = function(e) {
+ 
+        var num = new Array(_this.getLength() + e.getLength() - 1);
+ 
+        for (var i = 0; i < _this.getLength(); i += 1) {
+            for (var j = 0; j < e.getLength(); j += 1) {
+                num[i + j] ^= QRMath.gexp(QRMath.glog(_this.getAt(i) ) + QRMath.glog(e.getAt(j) ) );
+            }
+        }
+ 
+        return qrPolynomial(num, 0);
+    };
+ 
+    _this.mod = function(e) {
+ 
+        if (_this.getLength() - e.getLength() < 0) {
+            return _this;
+        }
+ 
+        var ratio = QRMath.glog(_this.getAt(0) ) - QRMath.glog(e.getAt(0) );
+ 
+        var num = new Array(_this.getLength() );
+        for (var i = 0; i < _this.getLength(); i += 1) {
+            num[i] = _this.getAt(i);
+        }
+ 
+        for (var i = 0; i < e.getLength(); i += 1) {
+            num[i] ^= QRMath.gexp(QRMath.glog(e.getAt(i) ) + ratio);
+        }
+ 
+        // recursive call
+        return qrPolynomial(num, 0).mod(e);
+    };
+ 
+    return _this;
+};
+ 
+//---------------------------------------------------------------------
+// QRRSBlock
+//---------------------------------------------------------------------
+ 
+var QRRSBlock = function() {
+ 
+ 
+    // [1: [L, M, Q, H], ..]
+    var RS_BLOCK_TABLE=[[1,26,19],[1,26,16],[1,26,13],[1,26,9],[1,44,34],[1,44,28],[1,44,22],[1,44,16],[1,70,55],[1,70,44],[2,35,17],[2,35,13],[1,100,80],[2,50,32],[2,50,24],[4,25,9],[1,134,108],[2,67,43],[2,33,15,2,34,16],[2,33,11,2,34,12],[2,86,68],[4,43,27],[4,43,19],[4,43,15],[2,98,78],[4,49,31],[2,32,14,4,33,15],[4,39,13,1,40,14],[2,121,97],[2,60,38,2,61,39],[4,40,18,2,41,19],[4,40,14,2,41,15],[2,146,116],[3,58,36,2,59,37],[4,36,16,4,37,17],[4,36,12,4,37,13],[2,86,68,2,87,69],[4,69,43,1,70,44],[6,43,19,2,44,20],[6,43,15,2,44,16],[4,101,81],[1,80,50,4,81,51],[4,50,22,4,51,23],[3,36,12,8,37,13],[2,116,92,2,117,93],[6,58,36,2,59,37],[4,46,20,6,47,21],[7,42,14,4,43,15],[4,133,107],[8,59,37,1,60,38],[8,44,20,4,45,21],[12,33,11,4,34,12],[3,145,115,1,146,116],[4,64,40,5,65,41],[11,36,16,5,37,17],[11,36,12,5,37,13],[5,109,87,1,110,88],[5,65,41,5,66,42],[5,54,24,7,55,25],[11,36,12],[5,122,98,1,123,99],[7,73,45,3,74,46],[15,43,19,2,44,20],[3,45,15,13,46,16],[1,135,107,5,136,108],[10,74,46,1,75,47],[1,50,22,15,51,23],[2,42,14,17,43,15],[5,150,120,1,151,121],[9,69,43,4,70,44],[17,50,22,1,51,23],[2,42,14,19,43,15],[3,141,113,4,142,114],[3,70,44,11,71,45],[17,47,21,4,48,22],[9,39,13,16,40,14],[3,135,107,5,136,108],[3,67,41,13,68,42],[15,54,24,5,55,25],[15,43,15,10,44,16],[4,144,116,4,145,117],[17,68,42],[17,50,22,6,51,23],[19,46,16,6,47,17],[2,139,111,7,140,112],[17,74,46],[7,54,24,16,55,25],[34,37,13],[4,151,121,5,152,122],[4,75,47,14,76,48],[11,54,24,14,55,25],[16,45,15,14,46,16],[6,147,117,4,148,118],[6,73,45,14,74,46],[11,54,24,16,55,25],[30,46,16,2,47,17],[8,132,106,4,133,107],[8,75,47,13,76,48],[7,54,24,22,55,25],[22,45,15,13,46,16],[10,142,114,2,143,115],[19,74,46,4,75,47],[28,50,22,6,51,23],[33,46,16,4,47,17],[8,152,122,4,153,123],[22,73,45,3,74,46],[8,53,23,26,54,24],[12,45,15,28,46,16],[3,147,117,10,148,118],[3,73,45,23,74,46],[4,54,24,31,55,25],[11,45,15,31,46,16],[7,146,116,7,147,117],[21,73,45,7,74,46],[1,53,23,37,54,24],[19,45,15,26,46,16],[5,145,115,10,146,116],[19,75,47,10,76,48],[15,54,24,25,55,25],[23,45,15,25,46,16],[13,145,115,3,146,116],[2,74,46,29,75,47],[42,54,24,1,55,25],[23,45,15,28,46,16],[17,145,115],[10,74,46,23,75,47],[10,54,24,35,55,25],[19,45,15,35,46,16],[17,145,115,1,146,116],[14,74,46,21,75,47],[29,54,24,19,55,25],[11,45,15,46,46,16],[13,145,115,6,146,116],[14,74,46,23,75,47],[44,54,24,7,55,25],[59,46,16,1,47,17],[12,151,121,7,152,122],[12,75,47,26,76,48],[39,54,24,14,55,25],[22,45,15,41,46,16],[6,151,121,14,152,122],[6,75,47,34,76,48],[46,54,24,10,55,25],[2,45,15,64,46,16],[17,152,122,4,153,123],[29,74,46,14,75,47],[49,54,24,10,55,25],[24,45,15,46,46,16],[4,152,122,18,153,123],[13,74,46,32,75,47],[48,54,24,14,55,25],[42,45,15,32,46,16],[20,147,117,4,148,118],[40,75,47,7,76,48],[43,54,24,22,55,25],[10,45,15,67,46,16],[19,148,118,6,149,119],[18,75,47,31,76,48],[34,54,24,34,55,25],[20,45,15,61,46,16]];
+ 
+    var qrRSBlock = function(totalCount, dataCount) {
+        var _this = {};
+        _this.totalCount = totalCount;
+        _this.dataCount = dataCount;
+        return _this;
+    };
+ 
+    var _this = {};
+ 
+    var getRsBlockTable = function(typeNumber, errorCorrectLevel) {
+ 
+        switch(errorCorrectLevel) {
+            case QRErrorCorrectLevel.L :
+                return RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 0];
+            case QRErrorCorrectLevel.M :
+                return RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 1];
+            case QRErrorCorrectLevel.Q :
+                return RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 2];
+            case QRErrorCorrectLevel.H :
+                return RS_BLOCK_TABLE[(typeNumber - 1) * 4 + 3];
+                default :
+                return undefined;
+        }
+    };
+ 
+    _this.getRSBlocks = function(typeNumber, errorCorrectLevel) {
+ 
+        var rsBlock = getRsBlockTable(typeNumber, errorCorrectLevel);
+ 
+        if (typeof rsBlock == 'undefined') {
+            throw new Error('bad rs block [url=home.php?mod=space&uid=5302]@[/url] typeNumber:' + typeNumber +
+                            '/errorCorrectLevel:' + errorCorrectLevel);
+        }
+ 
+        var length = rsBlock.length / 3;
+ 
+        var list = new Array();
+ 
+        for (var i = 0; i < length; i += 1) {
+ 
+            var count = rsBlock[i * 3 + 0];
+            var totalCount = rsBlock[i * 3 + 1];
+            var dataCount = rsBlock[i * 3 + 2];
+ 
+            for (var j = 0; j < count; j += 1) {
+                list.push(qrRSBlock(totalCount, dataCount) );
+            }
+        }
+ 
+        return list;
+    };
+ 
+    return _this;
+}();
+ 
+//---------------------------------------------------------------------
+// qrBitBuffer
+//---------------------------------------------------------------------
+ 
+var qrBitBuffer = function() {
+ 
+    var _buffer = new Array();
+    var _length = 0;
+ 
+    var _this = {};
+ 
+    _this.getBuffer = function() {
+        return _buffer;
+    };
+ 
+    _this.getAt = function(index) {
+        var bufIndex = Math.floor(index / 8);
+        return ( (_buffer[bufIndex] >>> (7 - index % 8) ) & 1) == 1;
+    };
+ 
+    _this.put = function(num, length) {
+        for (var i = 0; i < length; i += 1) {
+            _this.putBit( ( (num >>> (length - i - 1) ) & 1) == 1);
+        }
+    };
+ 
+    _this.getLengthInBits = function() {
+        return _length;
+    };
+ 
+    _this.putBit = function(bit) {
+ 
+        var bufIndex = Math.floor(_length / 8);
+        if (_buffer.length <= bufIndex) {
+            _buffer.push(0);
+        }
+ 
+        if (bit) {
+            _buffer[bufIndex] |= (0x80 >>> (_length % 8) );
+        }
+ 
+        _length += 1;
+    };
+ 
+    return _this;
+};
+ 
+//---------------------------------------------------------------------
+// qr8BitByte
+//---------------------------------------------------------------------
+ 
+var qr8BitByte = function(data) {
+ 
+    var _mode = QRMode.MODE_8BIT_BYTE;
+    var _data = data;
+    var _parsedData = [];
+ 
+    var _this = {};
+ 
+ 
+    // Added to support UTF-8 Characters
+    for (var i = 0, l = _data.length; i < l; i++) {
+        var byteArray = [];
+        var code = _data.charCodeAt(i);
+ 
+        if (code > 0x10000) {
+            byteArray[0] = 0xF0 | ((code & 0x1C0000) >>> 18);
+            byteArray[1] = 0x80 | ((code & 0x3F000) >>> 12);
+            byteArray[2] = 0x80 | ((code & 0xFC0) >>> 6);
+            byteArray[3] = 0x80 | (code & 0x3F);
+        } else if (code > 0x800) {
+            byteArray[0] = 0xE0 | ((code & 0xF000) >>> 12);
+            byteArray[1] = 0x80 | ((code & 0xFC0) >>> 6);
+            byteArray[2] = 0x80 | (code & 0x3F);
+        } else if (code > 0x80) {
+            byteArray[0] = 0xC0 | ((code & 0x7C0) >>> 6);
+            byteArray[1] = 0x80 | (code & 0x3F);
+        } else {
+            byteArray[0] = code;
+        }
+ 
+        // Fix Unicode corruption bug
+        _parsedData.push(byteArray);
+    }
+ 
+    _parsedData = Array.prototype.concat.apply([], _parsedData);
+ 
+    if (_parsedData.length != _data.length) {
+        _parsedData.unshift(191);
+        _parsedData.unshift(187);
+        _parsedData.unshift(239);
+    }
+ 
+    var _bytes = _parsedData;
+ 
+    _this.getMode = function() {
+        return _mode;
+    };
+ 
+    _this.getLength = function(buffer) {
+        return _bytes.length;
+    };
+ 
+    _this.write = function(buffer) {
+        for (var i = 0; i < _bytes.length; i += 1) {
+            buffer.put(_bytes[i], 8);
+        }
+    };
+ 
+    return _this;
+};
+ 
+//=====================================================================
+// GIF Support etc.
+//
+ 
+//---------------------------------------------------------------------
+// byteArrayOutputStream
+//---------------------------------------------------------------------
+ 
+var byteArrayOutputStream = function() {
+ 
+    var _bytes = new Array();
+ 
+    var _this = {};
+ 
+    _this.writeByte = function(b) {
+        _bytes.push(b & 0xff);
+    };
+ 
+    _this.writeShort = function(i) {
+        _this.writeByte(i);
+        _this.writeByte(i >>> 8);
+    };
+ 
+    _this.writeBytes = function(b, off, len) {
+        off = off || 0;
+        len = len || b.length;
+        for (var i = 0; i < len; i += 1) {
+            _this.writeByte(b[i + off]);
+        }
+    };
+ 
+    _this.writeString = function(s) {
+        for (var i = 0; i < s.length; i += 1) {
+            _this.writeByte(s.charCodeAt(i) );
+        }
+    };
+ 
+    _this.toByteArray = function() {
+        return _bytes;
+    };
+ 
+    _this.toString = function() {
+        var s = '';
+        s += '[';
+        for (var i = 0; i < _bytes.length; i += 1) {
+            if (i > 0) {
+                s += ',';
+            }
+            s += _bytes[i];
+        }
+        s += ']';
+        return s;
+    };
+ 
+    return _this;
+};
+ 
+//---------------------------------------------------------------------
+// base64EncodeOutputStream
+//---------------------------------------------------------------------
+ 
+var base64EncodeOutputStream = function() {
+ 
+    var _buffer = 0;
+    var _buflen = 0;
+    var _length = 0;
+    var _base64 = '';
+ 
+    var _this = {};
+ 
+    var writeEncoded = function(b) {
+        _base64 += String.fromCharCode(encode(b & 0x3f) );
+    };
+ 
+    var encode = function(n) {
+        if (n < 0) {
+            // error.
+        } else if (n < 26) {
+            return 0x41 + n;
+        } else if (n < 52) {
+            return 0x61 + (n - 26);
+        } else if (n < 62) {
+            return 0x30 + (n - 52);
+        } else if (n == 62) {
+            return 0x2b;
+        } else if (n == 63) {
+            return 0x2f;
+        }
+        throw new Error('n:' + n);
+    };
+ 
+    _this.writeByte = function(n) {
+ 
+        _buffer = (_buffer << 8) | (n & 0xff);
+        _buflen += 8;
+        _length += 1;
+ 
+        while (_buflen >= 6) {
+            writeEncoded(_buffer >>> (_buflen - 6) );
+            _buflen -= 6;
+        }
+    };
+ 
+    _this.flush = function() {
+ 
+        if (_buflen > 0) {
+            writeEncoded(_buffer << (6 - _buflen) );
+            _buffer = 0;
+            _buflen = 0;
+        }
+ 
+        if (_length % 3 != 0) {
+            // padding
+            var padlen = 3 - _length % 3;
+            for (var i = 0; i < padlen; i += 1) {
+                _base64 += '=';
+            }
+        }
+    };
+ 
+    _this.toString = function() {
+        return _base64;
+    };
+ 
+    return _this;
+};
+ 
+//---------------------------------------------------------------------
+// base64DecodeInputStream
+//---------------------------------------------------------------------
+ 
+var base64DecodeInputStream = function(str) {
+ 
+    var _str = str;
+    var _pos = 0;
+    var _buffer = 0;
+    var _buflen = 0;
+ 
+    var _this = {};
+ 
+    _this.read = function() {
+ 
+        while (_buflen < 8) {
+ 
+            if (_pos >= _str.length) {
+                if (_buflen == 0) {
+                    return -1;
+                }
+                throw new Error('unexpected end of file./' + _buflen);
+            }
+ 
+            var c = _str.charAt(_pos);
+            _pos += 1;
+ 
+            if (c == '=') {
+                _buflen = 0;
+                return -1;
+            } else if (c.match(/^\s$/) ) {
+                // ignore if whitespace.
+                continue;
+            }
+ 
+            _buffer = (_buffer << 6) | decode(c.charCodeAt(0) );
+            _buflen += 6;
+        }
+ 
+        var n = (_buffer >>> (_buflen - 8) ) & 0xff;
+        _buflen -= 8;
+        return n;
+    };
+ 
+    var decode = function(c) {
+        if (0x41 <= c && c <= 0x5a) {
+            return c - 0x41;
+        } else if (0x61 <= c && c <= 0x7a) {
+            return c - 0x61 + 26;
+        } else if (0x30 <= c && c <= 0x39) {
+            return c - 0x30 + 52;
+        } else if (c == 0x2b) {
+            return 62;
+        } else if (c == 0x2f) {
+            return 63;
+        } else {
+            throw new Error('c:' + c);
+        }
+    };
+ 
+    return _this;
+};
+ 
+//---------------------------------------------------------------------
+// gifImage (B/W)
+//---------------------------------------------------------------------
+ 
+var gifImage = function(width, height) {
+ 
+    var _width = width;
+    var _height = height;
+    var _data = new Array(width * height);
+ 
+    var _this = {};
+ 
+    _this.setPixel = function(x, y, pixel) {
+        _data[y * _width + x] = pixel;
+    };
+ 
+    _this.write = function(out) {
+ 
+        //---------------------------------
+        // GIF Signature
+ 
+        out.writeString('GIF87a');
+ 
+        //---------------------------------
+        // Screen Descriptor
+ 
+        out.writeShort(_width);
+        out.writeShort(_height);
+ 
+        out.writeByte(0x80); // 2bit
+        out.writeByte(0);
+        out.writeByte(0);
+ 
+        //---------------------------------
+        // Global Color Map
+ 
+        // black
+        out.writeByte(0x00);
+        out.writeByte(0x00);
+        out.writeByte(0x00);
+ 
+        // white
+        out.writeByte(0xff);
+        out.writeByte(0xff);
+        out.writeByte(0xff);
+ 
+        //---------------------------------
+        // Image Descriptor
+ 
+        out.writeString(',');
+        out.writeShort(0);
+        out.writeShort(0);
+        out.writeShort(_width);
+        out.writeShort(_height);
+        out.writeByte(0);
+ 
+        //---------------------------------
+        // Local Color Map
+ 
+        //---------------------------------
+        // Raster Data
+ 
+        var lzwMinCodeSize = 2;
+        var raster = getLZWRaster(lzwMinCodeSize);
+ 
+        out.writeByte(lzwMinCodeSize);
+ 
+        var offset = 0;
+ 
+        while (raster.length - offset > 255) {
+            out.writeByte(255);
+            out.writeBytes(raster, offset, 255);
+            offset += 255;
+        }
+ 
+        out.writeByte(raster.length - offset);
+        out.writeBytes(raster, offset, raster.length - offset);
+        out.writeByte(0x00);
+ 
+        //---------------------------------
+        // GIF Terminator
+        out.writeString(';');
+    };
+ 
+    var bitOutputStream = function(out) {
+ 
+        var _out = out;
+        var _bitLength = 0;
+        var _bitBuffer = 0;
+ 
+        var _this = {};
+ 
+        _this.write = function(data, length) {
+ 
+            if ( (data >>> length) != 0) {
+                throw new Error('length over');
+            }
+ 
+            while (_bitLength + length >= 8) {
+                _out.writeByte(0xff & ( (data << _bitLength) | _bitBuffer) );
+                length -= (8 - _bitLength);
+                data >>>= (8 - _bitLength);
+                _bitBuffer = 0;
+                _bitLength = 0;
+            }
+ 
+            _bitBuffer = (data << _bitLength) | _bitBuffer;
+            _bitLength = _bitLength + length;
+        };
+ 
+        _this.flush = function() {
+            if (_bitLength > 0) {
+                _out.writeByte(_bitBuffer);
+            }
+        };
+ 
+        return _this;
+    };
+ 
+    var getLZWRaster = function(lzwMinCodeSize) {
+ 
+        var clearCode = 1 << lzwMinCodeSize;
+        var endCode = (1 << lzwMinCodeSize) + 1;
+        var bitLength = lzwMinCodeSize + 1;
+ 
+        // Setup LZWTable
+        var table = lzwTable();
+ 
+        for (var i = 0; i < clearCode; i += 1) {
+            table.add(String.fromCharCode(i) );
+        }
+        table.add(String.fromCharCode(clearCode) );
+        table.add(String.fromCharCode(endCode) );
+ 
+        var byteOut = byteArrayOutputStream();
+        var bitOut = bitOutputStream(byteOut);
+ 
+        // clear code
+        bitOut.write(clearCode, bitLength);
+ 
+        var dataIndex = 0;
+ 
+        var s = String.fromCharCode(_data[dataIndex]);
+        dataIndex += 1;
+ 
+        while (dataIndex < _data.length) {
+ 
+            var c = String.fromCharCode(_data[dataIndex]);
+            dataIndex += 1;
+ 
+            if (table.contains(s + c) ) {
+ 
+                s = s + c;
+ 
+            } else {
+ 
+                bitOut.write(table.indexOf(s), bitLength);
+ 
+                if (table.size() < 0xfff) {
+ 
+                    if (table.size() == (1 << bitLength) ) {
+                        bitLength += 1;
+                    }
+ 
+                    table.add(s + c);
+                }
+ 
+                s = c;
+            }
+        }
+ 
+        bitOut.write(table.indexOf(s), bitLength);
+ 
+        // end code
+        bitOut.write(endCode, bitLength);
+ 
+        bitOut.flush();
+ 
+        return byteOut.toByteArray();
+    };
+ 
+    var lzwTable = function() {
+ 
+        var _map = {};
+        var _size = 0;
+ 
+        var _this = {};
+ 
+        _this.add = function(key) {
+            if (_this.contains(key) ) {
+                throw new Error('dup key:' + key);
+            }
+            _map[key] = _size;
+            _size += 1;
+        };
+ 
+        _this.size = function() {
+            return _size;
+        };
+ 
+        _this.indexOf = function(key) {
+            return _map[key];
+        };
+ 
+        _this.contains = function(key) {
+            return typeof _map[key] != 'undefined';
+        };
+ 
+        return _this;
+    };
+ 
+    return _this;
+};
+ 
+var createImgTag = function(width, height, getPixel, alt) {
+ 
+    var gif = gifImage(width, height);
+    for (var y = 0; y < height; y += 1) {
+        for (var x = 0; x < width; x += 1) {
+            gif.setPixel(x, y, getPixel(x, y) );
+        }
+    }
+ 
+    var b = byteArrayOutputStream();
+    gif.write(b);
+ 
+    var base64 = base64EncodeOutputStream();
+    var bytes = b.toByteArray();
+    for (var i = 0; i < bytes.length; i += 1) {
+        base64.writeByte(bytes[i]);
+    }
+    base64.flush();
+ 
+    var img = '';
+    img += 'data:image/gif;base64,';
+    img += base64;
+ 
+    return img;
+};
+ 
+//---------------------------------------------------------------------
+// returns qrcode function.
+ 
+var createQrCodeImg = function(text, options) {
+    options = options || {};
+    var typeNumber = options.typeNumber || 4;
+    var errorCorrectLevel = options.errorCorrectLevel || 'M';
+    var size = options.size || 500;
+ 
+    var qr;
+ 
+    try {
+        qr = qrcode(typeNumber, errorCorrectLevel || 'M');
+        qr.addData(text);
+        qr.make();
+    } catch (e) {
+        if(typeNumber >= 40) {
+            throw new Error('Text too long to encode');
+        } else {
+            return gen(text, {
+                size: size,
+                errorCorrectLevel: errorCorrectLevel,
+                typeNumber: typeNumber + 1
+            });
+        }
+    }
+ 
+    // calc cellsize and margin
+    var cellsize = parseInt(size / qr.getModuleCount());
+    var margin = parseInt((size - qr.getModuleCount() * cellsize) / 2);
+ 
+    return qr.createImgTag(cellsize, margin, size);
+};
+// var module = {}; 需要注释这一行，否则微信小程序无法使用
+module.exports = {
+        createQrCodeImg : createQrCodeImg
+};
\ No newline at end of file
diff --git a/pages_borrow_books/pages/address/address.vue b/pages_borrow_books/pages/address/address.vue
new file mode 100644
index 0000000000000000000000000000000000000000..6c0b5c58708c561e4b861852edb6c6035284aae1
--- /dev/null
+++ b/pages_borrow_books/pages/address/address.vue
@@ -0,0 +1,280 @@
+<template>
+	<view>
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="地址管理" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
+		<view class="content">
+			<view class="list">
+				<view class="row" v-for="(row,index) in addressList" :key="index" @tap="select(row)">
+					<view class="left">
+						<view class="head">
+							{{row.head}}
+						</view>
+					</view>
+					<view class="center">
+						<view class="name-tel">
+							<view class="name">{{row.name}}</view>
+							<view class="tel">{{row.tel}}</view>
+							<view class="default" v-if="row.isDefault">
+								默认
+							</view>
+						</view>
+						<view class="address">
+							{{row.address.region.label}} {{row.address.detailed}}
+						</view>
+					</view>
+					<view class="right">
+						<view class="icon bianji" @tap.stop="edit(row)">
+							<view style="display: block;  margin-left: 30rpx; font-size: 22rpx; color: #574ef5;">修改</view>
+						</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<view class="add">
+			<view class="btn" @tap="add">
+				<view class="icon tianjia"></view>新增地址
+			</view>
+		</view>
+	</view>
+</template>
+<script>
+	const app = getApp()
+	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+				isSelect: false,
+				addressData: [],
+			};
+		},
+		onShow() {
+			app.myRequest({
+				url: "address/getAddress",
+				type: 'GET'
+			}).then(res => {
+				console.log(res);
+				this.addressData = res;
+			})
+			uni.getStorage({
+				key: 'delAddress',
+				success: (e) => {
+					let len = this.addressList.length;
+					if (e.data.hasOwnProperty('id')) {
+						for (let i = 0; i < len; i++) {
+							if (this.addressList[i].id == e.data.id) {
+								this.addressList.splice(i, 1);
+								break;
+							}
+						}
+					}
+					uni.removeStorage({
+						key: 'delAddress'
+					})
+				}
+			})
+			uni.getStorage({
+				key: 'saveAddress',
+				success: (e) => {
+					let len = this.addressList.length;
+					if (e.data.hasOwnProperty('id')) {
+						for (let i = 0; i < len; i++) {
+							if (this.addressList[i].id == e.data.id) {
+								this.addressList.splice(i, 1, e.data);
+								break;
+							}
+						}
+					} else {
+						let lastid = this.addressList[len - 1];
+						lastid++;
+						e.data.id = lastid;
+						this.addressList.push(e.data);
+					}
+					uni.removeStorage({
+						key: 'saveAddress'
+					})
+				}
+			})
+		},
+		onLoad(e) {
+			if (e.type == 'select') {
+				this.isSelect = true;
+			}
+		},
+		computed: {
+			addressList() {
+				return this.addressData.map(v => {
+					return {
+						id: v.addressId,
+						name: v.name,
+						head: v.name[0],
+						tel: v.phoneNumber,
+						isDefault: v.isMain,
+						address: {
+							region: {
+								"label": `${v.province}-${v.city}-${v.district}`,
+								"value": [18, 2, 1],
+								"cityCode": v.post
+							},
+							detailed: v.detailAddress,
+						},
+					}
+				})
+			}
+		},
+		methods: {
+			edit(row) {
+				uni.setStorage({
+					key: 'address',
+					data: row,
+					success() {
+						uni.navigateTo({
+							url: "edit/edit?type=edit&id=" + row.id
+						})
+					}
+				});
+
+			},
+			add() {
+				uni.navigateTo({
+					url: "edit/edit?type=add"
+				})
+			},
+			select(row) {
+				//是否需要返回地址(从订单确认页跳过来选收货地址)
+				if (!this.isSelect) {
+					return;
+				}
+				uni.setStorage({
+					key: 'selectAddress',
+					data: row,
+					success() {
+						uni.navigateBack();
+					}
+				})
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	view {
+		display: flex;
+	}
+
+	.add {
+		position: fixed;
+		bottom: 0;
+		width: 100%;
+		height: 120upx;
+		justify-content: center;
+		align-items: center;
+
+		.btn {
+			width: 100%;
+			height: 80upx;
+			border-radius: 5upx;
+			background-color: #574ef5;
+			color: #fff;
+			justify-content: center;
+			align-items: center;
+
+			// .icon {
+			// 	height: 80upx;
+			// 	color: #fff;
+			// 	font-size: 30upx;
+			// 	justify-content: center;
+			// 	align-items: center;
+			// }
+
+			font-size: 30upx;
+		}
+	}
+
+	.list {
+		flex-wrap: wrap;
+
+		.row {
+			width: 96%;
+			padding: 20upx 2%;
+
+			.left {
+				width: 90upx;
+				flex-shrink: 0;
+				align-items: center;
+
+				.head {
+					width: 70upx;
+					height: 70upx;
+					background: linear-gradient(to right, #ccc, #aaa);
+					color: #fff;
+					justify-content: center;
+					align-items: center;
+					border-radius: 60upx;
+					font-size: 35upx;
+				}
+			}
+
+			.center {
+				width: 100%;
+				flex-wrap: wrap;
+
+				.name-tel {
+					width: 100%;
+					align-items: baseline;
+
+					.name {
+						font-size: 34upx;
+					}
+
+					.tel {
+						margin-left: 30upx;
+						font-size: 24upx;
+						color: #777;
+					}
+
+					.default {
+
+						font-size: 22upx;
+
+						background-color: #574ef5;
+						color: #fff;
+						padding: 0 18upx;
+						border-radius: 24upx;
+						margin-left: 20upx;
+					}
+				}
+
+				.address {
+					width: 100%;
+					font-size: 24upx;
+					align-items: baseline;
+					color: #777;
+				}
+			}
+
+			.right {
+				flex-shrink: 0;
+				align-items: center;
+				margin-left: 20upx;
+
+				.icon {
+					justify-content: center;
+					align-items: center;
+					width: 80upx;
+					height: 60upx;
+					border-left: solid 1upx #aaa;
+					font-size: 40upx;
+					color: #777;
+				}
+			}
+		}
+	}
+</style>
diff --git a/pages_borrow_books/pages/address/edit/add.vue b/pages_borrow_books/pages/address/edit/add.vue
new file mode 100644
index 0000000000000000000000000000000000000000..55f174cf70a60e5ef9e5fb5ccc45b6dcab1cb1db
--- /dev/null
+++ b/pages_borrow_books/pages/address/edit/add.vue
@@ -0,0 +1,356 @@
+<template>
+	<view>
+		<view class="content">
+			<view class="row">
+				<view class="nominal">
+					收件人
+				</view>
+				<view class="input">
+					<input placeholder="请输入收件人姓名" type="text" v-model="formData.name" />
+				</view>
+			</view>
+			<view class="row">
+				<view class="nominal">
+					电话号码
+				</view>
+				<view class="input">
+					<input placeholder="请输入收件人电话号码" type="text" v-model="formData.phoneNumber" />
+				</view>
+			</view>
+			<view class="row">
+				<view class="nominal">
+					邮政编码
+				</view>
+				<view class="input">
+					<input placeholder="请输入邮政编码" type="text" v-model="formData.post" />
+				</view>
+			</view>
+			<view class="row">
+				<view class="nominal">
+					所在地区
+				</view>
+				<view class="input" @tap="chooseCity">
+					{{region.label}}
+				</view>
+			</view>
+			<view class="row">
+				<view class="nominal">
+					详细地址
+				</view>
+				<view class="input">
+					<textarea v-model="formData.detailAddress" auto-height="true" placeholder="输入详细地址"></textarea>
+				</view>
+			</view>
+			<view class="row">
+				<view class="nominal">
+					设置默认地址
+				</view>
+				<view class="input switch">
+					<switch color="#574ef5" :checked="formData.isMain===1" @change=isDefaultChange />
+				</view>
+			</view>
+			<view class="row" v-if="editType=='edit'" @tap="del">
+				<view class="del">
+					删除收货地址
+				</view>
+			</view>
+		</view>
+		<view class="save" @tap="save">
+			<view class="btn">
+				保存地址
+			</view>
+		</view>
+		<mpvue-city-picker :themeColor="themeColor" ref="mpvueCityPicker" :pickerValueDefault="cityPickerValue" @onCancel="onCancel"
+		 @onConfirm="onConfirm"></mpvue-city-picker>
+	</view>
+</template>
+
+<script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
+	import mpvueCityPicker from '@/pages_borrow_books/components/mpvue-citypicker/mpvueCityPicker.vue'
+	export default {
+		components: {
+			mpvueCityPicker
+		},
+		computed: {
+			...mapState(['token', 'userinfo', 'login'])
+		},
+		data() {
+			return {
+				editType: 'edit',
+				id: '',
+				name: '',
+				tel: '',
+				detailed: '',
+				isDefault: false,
+				cityPickerValue: [0, 0, 1],
+				themeColor: '#574ef5',
+				region: {
+					label: "请点击选择地址",
+					value: [],
+					cityCode: ""
+				},
+				formData: {
+					company: "", //公司
+					name: "", //姓名
+					province: "", //省
+					city: "", //市
+					district: "", //县
+					detailAddress: "", //详细地址
+					post: "", //邮政编码
+					phoneNumber: "", //手机号
+					isMain: 0, //是否为默认地址
+				}
+			};
+		},
+		methods: {
+			onCancel(e) {
+				console.log(e)
+			},
+			chooseCity() {
+				this.$refs.mpvueCityPicker.show()
+			},
+			onConfirm(e) {
+				this.region = e;
+				this.cityPickerValue = e.value;
+			},
+			isDefaultChange(e) {
+				this.formData.isMain = e.detail.value ? 1 : 0;
+			},
+			del() {
+				uni.showModal({
+					title: '删除提示',
+					content: '你将删除这个收货地址',
+					success: (res) => {
+						if (res.confirm) {
+							uni.setStorage({
+								key: 'delAddress',
+								data: {
+									id: this.id
+								},
+								success() {
+									uni.navigateBack();
+								}
+							})
+						} else if (res.cancel) {
+							console.log('用户点击取消');
+						}
+					}
+				});
+
+			},
+			save() {
+				let data = this.formData
+				let [province, city, district] = this.region.label.split("-")
+				data.province = province
+				data.city = city
+				data.district = district
+				if (this.editType == 'edit') {
+					data.id = this.id
+				}
+				if (!data.name) {
+					uni.showToast({
+						title: '请输入收件人姓名',
+						icon: 'none'
+					});
+					return;
+				}
+				if (!data.phoneNumber) {
+					uni.showToast({
+						title: '请输入收件人电话号码',
+						icon: 'none'
+					});
+					return;
+				}
+				if (!data.detailAddress) {
+					uni.showToast({
+						title: '请输入收件人详细地址',
+						icon: 'none'
+					});
+					return;
+				}
+				if (!data.district) {
+					uni.showToast({
+						title: '请选择收件地址',
+						icon: 'none'
+					});
+					return;
+				}
+				console.log("编辑的数据", data)
+				this.addAddress(data)
+				//实际应用中请提交ajax,模板定时器模拟提交效果
+				// setTimeout(()=>{
+				// 	uni.setStorage({
+				// 		key:'saveAddress',
+				// 		data:data,
+				// 		success() {
+
+				// 			// uni.hideLoading();
+				// 			// uni.navigateBack();
+				// 		}
+				// 	})
+				// },300)
+			},
+			//信息
+			addAddress(data) {
+				var that = this;
+				app.myRequest({
+					url: "address/addAddress",
+					type: "POST",
+					data: data
+				}).then(res => {
+					console.log(res);
+					this.$u.toast("添加成功！")
+					uni.redirectTo({
+						url: "/pages_borrow_books/pages/address/address"
+					})
+				}).catch(err => {
+					this.$u.toast("添加失败！")
+				})
+			},
+			//提示框
+			showModal(val) {
+				uni.showToast({
+					title: val,
+					icon: 'none'
+				});
+			},
+			// async addAddress(data){
+			// 	var that = this;
+			// 	let tmp = JSON.stringify(data)
+			// 	var params = {
+			// 		url: "address/addAddress",
+			// 		type: 'POST',
+			// 		data: {
+			// 			data:tmp,
+			// 			readerId1:that.userinfo.readerId,
+			// 		}
+			// 	}
+			// 	const res = await app.myRequest(params);
+			// 	console.log("后台传来的数据：",res)
+			// },
+		},
+		onLoad(e) {
+			//获取传递过来的参数
+			console.log("e===", e)
+			this.editType = e.type;
+			if (e.type == 'edit') {
+				// uni.getStorage({
+				// 	key:'address',
+				// 	success: (e) => {
+				// 		this.id = e.data.id;
+				// 		this.name = e.data.name;
+				// 		this.tel = e.data.tel;
+				// 		this.detailed = e.data.address.detailed;
+				// 		this.isDefault = e.data.isDefault;
+				// 		this.cityPickerValue = e.data.address.region.value;
+				// 		this.region = e.data.address.region;
+				// 	}
+				// })
+			}
+
+		},
+		onBackPress() {
+			if (this.$refs.mpvueCityPicker.showPicker) {
+				this.$refs.mpvueCityPicker.pickerCancel();
+				return true;
+			}
+		},
+		onUnload() {
+			if (this.$refs.mpvueCityPicker.showPicker) {
+				this.$refs.mpvueCityPicker.pickerCancel()
+			}
+		},
+		created() {}
+	};
+</script>
+<style lang="scss">
+	.save {
+		view {
+			display: flex;
+		}
+
+		position: fixed;
+		bottom: 0;
+		width: 100%;
+		height: 120upx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+
+		.btn {
+			width: 100%;
+			height: 80upx;
+			border-radius: 5upx;
+			background-color: #574ef5;
+			color: #fff;
+			justify-content: center;
+			align-items: center;
+
+			// .icon {
+			// 	height: 80upx;
+			// 	color: #fff;
+			// 	font-size: 30upx;
+			// 	justify-content: center;
+			// 	align-items: center;
+			// }
+
+			font-size: 30upx;
+		}
+	}
+
+	.content {
+		display: flex;
+		flex-wrap: wrap;
+
+		view {
+			display: flex;
+		}
+
+		.row {
+			width: 94%;
+
+			margin: 0 3%;
+			border-top: solid 1upx #eee;
+
+			.nominal {
+				width: 30%;
+				height: 120upx;
+				font-weight: 200;
+				font-size: 30upx;
+				align-items: center;
+			}
+
+			.input {
+				width: 70%;
+				padding: 20upx 0;
+				align-items: center;
+				font-size: 30upx;
+
+				&.switch {
+					justify-content: flex-end;
+				}
+
+				.textarea {
+					margin: 20upx 0;
+					min-height: 120upx;
+				}
+			}
+
+			.del {
+				width: 100%;
+				height: 100upx;
+				justify-content: center;
+				align-items: center;
+				font-size: 36upx;
+				color: #574ef5;
+				// background-color: rgba(255, 0, 0, 0.05);
+				border-bottom: solid 1upx #eee;
+			}
+		}
+	}
+</style>
diff --git a/pages_borrow_books/pages/address/edit/edit.vue b/pages_borrow_books/pages/address/edit/edit.vue
new file mode 100644
index 0000000000000000000000000000000000000000..191b8526c24ad6bd739cad8e6f52db8eb6c36b46
--- /dev/null
+++ b/pages_borrow_books/pages/address/edit/edit.vue
@@ -0,0 +1,403 @@
+<template>
+	<view>
+		<view class="content">
+			<view class="row">
+				<view class="nominal">
+					收件人
+				</view>
+				<view class="input">
+					<input placeholder="请输入收件人姓名" type="text" v-model="formData.name" />
+				</view>
+			</view>
+			<view class="row">
+				<view class="nominal">
+					电话号码
+				</view>
+				<view class="input">
+					<input placeholder="请输入收件人电话号码" type="text" v-model="formData.phoneNumber" />
+				</view>
+			</view>
+			<view class="row">
+				<view class="nominal">
+					邮政编码
+				</view>
+				<view class="input">
+					<input placeholder="请输入邮政编码" type="text" v-model="formData.post" />
+				</view>
+			</view>
+			<view class="row">
+				<view class="nominal">
+					所在地区
+				</view>
+				<view class="input" @tap="chooseCity">
+					{{region.label}}
+				</view>
+			</view>
+			<view class="row">
+				<view class="nominal">
+					详细地址
+				</view>
+				<view class="input">
+					<textarea v-model="formData.detailAddress" auto-height="true" placeholder="输入详细地址"></textarea>
+				</view>
+			</view>
+			<view class="row">
+				<view class="nominal">
+					设置默认地址
+				</view>
+				<view class="input switch">
+					<switch color="#574ef5" :checked="formData.isMain" @change=isDefaultChange />
+				</view>
+			</view>
+			<view class="row" v-if="editType=='edit'" @tap="del">
+				<view class="del">
+					删除收货地址
+				</view>
+			</view>
+		</view>
+		<view class="save" @tap="save">
+			<view class="btn">
+				保存地址
+			</view>
+		</view>
+		<mpvue-city-picker :themeColor="themeColor" ref="mpvueCityPicker" :pickerValueDefault="cityPickerValue" @onCancel="onCancel"
+		 @onConfirm="onConfirm"></mpvue-city-picker>
+	</view>
+</template>
+
+<script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
+	import mpvueCityPicker from '@/pages_borrow_books/components/mpvue-citypicker/mpvueCityPicker.vue'
+	export default {
+		components: {
+			mpvueCityPicker
+		},
+		computed: {
+			...mapState(['token', 'userinfo', 'login'])
+		},
+		data() {
+			return {
+				editType: 'edit',
+				addressId: 0,
+				id: '',
+				name: '',
+				tel: '',
+				detailed: '',
+				isDefault: false,
+				cityPickerValue: [0, 0, 1],
+				themeColor: '#574ef5',
+				region: {
+					label: "请点击选择地址",
+					value: [],
+					cityCode: ""
+				},
+				formData: {
+					company: "", //公司
+					name: "", //姓名
+					province: "", //省
+					city: "", //市
+					district: "", //县
+					detailAddress: "", //详细地址
+					post: "", //邮政编码
+					phoneNumber: "", //手机号
+					isMain: false, //是否为默认地址
+				}
+			};
+		},
+		methods: {
+			onCancel(e) {
+				console.log(e)
+			},
+			chooseCity() {
+				this.$refs.mpvueCityPicker.show()
+			},
+			onConfirm(e) {
+				this.region = e;
+				this.cityPickerValue = e.value;
+			},
+			isDefaultChange(e) {
+				this.formData.isMain = e.detail.value;
+			},
+			del() {
+				const that = this
+				uni.showModal({
+					title: '删除提示',
+					content: '你将删除这个收货地址',
+					success: (res) => {
+						if (res.confirm) {
+							/*deleteAddressById*/
+							app.myRequest({
+								url: "address/deleteAddressById",
+								type: "POST",
+								data: {
+									addressId: that.addressId
+								}
+							}).then(res => {
+								uni.navigateBack();
+							})
+						} else if (res.cancel) {
+							console.log('用户点击取消');
+						}
+					}
+				});
+
+			},
+			save() {
+				let data = this.formData
+				let [province, city, district] = this.region.label.split("-")
+				data.province = province
+				data.city = city
+				data.district = district
+				if (this.editType == 'edit') {
+					data.id = this.id
+				}
+				if (!data.name) {
+					uni.showToast({
+						title: '请输入收件人姓名',
+						icon: 'none'
+					});
+					return;
+				}
+				if (!data.phoneNumber) {
+					uni.showToast({
+						title: '请输入收件人电话号码',
+						icon: 'none'
+					});
+					return;
+				}
+				if (!data.detailAddress) {
+					uni.showToast({
+						title: '请输入收件人详细地址',
+						icon: 'none'
+					});
+					return;
+				}
+				if (!data.district) {
+					uni.showToast({
+						title: '请选择收件地址',
+						icon: 'none'
+					});
+					return;
+				}
+				console.log("编辑的数据", data)
+				if (this.editType == 'edit') {
+					this.updateAddress({ ...data,
+						addressId: this.addressId
+					})
+				} else {
+					this.addAddress(data)
+				}
+				//实际应用中请提交ajax,模板定时器模拟提交效果
+				// setTimeout(()=>{
+				// 	uni.setStorage({
+				// 		key:'saveAddress',
+				// 		data:data,
+				// 		success() {
+
+				// 			// uni.hideLoading();
+				// 			// uni.navigateBack();
+				// 		}
+				// 	})
+				// },300)
+			},
+			//信息
+			addAddress(data) {
+				var that = this;
+				app.myRequest({
+					url: "address/addAddress",
+					type: "POST",
+					data: data
+				}).then(res => {
+					console.log(res);
+					this.$u.toast("添加成功！")
+					uni.navigateBack();
+				}).catch(err => {
+					this.$u.toast("添加失败！")
+				})
+			},
+			updateAddress(data) {
+				app.myRequest({
+					url: "address/updateAddress",
+					type: "POST",
+					data: data
+				}).then(res => {
+					console.log(res);
+					this.$u.toast("修改成功！")
+					uni.navigateBack();
+				}).catch(err => {
+					this.$u.toast("修改失败！")
+				})
+			},
+			//提示框
+			showModal(val) {
+				uni.showToast({
+					title: val,
+					icon: 'none'
+				});
+			},
+			// async addAddress(data){
+			// 	var that = this;
+			// 	let tmp = JSON.stringify(data)
+			// 	var params = {
+			// 		url: "address/addAddress",
+			// 		type: 'POST',
+			// 		data: {
+			// 			data:tmp,
+			// 			readerId1:that.userinfo.readerId,
+			// 		}
+			// 	}
+			// 	const res = await app.myRequest(params);
+			// 	console.log("后台传来的数据：",res)
+			// },
+		},
+		onLoad(e) {
+			//获取传递过来的参数
+			console.log("e===", e)
+			this.editType = e.type;
+			this.addressId = e.id;
+			if (e.type == 'edit') {
+				// uni.getStorage({
+				// 	key:'address',
+				// 	success: (e) => {
+				// 		this.id = e.data.id;
+				// 		this.name = e.data.name;
+				// 		this.tel = e.data.tel;
+				// 		this.detailed = e.data.address.detailed;
+				// 		this.isDefault = e.data.isDefault;
+				// 		this.cityPickerValue = e.data.address.region.value;
+				// 		this.region = e.data.address.region;
+				// 	}
+				// })
+
+				//获取当前地址信息，填充为默认值
+				app.myRequest({
+					url: "address/getAddressById",
+					type: "GET",
+					data: {
+						addressId: this.addressId
+					}
+				}).then(res => {
+					console.log(res);
+					let {
+						province,
+						city,
+						district
+					} = res;
+					this.region.label = `${province}-${city}-${district}`
+					this.formData.company = res.company
+					this.formData.name = res.name
+					this.formData.province = res.province
+					this.formData.city = res.city
+					this.formData.district = res.district
+					this.formData.detailAddress = res.detailAddress
+					this.formData.post = res.post
+					this.formData.phoneNumber = res.phoneNumber
+					this.formData.isMain = res.isMain
+				})
+			}
+		},
+		onBackPress() {
+			if (this.$refs.mpvueCityPicker.showPicker) {
+				this.$refs.mpvueCityPicker.pickerCancel();
+				return true;
+			}
+		},
+		onUnload() {
+			if (this.$refs.mpvueCityPicker.showPicker) {
+				this.$refs.mpvueCityPicker.pickerCancel()
+			}
+		},
+		created() {}
+	};
+</script>
+<style lang="scss">
+	.save {
+		view {
+			display: flex;
+		}
+
+		position: fixed;
+		bottom: 0;
+		width: 100%;
+		height: 120upx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+
+		.btn {
+			// box-shadow: 0upx 5upx 10upx rgba(0, 0, 0, 0.4);
+			width: 100%;
+			height: 80upx;
+			border-radius: 5upx;
+			background-color: #574ef5;
+			color: #fff;
+			justify-content: center;
+			align-items: center;
+
+			// .icon {
+			// 	height: 80upx;
+			// 	color: #fff;
+			// 	font-size: 30upx;
+			// 	justify-content: center;
+			// 	align-items: center;
+			// }
+
+			font-size: 30upx;
+		}
+	}
+
+	.content {
+		display: flex;
+		flex-wrap: wrap;
+
+		view {
+			display: flex;
+		}
+
+		.row {
+			width: 94%;
+
+			margin: 0 3%;
+			border-top: solid 1upx #eee;
+
+			.nominal {
+				width: 30%;
+				height: 120upx;
+				font-weight: 200;
+				font-size: 30upx;
+				align-items: center;
+			}
+
+			.input {
+				width: 70%;
+				padding: 20upx 0;
+				align-items: center;
+				font-size: 30upx;
+
+				&.switch {
+					justify-content: flex-end;
+				}
+
+				.textarea {
+					margin: 20upx 0;
+					min-height: 120upx;
+				}
+			}
+
+			.del {
+				width: 100%;
+				height: 100upx;
+				justify-content: center;
+				align-items: center;
+				font-size: 36upx;
+				color: #574ef5;
+				background-color: rgba(255, 0, 0, 0.05);
+				border-bottom: solid 1upx #eee;
+			}
+		}
+	}
+</style>
diff --git a/pages_borrow_books/pages/allOrders/index.vue b/pages_borrow_books/pages/allOrders/index.vue
index 5326ea49bca0f105dbf1e8f1be68c7aafa40ae8f..7dc32a4493ccfbad04e799fb83681deb15f6011d 100644
--- a/pages_borrow_books/pages/allOrders/index.vue
+++ b/pages_borrow_books/pages/allOrders/index.vue
@@ -1,5 +1,13 @@
 <template>
 	<view>
+		<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="预约" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<view class="container">
 			<scroll-view 
 			class="scroll-container" 
@@ -56,6 +64,9 @@
 	export default {
 		data() {
 			return {
+				background: {
+					background: "#6C40F3",
+				},
 				currentId:'',/* 控制被选中 */
 				brands:[
 					'线上预约中',
diff --git a/pages_borrow_books/pages/appointment/abolish.vue b/pages_borrow_books/pages/appointment/abolish.vue
index ee3624164662bec27ba189e8bf758253e01cd2b2..d08106f7beab66964f09bf6fd4823eff30826234 100644
--- a/pages_borrow_books/pages/appointment/abolish.vue
+++ b/pages_borrow_books/pages/appointment/abolish.vue
@@ -1,211 +1,281 @@
 <template>
-	<view class="show">
-		<!-- 顶部 -->
-		
-		<!-- 顶部 -->
-		<view class="mid" style="  opacity:1;">
-			<view class="midone">
-				<view class="">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 206rpx; height: 258rpx;"></image>
-				</view>
-				<view>
-					<view class="book-name">书的名字</view>
-					<view class="s1">作者：
-						<view class="s6">汪魏青</view>
-					</view>
-					<view class="s2">出版社：浙江大学出版社</view>
-					<view class="s7">
-						<view class="s4">广东省立中山图书馆馆藏，广东中山图书馆
-						</view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="s8">
-				<!-- 分割线br -->
-				<view class="br"></view>
-				<view class="dt">
-					<view class="tishi">温馨提示：</view>
-					<view class="texts">
-						进入到线下交易环节的订单将不能取消预约。取消预约将影响您在“书易”的信誉
-					</view>
+  <view class="show">
+<!-- 顶部部分 -->
+		<u-navbar zhead="65rpx" height="44" title="取消预约" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
 				</view>
 			</view>
-			
-		</view>
-		
-		<view>
-			<button class="confirm-btn">确定取消</button>
-		</view>
-		
-		
-		
-	</view>
-</template>
+		</u-navbar>
+    <!-- 顶部 -->
+    <view class="mid" style="opacity: 1">
+      <view class="midone">
+        <view class="">
+          <image class="imag" :src="book.picturePath" @error="imageError()" style="width: 206rpx; height: 258rpx"></image>
+        </view>
+        <view>
+          <view class="book-name">{{(bookName(book.bookName) >13) ? book.bookName.substring(0,13)+'...' : book.bookName}}</view>
+          <view class="s1">作者：
+            <view class="s6">{{book.author}}</view>
+          </view>
+          <view class="s2">出版社：{{book.publisher}}</view>
+          <view class="s7">
+            <view class="s4">出版年：{{book.publisherYear}}</view>
+          </view>
+        </view>
+      </view>
 
-<script></script>
+      <view class="s8">
+        <!-- 分割线br -->
+        <view class="br"></view>
+        <view class="dt">
+          <view class="tishi">温馨提示：</view>
+          <view class="texts">
+            进入到线下交易环节的订单将不能取消预约。取消预约将影响您在“书易”的信誉
+          </view>
+        </view>
+      </view>
+    </view>
 
-<style>
+    <view>
+      <button class="confirm-btn" @click="getReserveListId(getReservetId())">确定取消</button>
+    </view>
+  </view>
+</template>
+
+<script>
+	let app = getApp();
+	export default {
+	  data() {
+		return {
+			background: {
+				background: "#6C40F3",
+			},
+			"book":[],
+			"reservetId": ""
+		};
+	  },
 	
-.confirm-btn{
-	margin-top: 270rpx;
-	color: #FFFFFF;
-	background-color: #5E49F5;
-	height: 90rpx;
-	border-radius: 0;
-}
-.book-name{
-	font-size: 36rpx;
-	margin-top: -80rpx;
-	color: #333333;
-}	
+	  onLoad(e) {
+		  console.log(e)
+		  this.getReservetId(e.reserveListId);
+		  this.reservetId = e.reserveListId;
+		  this.getBookByBookId(e.bookId); //查询图书信息
+	  },
 	
+	  methods: {
+		  //根据bookId获取图书详情
+		  async getBookByBookId(e) {
+		  	var that = this;
+		  	var params = {
+		  		url: "book?bookId=" + e,
+		  		type: 'GET'
+		  	}
+		  	const res = await app.myRequest(params);
+		  	that.book = res.content[0];
+		  	console.log(res.content[0]);
+		  },
+		  //根据reserveListId进行取消预约图书
+		  async getReserveListId(e) {
+		  	var that = this;
+		  	var params = {
+		  		url: "reserveList/cancelReserve?reserveListId=" + e,
+		  		type: 'GET'
+		  	}
+		  	const res = await app.myRequest(params);
+		  	if(res==true){
+				uni.redirectTo({
+					url: '/pages_borrow_books/pages/appointment/appointment'
+				})
+				uni.showToast({
+					icon: 'none',
+					title: '取消预约成功！'
+				})
+			}else{
+				uni.redirectTo({
+					url: '/pages_borrow_books/pages/appointment/appointment'
+				})
+				uni.showToast({
+					icon: 'none',
+					title: '取消预约失败！'
+				})
+			}
+		  },
+		  //获取预约id
+		  getReservetId(e){
+			  if(e== null){
+				  e = this.reservetId
+			  }
+			  return e ;
+		},
+		//图片加载不出来
+		imageError(){
+			let that = this;
+			// console.log(index)
+			that.book.picturePath = "/static/images/temporary.jpg"
+		},
+		bookName:function(e){
+			var e1 = e + " ";			
+			return e1.length;
+			},
+	  }
+	};
+</script>
+
+<style>
+.confirm-btn {
+  margin-top: 270rpx;
+  color: #ffffff;
+  background-color: #5e49f5;
+  height: 90rpx;
+  border-radius: 0;
+}
+.book-name {
+  font-size: 36rpx;
+  margin-top: -80rpx;
+  color: #333333;
+}
+
 .br {
-		/* margin-top: 10rpx; */
-		/* width: 100%; */
-		height: 1rpx;
-		background-color: #FF8726;
-	}
-.show{
-	/* margin-bottom: auto; */
-	width: auto;
-	height: auto;
-	/* background-color: #F8F8F8; */
-}
-.mid {	
-	/* margin-top:20rpx; */
-	width: 100%;
-	height: 480rpx;
-}
-.zt1{
-	color: #555555;
-	font-size: 26rpx;
-	margin-left: 30rpx;
-	line-height: center;
-	/* margin-top: 20rpx; */
-}
-.zt{
-	height: 50rpx;
-	display: flex;
-	align-items: center;
-	
+  /* margin-top: 10rpx; */
+  /* width: 100%; */
+  height: 1rpx;
+  background-color: #ff8726;
+}
+.show {
+  /* margin-bottom: auto; */
+  width: auto;
+  height: auto;
+  /* background-color: #F8F8F8; */
+}
+.mid {
+  /* margin-top:20rpx; */
+  width: 100%;
+  height: 480rpx;
+}
+.zt1 {
+  color: #555555;
+  font-size: 26rpx;
+  margin-left: 30rpx;
+  line-height: center;
+  /* margin-top: 20rpx; */
+}
+.zt {
+  height: 50rpx;
+  display: flex;
+  align-items: center;
 }
 .midone {
-	width: 90%;
-	height: 300rpx;
-	font-size: 30rpx;
-	margin-top: 20rpx;
-	align-items: center;
-	display: flex;
+  width: 90%;
+  height: 300rpx;
+  font-size: 30rpx;
+  margin-top: 20rpx;
+  align-items: center;
+  display: flex;
 }
 
-.imag{
-	margin-left:30rpx;
+.imag {
+  margin-left: 30rpx;
 }
 
-.s1{
-	font-size: 20rpx;
-	margin-top: 5rpx;
-	height:35rpx;
-	align-items: center;
-	color: #999999;
-	display: flex;
-}
-.s2{
-	font-size: 20rpx;
-	height:35rpx;
-	margin-top: 5rpx;
-	align-items: center;
-	color: #999999;
-}
-.s4{
-	font-size: 20rpx;
-	height:35rpx;
-	margin-top: 5rpx;
-	align-items: center;
-	color: #999999;
+.s1 {
+  font-size: 20rpx;
+  margin-top: 5rpx;
+  height: 35rpx;
+  align-items: center;
+  color: #999999;
+  display: flex;
 }
-
-.s6{
-	color: #999999;
-	
+.s2 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 5rpx;
+  align-items: center;
+  color: #999999;
+}
+.s4 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 5rpx;
+  align-items: center;
+  color: #999999;
 }
 
-.s7{
-	height:35rpx;
-	align-items: center;
-	width: auto;
-	/* display: flex; */
+.s6 {
+  color: #999999;
 }
 
-.s8{
-	background-color: #F7E7C5;
-	height: 160rpx;
-	opacity:30%;
-	/* display: flex; */
-}
-.dt{
-	margin-top: 20rpx;
-	margin-left: 30rpx;
-	font-size: 30rpx;
-	
-	
-	/* margin-bottom: 20rpx; */
-	/* display: flex; */
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  /* display: flex; */
 }
 
-.tishi{
-	margin-top: 10rpx;
-	margin-left: 30rpx;
-	font-size: 30rpx;
-	color: #FF8726;
-	margin-bottom: 20rpx;
-	/* display: flex; */
-}
-.texts{
-	/* margin-top: 20rpx; */
-	margin-left: 30rpx;
-	font-size: 24rpx;
-	color: #FF8726;
-	margin-bottom: 20rpx;
-}
-.ti{
-	color: #999999;
-	margin-top: 30rpx;
-	font-size: 23rpx;
-	margin-left: 230rpx;
+.s8 {
+  background-color: #f7e7c5;
+  height: 160rpx;
+  opacity: 30%;
+  /* display: flex; */
 }
+.dt {
+  margin-top: 20rpx;
+  margin-left: 30rpx;
+  font-size: 30rpx;
 
+  /* margin-bottom: 20rpx; */
+  /* display: flex; */
+}
 
+.tishi {
+  margin-top: 10rpx;
+  margin-left: 30rpx;
+  font-size: 30rpx;
+  color: #ff8726;
+  margin-bottom: 20rpx;
+  /* display: flex; */
+}
+.texts {
+  /* margin-top: 20rpx; */
+  margin-left: 30rpx;
+  font-size: 24rpx;
+  color: #ff8726;
+  margin-bottom: 20rpx;
+}
+.ti {
+  color: #999999;
+  margin-top: 30rpx;
+  font-size: 23rpx;
+  margin-left: 230rpx;
+}
 
-.wz{
-	font-size: 28rpx;
-	margin-top: 8rpx;
-	height: 90rpx;
-	
+.wz {
+  font-size: 28rpx;
+  margin-top: 8rpx;
+  height: 90rpx;
 }
 .shumu {
-	font-size: 25rpx;
-	margin-top: -130rpx;
-	color:   #999999;
-	width: 120rpx;
-	display: block;
-}
-.shumuone{
-	font-size: 25rpx;
-	color: #999999;
-	/* background-color: #4CD964; */
-}
-.shumutwo{
-	margin-left: 250rpx;
-	font-size: 20rpx;
-	color:  #999999;
-	margin-top: -30rpx;
-}
-.shumuthree{
-	margin-top: 10rpx;
-	font-size: 25rpx;
-	color: #999999;
+  font-size: 25rpx;
+  margin-top: -130rpx;
+  color: #999999;
+  width: 120rpx;
+  display: block;
+}
+.shumuone {
+  font-size: 25rpx;
+  color: #999999;
+  /* background-color: #4CD964; */
+}
+.shumutwo {
+  margin-left: 250rpx;
+  font-size: 20rpx;
+  color: #999999;
+  margin-top: -30rpx;
+}
+.shumuthree {
+  margin-top: 10rpx;
+  font-size: 25rpx;
+  color: #999999;
 }
-
 </style>
diff --git a/pages_borrow_books/pages/appointment/appointment.vue b/pages_borrow_books/pages/appointment/appointment.vue
index 5c807947a8391d616b42c27647e2392386cf7508..eafaa0df05f94ae8fcecda14bc86c77d2f67b03f 100644
--- a/pages_borrow_books/pages/appointment/appointment.vue
+++ b/pages_borrow_books/pages/appointment/appointment.vue
@@ -1,321 +1,363 @@
 <template>
-	<view class="show">
-		<!-- 顶部 -->
-		
-		<!-- 顶部 -->
-		<view class="mid" >
-			<view class="zt" style=" background-color: #F8F8F8;  opacity:1;">
-				<view class="zt1">
-					线下物流配送中
-				</view>
-				<!-- <view style="color: #808080;">156487912</view> -->
+  <view class="show">
+    <!-- 顶部 -->
+
+    <!-- 顶部 -->
+	<view v-if="BookSuccess.length > 0">
+		<view class="mid">
+		  <view class="zt" style="background-color: #f8f8f8; opacity: 1;">
+			<view class="zt1"> 线下物流配送中 </view>
+			<!-- <view style="color: #808080;">156487912</view> -->
+		  </view>
+
+		  <view class="midone" v-for="(item,index) in BookSuccess" :key="index">
+			<view class="">
+			  <image class="imag" :src="item.realBook.book.picturePath" @error="imageError()" style="width: 206rpx; height: 258rpx;margin-top: 70rpx;"></image>
 			</view>
-			
-			<view class="midone">
-				<view class="">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 206rpx; height: 258rpx;"></image>
+			<view class="rightPart">
+			  <view class="book-name">{{(bookName(item.realBook.book.bookName) >13) ? item.realBook.book.bookName.substring(0,13)+'...' : item.realBook.book.bookName}}</view>
+			  <view class="s1">预约时间：
+				<view class="s6">{{happenTimeFun(item.reserveTime)}}</view>
+			  </view>
+			  <view class="s2">持书人：
+				<view class="">{{item.holderName}}</view>
+			  </view>
+			  <view class="s7">
+				<view class="s4">应还时间：无 
+				  <!-- <view class="">无</view> -->
 				</view>
-				<view>
-					<view class="book-name">书的名字</view>
-					<view class="s1">预约时间：
-						<view class="s6">2018-08-20</view>
-					</view>
-					<view class="s2">持书人：
-						<view class="">省中山图书馆</view>
-					</view>
-					<view class="s7">
-						<view class="s4">应还时间：无
-							<!-- <view class="">无</view> -->
-						</view>
-					</view>
-					<view class="s2">当前状态：
-						<view class="">线下交易中，物流配送中</view>
-					</view>
-					<view class="btns">
-						<navigator url="contact-booking-agent">
-							<view class="one">
-								<view  style="margin-left: 10rpx; margin-top: 5rpx;">联系持有人</view>
-							</view>
-						</navigator>
-						<navigator url="confirm">
-							<view class="two">
-								<view  style="margin-left: 20rpx; margin-top: 5rpx;">确认收货</view>
-							</view>
-						</navigator>
-						<view class="three">
-							<navigator url="./logistics">
-							<view  style="margin-left: 20rpx; margin-top: 5rpx;">查看物流</view>
-							</navigator>
-				</view>
-					</view>
-				</view>
-			</view>
-			
-			<!-- 分割线br -->
-			<view class="br"></view>
+			  </view>
+			  <view class="s2">当前状态：
+				<view class="">线下交易中</view>
+			  </view>
+			  <view class="btns">
+				  <view class="one" @click="contactOrderAgent">
+					<view style="margin-left: 10rpx; margin-top: 5rpx">联系持有人</view>
+				  </view>
 			
-			
-			<view class="midone">
-				<view class="">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 206rpx; height: 258rpx;"></image>
-				</view>
-				<view>
-					<view class="book-name">书的名字</view>
-					<view class="s1">预约时间：
-						<view class="s6">2018-08-20</view>
-					</view>
-					<view class="s2">持书人：
-						<view class="">省中山图书馆</view>
-					</view>
-					<view class="s7">
-						<view class="s4">应还时间：无
-							<!-- <view class="">无</view> -->
-						</view>
-					</view>
-					<view class="s2">当前状态：
-						<view class="">线下交易中，物流配送中</view>
-					</view>
-					<view class="btns">
-						<navigator url="contact-booking-agent">
-							<view class="one">
-								<view  style="margin-left: 10rpx; margin-top: 5rpx;">联系持有人</view>
-							</view>
-						</navigator>
-						<view class="two1">
-							<view  style="margin-left: 20rpx; margin-top: 5rpx;">确认收货</view>
-						</view>
-						<view class="three">
-							<view  style="margin-left: 20rpx; margin-top: 5rpx;">查看物流</view>
-						</view>
-					</view>
+				  <view class="two" @click="confirm(item.realBook.bookId)">
+					<view style="margin-left: 20rpx; margin-top: 5rpx">确认收货</view>
+				  </view>
+				
+				<view class="three" @click="seeLogistics(item.realBook.bookId)">
+				  
+					<view style="margin-left: 20rpx; margin-top: 5rpx">查看物流</view>
+				  
 				</view>
+			  </view>
 			</view>
-			
-			<!-- 线上预约中 -->
-			<view class="zt" style=" background-color: #F8F8F8;  opacity:1;">
-				<view class="zt1">
-					线上预约中
-				</view>
-				<!-- <view style="color: #808080;">156487912</view> -->
+		  </view>
+	</view>
+      <!-- 线上预约中 -->
+	  <view v-if="BookReserving.length > 0">
+		<view class="mid">
+		  <view class="zt" style="background-color: #f8f8f8; opacity: 1;">
+			<view class="zt1"> 线上预约中 </view>
+			<!-- <view style="color: #808080;">156487912</view> -->
+		  </view>
+		  <view class="midone" v-for="(item,index) in realBook" :key="index">
+			<view class="">
+			  <image class="imag" :src="item.realBook.book.picturePath" @error="imageError()" style="width: 206rpx; height: 258rpx;margin-top: 70rpx;"></image>
 			</view>
-			<view class="midone">
-				<view class="">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 206rpx; height: 258rpx;"></image>
-				</view>
-				<view>
-					<view class="book-name">书的名字</view>
-					<view class="s1">预约时间：
-						<view class="s6">2018-08-20</view>
-					</view>
-					<view class="s2">持书人：
-						<view class="">省中山图书馆</view>
-					</view>
-					<view class="s7">
-						<view class="s4">应还时间：无
-							<!-- <view class="">无</view> -->
-						</view>
-					</view>
-					<view class="s2">当前状态：
-						<view class="">线下交易中，物流配送中</view>
-					</view>
-					<view class="btns">
-						<navigator url="abolish">
-							<view class="one">
-								<view  style="margin-left: 20rpx; margin-top: 5rpx;">取消预约</view>
-							</view>
-						</navigator>
-					</view>
+			<view class="rightPart">
+			  <view class="book-name">{{(bookName(item.realBook.book.bookName) >13) ? item.realBook.book.bookName.substring(0,13)+'...' : item.realBook.book.bookName}}</view>
+			  <view class="s1">预约时间：
+				<view class="s6">{{happenTimeFun(item.reserveTime)}}</view>
+			  </view>
+			  <view class="s2">持书人：
+				<view class="">省中山图书馆</view>
+			  </view>
+			  <view class="s7">
+				<view class="s4">应还时间：无
+				  <!-- <view class="">无</view> -->
 				</view>
+			  </view>
+			  <view class="s2">当前状态：
+				<view class="">线上预约中</view>
+			  </view>
+			  <view class="btns">
+				  <view class="one" @click="cancelReserve(item.realBook.bookId)">
+					<view style="margin-left: 20rpx; margin-top: 5rpx">取消预约</view>
+				  </view>
+			  </view>
 			</view>
-			<!-- 分割线br -->
-			<view class="br"></view>
-			
 		</view>
-	</view>
+      </view>
+	  </view>
+      <!-- 分割线br -->
+      <view class="br"></view>
+	  <view v-if="realBook.length == 0" @click="toBorrow()" >
+	   	您还没有记录，<span style="color: #00AAFF;">快去预约书吧!</span>
+	   </view>
+    </view>
+  </view>
 </template>
-<!-- <script></script> -->
+<script>
+	let app = getApp();
+	export default {
+	  data() {
+	    return {
+			background: {
+				background: "#6C40F3",
+			},
+			realBook : [],
+			BookReserving : [], //预约中的书籍
+			BookSuccess : [] //预约成功的书籍
+		};
+	  },
+	  onShow(){
+		  this.getSureReturn0();
+	  },
+
+	  methods: {
+	    cl(e) {
+	      uni.showModal({
+	        title: "温馨提示",
+	        style: "color:#494949;font-size: 30rpx;border-radius: 20rpx;",
+	        content: "确认读完后将无法取消，其他人将可以在系统上向你借书",
+
+	        success: function (res) {
+	          if (res.confirm) {
+	            console.log("确认");
+
+
+	          } else if (res.cancel) {
+	            console.log("取消");
+	          }
+	        },
+	      });
+	    },
+		cancelReserve(e){
+			uni.navigateTo({
+				url: '/pages_borrow_books/pages/appointment/abolish?bookId=' + e
+			})
+		},
+		async getSureReturn0(){
+			var that = this;
+			let bookInfoList = [];
+			var params = {
+				url: "reserveList/getReserveByStatus",
+				type: 'GET',
+				data: {
+					"status":0
+
+				}
+			}
+			const res = await app.myRequest(params);
+			that.realBook = res;
+			console.log("res",res)
+		},
+		//图片加载不出来
+		imageError(){
+			let that = this;
+			// console.log(index)
+			that.book.picturePath = "/static/images/temporary.jpg"
+		},
+		//去借书
+		toBorrow(){
+			uni.switchTab({
+			    url: '/pages/main/main'
+			});
+		},
+		bookName:function(e){
+			var e1 = e + " ";
+			return e1.length;
+			},
+		happenTimeFun(num){//时间戳数据处理
+			 let date = new Date(num);
+			 //时间戳为10位需*1000，时间戳为13位的话不需乘1000
+			 let y = date.getFullYear();
+			 let MM = date.getMonth() + 1;
+			 MM = MM < 10 ? ('0' + MM) : MM;//月补0
+			 let d = date.getDate();
+			 d = d < 10 ? ('0' + d) : d;//天补0
+			 let h = date.getHours();
+			 h = h < 10 ? ('0' + h) : h;//小时补0
+			 let m = date.getMinutes();
+			 m = m < 10 ? ('0' + m) : m;//分钟补0
+			 let s = date.getSeconds();
+			 s = s < 10 ? ('0' + s) : s;//秒补0
+			 return y + '-' + MM + '-' + d; //年月日
+		 },
+	  }
+	};
+</script>
 
 <style>
-	
-.book-name{
-	font-size: 36rpx;
-	margin-top: -20rpx;
-	color: #333333;
-}	
-	
+.book-name {
+  font-size: 36rpx;
+  margin-top: -20rpx;
+  color: #333333;
+}
+.rightPart{
+	margin-left: 20rpx;
+}
 .br {
-		margin-top: 10rpx;
-		/* width: 100%; */
-		height: 1rpx;
-		background-color: #EEEEEE;
-	}
-.show{
-	/* margin-bottom: auto; */
-	width: auto;
-	height: auto;
-	/* background-color: #F8F8F8; */
+  margin-top: 10rpx;
+  /* width: 100%; */
+  height: 1rpx;
+  background-color: #eeeeee;
 }
-.mid {	
-	/* margin-top:20rpx; */
-	width: 100%;
-	height: 480rpx;
+.show {
+  /* margin-bottom: auto; */
+  width: auto;
+  height: auto;
+  background-color: #FFFFFF;
 }
-.zt1{
-	color: #555555;
-	font-size: 26rpx;
-	margin-left: 30rpx;
-	line-height: center;
-	color: #646464;
+.mid {
+  /* margin-top:20rpx; */
+  width: 100%;
+  height: 480rpx;
 }
-.zt{
-	height: 70rpx;
-	display: flex;
-	align-items: center;
-	
+.zt1 {
+  color: #555555;
+  font-size: 26rpx;
+  margin-left: 30rpx;
+  line-height: center;
+  color: #646464;
+}
+.zt {
+  height: 70rpx;
+  display: flex;
+  align-items: center;
 }
 .midone {
-	width: 90%;
-	height: 300rpx;
-	font-size: 30rpx;
-	margin-top: 20rpx;
-	align-items: center;
-	display: flex;
+  width: 90%;
+  height: 300rpx;
+  font-size: 30rpx;
+  margin-top: 20rpx;
+  align-items: center;
+  display: flex;
 }
 
-.imag{
-	margin-left:30rpx;
+.imag {
+  margin-left: 30rpx;
+  /* margin-bottom: 50rpx; */
 }
 
-.s1{
-	font-size: 24rpx;
-	margin-top: 5rpx;
-	height:35rpx;
-	align-items: center;
-	color: #999999;
-	display: flex;
+.s1 {
+  font-size: 24rpx;
+  margin-top: 5rpx;
+  height: 35rpx;
+  align-items: center;
+  color: #999999;
+  display: flex;
 }
-.s2{
-	font-size: 24rpx;
-	height:35rpx;
-	margin-top: 5rpx;
-	align-items: center;
-	color: #999999;
-	display: flex;
+.s2 {
+  font-size: 24rpx;
+  height: 35rpx;
+  margin-top: 5rpx;
+  align-items: center;
+  color: #999999;
+  display: flex;
 }
-.btns{
-	font-size: 24rpx;
-	height:35rpx;
-	margin-top: 20rpx;
-	align-items: center;
-	color: #999999;
-	display: flex;
-	
+.btns {
+  font-size: 24rpx;
+  height: 35rpx;
+  margin-top: 30rpx;
+  align-items: center;
+  color: #999999;
+  display: flex;
 }
-.one{
-	background-color: #EBEBEB;
-	height: 45rpx;
-	width: 140rpx;
-	border-radius: 22rpx;
-	opacity:1;
+.one {
+  background-color: #ebebeb;
+  height: 45rpx;
+  width: 140rpx;
+  border-radius: 22rpx;
+  opacity: 1;
 }
-.two{
-	background-color: #5E49F5;
-	color: #FFFFFF;
-	height: 45rpx;
-	width: 140rpx;
-	margin-left: 20rpx;
-	border-radius: 22rpx;
-	opacity:1;
+.two {
+  background-color: #5e49f5;
+  color: #ffffff;
+  height: 45rpx;
+  width: 140rpx;
+  margin-left: 20rpx;
+  border-radius: 22rpx;
+  opacity: 1;
 }
 
-.two1{
-	background-color: #EBEBEB;
-	/* color: #FFFFFF; */
-	height: 45rpx;
-	width: 140rpx;
-	margin-left: 20rpx;
-	border-radius: 22rpx;
-	opacity:100%;
+.two1 {
+  background-color: #ebebeb;
+  /* color: #FFFFFF; */
+  height: 45rpx;
+  width: 140rpx;
+  margin-left: 20rpx;
+  border-radius: 22rpx;
+  opacity: 100%;
 }
 
-.three{
-	background-color: #EBEBEB;
-	height: 45rpx;
-	width: 140rpx;
-	margin-left: 20rpx;
-	border-radius: 22rpx;
-	opacity:1;
+.three {
+  background-color: #ebebeb;
+  height: 45rpx;
+  width: 140rpx;
+  margin-left: 20rpx;
+  border-radius: 22rpx;
+  opacity: 1;
 }
 
-.s4{
-	font-size: 24rpx;
-	height:35rpx;
-	margin-top: 5rpx;
-	align-items: center;
-	color: #999999;
+.s4 {
+  font-size: 24rpx;
+  height: 35rpx;
+  margin-top: 5rpx;
+  align-items: center;
+  color: #999999;
 }
 
-.s6{
-	color: #999999;
-	
+.s6 {
+  color: #999999;
 }
 
-.s7{
-	height:35rpx;
-	align-items: center;
-	width: auto;
-	display: flex;
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  display: flex;
 }
 
-.s8{
-	
-	display: flex;
+.s8 {
+  display: flex;
 }
-.dt{
-	margin-top: 20rpx;
-	margin-left: 30rpx;
-	font-size: 26rpx;
-	color: #555555;
-	margin-bottom: 20rpx;
-	display: flex;
+.dt {
+  margin-top: 20rpx;
+  margin-left: 30rpx;
+  font-size: 26rpx;
+  color: #555555;
+  margin-bottom: 20rpx;
+  display: flex;
 }
-.ti{
-	color: #999999;
-	margin-top: 30rpx;
-	font-size: 23rpx;
-	margin-left: 230rpx;
+.ti {
+  color: #999999;
+  margin-top: 30rpx;
+  font-size: 23rpx;
+  margin-left: 230rpx;
 }
 
-
-
-.wz{
-	font-size: 28rpx;
-	margin-top: 8rpx;
-	height: 90rpx;
-	
+.wz {
+  font-size: 28rpx;
+  margin-top: 8rpx;
+  height: 90rpx;
 }
 .shumu {
-	font-size: 25rpx;
-	margin-top: -130rpx;
-	color:   #999999;
-	width: 120rpx;
-	display: block;
+  font-size: 25rpx;
+  margin-top: -130rpx;
+  color: #999999;
+  width: 120rpx;
+  display: block;
 }
-.shumuone{
-	font-size: 25rpx;
-	color: #999999;
-	/* background-color: #4CD964; */
+.shumuone {
+  font-size: 25rpx;
+  color: #999999;
+  /* background-color: #4CD964; */
 }
-.shumutwo{
-	margin-left: 250rpx;
-	font-size: 20rpx;
-	color:  #999999;
-	margin-top: -30rpx;
+.shumutwo {
+  margin-left: 250rpx;
+  font-size: 20rpx;
+  color: #999999;
+  margin-top: -30rpx;
 }
-.shumuthree{
-	margin-top: 10rpx;
-	font-size: 25rpx;
-	color: #999999;
+.shumuthree {
+  margin-top: 10rpx;
+  font-size: 25rpx;
+  color: #999999;
 }
-
 </style>
diff --git a/pages_borrow_books/pages/appointment/confirm.vue b/pages_borrow_books/pages/appointment/confirm.vue
index a8a7063fd5362cefe06abe4ba0c658092c1f6da7..c4eca6a4afa30c7d5fec1ecc6208611c31a8a4db 100644
--- a/pages_borrow_books/pages/appointment/confirm.vue
+++ b/pages_borrow_books/pages/appointment/confirm.vue
@@ -1,211 +1,244 @@
 <template>
-	<view class="show">
-		<!-- 顶部 -->
-		
-		<!-- 顶部 -->
-		<view class="mid" style="  opacity:1;">
-			<view class="midone">
-				<view class="">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 206rpx; height: 258rpx;"></image>
-				</view>
-				<view>
-					<view class="book-name">书的名字</view>
-					<view class="s1">作者：
-						<view class="s6">汪魏青</view>
-					</view>
-					<view class="s2">出版社：浙江大学出版社</view>
-					<view class="s7">
-						<view class="s4">广东省立中山图书馆馆藏，广东中山图书馆
-						</view>
-					</view>
-				</view>
-			</view>
-			
-			<view class="s8">
-				<!-- 分割线br -->
-				<view class="br"></view>
-				<view class="dt">
-					<view class="tishi">温馨提示：</view>
-					<view class="texts">
-						确认收货之前，请仔细检查包装是否完好？图书是否污损？图书是否就是您要借的书？
-					</view>
-				</view>
-			</view>
-			
-		</view>
-		
-		<view>
-			<button class="confirm-btn">确定收货</button>
-		</view>
-		
-		
-		
-	</view>
+  <view class="show">
+    <!-- 顶部 -->
+
+    <!-- 顶部 -->
+    <view class="mid" style="opacity: 1">
+      <view class="midone">
+        <view class="">
+          <image
+            class="imag"
+            src="/static/images/ap.jpg"
+            style="width: 206rpx; height: 258rpx"
+          ></image>
+        </view>
+        <view>
+          <view class="book-name">书的名字</view>
+          <view class="s1"
+            >作者：
+            <view class="s6">汪魏青</view>
+          </view>
+          <view class="s2">出版社：浙江大学出版社</view>
+          <view class="s7">
+            <view class="s4">广东省立中山图书馆馆藏，广东中山图书馆 </view>
+          </view>
+        </view>
+      </view>
+
+      <view class="s8">
+        <!-- 分割线br -->
+        <view class="br"></view>
+        <view class="dt">
+          <view class="tishi">温馨提示：</view>
+          <view class="texts">
+            确认收货之前，请仔细检查包装是否完好？图书是否污损？图书是否就是您要借的书？
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <view>
+      <button class="confirm-btn">确定收货</button>
+    </view>
+  </view>
 </template>
 
-<script></script>
+<script>
+	let app = getApp();
+	export default {
+	  data() {
+		return {
+      background: {
+        background: "#6C40F3",
+      },
+			"book":[]
+		};
+	  },
+
+	  onLoad(e) {
+		  console.log(e)
+		  this.getBookByBookId(e.bookId); //查询图书信息
+	  },
+
+	  methods: {
+		  //根据bookId获取图书详情
+		  async getBookByBookId(e) {
+		  	var that = this;
+		  	var params = {
+		  		url: "book?bookId=" + e,
+		  		type: 'GET'
+		  	}
+		  	const res = await app.myRequest(params);
+		  	that.book = res.content[0];
+		  	console.log(res.content[0]);
+		  },
+		//图片加载不出来
+		imageError(){
+			let that = this;
+			// console.log(index)
+			that.book.picturePath = "/static/images/temporary.jpg"
+		},
+		bookName:function(e){
+			var e1 = e + " ";
+			return e1.length;
+			},
+	  }
+	};
+</script>
 
 <style>
-	
-.confirm-btn{
-	margin-top: 35%;
-	color: #FFFFFF;
-	background-color: #5E49F5;
-	height: 90rpx;
-	border-radius: 0;
-}
-.book-name{
-	font-size: 36rpx;
-	margin-top: -80rpx;
-	color: #333333;
-}	
-	
+.confirm-btn {
+  margin-top: 35%;
+  color: #ffffff;
+  background-color: #5e49f5;
+  height: 90rpx;
+  border-radius: 0;
+}
+.book-name {
+  font-size: 36rpx;
+  margin-top: -80rpx;
+  color: #333333;
+}
+
 .br {
-		/* margin-top: 10rpx; */
-		/* width: 100%; */
-		height: 1rpx;
-		background-color: #FF8726;
-	}
-.show{
-	/* margin-bottom: auto; */
-	width: auto;
-	height: auto;
-	/* background-color: #F8F8F8; */
-}
-.mid {	
-	/* margin-top:20rpx; */
-	width: 100%;
-	height: 480rpx;
-}
-.zt1{
-	color: #555555;
-	font-size: 26rpx;
-	margin-left: 30rpx;
-	line-height: center;
-	/* margin-top: 20rpx; */
-}
-.zt{
-	height: 50rpx;
-	display: flex;
-	align-items: center;
-	
+  /* margin-top: 10rpx; */
+  /* width: 100%; */
+  height: 1rpx;
+  background-color: #ff8726;
+}
+.show {
+  /* margin-bottom: auto; */
+  width: auto;
+  height: auto;
+  /* background-color: #F8F8F8; */
+}
+.mid {
+  /* margin-top:20rpx; */
+  width: 100%;
+  height: 480rpx;
+}
+.zt1 {
+  color: #555555;
+  font-size: 26rpx;
+  margin-left: 30rpx;
+  line-height: center;
+  /* margin-top: 20rpx; */
+}
+.zt {
+  height: 50rpx;
+  display: flex;
+  align-items: center;
 }
 .midone {
-	width: 90%;
-	height: 300rpx;
-	font-size: 30rpx;
-	margin-top: 20rpx;
-	align-items: center;
-	display: flex;
-}
-
-.imag{
-	margin-left:30rpx;
-}
-
-.s1{
-	font-size: 20rpx;
-	margin-top: 5rpx;
-	height:35rpx;
-	align-items: center;
-	color: #999999;
-	display: flex;
-}
-.s2{
-	font-size: 20rpx;
-	height:35rpx;
-	margin-top: 5rpx;
-	align-items: center;
-	color: #999999;
-}
-.s4{
-	font-size: 20rpx;
-	height:35rpx;
-	margin-top: 5rpx;
-	align-items: center;
-	color: #999999;
-}
-
-.s6{
-	color: #999999;
-	
-}
-
-.s7{
-	height:35rpx;
-	align-items: center;
-	width: auto;
-	/* display: flex; */
-}
-
-.s8{
-	background-color: #F7E7C5;
-	height: 160rpx;
-	opacity:30%;
-	/* display: flex; */
-}
-.dt{
-	margin-top: 20rpx;
-	margin-left: 30rpx;
-	font-size: 30rpx;
-	
-	
-	/* margin-bottom: 20rpx; */
-	/* display: flex; */
-}
-
-.tishi{
-	margin-top: 10rpx;
-	margin-left: 30rpx;
-	font-size: 30rpx;
-	color: #FF8726;
-	margin-bottom: 20rpx;
-	/* display: flex; */
-}
-.texts{
-	/* margin-top: 20rpx; */
-	margin-left: 30rpx;
-	font-size: 24rpx;
-	color: #FF8726;
-	margin-bottom: 20rpx;
-}
-.ti{
-	color: #999999;
-	margin-top: 30rpx;
-	font-size: 23rpx;
-	margin-left: 230rpx;
-}
-
-
-
-.wz{
-	font-size: 28rpx;
-	margin-top: 8rpx;
-	height: 90rpx;
-	
+  width: 90%;
+  height: 300rpx;
+  font-size: 30rpx;
+  margin-top: 20rpx;
+  align-items: center;
+  display: flex;
 }
-.shumu {
-	font-size: 25rpx;
-	margin-top: -130rpx;
-	color:   #999999;
-	width: 120rpx;
-	display: block;
+
+.imag {
+  margin-left: 30rpx;
+}
+
+.s1 {
+  font-size: 20rpx;
+  margin-top: 5rpx;
+  height: 35rpx;
+  align-items: center;
+  color: #999999;
+  display: flex;
+}
+.s2 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 5rpx;
+  align-items: center;
+  color: #999999;
+}
+.s4 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 5rpx;
+  align-items: center;
+  color: #999999;
 }
-.shumuone{
-	font-size: 25rpx;
-	color: #999999;
-	/* background-color: #4CD964; */
+
+.s6 {
+  color: #999999;
 }
-.shumutwo{
-	margin-left: 250rpx;
-	font-size: 20rpx;
-	color:  #999999;
-	margin-top: -30rpx;
+
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  /* display: flex; */
+}
+
+.s8 {
+  background-color: #f7e7c5;
+  height: 160rpx;
+  opacity: 30%;
+  /* display: flex; */
+}
+.dt {
+  margin-top: 20rpx;
+  margin-left: 30rpx;
+  font-size: 30rpx;
+
+  /* margin-bottom: 20rpx; */
+  /* display: flex; */
 }
-.shumuthree{
-	margin-top: 10rpx;
-	font-size: 25rpx;
-	color: #999999;
+
+.tishi {
+  margin-top: 10rpx;
+  margin-left: 30rpx;
+  font-size: 30rpx;
+  color: #ff8726;
+  margin-bottom: 20rpx;
+  /* display: flex; */
+}
+.texts {
+  /* margin-top: 20rpx; */
+  margin-left: 30rpx;
+  font-size: 24rpx;
+  color: #ff8726;
+  margin-bottom: 20rpx;
+}
+.ti {
+  color: #999999;
+  margin-top: 30rpx;
+  font-size: 23rpx;
+  margin-left: 230rpx;
 }
 
+.wz {
+  font-size: 28rpx;
+  margin-top: 8rpx;
+  height: 90rpx;
+}
+.shumu {
+  font-size: 25rpx;
+  margin-top: -130rpx;
+  color: #999999;
+  width: 120rpx;
+  display: block;
+}
+.shumuone {
+  font-size: 25rpx;
+  color: #999999;
+  /* background-color: #4CD964; */
+}
+.shumutwo {
+  margin-left: 250rpx;
+  font-size: 20rpx;
+  color: #999999;
+  margin-top: -30rpx;
+}
+.shumuthree {
+  margin-top: 10rpx;
+  font-size: 25rpx;
+  color: #999999;
+}
 </style>
diff --git a/pages_borrow_books/pages/appointment/contact-booking-agent.vue b/pages_borrow_books/pages/appointment/contact-booking-agent.vue
index 44da1155535f5e184528909fb2b080943d5d2cae..e7ff22221ce8294d0db3bc635ed9e76e1356632c 100644
--- a/pages_borrow_books/pages/appointment/contact-booking-agent.vue
+++ b/pages_borrow_books/pages/appointment/contact-booking-agent.vue
@@ -1,142 +1,150 @@
 <template>
-	<view class="bgConston">
-		<view class="userSession" :style="{ height: sHeight + 'px' }">
-			<block v-for="(userContext,index) in userContextItem " :key="userContext.userId">
-			<view class="userH" :class="{'userMe' :userContext.userId==''}">
-				<view class="userImg">
-					<image :src="userContext.userImg" mode="scaleToFill"></image>
-				</view>
-				<view class="userType">
-					<!-- 是否显示用户昵称 -->
-					<template v-if="userContext.userId !=''">
-						<view class="userN">
-							<text>{{userContext.userName}}</text>
-							<text>{{userContext.Time}}</text>
-						</view>
-					</template>
-					<!-- 文本格式 -->
-					<template v-if="userContext.type =='text'">
-						<view class="textType">
-							<text>{{userContext.context}}</text>
-						</view>
-					</template>
-					<!-- 图片格式 -->
-					<template v-else-if="userContext.type =='img'">
-						<view class="imgType">
-							<image :src="userContext.picImg" mode="scaleToFill"></image>
-						</view>
-					</template>
-					<!-- 视频格式 -->
-					<template v-else-if="userContext.type =='video'">
-						<view class="videoType">
-							<video :src="userContext.videoSrc" controls ="false"></video>
-						</view>
-					</template>
-					
-				</view>
-			</view>
-			</block>
-		</view>
-		<!-- 底部输入框 -->
-		<view class="userInput">
-			<input type="text" v-model="text" placeholder="文明发言" adjust-position="false" />
-			<view class="sumText" @tap="submit(text)">发送</view>
-		</view>
-	</view>
+  <view class="bgConston">
+    <view class="userSession" :style="{ height: sHeight + 'px' }">
+      <block
+        v-for="(userContext, index) in userContextItem"
+        :key="userContext.userId"
+      >
+        <view class="userH" :class="{ userMe: userContext.userId == '' }">
+          <view class="userImg">
+            <image :src="userContext.userImg" mode="scaleToFill"></image>
+          </view>
+          <view class="userType">
+            <!-- 是否显示用户昵称 -->
+            <template v-if="userContext.userId != ''">
+              <view class="userN">
+                <text>{{ userContext.userName }}</text>
+                <text>{{ userContext.Time }}</text>
+              </view>
+            </template>
+            <!-- 文本格式 -->
+            <template v-if="userContext.type == 'text'">
+              <view class="textType">
+                <text>{{ userContext.context }}</text>
+              </view>
+            </template>
+            <!-- 图片格式 -->
+            <template v-else-if="userContext.type == 'img'">
+              <view class="imgType">
+                <image :src="userContext.picImg" mode="scaleToFill"></image>
+              </view>
+            </template>
+            <!-- 视频格式 -->
+            <template v-else-if="userContext.type == 'video'">
+              <view class="videoType">
+                <video :src="userContext.videoSrc" controls="false"></video>
+              </view>
+            </template>
+          </view>
+        </view>
+      </block>
+    </view>
+    <!-- 底部输入框 -->
+    <view class="userInput">
+      <input
+        type="text"
+        v-model="text"
+        placeholder="文明发言"
+        adjust-position="false"
+      />
+      <view class="sumText" @tap="submit(text)">发送</view>
+    </view>
+  </view>
 </template>
 
 <script>
 export default {
-	data() {
-		return {
-			sHeight:500,
-			
-			userContextItem:[
-				{
-					userId:"",
-					meId:2,
-					userName:"白百合",
-					userImg:"../../static/images/头像2.jpg",
-					type:"text",
-					context:"哈哈哈，你好，你啥时候看完“活着”这本书，我想借来看看！",
-					time:(new Date().getTime())
-				},
-				{
-				
-				userId:1,
-				meId:"",
-				userName:"吴亦凡",
-				userImg:"../../static/images/图书持有人头像.jpg",
-				type:"text",
-				context:"可能还得3天才看完！",
-				time:(new Date().getTime())
-			},
-			
-			{
-			userId:1,
-			meId:"",
-			userName:"吴亦凡",
-			userImg:"../../static/images/图书持有人头像.jpg",
-			type:"text",
-			context:"之后平台会及时更新，你注意下单借书就好了！",
-			time:(new Date().getTime())
-			},
-			{
-				userId:"",
-				meId:2,
-				userName:"白百合",
-				userImg:"../../static/images/头像2.jpg",
-				type:"text",
-				context:"好的谢谢！",
-				time:(new Date().getTime())
-			},
-			]
-		}
-	},
-	onLoad() {
-		//获取系统信息
-		uni.getSystemInfo({
-			success: (res) => {
-				let height=res.windowHeight-uni.upx2px(100);
-				this.sHeight=height;
-			}
-		})
-	},
-	
-	methods: {
-		submit(text){
-			// 创建一组数据
-			let obj = {
-				userId:"",
-				meId: 2,
-				userName: "ailis",
-				userImg:"../../static/image/头像2.jpg",
-				type:"text",
-				context:text,
-				time:(new Date().getTime())
-			};
-			this.userContextItem.push(obj);
-		}
-		}
-}
+  data() {
+    return {
+      sHeight: 500,
+
+      userContextItem: [
+        {
+          userId: "",
+          meId: 2,
+          userName: "白百合",
+          userImg: "/static/images/头像2.jpg",
+          type: "text",
+          context: "哈哈哈，你好，你啥时候看完“活着”这本书，我想借来看看！",
+          time: new Date().getTime(),
+        },
+        {
+          userId: 1,
+          meId: "",
+          userName: "吴亦凡",
+          userImg: "/static/images/图书持有人头像.jpg",
+          type: "text",
+          context: "可能还得3天才看完！",
+          time: new Date().getTime(),
+        },
+
+        {
+          userId: 1,
+          meId: "",
+          userName: "吴亦凡",
+          userImg: "/static/images/图书持有人头像.jpg",
+          type: "text",
+          context: "之后平台会及时更新，你注意下单借书就好了！",
+          time: new Date().getTime(),
+        },
+        {
+          userId: "",
+          meId: 2,
+          userName: "白百合",
+          userImg: "/static/images/头像2.jpg",
+          type: "text",
+          context: "好的谢谢！",
+          time: new Date().getTime(),
+        },
+      ],
+    };
+  },
+  onLoad() {
+    //获取系统信息
+    uni.getSystemInfo({
+      success: (res) => {
+        let height = res.windowHeight - uni.upx2px(100);
+        this.sHeight = height;
+      },
+    });
+  },
+
+  methods: {
+    submit(text) {
+      // 创建一组数据
+      let obj = {
+        userId: "",
+        meId: 2,
+        userName: "ailis",
+        userImg: "../../static/image/头像2.jpg",
+        type: "text",
+        context: text,
+        time: new Date().getTime(),
+      };
+      this.userContextItem.push(obj);
+    },
+  },
+};
 </script>
 
 <style>
-	.bgConston{
+	.bgConston {
 		width: 100%;
 		height: 100%;
-		background-color: #F8F8F8;
+		background-color: #f8f8f8;
 		margin: 0;
 		padding: 0;
 	}
+
 	/* 聊天 */
-	.userSession{
+	.userSession {
 		width: 100%;
 		height: auto;
-		border-top: 1upx solid #EDEDED;
+		border-top: 1upx solid #ededed;
 		overflow: auto;
 	}
-	.userH{
+
+	.userH {
 		width: 80%;
 		height: auto;
 		display: flex;
@@ -144,7 +152,8 @@ export default {
 		flex-wrap: wrap;
 		padding: 20upx;
 	}
-	.userMe{
+
+	.userMe {
 		width: 95%;
 		height: auto;
 		display: flex;
@@ -155,7 +164,8 @@ export default {
 		flex-direction: row-reverse;
 		text-align: right;
 	}
-	.userImg{
+
+	.userImg {
 		width: 70upx;
 		height: 70upx;
 		display: flex;
@@ -164,74 +174,85 @@ export default {
 		margin-right: 15upx;
 		margin-left: 15upx;
 	}
-	.userImg>image{
+
+	.userImg>image {
 		width: 65upx;
 		height: 65upx;
 		border-radius: 100%;
 	}
-	.userType{
+
+	.userType {
 		display: flex;
 		justify-content: center;
 		flex-direction: column;
 		padding: 10upx;
 	}
-	.userN{
+
+	.userN {
 		height: 50upx;
 		display: flex;
 		justify-content: space-around;
-		margin-left:-40upx;
+		margin-left: -40upx;
 		font-size: 30upx;
 	}
-	.userN>text{
+
+	.userN>text {
 		height: 50upx;
 		min-height: 100upx;
 		color: #666;
 	}
-	.textType{
+
+	.textType {
 		max-width: 400upx;
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		border-radius: 10upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
+		box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
 		display: flex;
 		align-items: center;
 		justify-content: center;
 		padding: 10upx;
 	}
-	.textType>text{
+
+	.textType>text {
 		font-size: 28upx;
 		color: #666;
 	}
-	.imgType{
+
+	.imgType {
 		max-width: 300upx;
 		max-height: 420upx;
 		display: flex;
 		align-items: center;
 		justify-content: center;
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		border-radius: 20upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
+		box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
 	}
-	.imgType>image{
+
+	.imgType>image {
 		width: 250upx;
 		height: 350upx;
 		padding: 20upx;
 	}
-	.videoType{
+
+	.videoType {
 		width: 300upx;
 		height: 400upx;
 		display: flex;
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		border-radius: 20upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
+		box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
 		align-items: center;
 		justify-content: center;
 		padding: 10upx;
 	}
-	.videoType>video{
+
+	.videoType>video {
 		width: 270upx;
 		height: 370upx;
 	}
-	.userInput{
+
+	.userInput {
 		height: 100upx;
 		position: fixed;
 		bottom: 0;
@@ -241,24 +262,25 @@ export default {
 		display: flex;
 		justify-content: space-around;
 		align-items: center;
-		box-shadow: 0 0 5upx 0 #E3E3E3;
+		box-shadow: 0 0 5upx 0 #e3e3e3;
 	}
-	.userInput>input{
+
+	.userInput>input {
 		height: 50upx;
-		background: #F4F5F6;
+		background: #f4f5f6;
 		border-radius: 15upx;
 		padding: 10upx 10upx;
 		flex: 1;
 		margin-right: 20upx;
 		font-size: 28upx;
-		
 	}
-	.userInput>view{
+
+	.userInput>view {
 		width: 120upx;
 		font-size: 24upx;
-		color: #FFFFFF;
+		color: #ffffff;
 		height: 60upx;
-		background-color: #18C7F2;
+		background-color: #18c7f2;
 		border-radius: 20upx;
 		text-align: center;
 		line-height: 60upx;
diff --git a/pages_borrow_books/pages/appointment/index.vue b/pages_borrow_books/pages/appointment/index.vue
index f3c1a4e878db3c4a44ac430cf7bc9ecdfb14db7a..60131e48cb6257b607ffbd0147ef28a802150cbc 100644
--- a/pages_borrow_books/pages/appointment/index.vue
+++ b/pages_borrow_books/pages/appointment/index.vue
@@ -1,5 +1,13 @@
 <template>
 		<view>
+			<!-- 顶部部分 -->
+					<u-navbar zhead="65rpx" height="44" title="面对面还书" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
+						</view>
+					</u-navbar>
 			<button @click="uploadImage">选取图片识别</button>
 			<view class="vvv">
 				<text v-for="(item,index) in content" :key="index" >{{item.words}}</text>
@@ -11,6 +19,9 @@
 	export default {
 		data(){
 			return{
+				background: {
+					background: "#6C40F3",
+				},
 				src:'',
 				content:[]
 			}
diff --git a/pages_borrow_books/pages/appointment/logistics.vue b/pages_borrow_books/pages/appointment/logistics.vue
index b6624a8c006d9d04e36a35940e429a8a9516d44c..81d4c05513ce455c37687705ed7ab8e8bec4500e 100644
--- a/pages_borrow_books/pages/appointment/logistics.vue
+++ b/pages_borrow_books/pages/appointment/logistics.vue
@@ -1,188 +1,218 @@
 <template>
-	<view class="show">
-		<!-- 顶部 -->
-		
-		<!-- 顶部 -->
-		<view class="mid" style=" background-color: #F8F8F8;  opacity:1;">
-			<view class="zt">
-				<view class="zt1">
-					订单编号：
-				</view>
-				<view style="color: #808080;">156487912</view>
-			</view>
-			<!-- 分割线br -->
-			<view class="br"></view>
-			<view class="midone">
-				<view class="">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 206rpx; height: 258rpx;"></image>
-				</view>
-				<view>
-					<view class="book-name">书的名字</view>
-					<view class="s1">作者：
-						<view class="s6">汪魏青</view>
-					</view>
-					<view class="s2">出版社：浙江大学出版社</view>
-					<view class="s7">
-						<view class="s4">广东省立中山图书馆馆藏，广东中山图书馆
-						</view>
-					</view>
-				</view>
-			</view>
-			<view class="s8">
-				<view class="dt">
-					<view>承运快递：</view>
-					<view style="color: #808080;">
-						顺丰速运
-					</view>
-				</view>
-			</view>
-			<!-- 分割线br -->
-			<view class="br"></view>
-		</view>
-		
-		
-		
-		
-	</view>
+  <view class="show">
+    <!-- 顶部 -->
+    <u-navbar zhead="65rpx" height="44" title="预约" title-color="white" title-size="40" :background="background"
+              back-icon-color="white" back-icon-size="50">
+      <view class="navbar-right" slot="right">
+        <view class="right_list" @click="bindInBatch">
+        </view>
+      </view>
+    </u-navbar>
+    <!-- 顶部 -->
+    <view class="mid" style="background-color: #f8f8f8; opacity: 1">
+      <view class="zt">
+        <view class="zt1"> 订单编号： </view>
+        <view style="color: #808080">暂无订单号</view>
+      </view>
+      <!-- 分割线br -->
+      <view class="br"></view>
+      <view class="midone">
+        <view class="">
+          <image class="imag" :src="book.picturePath" @error="imageError()" style="width: 206rpx; height: 258rpx"></image>
+        </view>
+        <view>
+          <view class="book-name">{{(bookName(book.bookName) >13) ? book.bookName.substring(0,13)+'...' : book.bookName}}</view>
+          <view class="s1">作者：
+            <view class="s6">{{book.author}}</view>
+          </view>
+          <view class="s2">出版社：{{book.publisher}}</view>
+          <view class="s7">
+            <view class="s4">出版年：{{book.publisherYear}} </view>
+          </view>
+        </view>
+      </view>
+      <view class="s8">
+        <view class="dt">
+          <view>承运快递：</view>
+          <view style="color: #808080"> 暂无信息 </view>
+        </view>
+      </view>
+      <!-- 分割线br -->
+      <view class="br"></view>
+    </view>
+  </view>
 </template>
 
-<script></script>
+<script>
+	let app = getApp();
+	export default {
+	  data() {
+		return {
+      background: {
+        background: "#6C40F3",
+      },
+			"book":[]
+		};
+	  },
+
+	  onLoad(e) {
+		  console.log(e)
+		  this.getBookByBookId(e.bookId); //查询图书信息
+	  },
+
+	  methods: {
+		  //根据bookId获取图书详情
+		  async getBookByBookId(e) {
+		  	var that = this;
+		  	var params = {
+		  		url: "book?bookId=" + e,
+		  		type: 'GET'
+		  	}
+		  	const res = await app.myRequest(params);
+		  	that.book = res.content[0];
+		  	console.log(res.content[0]);
+		  },
+		//图片加载不出来
+		imageError(){
+			let that = this;
+			// console.log(index)
+			that.book.picturePath = "/static/images/temporary.jpg"
+		},
+		bookName:function(e){
+			var e1 = e + " ";
+			return e1.length;
+			},
+	  }
+	};
+</script>
 
 <style>
-	
-.book-name{
-	font-size: 36rpx;
-	margin-top: -80rpx;
-	color: #333333;
-}	
-	
+.book-name {
+  font-size: 36rpx;
+  margin-top: -80rpx;
+  color: #333333;
+}
+
 .br {
-		margin-top: 10rpx;
-		/* width: 100%; */
-		height: 1rpx;
-		background-color: #EEEEEE;
-	}
-.show{
-	/* margin-bottom: auto; */
-	width: auto;
-	height: auto;
-	/* background-color: #F8F8F8; */
-}
-.mid {	
-	/* margin-top:20rpx; */
-	width: 100%;
-	height: 480rpx;
-}
-.zt1{
-	color: #555555;
-	font-size: 26rpx;
-	margin-left: 30rpx;
-	line-height: center;
-	/* margin-top: 20rpx; */
-}
-.zt{
-	height: 50rpx;
-	display: flex;
-	align-items: center;
-	
+  margin-top: 10rpx;
+  /* width: 100%; */
+  height: 1rpx;
+  background-color: #eeeeee;
+}
+.show {
+  /* margin-bottom: auto; */
+  width: auto;
+  height: auto;
+  /* background-color: #F8F8F8; */
+}
+.mid {
+  /* margin-top:20rpx; */
+  width: 100%;
+  height: 480rpx;
+}
+.zt1 {
+  color: #555555;
+  font-size: 26rpx;
+  margin-left: 30rpx;
+  line-height: center;
+  /* margin-top: 20rpx; */
+}
+.zt {
+  height: 50rpx;
+  display: flex;
+  align-items: center;
 }
 .midone {
-	width: 90%;
-	height: 300rpx;
-	font-size: 30rpx;
-	margin-top: 20rpx;
-	align-items: center;
-	display: flex;
+  width: 90%;
+  height: 300rpx;
+  font-size: 30rpx;
+  margin-top: 20rpx;
+  align-items: center;
+  display: flex;
 }
 
-.imag{
-	margin-left:30rpx;
+.imag {
+  margin-left: 30rpx;
 }
 
-.s1{
-	font-size: 20rpx;
-	margin-top: 5rpx;
-	height:35rpx;
-	align-items: center;
-	color: #999999;
-	display: flex;
-}
-.s2{
-	font-size: 20rpx;
-	height:35rpx;
-	margin-top: 5rpx;
-	align-items: center;
-	color: #999999;
-}
-.s4{
-	font-size: 20rpx;
-	height:35rpx;
-	margin-top: 5rpx;
-	align-items: center;
-	color: #999999;
+.s1 {
+  font-size: 20rpx;
+  margin-top: 5rpx;
+  height: 35rpx;
+  align-items: center;
+  color: #999999;
+  display: flex;
+}
+.s2 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 5rpx;
+  align-items: center;
+  color: #999999;
+}
+.s4 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 5rpx;
+  align-items: center;
+  color: #999999;
 }
 
-.s6{
-	color: #999999;
-	
+.s6 {
+  color: #999999;
 }
 
-.s7{
-	height:35rpx;
-	align-items: center;
-	width: auto;
-	/* display: flex; */
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  /* display: flex; */
 }
 
-.s8{
-	
-	display: flex;
-}
-.dt{
-	margin-top: 20rpx;
-	margin-left: 30rpx;
-	font-size: 26rpx;
-	color: #555555;
-	margin-bottom: 20rpx;
-	display: flex;
-}
-.ti{
-	color: #999999;
-	margin-top: 30rpx;
-	font-size: 23rpx;
-	margin-left: 230rpx;
+.s8 {
+  display: flex;
+}
+.dt {
+  margin-top: 20rpx;
+  margin-left: 30rpx;
+  font-size: 26rpx;
+  color: #555555;
+  margin-bottom: 20rpx;
+  display: flex;
+}
+.ti {
+  color: #999999;
+  margin-top: 30rpx;
+  font-size: 23rpx;
+  margin-left: 230rpx;
 }
 
-
-
-.wz{
-	font-size: 28rpx;
-	margin-top: 8rpx;
-	height: 90rpx;
-	
+.wz {
+  font-size: 28rpx;
+  margin-top: 8rpx;
+  height: 90rpx;
 }
 .shumu {
-	font-size: 25rpx;
-	margin-top: -130rpx;
-	color:   #999999;
-	width: 120rpx;
-	display: block;
-}
-.shumuone{
-	font-size: 25rpx;
-	color: #999999;
-	/* background-color: #4CD964; */
-}
-.shumutwo{
-	margin-left: 250rpx;
-	font-size: 20rpx;
-	color:  #999999;
-	margin-top: -30rpx;
-}
-.shumuthree{
-	margin-top: 10rpx;
-	font-size: 25rpx;
-	color: #999999;
+  font-size: 25rpx;
+  margin-top: -130rpx;
+  color: #999999;
+  width: 120rpx;
+  display: block;
+}
+.shumuone {
+  font-size: 25rpx;
+  color: #999999;
+  /* background-color: #4CD964; */
+}
+.shumutwo {
+  margin-left: 250rpx;
+  font-size: 20rpx;
+  color: #999999;
+  margin-top: -30rpx;
+}
+.shumuthree {
+  margin-top: 10rpx;
+  font-size: 25rpx;
+  color: #999999;
 }
-
 </style>
diff --git "a/pages_borrow_books/pages/borrow/borrow - \345\211\257\346\234\254.vue" "b/pages_borrow_books/pages/borrow/borrow - \345\211\257\346\234\254.vue"
deleted file mode 100644
index 1cb97035294c3f14ec5916b6eee065f96b89e66b..0000000000000000000000000000000000000000
--- "a/pages_borrow_books/pages/borrow/borrow - \345\211\257\346\234\254.vue"	
+++ /dev/null
@@ -1,402 +0,0 @@
-<template>
-	<view class="show">
-		<view class="midone">
-			<view class="zhengti">
-				<image class="imag" src="../../static/images/C.jpg" style="width: 125rpx; height: 170rpx;"></image>
-				<view class="midwz">C++ Printer Plus</view>
-			</view>
-			<view >
-				<view class="s1">作者：
-					<view class="s6">汪魏青</view>
-				</view>
-				<view class="s2">出版社：浙江大学出版社</view>
-				<view class="s7">
-					<view class="s3">出版时间：2017-09-10</view>
-					<view class="s4">
-						C++程序设计经典教程，畅销30年的C++大百科全书全新升级，经典C++入门教程十年新版再现，孟岩、高博倾力推荐，赠送价值99元的e读版电子书及在线实验环境，赠送大尺寸全书思维导图，赠199元训练营
-					</view>
-				</view>
-			</view>
-		</view>
-		
-		<view class="content">
-			<view class="b1">
-				馆外流通
-			</view>
-			<view class="b1">
-				馆藏的书
-			</view>
-			<view class="b3">
-				可借优先
-			</view>
-			<view class="b3">
-				距离优先
-			</view>
-		</view>
-		
-		<!--可预约-->
-		<view class="all">
-			<view class="user">
-				<view class="imag">
-					<image src="../../static/images/user.jpg" style="width: 70rpx; height: 70rpx;border-radius: 50%;"></image>
-				</view>
-				<view class="person">
-					<view class="tou">爱书的猫</view>
-					<view class="time">归还日期：2017-05-06</view>
-					<view class="option">
-						<view>
-							<image src="../../static/images/location.png"  style="width: 30rpx; height: 30rpx;"></image>
-						</view>
-						<view class="">1.2km</view>
-					</view>
-				</view>
-			</view>
-			<view class="tx">
-				<view class="" style="color: #007AFF;">可预约</view>
-				<view class="get1">已有</view>
-				<view class="count" >1</view>
-				<view class="">人预约</view>
-			</view>
-			<view class="btns">
-				<view class="btn">
-					<button class="btn1" style="background-color: #4CD964;  width:120rpx ;">借走</button>
-				</view>
-				<view class="btn">
-					<button class="btn1">在馆预约</button>
-				</view>
-				<view class="btn">
-					<button class="btn1"  style="background-color: #F0AD4E; width:170rpx ;">加入借书车</button>
-				</view>
-			</view>
-		</view>
-		
-		<!--可借-->
-		<view class="all">
-			<view class="user">
-				<view class="imag">
-					<image src="../../static/images/user.jpg" style="width: 70rpx; height: 70rpx;border-radius: 50%;"></image>
-				</view>
-				<view class="person">
-					<view class="tou">哈利波特</view>
-					<view class="time">归还日期：2017-05-06</view>
-					<view class="option">
-						<view>
-							<image src="../../static/images/location.png"  style="width: 30rpx; height: 30rpx;"></image>
-						</view>
-						<view class="">1.2km</view>
-					</view>
-				</view>
-			</view>
-			<view class="tx">
-				<view class="" style="color: #4CD964;">可借</view>
-				<view class="get1">已有</view>
-				<view class="count" style="color: #4CD964;"  >0</view>
-				<view class="">人预约</view>
-			</view>
-			<view class="btns">
-				<view class="btn">
-					<button class="btn1" style="background-color: #4CD964;  width:120rpx ;">借走</button>
-				</view>
-				<view class="btn">
-					<button class="btn1">在馆预约</button>
-				</view>
-				<view class="btn">
-					<button class="btn1"  style="background-color: #F0AD4E; width:170rpx ;">加入借书车</button>
-				</view>
-			</view>
-		</view>
-		
-		<!--不可借-->
-		<view class="all">
-			<view class="user">
-				<view class="imag">
-					<image src="../../static/images/user.jpg" style="width: 70rpx; height: 70rpx;border-radius: 50%;"></image>
-				</view>
-				<view class="person">
-					<view class="tou">哈利波特</view>
-					<view class="time">归还日期：2017-05-06</view>
-					<view class="option">
-						<view>
-							<image src="../../static/images/location.png"  style="width: 30rpx; height: 30rpx;"></image>
-						</view>
-						<view class="">50km</view>
-					</view>
-				</view>
-			</view>
-			<view class="tx">
-				<view class="" style="color: #DD524D;">不可借</view>
-				<view class="get1">数量：</view>
-				<view class="count" style="color: #DD524D;"  >1</view>
-			</view>
-			<view class="btns">
-				<view class="btn">
-					<button class="btn1" style="background-color: #C8C7CC;  width:120rpx ;">借走</button>
-				</view>
-				<view class="btn">
-					<button class="btn1" style="background-color: #C8C7CC;">在馆预约</button>
-				</view>
-				<view class="btn">
-					<button class="btn1"  style="background-color: #C8C7CC; width:170rpx ;">加入借书车</button>
-				</view>
-			</view>
-		</view>
-	</view>
-</template>
-
-<script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			
-		}
-	}
-</script>
-
-<style>
-	
-	.btns{
-		margin-top: 45rpx;
-		display: flex;
-		margin-left: 260rpx;
-		}
-	.btn1{
-		background-color: #00BFFF;
-		color: #F8F8F8;
-		font-size: 21rpx;
-		width: 145rpx;
-		height: 60rpx;
-		margin-right: 20rpx;
-		align-items: center;
-	}
-	.all{
-		border-bottom: 1rpx solid #C8C7CC;
-	}
-	.get1{
-		margin-left: 30rpx;
-	}
-	
-	.count{
-		margin-left: 10rpx;
-		margin-right: 10rpx;
-		color: #00BFFF;
-	}
-	.tx{
-		display: flex;
-		font-size: 25rpx;
-		color: #555555;
-		margin-left: 140rpx;
-	}
-	.tou{
-		color: #F0AD4E;
-		font-size: 23rpx;
-		align-items: center;
-		
-	}
-	.time{
-		font-size: 25rpx;
-		color: #555555;
-		margin-left: 60rpx;
-	}
-	.person{
-		display: flex;
-		margin-left: 20rpx;
-		margin-top: 20rpx;
-	}
-	.option{
-		color: #999999;
-		font-size: 23rpx;
-		display: flex;
-		margin-left: 50rpx;
-	}
-	.user{
-		margin-top: 50rpx;
-		margin-left: 25rpx;
-		display: flex;
-	}
-	
-	.show{
-		width: auto;
-		height: auto;
-	}
-	.content{
-		height: 75rpx;
-		background-color: #F1F1F1;
-		font-size: 23rpx;
-		/* margin-top: 10rpx; */
-		text-align: center;
-		align-items: center;
-		display: flex;
-	}
-	.b1{
-		background-color:#00BFFF ;
-		width: 100rpx;
-		border-radius: 10rpx;
-		height: 35rpx;
-		/* object-position: initial; */
-		margin-left: 70rpx;
-		color: #F1F1F1;
-		margin-bottom: 10rpx;
-		align-items: center;
-		
-		}
-		
-		.b3{
-			width: 100rpx;
-			border-radius: 10rpx;
-			height: 35rpx;
-			margin-left: 70rpx;
-			color: #999999;
-			border: #C8C7CC 2rpx solid;
-			margin-bottom: 10rpx;
-			align-items: center;
-			}
-		
-	.zt1{
-		color: #808080;
-		font-size: 22rpx;
-		margin-left: 50rpx;
-		line-height: center;
-		margin-top: 20rpx;
-	}
-	.zt{
-		height: 50rpx;
-		border-bottom:solid 1rpx;
-		/* border-top:solid 1rpx; */
-		/* margin-bottom: -20rpx; */
-		color: #BBBBBB;
-	}
-	.midone {
-		width: 100%;
-		height: 340rpx;
-		font-size: 30rpx;
-		margin-top: 35rpx;
-		align-items: center;
-		/* background-color: #007AFF; */
-		/* border-bottom: 1rpx solid #bbbbbb; */
-	}
-	.zhengti {
-		display: flex;
-	}
-	.imag{
-		margin-left:30rpx;
-	}
-	.midwz {
-		font-size: 28rpx;
-		height:35rpx;
-		margin-top: -5rpx;
-		align-items: center;
-		margin-left: 30rpx;
-		/* background-color:  #333333; */
-	}
-	.s1{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: -120rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-		display: flex;
-	}
-	.s2{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-	.s3{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-	.s4{
-		font-size: 25rpx;
-		height:150rpx;
-		margin-top: 30rpx;
-		align-items: center;
-		margin-left: 50rpx;
-		color: #555555;
-		width: 88%;
-		/* background-color: #4CD964; */
-	}
-	.s5{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: -26rpx;
-		align-items: center;
-		margin-left: 100rpx;
-		color: #555555;
-	}
-	.s6{
-		color: #00BFFF;
-		
-	}
-	
-	.s7{
-		height:35rpx;
-		align-items: center;
-		width: auto;
-		/* display: flex; */
-	}
-	
-	
-	.dt{
-		margin-top: 30rpx;
-		margin-left: 50rpx;
-		font-size: 23rpx;
-		color: #808080;
-		margin-bottom: 30rpx;
-	}
-	.ti{
-		color: #007AFF;
-		margin-top: 30rpx;
-		font-size: 23rpx;
-		margin-left: 230rpx;
-	}
-	
-	
-	
-	.wz{
-		font-size: 28rpx;
-		margin-top: 8rpx;
-		height: 90rpx;
-		
-	}
-	.shumu {
-		margin-left: 180rpx;
-		font-size: 25rpx;
-		margin-top: -130rpx;
-		color:   #999999;
-		width: 120rpx;
-		display: block;
-	}
-	.shumuone{
-		margin-left: 180rpx;
-		font-size: 25rpx;
-		color: #999999;
-		/* background-color: #4CD964; */
-	}
-	.shumutwo{
-		margin-left: 250rpx;
-		font-size: 20rpx;
-		color:  #007AFF;
-		margin-top: -30rpx;
-		/* background-color: #F0AD4E; */
-	}
-	.shumuthree{
-		margin-top: 10rpx;
-		font-size: 25rpx;
-		color: #F0AD4E;
-		margin-left: 180rpx;
-	}
-
-
-</style>
diff --git a/pages_borrow_books/pages/borrow/borrow.vue b/pages_borrow_books/pages/borrow/borrow.vue
index a05ee0e6b835ddbcec3e6970da6ad5e76377c9c3..74f73b7b360cc71c2382cee25dabe22bcf29366a 100644
--- a/pages_borrow_books/pages/borrow/borrow.vue
+++ b/pages_borrow_books/pages/borrow/borrow.vue
@@ -1,252 +1,431 @@
 <template>
-  <view class="show">
-    <view class="book">
-      <view class="imag">
-        <image :src="book.picturePath" style="width: 208rpx; height: 258rpx;"></image>
-      </view>
-      <view class="book-name">{{book.bookName}}</view>
-    </view>
-    <!-- 分割线 -->
-    <view class="br3"></view>
-
-    <!-- #ifndef MP-WEIXIN -->
-    <view class="text">
-      <view class="book-Name">{{book.bookName}}</view>
-      <view class="book-author">作者：
-        <view>{{book.author}}</view>
-      </view>
-      <view class="book-publisher">出版社：
-        <view>{{book.publisher}}</view>
-      </view>
-      <view class="book-publish-time">出版年：
-        <view>{{book.publisherYear}}</view>
-      </view>
-    </view>
-    <!-- #endif -->
-
-    <!-- #ifdef MP-WEIXIN -->
-    <view class="text" style="margin-top: 10rpx; height: 210rpx; width: auto;">
-      <view class="book-Name">{{book.bookName}}</view>
-      <view class="book-author">作者：
-        <view>{{book.author}}</view>
-      </view>
-      <view class="book-publisher">出版社：
-        <view>{{book.publisher}}</view>
-      </view>
-      <view class="book-publish-time">出版年：
-        <view>{{book.publisherYear}}</view>
-      </view>
-    </view>
-    <!-- #endif -->
-
-
-    <!-- 分割线 -->
-    <view class="br3"></view>
-    <!-- <view class="order-book"> -->
-    <!--
-barcode: "1118"
-book: Object
-bookId: 7510
-isBorrowed: false
-isCirculating: false
-isEnable: true
-latitude: 36.309051
-library: Object
-address: "<script>alert(1)</script>"
-isEnable: true
-latitude: 12
-libraryId: 1
-longitude: 12
-name: "中山图书馆"
-ownerId: 1
-type: false
-userId: 1-->
-    <block v-for="(item,index) in list" :key="index">
-      <view class="order-book-image">
-        <image class="house-image" src="../../static/images/person_library.jpg"></image>
-      </view>
-      <view class="order-book-right">
-        <view class="right-name">
-          {{item.library.name}}
-        </view>
-        <view class="order-book-right1">
-          <view class="order-ok">
-            <!--在馆-->不可预约
-          </view>
-          <!--<view class="count">
-            数量：<view style="color:#00AAFF;">2</view>
-          </view>-->
-          <view class="address">
-            <image style="width: 30rpx;height: 30rpx;" src="../../static/images/dingwei.png"></image>约<view style="color: #00AAFF;">1196</view>km
-          </view>
-
-        </view>
-        <view class="btnSubmmit">
-          <navigator :url="`/pages_borrow_books/pages/order/order?realBookId=${item.realBookId}&bookId=${book.bookId}&index=${index}`">
-            <button class="orderSubmmit"><view class="orderText">借走</view>
-            </button>
-          </navigator>
-        </view>
-      </view>
-    </block>
-    <!-- </view> -->
-  </view>
+	<view>
+		<!-- 顶部部分 -->
+						<u-navbar zhead="65rpx" height="44" title="借书" title-color="white" title-size="40" :background="background"
+						 back-icon-color="white" back-icon-size="50">
+							<view class="navbar-right" slot="right">
+								<view class="right_list" @click="bindInBatch">
+								</view>
+							</view>
+						</u-navbar>
+	<view class="show">
+			<view class="library">
+				<view class="imag">
+					<image :src="book.picturePath" @error="imageError()" class="library-picture" ></image>
+				</view>
+				<!-- <view class="book-name" style="color: #255BBA;">{{book.bookName}}</view> -->
+				<view class="book-name">{{book.bookName}}</view>
+			</view>
+			
+		<!-- 分割线 -->
+		<view class="br3"></view>
+		<view style="display: flex; height: 200rpx;width: auto;">
+			<view class="text">
+				<view class="book-Name">{{book.bookName}}</view>
+				<view class="book-author">作者：
+					<text>{{(bookAuthor(book.author) >15) ? book.author.substring(0,15)+'...' : book.author}}</text>
+				</view>
+				<view class="book-publisher">出版社：
+					<view>{{book.publisher}}</view>
+				</view>
+				<view class="book-publish-time">出版年：
+					<view>{{book.publisherYear}}</view>
+				</view>
+			</view>
+		</view>
+		
+		
+		<view v-for="(item,index) in libraryList" :key="index">
+			<view class="br3"></view>
+			<view style="display: flex; height: 180rpx;width: auto;">
+				<view class="order-book-image">
+					<image class="house-image" src="../../../static/images/person_library.jpg" @error="imageError()"></image>
+				</view>
+				<view class="text">
+					<view class="book-Name">{{item.library.name}}</view>
+					<view class="book-publisher">
+						<view >在馆可借</view>
+						<view style="margin-left: auto; display: flex;">数量：<view style="color:#00AAFF;">{{item.libraryCanBorrowCount}}</view></view>
+						
+						<view style="margin-left: auto; display: flex;"><image style="width: 30rpx;height: 30rpx;margin-top: 5rpx;" src="../../../static/images/dingwei.png"></image>约<view style="color: #00AAFF;" >11</view>km</view>
+					</view>
+					<view class="btnSubmmit">
+						<button  class="orderSubmmit" @click="borrowItLibrary(item.realBookId,item.library.name,item.library.libraryId)">
+							<view class="orderText">借走</view>
+						</button>
+					</view>
+				</view>
+			</view>
+		</view>	
+		<view v-if="readerBookList.length >0">
+			<view v-for="(item,index) in readerBookList" :key="index">
+				<view class="br3"></view>
+				<view style="display: flex; height: 180rpx;width: auto;">
+					<view class="order-book-image">
+						<image class="house-image" :src="book.picturePath" @error="imageError()"></image>
+					</view>
+					<view class="text">
+						<view class="book-Name">{{item.holder.nickname}}</view>
+						<view class="book-publisher">
+							<view v-if="item.canBorrow==true">可以借走</view>
+							<view v-else-if="(item.canReserve==true && item.holderId !=readerIds)">可以预约</view>
+							<view v-else>暂不可借</view>
+							<view style="margin-left: auto; display: flex;">数量：<view style="color:#00AAFF;">1</view></view>
+							<view style="margin-left: auto; display: flex;"><image style="width: 30rpx;height: 30rpx;margin-top: 5rpx;" src="../../../static/images/dingwei.png"></image>约<view style="color: #00AAFF;">11</view>km</view>
+						</view>
+						
+						
+						
+						<view class="btnSubmmit">
+							<button v-if="item.canBorrow == true" class="orderSubmmit" @click="borrowIt(item.realBookId,item.library.name,item.library.libraryId)">
+								<view class="orderText">借走</view>
+							</button>
+							<button v-if="(item.canReserve==true && item.holderId !=readerIds)" class="orderSubmmit" @click="Inappointment(item.realBookId,item.library.name)">
+								<view class="orderText">预约</view>
+							</button>
+						</view>
+					</view>
+				</view>
+			</view>	
+		</view>
+	</view>
+	</view>
 </template>
 
 <script>
-import {getBookByBookId,realBook} from "../../../api"
-export default {
-  data() {
-    return {
-      book:{},
-      //图书馆列表
-      list:{}
-    }
-  },
-  methods: {
-    Inappointment: function(e) {
-      uni.showActionSheet({
-        itemList: ['预约自提','预约物流' ],
-        success: function (res) {
-          console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
-          /* var that = this;
-          uni.request({
-              url:getApp().globalData.URL+"api/reserveList/onlineBooking",
-              data:{
-                book_id:7509,
-                library_id:1,
-                mode:res.tapIndex
-
-               },
-               header: {
-                 'content-type': 'application/json;charset=UTF-8' // 默认值
-                 },
-              success:res =>{
-                console.log("后台传来的",res.data)
-                that.logistics = res.data;
-                }
-            }) */
-        },
-        fail: function (res) {
-          console.log(res.errMsg);
-        }
-      });
+	let app = getApp();
+	// import {
+	// 	getBookByBookId,
+	// 	realBook
+	// } from "../../../api"
+	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+				book: {},
+				//图书馆列表
+				realBookList: [],
+				readerIds:[] ,//当前登录读者readerId
+				bookHolderIds: [],//持书者的读者readerId
+				libraryList: [] ,//图书馆列表
+				readerBookList : [] ,//图书在读者的列表
+				
+			}
+		},
+		onLoad(e) {
+			console.log(e.bookId);
+			/* this.getBookByBookId(e.bookId);
+			this.getRealBookByBookId(e.bookId); */
+			this.getLibraryBookList(e.bookId);
+			this.getReaderBookList(e.bookId);
+			this.getReaderId();
+		},
+		methods: {
+			bookAuthor:function(e){
+				var e1 = e + " ";			
+				return e1.length;
+				},
+			//根据bookId获取图书信息以及图书馆信息
+			async getLibraryBookList(e) {
+				var that = this;
+				await getApp().myRequest({
+					url: "book/getLibraryBookList?bookId="+e,
+					type: 'GET'
+				}).then(res => {
+					console.log("LibraryBookList",res.list)
+					this.libraryList = res.list;
+					console.log("res.list",res.list)
+					console.log("res.list.libraryCanBorrowCount",res.list[0].libraryCanBorrowCount)
+					this.book = res.book
+				}).catch(err => {
+					console.log("err", err);
+				})
+			},
+			//根据bookId获取图书信息以及读者信息
+			async getReaderBookList(e) {
+				var that = this;
+				await getApp().myRequest({
+					url: "book/getReaderBookList?bookId="+e,
+					type: 'GET'
+				}).then(res => {
+					console.log("ReaderBookList",res.list)
+					that.readerBookList = res.list;
+					
+				}).catch(err => {
+					console.log("err", err);
+				})
+			},
+			//查看当前登录读者的readerId
+			async getReaderId(){
+				var that = this;
+				var params = {
+					url: "reader/readerId",
+					type: 'GET'
+				}
+				const res = await app.myRequest(params)
+				console.log("getReaderId",res)
+				that.readerIds = res;
+				//return res;
+			},
+			//图书馆借走
+			async borrowItLibrary(e,w,s) {
+				let that = this;
+				// 调起条码扫描
+				uni.scanCode({
+				    scanType: ['barCode'],
+				    success: function (res) {
+				        console.log('条码类型：' + res.scanType);
+				        console.log('条码内容：' + res.result);
+						let ss =  that.borrowByFromLibrary(s,res.result)
+						
+						uni.switchTab({
+							url: '/pages/main/main'
+						});
+						
+						uni.showToast({
+							icon: 'none',
+							title: '图书自提成功！'
+						})
+						
+				    }
+				});
 
-    },
-    checkAppointment: function(){
-      uni.showToast({
-        title: '该图书正在预约中',
-        duration: 2000
-      })
-    }
-  },
-  onLoad(query){
-    //获取到图书信息
-    getBookByBookId({bookId:query.bookId}).then(({data})=>{
-      this.book = data.book;
-      this.list = data.list;
-    })
-  }
-}
+			},
+			//读者手中借走
+			async borrowIt(e,w,s) {
+				let that = this;
+				console.log(e)
+				uni.showActionSheet({
+					itemList: ['自提', '书易配送'],
+					success: function(res) {
+						console.log('选中了第' + (res.tapIndex + 1) + '个按钮');
+						if(res.tapIndex ==0){
+							// 调起条码扫描
+							uni.scanCode({
+							    scanType: ['barCode'],
+							    success: function (res) {
+							        console.log('条码类型：' + res.scanType);
+							        console.log('条码内容：' + res.result);
+									let ss =  that.borrowByFromLibrary(s,res.result)
+									
+									uni.switchTab({
+										url: '/pages/main/main'
+									});
+									
+									uni.showToast({
+										icon: 'none',
+										title: '图书自提成功！'
+									})
+									
+							    }
+							});
+							
+							
+							}else{
+								uni.navigateTo({
+									url: "/pages_borrow_books/pages/order/order?realBookId="+e+"&bookId="+that.book.bookId+"&libraryName="+w
+								})
+							}
+						
+					},
+					fail: function(res) {
+						console.log(res.errMsg);
+					}
+				});
+			
+			},
+			//预约
+			async Inappointment(e){
+				var that = this;
+				await getApp().myRequest({
+					url: "borrow/reserve?realBookId="+e,
+					type: 'GET'
+				}).then(res1 => {
+					console.log("res1",res1.message);
+					if(res1 == true){
+						/* uni.switchTab({
+							url: '/pages/main/main'
+						}); */
+						uni.showToast({
+							icon: 'none',
+							title: '预约成功！'
+						})
+						
+					}else{
+						/* uni.switchTab({
+							url: '/pages/main/main'
+						}); */
+						uni.showToast({
+							icon: 'none',
+							title: res1.message
+						})
+					}
+				}).catch(err => {
+					console.log("err", err);
+				})
+			},
+			async borrowByFromLibrary(e,w){
+				var that = this;
+				var params = {
+					url: "borrow/borrowByFromLibrary",
+					type: 'GET',
+					data:{
+						"libraryId" :e,
+						"barcode" : w
+					}
+				}
+				const borrowByFromLibrary = await app.myRequest(params);
+				console.log("borrowByFromLibrary",borrowByFromLibrary)
+				return borrowByFromLibrary
+			},
+			//图片加载不出来
+			imageError(){
+				let that = this;
+				// console.log(index)
+					that.book.picturePath = "/static/images/temporary.jpg"
+			},
+			checkAppointment: function() {
+				uni.showToast({
+					title: '该图书正在预约中',
+					duration: 2000
+				})
+			}
+		},
+		// onLoad(query) {
+		// 	//获取到图书信息
+		// 	getBookByBookId({
+		// 		bookId: query.bookId
+		// 	}).then(({
+		// 		data
+		// 	}) => {
+		// 		this.book = data.book;
+		// 		this.list = data.list;
+		// 	})
+		// }
+	}
 </script>
 
-<style>
-.book{
-  height: 350rpx;
-}
-.imag{
-  margin-left: 35%;
-  margin-top: 40rpx;
-
-}
-.book-name{
-  font-size: 36rpx;
-  color: #333333;
-  margin-top: 9rpx;
-  text-align: center;
-}
-.br3{
-  height: 26rpx;
-  background-color: #F4F5F6;
-}
-.text{
-  margin-top: 20rpx;
-  height: 200rpx;
-  margin-left: 50rpx;
-}
-.book-Name{
-  font-size: 36rpx;
-  color: #333333;
-}
-.book-author{
-  display: flex;
-  margin-top: 5rpx;
-  font-size: 26rpx;
-  color: #999999;
-}
-.book-publisher{
-  display: flex;
-  margin-top: 5rpx;
-  font-size: 26rpx;
-  color: #999999;
-}
-.book-publish-time{
-  display: flex;
-  margin-top: 5rpx;
-  font-size: 26rpx;
-  color: #999999;
-}
-/* .order-book{
-  height: 280rpx;
-  border: #18B566 1rpx solid;
-  display: flex;
-} */
-.order-book-image{
-  margin-top: 30rpx;
-  margin-left: 30rpx;
-  align-items: center;
-}
-.house-image{
-  width: 166rpx;
-  height:126rpx;
-  /* border: #000000 1rpx solid; */
-}
-.order-book-right{
-  margin-top: -140rpx;
-  margin-left: 230rpx;
-}
-.order-book-right1{
-  display: flex;
-  font-size: 26rpx;
-  color: #999999;
-  margin-top: 10rpx;
-  margin-bottom: 20rpx;
-}
-.right-name{
-  font-size: 36rpx;
-}
-.count{
-  display: flex;
-  margin-left: 30rpx;
-}
-.address{
-  display: flex;
-  margin-left: 30rpx;
-}
-.btnSubmmit{
-  margin-left: 220rpx;
-  /* line-height: center; */
-}
-.orderSubmmit{
-  background-color: #5E49F5;
-  width: 146rpx;
-  height: 46rpx;
-  border-radius: 23rpx;
-  font-size: 28rpx;
-  color: #FFFFFF;
-
-}
-.orderText{
-  margin-top: -13rpx;
-}
+<style scoped>
+	.library{
+		height: 360rpx;
+	}
+	.library-picture{
+		width: 208rpx; 
+		height: 258rpx; 
+		margin-top: 10rpx;
+		text-align: center;
+		
+	}
+	.imag{
+		/* align-items: center; */
+		text-align: center;
+		margin-top: 40rpx;
+		margin-left: 20rpx;
+		
+	}
+	.book-name{
+		font-size: 40rpx;
+		color: #333333;
+		margin-top: 9rpx;
+		align-items: center;
+		text-align: center;
+	}
+	.br3{
+		height: 26rpx;
+		background-color: #F4F5F6;
+	}
+	.show{
+		height: 100%;
+		background-color: #FFFFFF;
+	}
+	.text{
+		margin-top: 20rpx;
+		height: 200rpx;
+		margin-left: 50rpx;
+		width: auto;
+	}
+	.book-Name{
+		font-size: 36rpx;
+		color: #333333;
+	}
+	.book-author{
+		/* display: flex; */
+		margin-top: 5rpx;
+		font-size: 26rpx;
+		color: #999999;
+		width: auto;
+	}
+	.book-publisher{
+		display: flex;
+		margin-top: 5rpx;
+		font-size: 26rpx;
+		color: #999999;
+	}
+	.book-publish-time{
+		display: flex;
+		margin-top: 5rpx;
+		font-size: 26rpx;
+		color: #999999;
+	}
+	/* .order-book{
+		height: 280rpx;
+		border: #18B566 1rpx solid;
+		display: flex;
+	} */
+	.order-book-image{
+		margin-top: 30rpx;
+		margin-left: 30rpx;
+		align-items: center;
+	}
+	.house-image{
+		width: 166rpx;
+		height:126rpx;
+		/* border: #000000 1rpx solid; */
+	}
+	.order-book-right{
+		margin-top: -140rpx;
+		margin-left: 230rpx;
+	}
+	.order-book-right1{
+		display: flex;
+		font-size: 26rpx;
+		color: #999999;
+		margin-top: 30rpx;
+		margin-bottom: 20rpx;
+		margin-left: 165rpx;
+	}
+	.right-name{
+		font-size: 36rpx;
+	}
+	.count{
+		display: flex;
+		margin-left: 30rpx;
+	}
+	.address{
+		display: flex;
+		margin-left: 30rpx;
+	}
+	.btnSubmmit{
+		margin-left: 320rpx;
+		/* line-height: center; */
+		margin-top: 15rpx;
+	}
+	.orderSubmmit{
+		background-color: #5E49F5;
+		width: 146rpx;
+		height: 46rpx;
+		border-radius: 23rpx;
+		font-size: 28rpx;
+		color: #FFFFFF;
+		
+	}
+	.orderText{
+		margin-top: -13rpx;
+	}
+	.address{
+	  display: flex;
+	  margin-left: 30rpx;
+	}
 </style>
diff --git a/pages_borrow_books/pages/borrow/face_to_face.vue b/pages_borrow_books/pages/borrow/face_to_face.vue
index a5e76d597297f8e40fb3c289e0de813d94cc6dd5..109f0cda41f4e6c5e4c324366941ca4fea914c29 100644
--- a/pages_borrow_books/pages/borrow/face_to_face.vue
+++ b/pages_borrow_books/pages/borrow/face_to_face.vue
@@ -1,5 +1,13 @@
 <template>
 	<view class="show">
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="面对面借书" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
+						</view>
+					</u-navbar>
 		<view class="zt">
 			<view class="zt1">
 				温馨提示：确认收货之前，请仔细检查：包装是否完好；图书是否污损？图书是否就是您要借的书？
@@ -13,7 +21,17 @@
 </template>
 
 <script>
-	
+	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+			};
+		},
+		methods: {
+		},
+	};
 </script>
 
 <style>
diff --git a/pages_borrow_books/pages/borrow_and_return/borrow_and_return.vue b/pages_borrow_books/pages/borrow_and_return/borrow_and_return.vue
index e11d81230f9540cb8b2fb40cb4947cef73f63b8b..7f5d1a33c4d944c7cf00fe3675523f88853d7816 100644
--- a/pages_borrow_books/pages/borrow_and_return/borrow_and_return.vue
+++ b/pages_borrow_books/pages/borrow_and_return/borrow_and_return.vue
@@ -1,11 +1,19 @@
 <template>
 	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="借还记录" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
+						</view>
+					</u-navbar>
 		<!-- 搜索框开始 -->
 	<view class="top">
 	<view class="header-input">
 		<input v-model="mhcx" placeholder="输入书名查找" placeholderStyle="color:#BBBBBB" type="text"></input>
 		<view @click="goToSearch()">
-			<image class="image" src="../../static/images/search_icon.png">
+			<image class="image" src="/static/images/search_icon.png">
 			</image>
 		</view>
 	</view>
@@ -115,8 +123,8 @@
 		    <!--<view v-if="info.length==0">
 		    	您还没有记录，<span style="color: #00AAFF;">快去借书吧!</span>
 		    </view>-->
-    <view v-if="!borrowList.length">
-      您还没有记录，<span style="color: #00AAFF;">快去借书吧!</span>
+    <view v-if="!borrowList.length" @click="toBorrow()">
+		您还没有记录，<span style="color: #00AAFF;">快去借书吧!</span>
     </view>
 			<!-- 刷新 -->
 		<view class="bt" @click="goToSearch()"><button style="background-color: #6C40F3;" >刷新</button></view>
@@ -129,6 +137,9 @@ import {BorrowedRecord,payment,signFor} from "../../../api"
 	export default {
 		data() {
 			return {
+				background: {
+					background: "#6C40F3",
+				},
 				//列表数据，可根据自己的业务获取
 				csListArrl:[{
 					name:'小A',
@@ -290,6 +301,12 @@ import {BorrowedRecord,payment,signFor} from "../../../api"
 					url:'borrow_and_returnXQ?id='+this.borrow_list_id
 				})
 			},
+			//去借书
+			toBorrow(){
+				uni.navigateTo({
+				    url: '/pages/classify/classify'
+				});
+			},
       //付款弹出
       showPopup(borrow){
         this.show = true
diff --git a/pages_borrow_books/pages/borrow_and_return/borrow_and_returnXQ.vue b/pages_borrow_books/pages/borrow_and_return/borrow_and_returnXQ.vue
index 6cad465bea1b6fd44db2600f79c0ec78117d4367..5693a5d4b66e2b3aec8f890af875466a46283011 100644
--- a/pages_borrow_books/pages/borrow_and_return/borrow_and_returnXQ.vue
+++ b/pages_borrow_books/pages/borrow_and_return/borrow_and_returnXQ.vue
@@ -1,13 +1,21 @@
 <template>
 	<view>
+    <!-- 顶部 -->
+    <u-navbar zhead="65rpx" height="44" title="订单详情" title-color="white" title-size="40" :background="background"
+              back-icon-color="white" back-icon-size="50">
+      <view class="navbar-right" slot="right">
+        <view class="right_list" @click="bindInBatch">
+        </view>
+      </view>
+    </u-navbar>
 		<view class="top">
 			<view class="topone">订单编号：11120391192216</view>
 			<view class="br1"></view>
 			<!-- 中间书籍部分 -->
 			<view class="midone">
 				<view class="zhengti">
-					<navigator :url="'../Bdetail/Bdetail?isbn='+info.ISBN">
-						<image :src="info.picture_path" style="width: 140rpx;height: 180rpx;"></image>
+					<navigator :url="'../Bdetail/Bdetail?isbn=' + info.ISBN">
+						<image :src="info.picture_path" style="width: 140rpx; height: 180rpx"></image>
 					</navigator>
 				</view>
 				<view class="xq">
@@ -16,7 +24,7 @@
 						<view>作者：</view>
 						<view class="s6" v-text="info.author">大鲤鱼</view>
 					</view>
-					<view class="s2" >
+					<view class="s2">
 						<view>出版社：</view>
 						<view v-text="info.publisher">湖南文艺出版社</view>
 					</view>
@@ -28,7 +36,9 @@
 						<view class="s4" v-text="info.library">广东省立中山图书馆馆藏，广东中山图书馆</view>
 						<view class="s8">
 							<navigator url="./borrow_and_returnXQ">
-								<button class="btn1"><view class="wz">查看详情</view></button>
+								<button class="btn1">
+									<view class="wz">查看详情</view>
+								</button>
 							</navigator>
 						</view>
 					</view>
@@ -42,196 +52,199 @@
 				</view>
 				<!-- <view class="kd">
 					地址：
-					<image style="width: 30rpx; height: 30rpx;" src="../../static/images/dingwei.png"></image>
+					<image style="width: 30rpx; height: 30rpx;" src="/static/images/dingwei.png"></image>
 					<view class="s5">上海市松江区亭林镇大叶公路500号</view>
 				</view> -->
-				<view class="kd1">
-					<view>借入时间：</view>
-					<view v-text="formatDate(info.borrow_time)">2017-09-10</view>
-				</view>
-				<view class="kd1">
-					<view>还书时间：</view>
-					<view v-text="formatDate(info.needreturn_time)">2017-09-10</view>
-				</view>
-			</view>
-			<view class="br1"></view>
-		</view>
-	</view>
+        <view class="kd1">
+          <view>借入时间：</view>
+          <view v-text="formatDate(info.borrow_time)">2017-09-10</view>
+        </view>
+        <view class="kd1">
+          <view>还书时间：</view>
+          <view v-text="formatDate(info.needreturn_time)">2017-09-10</view>
+        </view>
+      </view>
+      <view class="br1"></view>
+    </view>
+  </view>
 </template>
 
 <script>
 export default {
-	data() {
-		return {
-			id:"",//借还id
-			info:{}//后台传来的信息
-		};
-	},
-	onLoad(res) {
-		this.getIDetail(res.id)
-		console.log("++++来活了",res)
-	},
-	methods: {
-		getIDetail(id){
-			uni.request({
-				 url:getApp().globalData.URL+'borrowList/borrowAndRetrueDetail',
-				 data:{
-					 borrowId:id
-				 },
-				 method:'GET',
-				 header: {
-				     'content-type': 'application/json;charset=UTF-8' // 默认值
-				   },
-				success:res =>{
-					console.log("后台传来的数据：",res.data)
-					this.info = res.data;
-					},
-				fail: (res) => {
-					this.showModal("网络错误！")
-				}
-			})
-		},
-		//日期转换方法
-		formatDate(value) {
-			let date = new Date(value);
-			let y = date.getFullYear();
-			let MM = date.getMonth() + 1;
-			MM = MM < 10 ? ('0' + MM) : MM;
-			let d = date.getDate();
-			d = d < 10 ? ('0' + d) : d;
-			let h = date.getHours();
-			h = h < 10 ? ('0' + h) : h;
-			let m = date.getMinutes();
-			m = m < 10 ? ('0'+ m) : m;
-			let s = date.getSeconds();
-			s = s < 10 ? ('0' + s) : s;
-			return y + '/' + MM + '/' + d+' '+h+':'+m+':'+s ;
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
 		},
-	}
+      id: "", //借还id
+      info: {}, //后台传来的信息
+    };
+  },
+  onLoad(res) {
+    this.getIDetail(res.id);
+    console.log("++++来活了", res);
+  },
+  methods: {
+    getIDetail(id) {
+      uni.request({
+        url: getApp().globalData.URL + "borrowList/borrowAndRetrueDetail",
+        data: {
+          borrowId: id,
+        },
+        method: "GET",
+        header: {
+          "content-type": "application/json;charset=UTF-8", // 默认值
+        },
+        success: (res) => {
+          console.log("后台传来的数据：", res.data);
+          this.info = res.data;
+        },
+        fail: (res) => {
+          this.showModal("网络错误！");
+        },
+      });
+    },
+    //日期转换方法
+    formatDate(value) {
+      let date = new Date(value);
+      let y = date.getFullYear();
+      let MM = date.getMonth() + 1;
+      MM = MM < 10 ? "0" + MM : MM;
+      let d = date.getDate();
+      d = d < 10 ? "0" + d : d;
+      let h = date.getHours();
+      h = h < 10 ? "0" + h : h;
+      let m = date.getMinutes();
+      m = m < 10 ? "0" + m : m;
+      let s = date.getSeconds();
+      s = s < 10 ? "0" + s : s;
+      return y + "/" + MM + "/" + d + " " + h + ":" + m + ":" + s;
+    },
+  },
 };
 </script>
 
 <style>
 /* 订单编号 */
 .topone {
-	height: 40rpx;
-	margin-top: 20rpx;
-	margin-left: 30rpx;
+  height: 40rpx;
+  margin-top: 20rpx;
+  margin-left: 30rpx;
 }
 .br1 {
-	width: 100%;
-	height: 3rpx;
-	background-color: #f4f5f6;
-	margin-top: 20rpx;
-	/* margin-left: 30rpx; */
+  width: 100%;
+  height: 3rpx;
+  background-color: #f4f5f6;
+  margin-top: 20rpx;
+  /* margin-left: 30rpx; */
 }
 /* 订单详情 */
 .midone {
-	display: flex;
-	/* width: 100%; */
-	height: 210rpx;
-	font-size: 30rpx;
-	margin-top: 35rpx;
-	/* align-items: center; */
-	/* background-color: #00BFFF; */
-	/* border-bottom: 1rpx solid #EBEBEB; */
+  display: flex;
+  /* width: 100%; */
+  height: 210rpx;
+  font-size: 30rpx;
+  margin-top: 35rpx;
+  /* align-items: center; */
+  /* background-color: #00BFFF; */
+  /* border-bottom: 1rpx solid #EBEBEB; */
 }
 .zhengti {
-	margin-left: 30rpx;
-	width: 125rpx;
-	height: 170rpx;
-	/* background-color: #0066CC; */
+  margin-left: 30rpx;
+  width: 125rpx;
+  height: 170rpx;
+  /* background-color: #0066CC; */
 }
 .xq {
-	margin-left: 40rpx;
-	height: 180rpx;
-	width: 500rpx;
+  margin-left: 40rpx;
+  height: 180rpx;
+  width: 500rpx;
 }
 .midwz {
-	font-size: 28rpx;
+  font-size: 28rpx;
 }
 .s1 {
-	font-size: 20rpx;
-	height: 35rpx;
-	/* margin-top: -120rpx; */
-	align-items: center;
-	/* margin-left: 190rpx; */
-	color: #999999;
-	display: flex;
-	flex-flow : row;
+  font-size: 20rpx;
+  height: 35rpx;
+  /* margin-top: -120rpx; */
+  align-items: center;
+  /* margin-left: 190rpx; */
+  color: #999999;
+  display: flex;
+  flex-flow: row;
 }
 .s2 {
-	font-size: 20rpx;
-	height: 35rpx;
-	/* margin-top: 20rpx; */
-	align-items: center;
-	/* margin-left: 190rpx; */
-	color: #999999;
-	display : flex ;
-	flex-flow : row;
+  font-size: 20rpx;
+  height: 35rpx;
+  /* margin-top: 20rpx; */
+  align-items: center;
+  /* margin-left: 190rpx; */
+  color: #999999;
+  display: flex;
+  flex-flow: row;
 }
 .s3 {
-	font-size: 20rpx;
-	height: 35rpx;
-	margin-top: 0rpx;
-	align-items: center;
-	/* margin-left: 190rpx; */
-	color: #999999;
-	display : flex ;
-	flex-flow : row;
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  /* margin-left: 190rpx; */
+  color: #999999;
+  display: flex;
+  flex-flow: row;
 }
 .s4 {
-	font-size: 24rpx;
-	height: 35rpx;
-	margin-top: 10rpx;
-	align-items: center;
-	/* margin-left: 190rpx; */
-	color: #f0ad4e;
+  font-size: 24rpx;
+  height: 35rpx;
+  margin-top: 10rpx;
+  align-items: center;
+  /* margin-left: 190rpx; */
+  color: #f0ad4e;
 }
 .s5 {
-	font-size: 24rpx;
-	height: 35rpx;
-	margin-top: -32rpx;
-	align-items: center;
-	margin-left: 110rpx;
-	color: #999999;
+  font-size: 24rpx;
+  height: 35rpx;
+  margin-top: -32rpx;
+  align-items: center;
+  margin-left: 110rpx;
+  color: #999999;
 }
 .s6 {
-	color: #00bfff;
+  color: #00bfff;
 }
 
 .s7 {
-	height: 35rpx;
-	align-items: center;
-	width: auto;
+  height: 35rpx;
+  align-items: center;
+  width: auto;
 }
 
 .s8 {
-	margin-top: 20rpx;
-	margin-left: 380rpx;
+  margin-top: 20rpx;
+  margin-left: 380rpx;
 }
 .wz {
-	font-size: 20rpx;
-	margin-top: 5rpx;
-	margin-left: 2rpx;
-	text-align: center;
-	position: absolute;
+  font-size: 20rpx;
+  margin-top: 5rpx;
+  margin-left: 2rpx;
+  text-align: center;
+  position: absolute;
 }
 /* 下半部分快递详情 */
 .below {
-	margin-top: 20rpx;
-	margin-left: 30rpx;
+  margin-top: 20rpx;
+  margin-left: 30rpx;
 }
 .kd {
-	margin-top: 10rpx;
-	font-size: 24rpx;
-	color: #000000;
+  margin-top: 10rpx;
+  font-size: 24rpx;
+  color: #000000;
 }
 .kd1 {
-	margin-top: 10rpx;
-	font-size: 24rpx;
-	color: #000000;
-	display : flex ;
-	flex-flow : row;
+  margin-top: 10rpx;
+  font-size: 24rpx;
+  color: #000000;
+  display: flex;
+  flex-flow: row;
 }
 </style>
diff --git a/pages_borrow_books/pages/components/fail.vue b/pages_borrow_books/pages/components/fail.vue
index 094acf22839a9d7a3899dceae21fcf9dd72f9cc6..2b5b8391443895998f94de32db3a9512b6c7f8c6 100644
--- a/pages_borrow_books/pages/components/fail.vue
+++ b/pages_borrow_books/pages/components/fail.vue
@@ -1,277 +1,285 @@
 <template name="Fail">
-	<view>
-		<view class="midone">
-			
-			<view class="zhengti">
-				<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-				<view class="midwz">致敬老师</view>
-				
-			</view>
-			<view >
-				<view class="s1">预约时间：2017-11-08 <image style="width: 30rpx; height: 30rpx;" src="../../static/images/location.png"></image>
-					<view class="s6">1.2km</view>
-				</view>
-				<view class="s2">上一位借书人：爱哭的猫</view>
-				<view class="s7">
-					<view class="s3">上一次还书期：无</view>
-					<view class="s4">当前状态：
-						<view class="s5">预约失败，交易终止</view>
-					</view>
-					<view class="s8">
-						<button class="btn5"><view class="wz1">删除</view></button>
-					</view>
-				</view>
-			</view>
-		</view>
-		
-		<view class="midone">
-			
-			<view class="zhengti">
-				<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-				<view class="midwz">致敬老师</view>
-				
-			</view>
-			<view >
-				<view class="s1">预约时间：2017-11-08 <image style="width: 30rpx; height: 30rpx;" src="../../static/images/location.png"></image>
-					<view class="s6">1.2km</view>
-				</view>
-				<view class="s2">上一位借书人：爱哭的猫</view>
-				<view class="s7">
-					<view class="s3">上一次还书期：无</view>
-					<view class="s4">当前状态：
-						<view class="s5">预约失败，交易终止</view>
-					</view>
-					<view class="s8">
-						<button class="btn5"><view class="wz1">删除</view></button>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
-	
+  <view>
+    <view class="midone">
+      <view class="zhengti">
+        <image
+          class="imag"
+          src="/static/images/ap.jpg"
+          style="width: 125rpx; height: 170rpx"
+        ></image>
+        <view class="midwz">致敬老师</view>
+      </view>
+      <view>
+        <view class="s1"
+          >预约时间：2017-11-08
+          <image
+            style="width: 30rpx; height: 30rpx"
+            src="/static/images/location.png"
+          ></image>
+          <view class="s6">1.2km</view>
+        </view>
+        <view class="s2">上一位借书人：爱哭的猫</view>
+        <view class="s7">
+          <view class="s3">上一次还书期：无</view>
+          <view class="s4"
+            >当前状态：
+            <view class="s5">预约失败，交易终止</view>
+          </view>
+          <view class="s8">
+            <button class="btn5"><view class="wz1">删除</view></button>
+          </view>
+        </view>
+      </view>
+    </view>
+
+    <view class="midone">
+      <view class="zhengti">
+        <image
+          class="imag"
+          src="/static/images/ap.jpg"
+          style="width: 125rpx; height: 170rpx"
+        ></image>
+        <view class="midwz">致敬老师</view>
+      </view>
+      <view>
+        <view class="s1"
+          >预约时间：2017-11-08
+          <image
+            style="width: 30rpx; height: 30rpx"
+            src="/static/images/location.png"
+          ></image>
+          <view class="s6">1.2km</view>
+        </view>
+        <view class="s2">上一位借书人：爱哭的猫</view>
+        <view class="s7">
+          <view class="s3">上一次还书期：无</view>
+          <view class="s4"
+            >当前状态：
+            <view class="s5">预约失败，交易终止</view>
+          </view>
+          <view class="s8">
+            <button class="btn5"><view class="wz1">删除</view></button>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-	  name: 'Fail',
-	  props: {
-	            
-	  },
-	  data() {
-	    return {
-	        autoplay: true,
-	        interval: 3000,
-	        duration: 500        
-	    }
-	  },
-	  methods: {
-	            
-	  }
-	}
+export default {
+  name: "Fail",
+  props: {},
+  data() {
+    return {
+      autoplay: true,
+      interval: 3000,
+      duration: 500,
+    };
+  },
+  methods: {},
+};
 </script>
 
 <style>
-	.bt{
-		margin-top: 1045rpx;
-	}
-	.mid {	
-		margin-top:20rpx;
-		width: 100%;
-		height: 200rpx;
-	}
-	.zt1{
-		color: #00BFFF;
-		font-size: 22rpx;
-		margin-left: 50rpx;
-		line-height: center;
-		margin-top: 25rpx;
-	}
-	.zt{
-		/* height: 40rpx; */
-		border-bottom:solid 1rpx;
-		/* border-top:solid 1rpx; */
-		margin-top: -5rpx;
-		height: 60rpx;
-		color: #BBBBBB;
-	}
-	.midone {
-		width: 100%;
-		height: 200rpx;
-		font-size: 30rpx;
-		margin-top: 35rpx;
-		align-items: center;
-		border-bottom: 1rpx solid #bbbbbb;
-	}
-	.zhengti {
-		display: flex;
-		width: 100%;
-	}
-	.imag{
-		margin-left:30rpx;
-	}
-	.midwz {
-		font-size: 28rpx;
-		height:35rpx;
-		margin-top: -5rpx;
-		align-items: center;
-		margin-left: 30rpx;
-		width: auto;
-		/* background-color:  #333333; */
-	}
-	.s1{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: -120rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-		display: flex;
-	}
-	.s2{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-	.s3{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-	.s4{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #F0AD4E;
-	}
-	.s5{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: -26rpx;
-		align-items: center;
-		margin-left: 100rpx;
-		color: #555555;
-	}
-	.s6{
-		color: #DD524D;
-		
-	}
-	
-	.s7{
-		height:35rpx;
-		align-items: center;
-		width: auto;
-		/* display: flex; */
-	}
-	
-	.s8{
-		text-align: center;
-	}
-	.s9{
-		position: relative;
-		margin-left: 300rpx;
-		margin-top: -5rpx;
-		height: 20rpx;
-		width: 100rpx;
-	}
-	.btn1{
-		color: #F8F8F8;
-		width: 137rpx;
-		height: 55rpx;
-		margin-right: 20rpx;
-		margin-top: -60rpx;
-		background-color: #00BFFF;
-		border-radius: 15rpx;
-		}
-	.btn2{
-		color: #F8F8F8;
-		width: 137rpx;
-		height: 55rpx;
-		margin-right: 20rpx;
-		margin-top: -60rpx;
-		background-color: #F0AD4E;
-		border-radius: 15rpx;
-		}
-	.btn3{
-			color: #F8F8F8;
-			width: 137rpx;
-			height: 55rpx;
-			margin-right: 20rpx;
-			margin-top: -60rpx;
-			background-color: #4CD964;
-			border-radius: 15rpx;
-			}
-	.btn4{
-			color: #F8F8F8;
-			width: 137rpx;
-			height: 55rpx;
-			
-			background-color: #00BFFF;
-			border-radius: 15rpx;
-			position: relative;
-			}
-	.btn5{
-		color: #F8F8F8;
-		width: 137rpx;
-		height: 55rpx;
-		margin-right: 20rpx;
-		margin-top: -60rpx;
-		background-color: #DD524D;
-		border-radius: 15rpx;
-		text-align: center;
-		}
-	.flesh{
-		
-	}
-	.wz{
-		font-size: 16rpx;
-		margin-top: 8rpx;
-		/* width: 137rpx; */
-		margin-left: 5rpx;
-		text-align: center;
-		position: absolute;
-	}
-	.wz1{
-		font-size: 16rpx;
-		margin-top: 8rpx;
-		/* width: 137rpx; */
-		margin-left: 20rpx;
-		text-align: center;
-		position: absolute;
-	}
-	.shumu {
-		margin-left: 180rpx;
-		font-size: 25rpx;
-		margin-top: -130rpx;
-		color:   #999999;
-		width: 120rpx;
-		display: block;
-	}
-	.shumuone{
-		margin-left: 180rpx;
-		font-size: 25rpx;
-		color: #999999;
-		/* background-color: #4CD964; */
-	}
-	.shumutwo{
-		margin-left: 250rpx;
-		font-size: 20rpx;
-		color:  #00BFFF;
-		margin-top: -30rpx;
-		/* background-color: #F0AD4E; */
-	}
-	.shumuthree{
-		margin-top: 10rpx;
-		font-size: 25rpx;
-		color: #F0AD4E;
-		margin-left: 180rpx;
-	}
-	
+.bt {
+  margin-top: 1045rpx;
+}
+.mid {
+  margin-top: 20rpx;
+  width: 100%;
+  height: 200rpx;
+}
+.zt1 {
+  color: #00bfff;
+  font-size: 22rpx;
+  margin-left: 50rpx;
+  line-height: center;
+  margin-top: 25rpx;
+}
+.zt {
+  /* height: 40rpx; */
+  border-bottom: solid 1rpx;
+  /* border-top:solid 1rpx; */
+  margin-top: -5rpx;
+  height: 60rpx;
+  color: #bbbbbb;
+}
+.midone {
+  width: 100%;
+  height: 200rpx;
+  font-size: 30rpx;
+  margin-top: 35rpx;
+  align-items: center;
+  border-bottom: 1rpx solid #bbbbbb;
+}
+.zhengti {
+  display: flex;
+  width: 100%;
+}
+.imag {
+  margin-left: 30rpx;
+}
+.midwz {
+  font-size: 28rpx;
+  height: 35rpx;
+  margin-top: -5rpx;
+  align-items: center;
+  margin-left: 30rpx;
+  width: auto;
+  /* background-color:  #333333; */
+}
+.s1 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -120rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+  display: flex;
+}
+.s2 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+.s3 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+.s4 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #f0ad4e;
+}
+.s5 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -26rpx;
+  align-items: center;
+  margin-left: 100rpx;
+  color: #555555;
+}
+.s6 {
+  color: #dd524d;
+}
+
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  /* display: flex; */
+}
+
+.s8 {
+  text-align: center;
+}
+.s9 {
+  position: relative;
+  margin-left: 300rpx;
+  margin-top: -5rpx;
+  height: 20rpx;
+  width: 100rpx;
+}
+.btn1 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #00bfff;
+  border-radius: 15rpx;
+}
+.btn2 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #f0ad4e;
+  border-radius: 15rpx;
+}
+.btn3 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #4cd964;
+  border-radius: 15rpx;
+}
+.btn4 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+
+  background-color: #00bfff;
+  border-radius: 15rpx;
+  position: relative;
+}
+.btn5 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #dd524d;
+  border-radius: 15rpx;
+  text-align: center;
+}
+.flesh {
+}
+.wz {
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 5rpx;
+  text-align: center;
+  position: absolute;
+}
+.wz1 {
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 20rpx;
+  text-align: center;
+  position: absolute;
+}
+.shumu {
+  margin-left: 180rpx;
+  font-size: 25rpx;
+  margin-top: -130rpx;
+  color: #999999;
+  width: 120rpx;
+  display: block;
+}
+.shumuone {
+  margin-left: 180rpx;
+  font-size: 25rpx;
+  color: #999999;
+  /* background-color: #4CD964; */
+}
+.shumutwo {
+  margin-left: 250rpx;
+  font-size: 20rpx;
+  color: #00bfff;
+  margin-top: -30rpx;
+  /* background-color: #F0AD4E; */
+}
+.shumuthree {
+  margin-top: 10rpx;
+  font-size: 25rpx;
+  color: #f0ad4e;
+  margin-left: 180rpx;
+}
 </style>
diff --git a/pages_borrow_books/pages/components/logistic.vue b/pages_borrow_books/pages/components/logistic.vue
index 3d91856933f485830555b6956b3fb3ada06c09da..2d17d3a78f1f1d00085e49abe15cecbf4344a4b9 100644
--- a/pages_borrow_books/pages/components/logistic.vue
+++ b/pages_borrow_books/pages/components/logistic.vue
@@ -1,263 +1,275 @@
 <template name="Logistic">
-	<view class="midone">
-		
-		
-			<view class="zhengti">
-				<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-				<view class="">
-				<view class="midwz">致敬老师</view>
-			</view>
-			<view class="s9">
-				<navigator url="/pages_borrow_books/pages/appointment/confirm">
-					<button class="btn4"><view class="wz">确认收货</view></button>
-				</navigator>
-			</view>
-		</view>
-		<view >
-			<view class="">
-				<view class="s1">预约时间：2017-11-08 <image style="width: 30rpx; height: 30rpx;" src="../../static/images/location.png"></image>
-					<view class="s6">1.2km</view>
-				</view>
-				<view class="s2">上一位借书人：爱哭的猫</view>
-				<view class="s8">
-					<button class="btn2"><view class="wz">联系还书人</view></button>
-				</view>
-			</view>
-			
-			<view class="s7">
-				<view class="s3">上一次还书期：2017-09-10</view>
-				<view class="s4">当前状态：
-					<view class="s5">等待持书人还书</view>
-				</view>
-				<view class="s8">
-					<navigator url="/pages_borrow_books/pages/appointment/logistics">
-						<button class="btn3"><view class="wz">查看物流</view></button>
-					</navigator>
-				</view>
-			</view>
-			
-		</view>
-		
-	</view>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="物流配送中" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
+						</view>
+					</u-navbar>
+  <view class="midone">
+    <view class="zhengti">
+      <image
+        class="imag"
+        src="/static/images/ap.jpg"
+        style="width: 125rpx; height: 170rpx"
+      ></image>
+      <view class="">
+        <view class="midwz">致敬老师</view>
+      </view>
+      <view class="s9">
+        <navigator url="/pages_borrow_books/pages/appointment/confirm">
+          <button class="btn4"><view class="wz">确认收货</view></button>
+        </navigator>
+      </view>
+    </view>
+    <view>
+      <view class="">
+        <view class="s1"
+          >预约时间：2017-11-08
+          <image
+            style="width: 30rpx; height: 30rpx"
+            src="/static/images/location.png"
+          ></image>
+          <view class="s6">1.2km</view>
+        </view>
+        <view class="s2">上一位借书人：爱哭的猫</view>
+        <view class="s8">
+          <button class="btn2"><view class="wz">联系还书人</view></button>
+        </view>
+      </view>
+
+      <view class="s7">
+        <view class="s3">上一次还书期：2017-09-10</view>
+        <view class="s4"
+          >当前状态：
+          <view class="s5">等待持书人还书</view>
+        </view>
+        <view class="s8">
+          <navigator url="/pages_borrow_books/pages/appointment/logistics">
+            <button class="btn3"><view class="wz">查看物流</view></button>
+          </navigator>
+        </view>
+      </view>
+    </view>
+  </view>
+  </view>
 </template>
 
 <script>
-	export default {
-	  name: 'Logistic',
-	  props: {
-	            
-	  },
-	  data() {
-	    return {
-	                
-	    }
-	  },
-	  methods: {
-	            
-	  }
-	}
+export default {
+  name: "Logistic",
+  props: {},
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
+		},
+	};
+  },
+  methods: {},
+};
 </script>
 
 <style>
-	.bt{
-		margin-top: 1045rpx;
-	}
-	.mid {	
-		margin-top:20rpx;
-		width: 100%;
-		height: 200rpx;
-	}
-	.zt1{
-		color: #00BFFF;
-		font-size: 22rpx;
-		margin-left: 50rpx;
-		line-height: center;
-		margin-top: 25rpx;
-	}
-	.zt{
-		/* height: 40rpx; */
-		border-bottom:solid 1rpx;
-		/* border-top:solid 1rpx; */
-		margin-top: -5rpx;
-		height: 60rpx;
-		color: #BBBBBB;
-	}
-	.midone {
-		width: 100%;
-		height: 200rpx;
-		font-size: 30rpx;
-		margin-top: 35rpx;
-		align-items: center;
-		border-bottom: 1rpx solid #bbbbbb;
-	}
-	.zhengti {
-		display: flex;
-		width: 100%;
-	}
-	.imag{
-		margin-left:30rpx;
-	}
-	.midwz {
-		font-size: 28rpx;
-		height:35rpx;
-		margin-top: -5rpx;
-		align-items: center;
-		margin-left: 40rpx;
-		width: auto;
-		/* background-color:  #333333; */
-	}
-	.s1{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: -120rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-		display: flex;
-	}
-	.s2{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-	.s3{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-	.s4{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #F0AD4E;
-	}
-	.s5{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: -26rpx;
-		align-items: center;
-		margin-left: 100rpx;
-		color: #555555;
-	}
-	.s6{
-		color: #DD524D;
-		
-	}
-	
-	.s7{
-		height:35rpx;
-		align-items: center;
-		width: auto;
-		/* display: flex; */
-	}
-	
-	.s8{
-		text-align: center;
-	}
-	.s9{
-		position: relative;
-		/* margin-left:300rpx; */
-		margin-left: 40%;
-		margin-top: -5rpx;
-		height: 20rpx;
-		width: 100rpx;
-	}
-	.btn1{
-		color: #F8F8F8;
-		width: 137rpx;
-		height: 55rpx;
-		margin-right: 20rpx;
-		margin-top: -60rpx;
-		background-color: #00BFFF;
-		border-radius: 15rpx;
-		}
-	.btn2{
-		color: #F8F8F8;
-		width: 137rpx;
-		height: 55rpx;
-		margin-right: 20rpx;
-		margin-top: -60rpx;
-		background-color: #F0AD4E;
-		border-radius: 15rpx;
-		}
-	.btn3{
-			color: #F8F8F8;
-			width: 137rpx;
-			height: 55rpx;
-			margin-right: 20rpx;
-			margin-top: -60rpx;
-			background-color: #4CD964;
-			border-radius: 15rpx;
-			}
-	.btn4{
-			color: #F8F8F8;
-			width: 137rpx;
-			height: 55rpx;
-			background-color: #00BFFF;
-			border-radius: 15rpx;
-			position: relative;
-			}
-	.btn5{
-		color: #F8F8F8;
-		width: 137rpx;
-		height: 55rpx;
-		margin-right: 20rpx;
-		margin-top: -60rpx;
-		background-color: #DD524D;
-		border-radius: 15rpx;
-		text-align: center;
-		}
-	
-	.wz{
-		font-size: 16rpx;
-		margin-top: 8rpx;
-		/* width: 137rpx; */
-		margin-left: 5rpx;
-		text-align: center;
-		position: absolute;
-	}
-	.wz1{
-		font-size: 16rpx;
-		margin-top: 8rpx;
-		/* width: 137rpx; */
-		margin-left: 20rpx;
-		text-align: center;
-		position: absolute;
-	}
-	.shumu {
-		margin-left: 180rpx;
-		font-size: 25rpx;
-		margin-top: -130rpx;
-		color:   #999999;
-		width: 120rpx;
-		display: block;
-	}
-	.shumuone{
-		margin-left: 180rpx;
-		font-size: 25rpx;
-		color: #999999;
-		/* background-color: #4CD964; */
-	}
-	.shumutwo{
-		margin-left: 250rpx;
-		font-size: 20rpx;
-		color:  #00BFFF;
-		margin-top: -30rpx;
-		/* background-color: #F0AD4E; */
-	}
-	.shumuthree{
-		margin-top: 10rpx;
-		font-size: 25rpx;
-		color: #F0AD4E;
-		margin-left: 180rpx;
-	}
-	
+.bt {
+  margin-top: 1045rpx;
+}
+.mid {
+  margin-top: 20rpx;
+  width: 100%;
+  height: 200rpx;
+}
+.zt1 {
+  color: #00bfff;
+  font-size: 22rpx;
+  margin-left: 50rpx;
+  line-height: center;
+  margin-top: 25rpx;
+}
+.zt {
+  /* height: 40rpx; */
+  border-bottom: solid 1rpx;
+  /* border-top:solid 1rpx; */
+  margin-top: -5rpx;
+  height: 60rpx;
+  color: #bbbbbb;
+}
+.midone {
+  width: 100%;
+  height: 200rpx;
+  font-size: 30rpx;
+  margin-top: 35rpx;
+  align-items: center;
+  border-bottom: 1rpx solid #bbbbbb;
+}
+.zhengti {
+  display: flex;
+  width: 100%;
+}
+.imag {
+  margin-left: 30rpx;
+}
+.midwz {
+  font-size: 28rpx;
+  height: 35rpx;
+  margin-top: -5rpx;
+  align-items: center;
+  margin-left: 40rpx;
+  width: auto;
+  /* background-color:  #333333; */
+}
+.s1 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -120rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+  display: flex;
+}
+.s2 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+.s3 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+.s4 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #f0ad4e;
+}
+.s5 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -26rpx;
+  align-items: center;
+  margin-left: 100rpx;
+  color: #555555;
+}
+.s6 {
+  color: #dd524d;
+}
+
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  /* display: flex; */
+}
+
+.s8 {
+  text-align: center;
+}
+.s9 {
+  position: relative;
+  /* margin-left:300rpx; */
+  margin-left: 40%;
+  margin-top: -5rpx;
+  height: 20rpx;
+  width: 100rpx;
+}
+.btn1 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #00bfff;
+  border-radius: 15rpx;
+}
+.btn2 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #f0ad4e;
+  border-radius: 15rpx;
+}
+.btn3 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #4cd964;
+  border-radius: 15rpx;
+}
+.btn4 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  background-color: #00bfff;
+  border-radius: 15rpx;
+  position: relative;
+}
+.btn5 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #dd524d;
+  border-radius: 15rpx;
+  text-align: center;
+}
+
+.wz {
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 5rpx;
+  text-align: center;
+  position: absolute;
+}
+.wz1 {
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 20rpx;
+  text-align: center;
+  position: absolute;
+}
+.shumu {
+  margin-left: 180rpx;
+  font-size: 25rpx;
+  margin-top: -130rpx;
+  color: #999999;
+  width: 120rpx;
+  display: block;
+}
+.shumuone {
+  margin-left: 180rpx;
+  font-size: 25rpx;
+  color: #999999;
+  /* background-color: #4CD964; */
+}
+.shumutwo {
+  margin-left: 250rpx;
+  font-size: 20rpx;
+  color: #00bfff;
+  margin-top: -30rpx;
+  /* background-color: #F0AD4E; */
+}
+.shumuthree {
+  margin-top: 10rpx;
+  font-size: 25rpx;
+  color: #f0ad4e;
+  margin-left: 180rpx;
+}
 </style>
diff --git a/pages_borrow_books/pages/components/orders.vue b/pages_borrow_books/pages/components/orders.vue
index e6329a87a6a3a41448502d7ef1ab457178ffc53e..b5d1a704747ea0f5aa3678b6743701f011f60e7d 100644
--- a/pages_borrow_books/pages/components/orders.vue
+++ b/pages_borrow_books/pages/components/orders.vue
@@ -1,372 +1,402 @@
 <template name="Orders">
-	<view class="order">
-		<view class="one">
-			<view class="per" style="color: #FFA500; font-size: 28rpx;">
-				<view class="per1">爱哭的猫</view>
-			</view>
-			<view class="midone">
-				<view class="zhengti">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">致敬老师</view>
-				</view>
-				<view >
-					<view class="s1">预约时间：2017-11-08 <image style="width: 30rpx; height: 30rpx;" src="../../static/images/location.png"></image>
-						<view class="s6">1.2km</view>
-					</view>
-					<view class="s2">上一位借书人：爱哭的猫</view>
-					<view class="s7">
-						<view class="s3">上一次还书期：2017-09-10</view>
-						<view class="s4">当前状态：
-							<view class="s5">等待持书人还书</view>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="线上预约" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
 						</view>
-					</view>
-				</view>
-			</view>
-			<view class="midone">
-				
-				<view class="zhengti">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">致敬老师</view>
-				</view>
-				<view >
-					<view class="s1">预约时间：2017-11-08 <image style="width: 30rpx; height: 30rpx;" src="../../static/images/location.png"></image>
-						<view class="s6">1.2km</view>
-					</view>
-					<view class="s2">上一位借书人：爱哭的猫</view>
-					<view class="s7">
-						<view class="s3">上一次还书期：2017-09-10</view>
-						<view class="s4">当前状态：
-							<view class="s5">等待持书人还书</view>
-						</view>
-					</view>
-				</view>
-			</view>
-			<view class="s8">
-				<view class="tt1">
-					<view class="t1">共</view>
-					<view class="t1" style="color: #DD524D;">2</view>
-					<view class="t1">本</view>
-				</view>
-				
-				<view class="tt2">
-					<navigator url="/pages_borrow_books/pages/appointment/abolish">
-						<button class="btn1">
-							<view class="wz">取消预约</view>
-						</button>
-					</navigator>
-				</view>
-				
-			</view>
-		</view>
-		<view class="one">
-			<view class="per" style="color: #FFA500; font-size: 28rpx;">
-				<view class="per1">爱哭的猫</view>
-			</view>
-			<view class="midone">
-				
-				<view class="zhengti">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">致敬老师</view>
-				</view>
-				<view >
-					<view class="s1">预约时间：2017-11-08 <image style="width: 30rpx; height: 30rpx;" src="../../static/images/location.png"></image>
-						<view class="s6">1.2km</view>
-					</view>
-					<view class="s2">上一位借书人：爱哭的猫</view>
-					<view class="s7">
-						<view class="s3">上一次还书期：2017-09-10</view>
-						<view class="s4">当前状态：
-							<view class="s5">等待持书人还书</view>
-						</view>
-					</view>
-				</view>
-			</view>
-			<view class="s8">
-				<view class="tt1">
-					<view class="t1">共</view>
-					<view class="t1" style="color: #DD524D;">1</view>
-					<view class="t1">本</view>
-				</view>
-				
-				<view class="tt2">
-					<navigator url="/pages_borrow_books/pages/appointment/abolish ">
-						<button class="btn1">
-							<view class="wz">取消预约</view>
-						</button>
-					</navigator>
-				</view>
-			</view>
-			<view class="bt">
-				<button class="btn">刷新</button>
-			</view>
-		</view>
-	</view>
-    
+					</u-navbar>
+  <view class="order">
+    <view class="one">
+      <view class="per" style="color: #ffa500; font-size: 28rpx">
+        <view class="per1">爱哭的猫</view>
+      </view>
+      <view class="midone">
+        <view class="zhengti">
+          <image
+            class="imag"
+            src="/static/images/ap.jpg"
+            style="width: 125rpx; height: 170rpx"
+          ></image>
+          <view class="midwz">致敬老师</view>
+        </view>
+        <view>
+          <view class="s1"
+            >预约时间：2017-11-08
+            <image
+              style="width: 30rpx; height: 30rpx"
+              src="/static/images/location.png"
+            ></image>
+            <view class="s6">1.2km</view>
+          </view>
+          <view class="s2">上一位借书人：爱哭的猫</view>
+          <view class="s7">
+            <view class="s3">上一次还书期：2017-09-10</view>
+            <view class="s4"
+              >当前状态：
+              <view class="s5">等待持书人还书</view>
+            </view>
+          </view>
+        </view>
+      </view>
+      <view class="midone">
+        <view class="zhengti">
+          <image
+            class="imag"
+            src="/static/images/ap.jpg"
+            style="width: 125rpx; height: 170rpx"
+          ></image>
+          <view class="midwz">致敬老师</view>
+        </view>
+        <view>
+          <view class="s1"
+            >预约时间：2017-11-08
+            <image
+              style="width: 30rpx; height: 30rpx"
+              src="/static/images/location.png"
+            ></image>
+            <view class="s6">1.2km</view>
+          </view>
+          <view class="s2">上一位借书人：爱哭的猫</view>
+          <view class="s7">
+            <view class="s3">上一次还书期：2017-09-10</view>
+            <view class="s4"
+              >当前状态：
+              <view class="s5">等待持书人还书</view>
+            </view>
+          </view>
+        </view>
+      </view>
+      <view class="s8">
+        <view class="tt1">
+          <view class="t1">共</view>
+          <view class="t1" style="color: #dd524d">2</view>
+          <view class="t1">本</view>
+        </view>
+
+        <view class="tt2">
+          <navigator url="/pages_borrow_books/pages/appointment/abolish">
+            <button class="btn1">
+              <view class="wz">取消预约</view>
+            </button>
+          </navigator>
+        </view>
+      </view>
+    </view>
+    <view class="one">
+      <view class="per" style="color: #ffa500; font-size: 28rpx">
+        <view class="per1">爱哭的猫</view>
+      </view>
+      <view class="midone">
+        <view class="zhengti">
+          <image
+            class="imag"
+            src="/static/images/ap.jpg"
+            style="width: 125rpx; height: 170rpx"
+          ></image>
+          <view class="midwz">致敬老师</view>
+        </view>
+        <view>
+          <view class="s1"
+            >预约时间：2017-11-08
+            <image
+              style="width: 30rpx; height: 30rpx"
+              src="/static/images/location.png"
+            ></image>
+            <view class="s6">1.2km</view>
+          </view>
+          <view class="s2">上一位借书人：爱哭的猫</view>
+          <view class="s7">
+            <view class="s3">上一次还书期：2017-09-10</view>
+            <view class="s4"
+              >当前状态：
+              <view class="s5">等待持书人还书</view>
+            </view>
+          </view>
+        </view>
+      </view>
+      <view class="s8">
+        <view class="tt1">
+          <view class="t1">共</view>
+          <view class="t1" style="color: #dd524d">1</view>
+          <view class="t1">本</view>
+        </view>
+
+        <view class="tt2">
+          <navigator url="/pages_borrow_books/pages/appointment/abolish ">
+            <button class="btn1">
+              <view class="wz">取消预约</view>
+            </button>
+          </navigator>
+        </view>
+      </view>
+      <view class="bt">
+        <button class="btn">刷新</button>
+      </view>
+    </view>
+  </view>
+  </view>
 </template>
 
 <script>
-	export default {
-	  name: 'Orders',
-	  props: {
-	            
-	  },
-	  data() {
-	    return {
-	                
-	    }
-	  },
-	  methods: {
-	            
-	  }
-	}
-</script>　
+export default {
+  name: "Orders",
+  props: {},
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
+		},
+	};
+  },
+  methods: {},
+};
+</script>
+　
+
+<style lang="scss">
+.per {
+  margin-bottom: 30upx;
+  // align-items: center;
+  width: 100%;
+  margin-top: 20upx;
+  height: 60upx;
+  border-bottom: 1upx solid #bbbbbb;
+}
+.btn {
+  height: 80upx;
+  // width: 300upx;
+  color: #00bfff;
+  border-radius: 0upx;
+}
+.per1 {
+  margin-left: 50upx;
+}
+.t1 {
+  margin-left: 10upx;
+  // align-items: center;
+}
+.tt1 {
+  display: flex;
+  margin-left: 50upx;
+  font-size: 25upx;
+  color: #808080;
+  margin-top: -20upx;
+}
+.tt2 {
+  text-align: center;
+  font-size: 23upx;
+  margin-left: 500upx;
+  margin-bottom: 30upx;
+}
+
+.s8 {
+  margin-top: 50upx;
+  border-bottom: 1upx solid #bbbbbb;
+}
+
+.btn {
+  background-color: #00bfff;
+  margin-top: -15upx;
+  color: #ffffff;
+}
+.mid {
+  margin-top: 20rpx;
+  width: 100%;
+  height: 300rpx;
+}
+.zt1 {
+  color: #00bfff;
+  font-size: 22rpx;
+  margin-left: 50rpx;
+  line-height: center;
+  margin-top: 25rpx;
+}
+.zt {
+  /* height: 40rpx; */
+  border-bottom: solid 1rpx;
+  /* border-top:solid 1rpx; */
+  margin-top: -5rpx;
+  height: 80rpx;
+  color: #bbbbbb;
+}
+.midone {
+  width: 100%;
+  height: 240rpx;
+  font-size: 30rpx;
+  margin-top: 35rpx;
+  align-items: center;
+  border-bottom: 1rpx solid #bbbbbb;
+  // border-top: 1rpx solid #bbbbbb;
+}
+.zhengti {
+  display: flex;
+  width: 100%;
+  margin-top: 40upx;
+}
+.imag {
+  margin-left: 30rpx;
+}
+.midwz {
+  font-size: 28rpx;
+  height: 35rpx;
+  margin-top: -5rpx;
+  align-items: center;
+  margin-left: 30rpx;
+  width: auto;
+  /* background-color:  #333333; */
+}
+.s1 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -120rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+  display: flex;
+}
+.s2 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+.s3 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+.s4 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #f0ad4e;
+}
+.s5 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -26rpx;
+  align-items: center;
+  margin-left: 100rpx;
+  color: #555555;
+}
+.s6 {
+  color: #dd524d;
+}
+
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  /* display: flex; */
+}
+
+.s9 {
+  position: relative;
+  margin-left: 300rpx;
+  margin-top: -5rpx;
+  height: 20rpx;
+  width: 100rpx;
+}
+.btn1 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -45rpx;
+  align-items: center;
+  background-color: #00bfff;
+  border-radius: 15rpx;
+}
+.btn2 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #f0ad4e;
+  border-radius: 15rpx;
+}
+.btn3 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #4cd964;
+  border-radius: 15rpx;
+}
+.btn4 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
 
-<style>
-  .per{
-	  margin-bottom: 30upx;
-	  // align-items: center;
-	  width: 100%;
-	  margin-top: 20upx;
-	  height: 60upx;
-	  border-bottom: 1upx solid #bbbbbb;
-  }
-  .btn{
-	  height: 80upx;
-	  // width: 300upx;
-	  color: 	#00BFFF;
-	  border-radius: 0upx;
-  }
-  .per1{
-  	  margin-left: 50upx;
-  }
-  .t1{
-  	  margin-left: 10upx;
-	  // align-items: center;
-  }
- .tt1{
-	 display: flex;
-	 margin-left: 50upx;
-	 font-size: 25upx;
-	 color: #808080;
-	 margin-top: -20upx;
- }
- .tt2{
-	 text-align: center;
-	 font-size: 23upx;
-	 margin-left: 500upx;
-	 margin-bottom: 30upx;
- }
- 
- .s8{
- 	margin-top: 50upx;
- 	border-bottom: 1upx solid #BBBBBB;
-	
- }
-  
-  .btn{
-	  background-color:#00BFFF;
-	  margin-top: -15upx;
-	  color: #FFFFFF;
-  }
-  .mid {	
-  	margin-top:20rpx;
-  	width: 100%;
-  	height: 300rpx;
-  }
-  .zt1{
-  	color: #00BFFF;
-  	font-size: 22rpx;
-  	margin-left: 50rpx;
-  	line-height: center;
-  	margin-top: 25rpx;
-  }
-  .zt{
-  	/* height: 40rpx; */
-  	border-bottom:solid 1rpx;
-  	/* border-top:solid 1rpx; */
-  	margin-top: -5rpx;
-  	height: 80rpx;
-  	color: #BBBBBB;
-  }
-  .midone {
-  	width: 100%;
-  	height: 240rpx;
-  	font-size: 30rpx;
-  	margin-top: 35rpx;
-  	align-items: center;
-  	border-bottom: 1rpx solid #bbbbbb;
-	// border-top: 1rpx solid #bbbbbb;
-  }
-  .zhengti {
-  	display: flex;
-  	width: 100%;
-	margin-top: 40upx;
-  }
-  .imag{
-  	margin-left:30rpx;
-  }
-  .midwz {
-  	font-size: 28rpx;
-  	height:35rpx;
-  	margin-top: -5rpx;
-  	align-items: center;
-  	margin-left: 30rpx;
-  	width: auto;
-  	/* background-color:  #333333; */
-  }
-  .s1{
-  	font-size: 20rpx;
-  	height:35rpx;
-  	margin-top: -120rpx;
-  	align-items: center;
-  	margin-left: 190rpx;
-  	color: #999999;
-  	display: flex;
-  }
-  .s2{
-  	font-size: 20rpx;
-  	height:35rpx;
-  	margin-top: 0rpx;
-  	align-items: center;
-  	margin-left: 190rpx;
-  	color: #999999;
-  }
-  .s3{
-  	font-size: 20rpx;
-  	height:35rpx;
-  	margin-top: 0rpx;
-  	align-items: center;
-  	margin-left: 190rpx;
-  	color: #999999;
-  }
-  .s4{
-  	font-size: 20rpx;
-  	height:35rpx;
-  	margin-top: 0rpx;
-  	align-items: center;
-  	margin-left: 190rpx;
-  	color: #F0AD4E;
-  }
-  .s5{
-  	font-size: 20rpx;
-  	height:35rpx;
-  	margin-top: -26rpx;
-  	align-items: center;
-  	margin-left: 100rpx;
-  	color: #555555;
-  }
-  .s6{
-  	color: #DD524D;
-  	
-  }
-  
-  .s7{
-  	height:35rpx;
-  	align-items: center;
-  	width: auto;
-  	/* display: flex; */
-  }
-  
-  
-  
-  .s9{
-  	position: relative;
-  	margin-left: 300rpx;
-  	margin-top: -5rpx;
-  	height: 20rpx;
-  	width: 100rpx;
-  }
-  .btn1{
-  	color: #F8F8F8;
-  	width: 137rpx;
-  	height: 55rpx;
-  	margin-right: 20rpx;
-  	margin-top: -45rpx;
-	align-items: center;
-  	background-color: #00BFFF;
-  	border-radius: 15rpx;
-  	}
-  .btn2{
-  	color: #F8F8F8;
-  	width: 137rpx;
-  	height: 55rpx;
-  	margin-right: 20rpx;
-  	margin-top: -60rpx;
-  	background-color: #F0AD4E;
-  	border-radius: 15rpx;
-  	}
-  .btn3{
-  		color: #F8F8F8;
-  		width: 137rpx;
-  		height: 55rpx;
-  		margin-right: 20rpx;
-  		margin-top: -60rpx;
-  		background-color: #4CD964;
-  		border-radius: 15rpx;
-  		}
-  .btn4{
-  		color: #F8F8F8;
-  		width: 137rpx;
-  		height: 55rpx;
-  		
-  		background-color: #00BFFF;
-  		border-radius: 15rpx;
-  		position: relative;
-  		}
-  .btn5{
-  	color: #F8F8F8;
-  	width: 137rpx;
-  	height: 55rpx;
-  	margin-right: 20rpx;
-  	margin-top: -60rpx;
-  	background-color: #DD524D;
-  	border-radius: 15rpx;
-  	text-align: center;
-  	}
-  .flesh{
-  	
-  }
-  .wz{
-  	font-size: 16rpx;
-  	margin-top: 8rpx;
-  	/* width: 137rpx; */
-  	margin-left: 5rpx;
-  	text-align: center;
-  	position: absolute;
-  }
-  .wz1{
-  	font-size: 16rpx;
-  	margin-top: 8rpx;
-  	/* width: 137rpx; */
-  	margin-left: 20rpx;
-  	text-align: center;
-  	position: absolute;
-  }
-  .shumu {
-  	margin-left: 180rpx;
-  	font-size: 25rpx;
-  	margin-top: -130rpx;
-  	color:   #999999;
-  	width: 120rpx;
-  	display: block;
-  }
-  .shumuone{
-  	margin-left: 180rpx;
-  	font-size: 25rpx;
-  	color: #999999;
-  	/* background-color: #4CD964; */
-  }
-  .shumutwo{
-  	margin-left: 250rpx;
-  	font-size: 20rpx;
-  	color:  #00BFFF;
-  	margin-top: -30rpx;
-  	/* background-color: #F0AD4E; */
-  }
-  .shumuthree{
-  	margin-top: 10rpx;
-  	font-size: 25rpx;
-  	color: #F0AD4E;
-  	margin-left: 180rpx;
-  }
-</style>
\ No newline at end of file
+  background-color: #00bfff;
+  border-radius: 15rpx;
+  position: relative;
+}
+.btn5 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #dd524d;
+  border-radius: 15rpx;
+  text-align: center;
+}
+.flesh {
+}
+.wz {
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 5rpx;
+  text-align: center;
+  position: absolute;
+}
+.wz1 {
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 20rpx;
+  text-align: center;
+  position: absolute;
+}
+.shumu {
+  margin-left: 180rpx;
+  font-size: 25rpx;
+  margin-top: -130rpx;
+  color: #999999;
+  width: 120rpx;
+  display: block;
+}
+.shumuone {
+  margin-left: 180rpx;
+  font-size: 25rpx;
+  color: #999999;
+  /* background-color: #4CD964; */
+}
+.shumutwo {
+  margin-left: 250rpx;
+  font-size: 20rpx;
+  color: #00bfff;
+  margin-top: -30rpx;
+  /* background-color: #F0AD4E; */
+}
+.shumuthree {
+  margin-top: 10rpx;
+  font-size: 25rpx;
+  color: #f0ad4e;
+  margin-left: 180rpx;
+}
+</style>
diff --git a/pages_borrow_books/pages/components/trade.vue b/pages_borrow_books/pages/components/trade.vue
index 3267a26dd07743c60e828e9f55e679e33c8bb9ef..fa09b20947d2e6c735652742173ca0304ee2f709 100644
--- a/pages_borrow_books/pages/components/trade.vue
+++ b/pages_borrow_books/pages/components/trade.vue
@@ -1,257 +1,269 @@
 <template name="Trade">
-	<view class="midone">
-		
-		<view class="zhengti">
-			<image class="imag" src="../../static/images/ap.jpg" style="width: 125rpx; height: 170rpx;"></image>
-			<view class="midwz">致敬老师</view>
-		</view>
-		<view >
-			<view class="">
-				<view class="s1">预约时间：2017-11-08 <image style="width: 30rpx; height: 30rpx;" src="../../static/images/location.png"></image>
-					<view class="s6">1.2km</view>
-				</view>
-				<view class="s2">上一位借书人：爱哭的猫</view>
-				<view class="s8">
-					<button class="btn2"><view class="wz">联系还书人</view></button>
-				</view>
-			</view>
-			
-			<view class="s7">
-				<view class="s3">上一次还书期：2017-09-10</view>
-				<view class="s4">当前状态：
-					<view class="s5">等待持书人还书</view>
-				</view>
-				<view class="s8">
-					<navigator url="/pages_borrow_books/pages/borrow/face_to_face">
-						<button class="btn3"><view class="wz">面对面借书</view></button>
-					</navigator>
-				</view>
-			</view>
-			
-		</view>
-		
-	</view>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="面对面交易中" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
+						</view>
+					</u-navbar>
+  <view class="midone">
+    <view class="zhengti">
+      <image
+        class="imag"
+        src="/static/images/ap.jpg"
+        style="width: 125rpx; height: 170rpx"
+      ></image>
+      <view class="midwz">致敬老师</view>
+    </view>
+    <view>
+      <view class="">
+        <view class="s1"
+          >预约时间：2017-11-08
+          <image
+            style="width: 30rpx; height: 30rpx"
+            src="/static/images/location.png"
+          ></image>
+          <view class="s6">1.2km</view>
+        </view>
+        <view class="s2">上一位借书人：爱哭的猫</view>
+        <view class="s8">
+          <button class="btn2"><view class="wz">联系还书人</view></button>
+        </view>
+      </view>
+
+      <view class="s7">
+        <view class="s3">上一次还书期：2017-09-10</view>
+        <view class="s4"
+          >当前状态：
+          <view class="s5">等待持书人还书</view>
+        </view>
+        <view class="s8">
+          <navigator url="/pages_borrow_books/pages/borrow/face_to_face">
+            <button class="btn3"><view class="wz">面对面借书</view></button>
+          </navigator>
+        </view>
+      </view>
+    </view>
+  </view>
+  </view>
 </template>
 
 <script>
-	export default {
-	  name: 'Trade',
-	  props: {
-	            
-	  },
-	  data() {
-	    return {
-	                
-	    }
-	  },
-	  methods: {
-	            
-	  }
-	}
+export default {
+  name: "Trade",
+  props: {},
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
+		},
+	};
+  },
+  methods: {},
+};
 </script>
 
 <style>
-	.bt{
-		margin-top: 1045rpx;
-	}
-	.mid {	
-		margin-top:20rpx;
-		width: 100%;
-		height: 200rpx;
-	}
-	.zt1{
-		color: #00BFFF;
-		font-size: 22rpx;
-		margin-left: 50rpx;
-		line-height: center;
-		margin-top: 25rpx;
-	}
-	.zt{
-		/* height: 40rpx; */
-		border-bottom:solid 1rpx;
-		/* border-top:solid 1rpx; */
-		margin-top: -5rpx;
-		height: 60rpx;
-		color: #BBBBBB;
-	}
-	.midone {
-		width: 100%;
-		height: 200rpx;
-		font-size: 30rpx;
-		margin-top: 35rpx;
-		align-items: center;
-		border-bottom: 1rpx solid #bbbbbb;
-	}
-	.zhengti {
-		display: flex;
-		width: 100%;
-	}
-	.imag{
-		margin-left:30rpx;
-	}
-	.midwz {
-		font-size: 28rpx;
-		height:35rpx;
-		margin-top: -5rpx;
-		align-items: center;
-		margin-left: 30rpx;
-		width: auto;
-		/* background-color:  #333333; */
-	}
-	.s1{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: -120rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-		display: flex;
-	}
-	.s2{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-	.s3{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-	.s4{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #F0AD4E;
-	}
-	.s5{
-		font-size: 20rpx;
-		height:35rpx;
-		margin-top: -26rpx;
-		align-items: center;
-		margin-left: 100rpx;
-		color: #555555;
-	}
-	.s6{
-		color: #DD524D;
-		
-	}
-	
-	.s7{
-		height:35rpx;
-		align-items: center;
-		width: auto;
-		/* display: flex; */
-	}
-	
-	.s8{
-		text-align: center;
-	}
-	.s9{
-		position: relative;
-		margin-left: 300rpx;
-		margin-top: -5rpx;
-		height: 20rpx;
-		width: 100rpx;
-	}
-	.btn1{
-		color: #F8F8F8;
-		width: 137rpx;
-		height: 55rpx;
-		margin-right: 20rpx;
-		margin-top: -60rpx;
-		background-color: #00BFFF;
-		border-radius: 15rpx;
-		}
-	.btn2{
-		color: #F8F8F8;
-		width: 137rpx;
-		height: 55rpx;
-		margin-right: 20rpx;
-		margin-top: -60rpx;
-		background-color: #F0AD4E;
-		border-radius: 15rpx;
-		}
-	.btn3{
-			color: #F8F8F8;
-			width: 137rpx;
-			height: 55rpx;
-			margin-right: 20rpx;
-			margin-top: -60rpx;
-			background-color: #4CD964;
-			border-radius: 15rpx;
-			}
-	.btn4{
-			color: #F8F8F8;
-			width: 137rpx;
-			height: 55rpx;
-			
-			background-color: #00BFFF;
-			border-radius: 15rpx;
-			position: relative;
-			}
-	.btn5{
-		color: #F8F8F8;
-		width: 137rpx;
-		height: 55rpx;
-		margin-right: 20rpx;
-		margin-top: -60rpx;
-		background-color: #DD524D;
-		border-radius: 15rpx;
-		text-align: center;
-		}
-	.flesh{
-		
-	}
-	.wz{
-		font-size: 16rpx;
-		margin-top: 8rpx;
-		/* width: 137rpx; */
-		margin-left: 5rpx;
-		text-align: center;
-		position: absolute;
-	}
-	.wz1{
-		font-size: 16rpx;
-		margin-top: 8rpx;
-		/* width: 137rpx; */
-		margin-left: 20rpx;
-		text-align: center;
-		position: absolute;
-	}
-	.shumu {
-		margin-left: 180rpx;
-		font-size: 25rpx;
-		margin-top: -130rpx;
-		color:   #999999;
-		width: 120rpx;
-		display: block;
-	}
-	.shumuone{
-		margin-left: 180rpx;
-		font-size: 25rpx;
-		color: #999999;
-		/* background-color: #4CD964; */
-	}
-	.shumutwo{
-		margin-left: 250rpx;
-		font-size: 20rpx;
-		color:  #00BFFF;
-		margin-top: -30rpx;
-		/* background-color: #F0AD4E; */
-	}
-	.shumuthree{
-		margin-top: 10rpx;
-		font-size: 25rpx;
-		color: #F0AD4E;
-		margin-left: 180rpx;
-	}
-	
+.bt {
+  margin-top: 1045rpx;
+}
+.mid {
+  margin-top: 20rpx;
+  width: 100%;
+  height: 200rpx;
+}
+.zt1 {
+  color: #00bfff;
+  font-size: 22rpx;
+  margin-left: 50rpx;
+  line-height: center;
+  margin-top: 25rpx;
+}
+.zt {
+  /* height: 40rpx; */
+  border-bottom: solid 1rpx;
+  /* border-top:solid 1rpx; */
+  margin-top: -5rpx;
+  height: 60rpx;
+  color: #bbbbbb;
+}
+.midone {
+  width: 100%;
+  height: 200rpx;
+  font-size: 30rpx;
+  margin-top: 35rpx;
+  align-items: center;
+  border-bottom: 1rpx solid #bbbbbb;
+}
+.zhengti {
+  display: flex;
+  width: 100%;
+}
+.imag {
+  margin-left: 30rpx;
+}
+.midwz {
+  font-size: 28rpx;
+  height: 35rpx;
+  margin-top: -5rpx;
+  align-items: center;
+  margin-left: 30rpx;
+  width: auto;
+  /* background-color:  #333333; */
+}
+.s1 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -120rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+  display: flex;
+}
+.s2 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+.s3 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+.s4 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #f0ad4e;
+}
+.s5 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -26rpx;
+  align-items: center;
+  margin-left: 100rpx;
+  color: #555555;
+}
+.s6 {
+  color: #dd524d;
+}
+
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  /* display: flex; */
+}
+
+.s8 {
+  text-align: center;
+}
+.s9 {
+  position: relative;
+  margin-left: 300rpx;
+  margin-top: -5rpx;
+  height: 20rpx;
+  width: 100rpx;
+}
+.btn1 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #00bfff;
+  border-radius: 15rpx;
+}
+.btn2 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #f0ad4e;
+  border-radius: 15rpx;
+}
+.btn3 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #4cd964;
+  border-radius: 15rpx;
+}
+.btn4 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+
+  background-color: #00bfff;
+  border-radius: 15rpx;
+  position: relative;
+}
+.btn5 {
+  color: #f8f8f8;
+  width: 137rpx;
+  height: 55rpx;
+  margin-right: 20rpx;
+  margin-top: -60rpx;
+  background-color: #dd524d;
+  border-radius: 15rpx;
+  text-align: center;
+}
+.flesh {
+}
+.wz {
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 5rpx;
+  text-align: center;
+  position: absolute;
+}
+.wz1 {
+  font-size: 16rpx;
+  margin-top: 8rpx;
+  /* width: 137rpx; */
+  margin-left: 20rpx;
+  text-align: center;
+  position: absolute;
+}
+.shumu {
+  margin-left: 180rpx;
+  font-size: 25rpx;
+  margin-top: -130rpx;
+  color: #999999;
+  width: 120rpx;
+  display: block;
+}
+.shumuone {
+  margin-left: 180rpx;
+  font-size: 25rpx;
+  color: #999999;
+  /* background-color: #4CD964; */
+}
+.shumutwo {
+  margin-left: 250rpx;
+  font-size: 20rpx;
+  color: #00bfff;
+  margin-top: -30rpx;
+  /* background-color: #F0AD4E; */
+}
+.shumuthree {
+  margin-top: 10rpx;
+  font-size: 25rpx;
+  color: #f0ad4e;
+  margin-left: 180rpx;
+}
 </style>
diff --git a/pages_borrow_books/pages/my_reserve/my_reserve.vue b/pages_borrow_books/pages/my_reserve/my_reserve.vue
index 0f33834b41545020a996d78668d8225d018edd20..587d97ea76c553d9008ee1d33e5015d1c812f0f5 100644
--- a/pages_borrow_books/pages/my_reserve/my_reserve.vue
+++ b/pages_borrow_books/pages/my_reserve/my_reserve.vue
@@ -1,26 +1,34 @@
 <template>
 	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="预约记录" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
+						</view>
+					</u-navbar>
 	<view class="top">
 	<view class="header-input">
 		<input v-model="mhcx" placeholder="输入书名查找" placeholderStyle="color:#BBBBBB" type="text"></input>
 		<view>
-			<image class="image" src="../../static/images/search_icon.png" @click="goToSearch()">
+			<image class="image" src="/static/images/search_icon.png" @click="goToSearch()">
 			</image>
 		</view>
 	</view>
 	</view>
 		<view class="show">
 			<view class="container">
-				<scroll-view 
-				class="scroll-container" 
-				scroll-x 
-				scroll-with-animation 
-				v-if="brands.length > 1" 
+				<scroll-view
+				class="scroll-container"
+				scroll-x
+				scroll-with-animation
+				v-if="brands.length > 1"
 				:scroll-into-view="'s' + currentIndex">
-					<view :class="['scroll-item', { active: index == currentId }]" 
-					:id="'s' + index" 
+					<view :class="['scroll-item', { active: index == currentId }]"
+					:id="'s' + index"
 					v-for="(item, index) in brands"
-					:key="index" 
+					:key="index"
 					@tap="handleScroll(index)">
 					{{ item }}
 						<view class="bottom-border" v-if="index == currentId">
@@ -74,6 +82,9 @@
 	export default {
 		data() {
 			return {
+				background: {
+					background: "#6C40F3",
+				},
 				currentId:'',/* 控制被选中 */
 				brands:[
 					'预约成功',
@@ -93,7 +104,7 @@
 			this.goToSearch()
 		},
 		onNavigationBarButtonTap(e) {
-		    console.log("success")        
+		    console.log("success")
 		},
 		methods: {
 			/* </scroll-view>的触底函数*/
@@ -111,7 +122,7 @@
 					// 		title: '到底啦~',
 					// 		icon: 'none'
 					// 	});
-					// }				
+					// }
 				},
 			//获取数据
 			goToSearch(){
@@ -164,7 +175,7 @@
 						}
 						that.info=that.info.concat(Array.from(res.data)); //拼接数组
 						// uni.stopPullDownRefresh();	//数据加载完成,刷新结束
-						// uni.hideNavigationBarLoading();	//数据读取完毕,刷新停止	
+						// uni.hideNavigationBarLoading();	//数据读取完毕,刷新停止
 					},
 					fail: (res) => {
 						this.showModal("网络错误！")
@@ -232,7 +243,7 @@
 				this.goToSearch()
 			},
 		}
-		
+
 	}
 
 </script>
@@ -254,7 +265,7 @@
 	    display: flex;
 	    flex-direction: row;
 		box-shadow: #007AFF 1rpx 1rpx 5rpx 1rpx;
-	} 
+	}
 	.header-input input {
 	    margin-left: 31rpx;
 	    width: 564rpx;
@@ -263,12 +274,12 @@
 	    /* border-right: 1rpx solid #dfdfdf; */
 	    font-size: 28rpx;
 	}
-	
+
 	.header-input view {
 	    width: 96rpx;
 	    height: 66rpx;
 	}
-	
+
 	.image {
 	    margin-left: 20rpx;
 	    margin-top: 11rpx;
@@ -292,7 +303,7 @@
 	      font-size: 32upx;
 	      font-weight: 400;
 	      color: #1e1e1e;
-	
+
 	      &.active {
 	        display: inline-block;
 	        font-weight: bold;
@@ -300,7 +311,7 @@
 	        font-size: 32upx;
 	      }
 	    }
-	
+
 	    .bottom-border {
 	      margin: 0 auto;
 	      width: 55upx;
@@ -401,14 +412,14 @@
     .s6 {
     	color: #dd524d;
     }
-    
+
     .s7 {
     	height: 35rpx;
     	align-items: center;
     	width: auto;
     	/* display: flex; */
     }
-    
+
     .s8 {
     	text-align: center;
     }
diff --git a/pages_borrow_books/pages/order/order.vue b/pages_borrow_books/pages/order/order.vue
index eb9f28fa4ea804137e88325a5b02bee58be2c37d..54838298f1963f5eba13359c9626c20eb0a3a295 100644
--- a/pages_borrow_books/pages/order/order.vue
+++ b/pages_borrow_books/pages/order/order.vue
@@ -1,305 +1,533 @@
 <template>
-	<view>
-		<view class="address1">
-			<view class="mingzi">
-				<view class="cos">李小琴</view>
-				<view class="phone">182*****2038</view>
-			</view>
-			<view class="dzhi">
+  <view>
+	  <!-- 顶部 -->
+	  <u-navbar zhead="65rpx" height="44" title="确认订单" title-color="white" title-size="40" :background="background"
+	  			 back-icon-color="white" back-icon-size="50">
+	  				<view class="navbar-right" slot="right">
+	  					<view class="right_list" @click="bindInBatch">
+	  					</view>
+	  				</view>
+	  			</u-navbar>
+    <!--<view class="address1">
+      &lt;!&ndash;<view class="mingzi">
+        <view class="cos">{{userinfo.readerName}}</view>
+				<view class="phone">{{userinfo.phoneNum}}</view>
+			</view>&ndash;&gt;
+      <view>
+        <view>贵州黔东南州三穗县八弓镇</view>
+        <view>贵根村前进组</view>
+        <view>王明</view>
+        <view>158****0085</view>
+      </view>
+      <view></view>
+			&lt;!&ndash;<view class="dzhi">
+				<view class="dzhi_head">
 				<view class="tupian2">
-					<image class="imag4" src="../../static/images/location.png"></image>
+					<image class="imag4" src="/static/images/location.png"></image>
 				</view>
-				<view class="dizhi">广东省广州大学城外环西路100号楼303</view>
-			</view>
-
-		</view>
-		<view class="fenge"></view>
-		<!--书籍-->
-		<view class="show">
-
-			<view class="midone">
-				<view class="zhengti">
-					<image class="imag" :src="book.picturePath" style="width: 158rpx; height: 188rpx;"></image>
-					<view class="midwz">{{book.bookName}}</view>
+				<view class="dizhi">{{address}}</view>
 				</view>
-				<view>
-					<view class="s1">作者：
-						<view class="s6">汪魏青</view>
-					</view>
-					<view class="s2">出版社：{{book.publisher}}</view>
-					<!-- <view class="s7">
-						<view class="s3">出版时间：2017-09-10</view>
-					</view> -->
-				</view>
-				<view class="aa">
-					<view class="sa">
-						<view class="ss u-flex">馆藏：
-							<view>{{list[index]&&list[index].library.name}}</view>
-						</view>
-						<!-- <view class="s7">
-							<view class="s4">书易读者：
-								<view class="s5" style="margin-left: 100rpx;">冰山一角，爱书的猫...</view>
-							</view>
-						</view> -->
-					</view>
-					<!-- <view class="sa2">
-						<button type="warn" class="delete">删除</button>
-					</view> -->
+				<view class="address" @click="editAddress()">
+					<image src="/static/images/book_review.png" style="width: 45rpx; height: 45rpx;"></image>
 				</view>
+			</view>&ndash;&gt;
+		</view>-->
+    <view class="address" @tap="selectAddress=!selectAddress">
+      <view v-if="addressList[addressIndex]">
+        <view>{{`${addressList[addressIndex].province}-${addressList[addressIndex].city}-${addressList[addressIndex].district}`}}  {{addressList[addressIndex].detailAddress}}</view>
+        <!--<view></view>-->
+        <view>{{addressList[addressIndex].name}}</view>
+        <view>{{addressList[addressIndex].phoneNumber}}</view>
+      </view>
+      <u-icon name="arrow-right" size="40"></u-icon>
+    </view>
+    <view @tap="selectLogistics=!selectLogistics" style="display: flex;align-items: center;justify-content: space-between;padding: 30rpx">
+      {{logisticsList[logisticsIndex].name}}
+      <u-icon name="arrow-right" size="40"></u-icon>
+    </view>
+    <u-popup v-model="selectAddress" mode="bottom" border-radius="24">
+      <scroll-view scroll-y="true" style="height: 1000rpx;padding: 40rpx;box-sizing: border-box;">
+        <navigator url="/pages_borrow_books/pages/address/address">
+          <view style="color: #2594ff;float: right">地址管理</view>
+        </navigator>
+        <u-radio-group v-model="addressIndex" @change="radioGroupChange" :wrap="true">
+          <u-radio @change="radioChange" v-for="(item, index) in addressList" :key="index" :name="index" :disabled="item.disabled">
+            <view class="u-m-20">
+              <view>{{`${item.province}-${item.city}-${item.district}`}}</view>
+              <view>{{item.detailAddress}}</view>
+              <view>{{item.name}}</view>
+              <view>{{item.phoneNumber}}</view>
+            </view>
+          </u-radio>
+        </u-radio-group>
+      </scroll-view>
+    </u-popup>
+    <u-popup v-model="selectLogistics" mode="bottom" border-radius="24">
+      <scroll-view scroll-y="true" style="height: 400rpx;padding: 40rpx;box-sizing: border-box;">
+        <u-radio-group v-model="logisticsIndex" :wrap="true">
+          <u-radio @change="radioChange1" v-for="(item, index) in logisticsList" :key="index" :name="index" :disabled="item.disabled">
+            <view>{{item.name}}</view>
+          </u-radio>
+        </u-radio-group>
+      </scroll-view>
+    </u-popup>
+
+    <view class="fenge"></view>
+    <!--书籍-->
+    <view class="show" v-for="(realBook,index) in realBookList" :key="index">
+      <view class="midone">
+        <view class="zhengti">
+          <image class="imag" :src="realBook.book.picturePath" style="width: 158rpx; height: 188rpx;"></image>
+          <view class="midwz">{{realBook.book.bookName}}</view>
+        </view>
+        <view>
+          <view class="s1">作者：
+            <view class="s6">{{realBook.book.author}}</view>
+          </view>
+          <view class="s2">出版社：{{realBook.book.publisher}}</view>
+          <!-- <view class="s7">
+            <view class="s3">出版时间：2017-09-10</view>
+          </view> -->
+        </view>
+        <view class="aa">
+          <view class="sa">
+            <view class="ss u-flex">馆藏：
+              <view>{{realBook.library.name}}</view>
+            </view>
+            <!-- <view class="s7">
+              <view class="s4">书易读者：
+                <view class="s5" style="margin-left: 100rpx;">冰山一角，爱书的猫...</view>
+              </view>
+            </view> -->
+          </view>
+          <!-- <view class="sa2">
+            <button type="warn" class="delete">删除</button>
+          </view> -->
+        </view>
 
 
-			</view>
-		</view>
-		<!-- <view class="dibu">
-			<view class="one">
-				<image class="syps" src="../../static/images/1.jpg"</image>
-				<view class="">书易配送</view>
-			</view>
-			<view class="two">
-				<image class="wlps" src="../../static/images/1.jpg"</image>
-				<view class="">物流配送</view>
-			</view>
-			<view class="three">
-				<image class="dzzt" src="../../static/images/1.jpg"</image>
-				<view class="">读者自提</view>
-			</view>
-		</view> -->
-
-		<!--书籍-->
-    <u-button @tap="orderSubmit(realBookId)" class="u-m-t-80 u-m-l-50 u-m-r-50" >提交</u-button>
-	</view>
+      </view>
+    </view>
+    <!-- <view class="dibu">
+      <view class="one">
+        <image class="syps" src="../../static/images/1.jpg"</image>
+        <view class="">书易配送</view>
+      </view>
+      <view class="two">
+        <image class="wlps" src="../../static/images/1.jpg"</image>
+        <view class="">物流配送</view>
+      </view>
+      <view class="three">
+        <image class="dzzt" src="../../static/images/1.jpg"</image>
+        <view class="">读者自提</view>
+      </view>
+    </view> -->
+
+    <!--书籍-->
+    <u-button @click="orderSubmit(realBookId)" class="u-m-t-80 u-m-l-50 u-m-r-50">提交</u-button>
+  </view>
 </template>
 
 <script>
-	import {getBookByBookId,realBook} from "../../../api";
-
-  export default {
-		data() {
-			return {
-        book:{},
-        index:0,//第几个图书馆
-        list:{},
-        realBookId:null,
-        bookId:null,
-			}
+let app = getApp();
+import {
+  mapState,
+  mapMutations
+} from 'vuex'
+export default {
+  computed: {
+    ...mapState(['token', 'userinfo', 'login'])
+  },
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
 		},
-		methods: {
-      orderSubmit(realBookId){
-        realBook({realBookId}).then(({data})=>{
-          uni.showToast({icon:"none",title: "下单成功"});
-          uni.switchTab({
-            url: '/pages/main/main'
-          });
-        }).catch(err=>{
-          uni.showToast({icon:"none",title: "服务器繁忙!"});
-        })
+      book: {},
+      libraryName: "", //图书馆
+      list: [],
+      realBookId: null,
+      bookId: "",
+      address: "",
+      type: "edit", //edit修改地址,add新增地址
+      selectAddress: false, //选择地址的弹出框
+      addressList: [], //可选的地址
+      // u-radio-group的v-model绑定的值如果设置为某个radio的name，就会被默认选中
+      value: 'orange',
+      addressIndex: 0, //当前选中的地址
+      selectLogistics: false,
+      logisticsIndex: 0,//当前选中的快递
+      logisticsList: [{
+        name: "圆通快递"
+      }, {
+        name: "中通快递"
+      }, {
+        name: "顺丰快递"
+      }, {
+        name: "韵达快递"
+      }],
+      realBookList:[],//真实图书信息
+    }
+  },
+  methods: {
+    // 选中某个单选框时，由radio时触发
+    radioChange(e) {
+      this.addressIndex = e;
+      this.selectAddress = false;
+    },
+    radioChange1(e) {
+      this.logisticsIndex = e;
+      this.selectLogistics = false;
+    },
+    // 选中任一radio时，由radio-group触发
+    radioGroupChange(e) {
+      // console.log(e);
+    },
+    //获得信息
+    async getInfo() {
+      var that = this;
+      var params = {
+        url: "borrow/info",
+        type: 'GET',
+        data: {
+          bookId1: that.bookId,
+          readerId1: that.userinfo.readerId,
+        }
       }
-		},
-    onLoad(query){
-      //获取到图书信息
-      console.log(query);
-      this.index = query.index;
-      this.realBookId = query.realBookId;
-      this.bookId = query.bookId;
-      getBookByBookId({bookId:query.bookId}).then(({data})=>{
-        this.book = data.book;
-        this.list = data.list;
+      const res = await app.myRequest(params);
+      console.log("后台传来的数据：", res)
+      this.book = res.book;
+      this.list = res.list;
+      this.address = res.mainAddress;
+    },
+    //提交订单
+    orderSubmit() {
+      let arr = []
+      this.realBookList.forEach(realBook=>{
+        console.log(realBook);
+        arr.push(app.myRequest({
+          url:"borrow/borrowByReaderDelivery",
+          type:"GET",
+          data:{
+            realBookId:realBook.realBookId,
+            addressId:this.addressList[this.addressIndex].addressId,
+          }
+        }))
+      })
+      /*app.myRequest({
+        url:"borrow/borrowByCommissionedStaff",
+        type:"POST",
+        data:{
+          realBookId:1,
+          addressId:this.addressList[this.addressIndex].addressId,
+        }
+      }).then(res=>{
+        console.log(res);
+      }).catch(err=>{
+        console.log('catch',err);
+      })*/
+      Promise.all(arr)
+          .then(res=>{
+            res.forEach(result=>{
+              if (result.status !== 200) {
+                this.$u.toast(result.message)
+              }else {
+                this.$u.toast("借书成功")
+                uni.reLaunch({
+                	url:"/pages/main/main"
+                })
+              }
+            })
+          })
+          .catch(err=>{
+            this.$u.toast("服务器繁忙")
+          })
+    },
+    //编辑地址
+    editAddress() {
+      console.log("编辑地址");
+      if (this.address == '请填写地址') {
+        this.type = "add"
+      }
+      uni.navigateTo({
+        url: "../address/edit/edit?type=" + this.type
       })
     }
-	}
+
+  },
+  onLoad(e) {
+	  console.log("e",e)
+    //realBookIds :真实图书的id，如果有多个id，使用逗号分隔（get方式传递复杂数据类型不同平台有差异，所以不采用传递数组的方式而是使用逗号拼接）
+	let realBookIds = e.realBookId
+	typeof(realBookIds)!=="string" && (realBookIds=realBookIds.toString())
+    realBookIds=realBookIds.split(",")
+    app.myRequest({
+      url:"order/queryRealBookInfoById",
+      type:"POST",
+      data:{
+        realBookIds
+      }
+    }).then(res=>{
+      console.log(this.realBookList = res);
+    })
+    //获取真实图书信息
+    //获取可选地址
+    //获取可选物流
+    /*//获取到图书信息
+    console.log("query", query);
+    this.libraryName = query.libraryName;
+    this.realBookId = query.realBookId;
+    this.bookId = query.bookId;
+    //获取信息
+    this.getInfo()*/
+  },
+  onShow() {
+    //获取地址
+    app.myRequest({
+      url: "address/getAddress",
+      type: "GET"
+    }).then(res => {
+      this.addressList = res;
+      res.forEach((v, i) => {
+        if (v.isMain) {
+          this.addressIndex = i;
+        }
+      })
+    })
+  }
+}
 </script>
 
-<style>
-	.one{
-		margin-left: 10rpx;
-	}
-	.two{
-		margin-left: 100rpx;
-	}
-	.three{
-		margin-left: 100rpx;
-	}
-	.wlps1{
-		width: 60rpx;
-		height: 60rpx;
-	}
-	.address1{
-		margin-left: 60rpx;
-		margin-top: 30rpx;
-	}
-	.dizhi{
-		font-size: 26rpx;
-		color: #999999;
-	}
-	.mingzi{
-		display: flex;
-		color: #999999;
-	}
-	.cos{
-		font-size: 32rpx;
-	}
-	.phone{
-		font-size: 26rpx;
-		line-height: 45rpx;
-		margin-left: 20rpx;
-
-	}
-	.dibu{
-		display: flex;
-		margin-top: 140rpx;
-		font-size: 20rpx;
-		color:#999999;
-		margin-left:150rpx;
-
-	}
-	.fenge{
-	/* 	height: 5rpx;
-		width: 100%; */
-		border-bottom: 1rpx solid #C8C7CC;
-	}
-	.dzhi{
-		display: flex;
-		margin-top: 10rpx;
-	}
-	.tupian{
-
-	}
-	.imag4{
-		width: 40rpx;
-		height: 40rpx;
-		margin-left: -10rpx;
-
-	}
-	.bottom{
-		border: #EEEEEE 1rpx solid;
-	}
-	.show {
-		border-bottom: 1rpx solid #C8C7CC;
-		display: flex;
-	}
-
-	.delete {
-		width: 110rpx;
-		font-size: 20rpx;
-		height: 50rpx;
-	}
-
-	.sa2 {
-		margin-left: 150rpx;
-		margin-top: 30rpx;
-	}
-
-	.aa {
-		display: flex;
-	}
-
-	.yuan {
-		border-radius: 50%;
-		width: 45rpx;
-		height: 40rpx;
-		border: 1rpx solid #C8C7CC;
-		margin-top: 100rpx;
-		margin-left: 50rpx;
-		margin-right: -70rpx;
-
-	}
-
-	.midone {
-		width: 100%;
-		height: 200rpx;
-		font-size: 30rpx;
-		margin-top: 35rpx;
-		margin-bottom: 50rpx;
-		align-items: center;
-		margin-left: 30rpx;
-	}
-
-	.zhengti {
-		display: flex;
-		width: 100%;
-		/* background-color: #4CD964; */
-	}
-
-	.imag {
-		margin-left: 30rpx;
-		size: 80%;
-	}
-
-	.midwz {
-		font-size: 36rpx;
-		height: 35rpx;
-		margin-top: -5rpx;
-		align-items: center;
-		margin-left: 5rpx;
-		width: auto;
-		color: #333333;
-		/* background-color:  #333333; */
-	}
-
-	.s1 {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: -120rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-		display: flex;
-	}
-
-	.s2 {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-
-	.s3 {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #999999;
-	}
-
-	.s4 {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		/* color: #F0AD4E; */
-		color: #999999;
-	}
-
-	.ss {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: 0rpx;
-		align-items: center;
-		margin-left: 190rpx;
-		color: #00BFFF;
-	}
-
-	.s5 {
-		font-size: 20rpx;
-		height: 35rpx;
-		margin-top: -26rpx;
-		align-items: center;
-		margin-left: 60rpx;
-	}
-
-	.s6 {
-		color: #00BFFF;
-
-	}
-
-	.s7 {
-		height: 35rpx;
-		align-items: center;
-		width: auto;
-		/* display: flex; */
-	}
+<style lang="scss" scoped>
+.address {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  padding: 30rpx;
+}
+
+
+
+.one {
+  margin-left: 10rpx;
+}
+
+.two {
+  margin-left: 100rpx;
+}
+
+.three {
+  margin-left: 100rpx;
+}
+
+.wlps1 {
+  width: 60rpx;
+  height: 60rpx;
+}
+
+.address1 {
+  margin-left: 60rpx;
+  margin-top: 30rpx;
+}
+
+.dizhi {
+  font-size: 26rpx;
+  color: #999999;
+}
+
+.mingzi {
+  display: flex;
+  color: #999999;
+}
+
+.cos {
+  font-size: 32rpx;
+}
+
+.phone {
+  font-size: 26rpx;
+  line-height: 45rpx;
+  margin-left: 20rpx;
+
+}
+
+.dibu {
+  display: flex;
+  margin-top: 140rpx;
+  font-size: 20rpx;
+  color: #999999;
+  margin-left: 150rpx;
+
+}
+
+.fenge {
+  /* 	height: 5rpx;
+  width: 100%; */
+  border-bottom: 1rpx solid #C8C7CC;
+}
+
+.dzhi {
+  display: flex;
+  margin-top: 10rpx;
+  justify-content: space-between;
+  word-break: break-all;
+  text-overflow: ellipsis;
+  /*自适应字体*/
+  overflow: hidden;
+  -webkit-box-orient: vertical;
+  -webkit-line-clamp: 2;
+  /*设置 需要显示的行数*/
+}
+
+.dzhi_head {
+  display: flex;
+}
+
+.tupian {}
+
+.imag4 {
+  width: 40rpx;
+  height: 40rpx;
+  margin-left: -10rpx;
+
+}
+
+.bottom {
+  border: #EEEEEE 1rpx solid;
+}
+
+.show {
+  border-bottom: 1rpx solid #C8C7CC;
+  display: flex;
+}
+
+.delete {
+  width: 110rpx;
+  font-size: 20rpx;
+  height: 50rpx;
+}
+
+.sa2 {
+  margin-left: 150rpx;
+  margin-top: 30rpx;
+}
+
+.aa {
+  display: flex;
+}
+
+.yuan {
+  border-radius: 50%;
+  width: 45rpx;
+  height: 40rpx;
+  border: 1rpx solid #C8C7CC;
+  margin-top: 100rpx;
+  margin-left: 50rpx;
+  margin-right: -70rpx;
+
+}
+
+.midone {
+  width: 100%;
+  height: 200rpx;
+  font-size: 30rpx;
+  margin-top: 35rpx;
+  margin-bottom: 50rpx;
+  align-items: center;
+  margin-left: 30rpx;
+}
+
+.zhengti {
+  display: flex;
+  width: 100%;
+
+  /* background-color: #4CD964; */
+}
+
+.imag {
+  margin-left: 30rpx;
+  size: 80%;
+}
+
+.midwz {
+  font-size: 36rpx;
+  height: 35rpx;
+  margin-top: -5rpx;
+  align-items: center;
+  margin-left: 5rpx;
+  width: auto;
+  color: #333333;
+  /* background-color:  #333333; */
+}
+
+.s1 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -120rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+  display: flex;
+}
+
+.s2 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+
+.s3 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #999999;
+}
+
+.s4 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  /* color: #F0AD4E; */
+  color: #999999;
+}
+
+.ss {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: 0rpx;
+  align-items: center;
+  margin-left: 190rpx;
+  color: #00BFFF;
+}
+
+.s5 {
+  font-size: 20rpx;
+  height: 35rpx;
+  margin-top: -26rpx;
+  align-items: center;
+  margin-left: 60rpx;
+}
+
+.s6 {
+  color: #00BFFF;
+
+}
+
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  /* display: flex; */
+}
+
+.address {
+  display: right;
+}
 </style>
diff --git a/pages_borrow_books/pages/reading/opinion.vue b/pages_borrow_books/pages/reading/opinion.vue
new file mode 100644
index 0000000000000000000000000000000000000000..ce800071a77db8f5f2c6e403e550e5af8ec13bc8
--- /dev/null
+++ b/pages_borrow_books/pages/reading/opinion.vue
@@ -0,0 +1,188 @@
+<template>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="写书评" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
+						</view>
+					</u-navbar>
+		<view class="tq"></view>
+		
+		<view class="all">
+			<form @submit='issueSubmit'>
+				<view class="top">
+					<!-- 简介 -->
+					<view class="toptwo">
+						<textarea name="content" class="te" placeholder="这一刻的想法......" maxlength="500"></textarea>
+					</view>
+				</view>
+				<!--  -->
+				<view class="qt">
+					<button class="fb" form-type='submit'>保存</button>
+				</view>
+			</form>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+			};
+		},
+		methods: {
+		},
+	};
+</script>
+
+<style>
+	/* 导航栏 */
+	.tq {
+		width: auto;
+		height: auto;
+	}
+	
+	.tab {
+		
+		display: flex;
+		background-color: #6C40F3;
+	}
+	
+	.tit2 {
+		margin-top: 20rpx;
+		color: #FFFFFF;
+		text-align: center;
+		margin-left: 55rpx;
+		/* display: flex; */
+		font-size: 40rpx;
+		width: 65%;
+	
+	}
+	
+	.back {
+		margin-top: 15rpx;
+		margin-left: 10rpx;
+	}
+	
+	.shua1 {
+		margin-top: 28rpx;
+		margin-left: 15rpx;
+	
+	}
+	
+	/* 发表 */
+	.all {
+		background-color: #FFFFFF;
+		width: 91%;
+		margin: 35rpx 35rpx;
+	}
+	
+	.top {
+		border-radius: 20rpx;
+		margin: 0rpx 0rpx;
+		height: 580rpx;
+		border: #EBEBEB 3rpx solid;
+	}
+	
+	.topone {
+		display: flex;
+	}
+	
+	.te {
+		margin: 20rpx 30rpx;
+		width: 92%;
+		font-size: 32rpx;
+		color: #000000;
+	}
+	
+	
+	/* 简介 */
+	.toptwo {
+		display: flex;
+	}
+	
+	
+	
+	/* 封面 */
+	.topthree {
+		display: flex;
+	}
+	
+	.tp {
+		width: 160rpx;
+		height: 160rpx;
+		margin-left: 10rpx;
+		margin-bottom: 20rpx;
+		/* 虚线 */
+	}
+	
+	.tp1 {
+		margin-bottom: 20rpx;
+	}
+	
+	.image {
+		margin-left: 550rpx;
+		align-items: center;
+	}
+	
+	.qt {
+		margin-top: 400rpx;
+		width: auto;
+		height: 350rpx;
+		align-items: center;
+		text-align: left;
+	
+	}
+	
+	.qq {
+		width: auto;
+		height: 80rpx;
+		font-size: 25rpx;
+		color: #555555;
+		align-items: center;
+		display: flex;
+		justify-content: left;
+		border-bottom: #F8F8F8 2rpx solid;
+	
+	}
+	
+	.fb {
+		color: #FFFFFF;
+		font-size: 28rpx;
+		margin-top: 100rpx;
+		width: 500rpx;
+		background-color: #6C40F3;
+	}
+	
+	.one {
+		align-items: center;
+		display: flex;
+	
+	}
+	
+	/* 添加照片 */
+	.img {
+		display: flex;
+		flex-wrap: wrap;
+	}
+	
+	.add {
+		margin-top: 40rpx;
+		width: 100%;
+		display: flex;
+		background-color: #fff;
+		height: 160rpx;
+	}
+	
+	.add image {
+		margin-right: 8rpx;
+		width: 160rpx;
+		height: 160rpx;
+	}
+</style>
diff --git a/pages_borrow_books/pages/reading/reading.vue b/pages_borrow_books/pages/reading/reading.vue
new file mode 100644
index 0000000000000000000000000000000000000000..12a7e7802c10850ba387370e15ea489eae4beed0
--- /dev/null
+++ b/pages_borrow_books/pages/reading/reading.vue
@@ -0,0 +1,430 @@
+<template>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="正在阅读" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
+						</view>
+					</u-navbar>
+	<view class="show" style="width: 100%; height: 90rpx">
+	
+		<!--条件编译APP-->
+		<!-- #ifdef APP-PLUS -->
+		<view v-if="realBook.length > 0">
+			<view v-for="(item,index) in realBook" :key="index">
+				<view class="mid">
+					<view class="midone">
+					  <view class="">
+						<image class="imag" :src="item.realBook.book.picturePath" @error="imageError()" style="width: 206rpx; height: 258rpx"></image>
+					  </view>
+					  <view class="rightPart">
+						<view class="book-name">{{(bookName(item.realBook.book.bookName) >13) ? item.realBook.book.bookName.substring(0,13)+'...' : item.realBook.book.bookName}}</view>
+						<view class="s1">借书时间：
+						  <view class="s6">{{happenTimeFun(item.borrowTime)}}</view>
+						</view>
+						<view class="s2">持书人：
+						  <view class="">{{item.reader.nickname}}</view>
+						</view>
+						<view class="s7">
+						  <view class="s4">应还时间：
+								<text >{{happenTimeFun(item.needreturnTime)}}</text>
+						  </view>
+						</view>
+						<view class="s2">当前状态：
+						  <view class="">正在阅读中</view>
+						</view>
+						<view class="btns">
+							<navigator url="opinion">
+								<view class="one">
+									<view style="">写书评</view>
+								</view>
+							</navigator>
+							<view class="two">
+								<view @click="cl(item.realBook.realBookId)">续借</view>
+							</view>
+						</view>
+					  </view>
+					</view>
+					
+				</view>
+			</view>
+		</view>
+		<!-- #endif -->
+		
+		<!--条件编译微信小程序-->
+		<!-- #ifdef MP-WEIXIN -->
+		<view v-if="realBook.length > 0">
+			<view v-for="(item,index) in realBook" :key="index">
+				<view class="mid">
+					<view class="midone">
+					  <view class="">
+						<image class="imag" :src="item.realBook.book.picturePath" @error="imageError()" style="width: 206rpx; height: 258rpx"></image>
+					  </view>
+					  <view class="rightPart">
+						<view class="book-name">{{(bookName(item.realBook.book.bookName) >13) ? item.realBook.book.bookName.substring(0,13)+'...' : item.realBook.book.bookName}}</view>
+						<view class="s1">借书时间：
+						  <view class="s6">{{happenTimeFun(item.borrowTime)}}</view>
+						</view>
+						<view class="s2">持书人：
+						  <view class="">{{item.reader.nickname}}</view>
+						</view>
+						<view class="s7">
+						  <view class="s4">应还时间：
+								<text >{{happenTimeFun(item.needreturnTime)}}</text>
+						  </view>
+						</view>
+						<view class="s2">当前状态：
+						  <view class="">正在阅读中</view>
+						</view>
+						<view class="btns">
+							<navigator url="opinion">
+								<view class="one">
+									<view style="">写书评</view>
+								</view>
+							</navigator>
+							<view class="two">
+								<view @click="cl(item.realBook.realBookId)">续借</view>
+							</view>
+						</view>
+					  </view>
+					</view>	
+				</view>
+			</view>
+		</view>
+		<!-- #endif -->
+		
+		<view v-else @click="toBorrow()" >
+			您还没有记录，<span style="color: #00AAFF;">快去借书吧!</span>
+		</view>
+		
+	</view>
+	</view>
+</template>
+
+<script>
+	let app = getApp();
+	export default {
+	  data() {
+	    return {
+			background: {
+				background: "#6C40F3",
+			},
+			realBook : []
+		};
+	  },
+	  onShow(){
+		  this.getSureReturn0();
+	  },
+	
+	  methods: {
+	    cl(e) {
+		var that = this;
+	      uni.showModal({
+	        title: "温馨提示",
+	        style: "color:#494949;font-size: 30rpx;border-radius: 20rpx;",
+	        content: "是否续借，确认续借后将无法取消，其他人将无法借走本书",
+				
+	        success: function (res) {
+	          if (res.confirm) {
+	            console.log("确认");
+				that.getBookRenew(e)
+				
+	          } else if (res.cancel) {
+	            console.log("取消");
+	          }
+			  
+	        },
+	      });
+	    },
+		//查找当前读者正在阅读的书
+		/* async getSureReturn0(){
+			var that = this;
+			let bookInfoList = [];
+			var params = {
+				url: "returnList/returnRealBookIds",
+				type: 'GET',
+				data: {
+					"sureReturn":0
+				}
+			}
+			const res = await app.myRequest(params);
+			that.realBookIds = res;
+			
+			if(res.length > 0){
+				for (var i = 0; res.length > i; i++) {
+					let bookinfo = await this.getRealBookInfo(res[i]);
+					console.log("bookinfo:",bookinfo)
+					bookInfoList.push(bookinfo)
+				}
+			}else{
+				that.readingList = "空空如也！！！"
+			}
+			that.bookInfoLists =bookInfoList;
+			
+		}, */
+		async getSureReturn0(){
+			var that = this;
+			let bookInfoList = [];
+			var params = {
+				url: "borrowList/myBorrowingList",
+				type: 'GET',
+				data: {
+					"isReturned":false,
+					"sureReturn":false
+				}
+			}
+			const res = await app.myRequest(params);
+			that.realBook = res;	
+			console.log("res",JSON.stringify(res))
+		}, 
+		async getBookRenew(e){
+			var that = this;
+			await getApp().myRequest({
+				url: "borrow/renew?realBookId="+e,
+				type: 'GET'
+			}).then(res1 => {
+				console.log("res1",res1);
+				if(res1 == true){
+					uni.switchTab({
+						url: '/pages/my/my'
+					});			
+					uni.showToast({
+						icon: 'none',
+						title: '续借成功！'
+					})
+					
+				}else{
+					uni.switchTab({
+						url: '/pages/my/my'
+					});
+					uni.showToast({
+						icon: 'none',
+						title: res1.message
+					})
+				}
+			}).catch(err => {
+				console.log("err", err);
+			})
+		},
+		//图片加载不出来
+		imageError(){
+			let that = this;
+			// console.log(index)
+			that.book.picturePath = "/static/images/temporary.jpg"
+		},
+		//去借书
+		toBorrow(){
+			uni.switchTab({
+			    url: '/pages/main/main'
+			});
+		},
+		bookName:function(e){
+			var e1 = e + " ";			
+			return e1.length;
+			},
+		//查看这册书的状态和信息
+		/* async getRealBookInfo(e){
+			var that = this;
+			var params = {
+				url: "borrow/bookInfo?realBookId=" + e,
+				type: 'GET'
+			}
+			const res = await app.myRequest(params)
+			return res
+		}, */
+		happenTimeFun(num){//时间戳数据处理
+			 let date = new Date(num);
+			 //时间戳为10位需*1000，时间戳为13位的话不需乘1000
+			 let y = date.getFullYear();
+			 let MM = date.getMonth() + 1;
+			 MM = MM < 10 ? ('0' + MM) : MM;//月补0
+			 let d = date.getDate();
+			 d = d < 10 ? ('0' + d) : d;//天补0
+			 let h = date.getHours();
+			 h = h < 10 ? ('0' + h) : h;//小时补0
+			 let m = date.getMinutes();
+			 m = m < 10 ? ('0' + m) : m;//分钟补0
+			 let s = date.getSeconds();
+			 s = s < 10 ? ('0' + s) : s;//秒补0
+			 return y + '-' + MM + '-' + d; //年月日
+		 },
+	  }
+	};
+</script>
+
+<style>
+	.rightPart{
+		margin-left: 20rpx;
+	}
+	.book-name {
+	  font-size: 36rpx;
+	  margin-top: -20rpx;
+	  color: #333333;
+	}
+	.emptyList {
+		width: 100%;
+		height: 100rpx;
+		font-size: 40rpx;
+		color: red;
+		text-align: center;
+		margin-top: 60rpx;
+	}
+
+	.br {
+	  margin-top: 20rpx;
+	  /* width: 100%; */
+	  height: 1rpx;
+	  background-color: #eeeeee;
+	}
+	.show {
+	  /* margin-bottom: auto; */
+	 width: auto;
+	 height: auto;
+	  /* background-color: #F8F8F8; */
+	}
+	.mid {
+	  /* margin-top:20rpx; */
+	  width: 100%;
+	  height: 320rpx;
+	}
+	.zt1 {
+	  color: #555555;
+	  font-size: 26rpx;
+	  margin-left: 30rpx;
+	  line-height: center;
+	  color: #646464;
+	}
+	.zt {
+	  height: 70rpx;
+	  display: flex;
+	  align-items: center;
+	}
+	.midone {
+	  width: 90%;
+	  height: 350rpx;
+	  font-size: 40rpx;
+	  margin-top: 20rpx;
+	  align-items: center;
+	  display: flex;
+	}
+	
+	.imag {
+	  margin-left: 30rpx;
+	  margin-top: 70rpx;
+	}
+	
+	.s1 {
+	  font-size: 24rpx;
+	  margin-top: 10rpx;
+	  height: 35rpx;
+	  align-items: center;
+	  color: #999999;
+	  display: flex;
+	}
+	.s2 {
+	  font-size: 24rpx;
+	  height: 35rpx;
+	  margin-top: 5rpx;
+	  align-items: center;
+	  color: #999999;
+	  display: flex;
+	}
+	.btns {
+	  font-size: 22rpx;
+	  height: 35rpx;
+	  margin-top: 50rpx;
+	  align-items: center;
+	  color: #999999;
+	  display: flex;
+	}
+	.one {
+	  background-color: #5E49F5;
+	  height: 45rpx;
+	  width: 135rpx;
+	  border-radius: 23rpx;
+	  line-height: 45rpx;
+	  text-align: center;
+	  opacity: 1;
+	  margin-left: 200rpx;
+	  color: #FFFFFF;
+	}
+	.two {
+	background-color: #ebebeb;
+	height: 45rpx;
+	width: 135rpx;
+	margin-left: 20rpx;
+	border-radius: 23rpx;
+	line-height: 45rpx;
+	text-align: center;
+	opacity: 100%;
+	}
+	
+	
+	.s4 {
+	  font-size: 24rpx;
+	  height: 35rpx;
+	  margin-top: 5rpx;
+	  align-items: center;
+	  color: #999999;
+	}
+	
+	.s6 {
+	  color: #999999;
+	}
+	
+	.s7 {
+	  height: 35rpx;
+	  align-items: center;
+	  width: auto;
+	  display: flex;
+	}
+	
+	.s8 {
+	  display: flex;
+	}
+	.dt {
+	  margin-top: 20rpx;
+	  margin-left: 30rpx;
+	  font-size: 26rpx;
+	  color: #555555;
+	  margin-bottom: 20rpx;
+	  display: flex;
+	}
+	.ti {
+	  color: #999999;
+	  margin-top: 30rpx;
+	  font-size: 23rpx;
+	  margin-left: 230rpx;
+	}
+	
+	.wz {
+	  font-size: 28rpx;
+	  margin-top: 8rpx;
+	  height: 90rpx;
+	}
+	.shumu {
+	  font-size: 25rpx;
+	  margin-top: -130rpx;
+	  color: #999999;
+	  width: 120rpx;
+	  display: block;
+	}
+	.shumuone {
+	  font-size: 25rpx;
+	  color: #999999;
+	  /* background-color: #4CD964; */
+	}
+	.shumutwo {
+	  margin-left: 250rpx;
+	  font-size: 20rpx;
+	  color: #999999;
+	  margin-top: -30rpx;
+	}
+	.shumuthree {
+	  margin-top: 10rpx;
+	  font-size: 25rpx;
+	  color: #999999;
+	}
+</style>
diff --git a/pages_borrow_books/pages/return-books/contact-order-agent.vue b/pages_borrow_books/pages/return-books/contact-order-agent.vue
index 44da1155535f5e184528909fb2b080943d5d2cae..b72f36738be4bb3d5ef39607f078e7c2324b9afe 100644
--- a/pages_borrow_books/pages/return-books/contact-order-agent.vue
+++ b/pages_borrow_books/pages/return-books/contact-order-agent.vue
@@ -1,266 +1,284 @@
 <template>
-	<view class="bgConston">
-		<view class="userSession" :style="{ height: sHeight + 'px' }">
-			<block v-for="(userContext,index) in userContextItem " :key="userContext.userId">
-			<view class="userH" :class="{'userMe' :userContext.userId==''}">
-				<view class="userImg">
-					<image :src="userContext.userImg" mode="scaleToFill"></image>
-				</view>
-				<view class="userType">
-					<!-- 是否显示用户昵称 -->
-					<template v-if="userContext.userId !=''">
-						<view class="userN">
-							<text>{{userContext.userName}}</text>
-							<text>{{userContext.Time}}</text>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="联系预约人" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
 						</view>
-					</template>
-					<!-- 文本格式 -->
-					<template v-if="userContext.type =='text'">
-						<view class="textType">
-							<text>{{userContext.context}}</text>
-						</view>
-					</template>
-					<!-- 图片格式 -->
-					<template v-else-if="userContext.type =='img'">
-						<view class="imgType">
-							<image :src="userContext.picImg" mode="scaleToFill"></image>
-						</view>
-					</template>
-					<!-- 视频格式 -->
-					<template v-else-if="userContext.type =='video'">
-						<view class="videoType">
-							<video :src="userContext.videoSrc" controls ="false"></video>
-						</view>
-					</template>
-					
-				</view>
-			</view>
-			</block>
-		</view>
-		<!-- 底部输入框 -->
-		<view class="userInput">
-			<input type="text" v-model="text" placeholder="文明发言" adjust-position="false" />
-			<view class="sumText" @tap="submit(text)">发送</view>
-		</view>
-	</view>
+					</u-navbar>
+  <view class="bgConston">
+    <view class="userSession" :style="{ height: sHeight + 'px' }">
+      <block
+        v-for="(userContext, index) in userContextItem"
+        :key="userContext.userId"
+      >
+        <view class="userH" :class="{ userMe: userContext.userId == '' }">
+          <view class="userImg">
+            <image :src="userContext.userImg" mode="scaleToFill"></image>
+          </view>
+          <view class="userType">
+            <!-- 是否显示用户昵称 -->
+            <template v-if="userContext.userId != ''">
+              <view class="userN">
+                <text>{{ userContext.userName }}</text>
+                <text>{{ userContext.Time }}</text>
+              </view>
+            </template>
+            <!-- 文本格式 -->
+            <template v-if="userContext.type == 'text'">
+              <view class="textType">
+                <text>{{ userContext.context }}</text>
+              </view>
+            </template>
+            <!-- 图片格式 -->
+            <template v-else-if="userContext.type == 'img'">
+              <view class="imgType">
+                <image :src="userContext.picImg" mode="scaleToFill"></image>
+              </view>
+            </template>
+            <!-- 视频格式 -->
+            <template v-else-if="userContext.type == 'video'">
+              <view class="videoType">
+                <video :src="userContext.videoSrc" controls="false"></video>
+              </view>
+            </template>
+          </view>
+        </view>
+      </block>
+    </view>
+    <!-- 底部输入框 -->
+    <view class="userInput">
+      <input
+        type="text"
+        v-model="text"
+        placeholder="文明发言"
+        adjust-position="false"
+      />
+      <view class="sumText" @tap="submit(text)">发送</view>
+    </view>
+  </view>
+  </view>
 </template>
 
 <script>
 export default {
-	data() {
-		return {
-			sHeight:500,
-			
-			userContextItem:[
-				{
-					userId:"",
-					meId:2,
-					userName:"白百合",
-					userImg:"../../static/images/头像2.jpg",
-					type:"text",
-					context:"哈哈哈，你好，你啥时候看完“活着”这本书，我想借来看看！",
-					time:(new Date().getTime())
-				},
-				{
-				
-				userId:1,
-				meId:"",
-				userName:"吴亦凡",
-				userImg:"../../static/images/图书持有人头像.jpg",
-				type:"text",
-				context:"可能还得3天才看完！",
-				time:(new Date().getTime())
-			},
-			
-			{
-			userId:1,
-			meId:"",
-			userName:"吴亦凡",
-			userImg:"../../static/images/图书持有人头像.jpg",
-			type:"text",
-			context:"之后平台会及时更新，你注意下单借书就好了！",
-			time:(new Date().getTime())
-			},
-			{
-				userId:"",
-				meId:2,
-				userName:"白百合",
-				userImg:"../../static/images/头像2.jpg",
-				type:"text",
-				context:"好的谢谢！",
-				time:(new Date().getTime())
-			},
-			]
-		}
-	},
-	onLoad() {
-		//获取系统信息
-		uni.getSystemInfo({
-			success: (res) => {
-				let height=res.windowHeight-uni.upx2px(100);
-				this.sHeight=height;
-			}
-		})
-	},
-	
-	methods: {
-		submit(text){
-			// 创建一组数据
-			let obj = {
-				userId:"",
-				meId: 2,
-				userName: "ailis",
-				userImg:"../../static/image/头像2.jpg",
-				type:"text",
-				context:text,
-				time:(new Date().getTime())
-			};
-			this.userContextItem.push(obj);
-		}
-		}
-}
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
+		},
+      sHeight: 500,
+
+      userContextItem: [
+        {
+          userId: "",
+          meId: 2,
+          userName: "白百合",
+          userImg: "/static/images/头像2.jpg",
+          type: "text",
+          context: "哈哈哈，你好，你啥时候看完“活着”这本书，我想借来看看！",
+          time: new Date().getTime(),
+        },
+        {
+          userId: 1,
+          meId: "",
+          userName: "吴亦凡",
+          userImg: "/static/images/图书持有人头像.jpg",
+          type: "text",
+          context: "可能还得3天才看完！",
+          time: new Date().getTime(),
+        },
+
+        {
+          userId: 1,
+          meId: "",
+          userName: "吴亦凡",
+          userImg: "/static/images/图书持有人头像.jpg",
+          type: "text",
+          context: "之后平台会及时更新，你注意下单借书就好了！",
+          time: new Date().getTime(),
+        },
+        {
+          userId: "",
+          meId: 2,
+          userName: "白百合",
+          userImg: "/static/images/头像2.jpg",
+          type: "text",
+          context: "好的谢谢！",
+          time: new Date().getTime(),
+        },
+      ],
+    };
+  },
+  onLoad() {
+    //获取系统信息
+    uni.getSystemInfo({
+      success: (res) => {
+        let height = res.windowHeight - uni.upx2px(100);
+        this.sHeight = height;
+      },
+    });
+  },
+
+  methods: {
+    submit(text) {
+      // 创建一组数据
+      let obj = {
+        userId: "",
+        meId: 2,
+        userName: "ailis",
+        userImg: "../../static/image/头像2.jpg",
+        type: "text",
+        context: text,
+        time: new Date().getTime(),
+      };
+      this.userContextItem.push(obj);
+    },
+  },
+};
 </script>
 
 <style>
-	.bgConston{
-		width: 100%;
-		height: 100%;
-		background-color: #F8F8F8;
-		margin: 0;
-		padding: 0;
-	}
-	/* 聊天 */
-	.userSession{
-		width: 100%;
-		height: auto;
-		border-top: 1upx solid #EDEDED;
-		overflow: auto;
-	}
-	.userH{
-		width: 80%;
-		height: auto;
-		display: flex;
-		flex: 1;
-		flex-wrap: wrap;
-		padding: 20upx;
-	}
-	.userMe{
-		width: 95%;
-		height: auto;
-		display: flex;
-		flex: 1;
-		flex-wrap: wrap;
-		padding: 20upx;
-		justify-content: flex-start;
-		flex-direction: row-reverse;
-		text-align: right;
-	}
-	.userImg{
-		width: 70upx;
-		height: 70upx;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		margin-right: 15upx;
-		margin-left: 15upx;
-	}
-	.userImg>image{
-		width: 65upx;
-		height: 65upx;
-		border-radius: 100%;
-	}
-	.userType{
-		display: flex;
-		justify-content: center;
-		flex-direction: column;
-		padding: 10upx;
-	}
-	.userN{
-		height: 50upx;
-		display: flex;
-		justify-content: space-around;
-		margin-left:-40upx;
-		font-size: 30upx;
-	}
-	.userN>text{
-		height: 50upx;
-		min-height: 100upx;
-		color: #666;
-	}
-	.textType{
-		max-width: 400upx;
-		background-color: #FFFFFF;
-		border-radius: 10upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		padding: 10upx;
-	}
-	.textType>text{
-		font-size: 28upx;
-		color: #666;
-	}
-	.imgType{
-		max-width: 300upx;
-		max-height: 420upx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		background-color: #FFFFFF;
-		border-radius: 20upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-	}
-	.imgType>image{
-		width: 250upx;
-		height: 350upx;
-		padding: 20upx;
-	}
-	.videoType{
-		width: 300upx;
-		height: 400upx;
-		display: flex;
-		background-color: #FFFFFF;
-		border-radius: 20upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-		align-items: center;
-		justify-content: center;
-		padding: 10upx;
-	}
-	.videoType>video{
-		width: 270upx;
-		height: 370upx;
-	}
-	.userInput{
-		height: 100upx;
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		right: 0;
-		padding: 0 10upx;
-		display: flex;
-		justify-content: space-around;
-		align-items: center;
-		box-shadow: 0 0 5upx 0 #E3E3E3;
-	}
-	.userInput>input{
-		height: 50upx;
-		background: #F4F5F6;
-		border-radius: 15upx;
-		padding: 10upx 10upx;
-		flex: 1;
-		margin-right: 20upx;
-		font-size: 28upx;
-		
-	}
-	.userInput>view{
-		width: 120upx;
-		font-size: 24upx;
-		color: #FFFFFF;
-		height: 60upx;
-		background-color: #18C7F2;
-		border-radius: 20upx;
-		text-align: center;
-		line-height: 60upx;
-	}
+.bgConston {
+  width: 100%;
+  height: 100%;
+  background-color: #f8f8f8;
+  margin: 0;
+  padding: 0;
+}
+/* 聊天 */
+.userSession {
+  width: 100%;
+  height: auto;
+  border-top: 1upx solid #ededed;
+  overflow: auto;
+}
+.userH {
+  width: 80%;
+  height: auto;
+  display: flex;
+  flex: 1;
+  flex-wrap: wrap;
+  padding: 20upx;
+}
+.userMe {
+  width: 95%;
+  height: auto;
+  display: flex;
+  flex: 1;
+  flex-wrap: wrap;
+  padding: 20upx;
+  justify-content: flex-start;
+  flex-direction: row-reverse;
+  text-align: right;
+}
+.userImg {
+  width: 70upx;
+  height: 70upx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-right: 15upx;
+  margin-left: 15upx;
+}
+.userImg > image {
+  width: 65upx;
+  height: 65upx;
+  border-radius: 100%;
+}
+.userType {
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  padding: 10upx;
+}
+.userN {
+  height: 50upx;
+  display: flex;
+  justify-content: space-around;
+  margin-left: -40upx;
+  font-size: 30upx;
+}
+.userN > text {
+  height: 50upx;
+  min-height: 100upx;
+  color: #666;
+}
+.textType {
+  max-width: 400upx;
+  background-color: #ffffff;
+  border-radius: 10upx;
+  box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 10upx;
+}
+.textType > text {
+  font-size: 28upx;
+  color: #666;
+}
+.imgType {
+  max-width: 300upx;
+  max-height: 420upx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #ffffff;
+  border-radius: 20upx;
+  box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
+}
+.imgType > image {
+  width: 250upx;
+  height: 350upx;
+  padding: 20upx;
+}
+.videoType {
+  width: 300upx;
+  height: 400upx;
+  display: flex;
+  background-color: #ffffff;
+  border-radius: 20upx;
+  box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
+  align-items: center;
+  justify-content: center;
+  padding: 10upx;
+}
+.videoType > video {
+  width: 270upx;
+  height: 370upx;
+}
+.userInput {
+  height: 100upx;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: 0 10upx;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  box-shadow: 0 0 5upx 0 #e3e3e3;
+}
+.userInput > input {
+  height: 50upx;
+  background: #f4f5f6;
+  border-radius: 15upx;
+  padding: 10upx 10upx;
+  flex: 1;
+  margin-right: 20upx;
+  font-size: 28upx;
+}
+.userInput > view {
+  width: 120upx;
+  font-size: 24upx;
+  color: #ffffff;
+  height: 60upx;
+  background-color: #18c7f2;
+  border-radius: 20upx;
+  text-align: center;
+  line-height: 60upx;
+}
 </style>
diff --git a/pages_borrow_books/pages/return-books/return-books.vue b/pages_borrow_books/pages/return-books/return-books.vue
index 01e959356a991f2ff0b712ad5e6d811a239911b8..5502cc8230c0cb61a4c1d21daf83d21f43673c6a 100644
--- a/pages_borrow_books/pages/return-books/return-books.vue
+++ b/pages_borrow_books/pages/return-books/return-books.vue
@@ -1,304 +1,437 @@
 <template>
-	<view class="show">
+	<view>
 		<!-- 顶部 -->
-		
-		<!-- 顶部 -->
-		<view class="mid" >
-			<view class="midone">
+		<u-navbar zhead="65rpx" height="44" title="还书" title-color="white" title-size="40" :background="background"
+					 back-icon-color="white" back-icon-size="50">
+						<view class="navbar-right" slot="right">
+							<view class="right_list" @click="bindInBatch">
+							</view>
+						</view>
+					</u-navbar>
+  <view class="show">
+	  <view v-if="realBook.length > 0">
+		<view v-for="(item,index) in realBook" :key="index">
+			<view class="mid">
+			  <view class="midone">
 				<view class="">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 206rpx; height: 258rpx;"></image>
+				  <image class="imag" :src="item.realBook.book.picturePath" @error="imageError()" style="width: 206rpx; height: 258rpx"></image>
 				</view>
 				<view>
-					<view class="book-name">书的名字</view>
-					<view class="s1">预约时间：
-						<view class="s6">2018-08-20</view>
+				  <view class="book-name">{{(bookName(item.realBook.book.bookName) >13) ? item.realBook.book.bookName.substring(0,13)+'...' : item.realBook.book.bookName}}</view>
+				  <view class="s1">借书时间：
+					<view class="s6">{{happenTimeFun(item.borrowTime)}}</view>
+				  </view>
+				  <view class="s2">持书人：
+					<view class="">{{item.reader.nickname}}</view>
+				  </view>
+				  <view class="s7">
+					<view class="s4">应还时间：
+					  <text >{{happenTimeFun(item.needreturnTime)}}</text>
 					</view>
-					<view class="s2">持书人：
-						<view class="">省中山图书馆</view>
-					</view>
-					<view class="s7">
-						<view class="s4">应还时间：无
-							<!-- <view class="">无</view> -->
-						</view>
-					</view>
-					<view class="s2">当前状态：
-						<view class="">线下交易中，物流配送中</view>
-					</view>
-					<view class="btns">
-						<view class="two">
-							<view  style="margin-left: 25rpx; margin-top: 5rpx;" @click="cl">我已读完</view>
-						</view>
+				  </view>
+				  <view class="s2">当前状态：
+					<view class="">正在阅读中</view>
+				  </view>
+				  <view class="btns">
+					<view class="two">
+					  <view style="margin-left: 25rpx; margin-top: 5rpx" @click="cl(item.realBook.realBookId)">我已读完</view>
 					</view>
+				  </view>
 				</view>
+			  </view>
 			</view>
-			
-			<!-- 分割线br -->
-			<view class="br"></view>
-			
-			
-			<view class="midone">
-				<view class="">
-					<image class="imag" src="../../static/images/ap.jpg" style="width: 206rpx; height: 258rpx;"></image>
-				</view>
-				<view>
-					<view class="book-name">书的名字</view>
-					<view class="s1">预约时间：
-						<view class="s6">2018-08-20</view>
-					</view>
-					<view class="s2">持书人：
-						<view class="">省中山图书馆</view>
+		 </view>
+		</view>
+		  <!-- 分割线br -->
+		  <view class="br"></view>
+		  <!-- #ifdef MP-WEIXIN -->
+		  <view class="br"></view>
+		  <!-- #endif -->
+		  <view v-if="SureReturn1.length > 0">
+			  <view v-for="(item,index) in SureReturn1" :key="index">
+				  <view class="midone">
+					<view class="">
+					  <image class="imag" :src="item.realBook.book.picturePath" @error="imageError()" style="width: 206rpx; height: 258rpx"></image>
 					</view>
-					<view class="s7">
-						<view class="s4">应还时间：无
-							<!-- <view class="">无</view> -->
+					<view>
+					  <view class="book-name">{{(bookName(item.realBook.book.bookName) >13) ? item.realBook.book.bookName.substring(0,13)+'...' : item.realBook.book.bookName}}</view>
+					  <view class="s1">借书时间：
+						<view class="s6">{{happenTimeFun(item.borrowTime)}}</view>
+					  </view>
+					  <view class="s2">持书人：
+						<view class="">{{item.reader.nickname}}</view>
+					  </view>
+					  <view class="s7">
+						<view class="s4">应还时间：
+						<text >{{happenTimeFun(item.needreturnTime)}}</text>
 						</view>
+					  </view>
+					  <view class="s2">当前状态：
+						<view class="">线下交易中</view>
+					  </view>
+					  <view class="btns">
+						  <view class="one" @click="contactOrderAgent">
+							<view style="">联系预约人</view>
+						  </view>
+
+						  <view class="three" @click="faceTofaceReturn(item.realBook.book.bookName,item.realBookId)">
+							<view style="">面对面还书</view>
+						  </view>
+					  </view>
 					</view>
-					<view class="s2">当前状态：
-						<view class="">线下交易中，物流配送中</view>
-					</view>
-					<view class="btns">
-						<navigator url="contact-order-agent">
-							<view class="one">
-								<view  style="">联系预约人</view>
-							</view>
-						</navigator>
-						<navigator url="/pages_borrow_books/pages/return/return">
-							<view class="three">
-								<view  style=" ">面对面还书</view>
-							</view>
-						</navigator>
-					</view>
+				  </view>
 				</view>
 			</view>
-			
-			<!-- 线上预约中 -->
-			
-			
-			<!-- 分割线br -->
-			<view class="br"></view>
-			
-		</view>
+		  <!-- 线上预约中 -->
+
+		  <!-- 分割线br -->
+		  <view class="br1"></view>
+		  <!-- #ifdef MP-WEIXIN -->
+		  <view class="br"></view>
+		  <!-- #endif -->
+	<view v-if="(realBook.length == 0 && SureReturn1.length == 0)" @click="toBorrow()">
+		您还没有记录，<span style="color: #00AAFF;">快去借书吧!</span>
 	</view>
+  </view>
+  </view>
 </template>
 <script>
+	let app = getApp();
 	export default {
-		data() {
-			return {
-				
-			};
-		},
-
-		onLoad() {
-
-		},
+	  data() {
+		return {
+      background: {
+        background: "#6C40F3",
+      },
+			realBook : [], //未点击已还的列表
+			SureReturn1 : [] //点击已还的列表
+		};
+	  },
 
+	  onLoad() {
+		  this.getSureReturn0(); //当前读者未点击已还列表
+		  this.getSureReturn1(); //当前读者点击已还界面
+	  },
 
+	  methods: {
+		cl(e) {
+		  var that = this;
+		  uni.showModal({
+			title: "温馨提示",
+			style: "color:#494949;font-size: 30rpx;border-radius: 20rpx;",
+			content: "确认读完后将无法取消，其他人将可以在系统上向你借书",
 
+			success: function (res) {
+			  if (res.confirm) {
+				console.log("确认");
+				that.getBookReturn(e);
+			  } else if (res.cancel) {
+				console.log("取消");
+			  }
+			},
+		  });
+		},
+		//查找当前读者的还书列表(未点击)
+		async getSureReturn0(){
+			var that = this;
+			let bookInfoList = [];
+			var params = {
+				url: "borrowList/myBorrowingList",
+				type: 'GET',
+				data: {
+					"isReturned":false,
+					"sureReturn":false
+				}
+			}
+			const res = await app.myRequest(params);
+			that.realBook = res;
+			console.log("res",res)
+		},
+		//点击我已读完
+		async getBookReturn(e){
+			var that = this;
+			await getApp().myRequest({
+				url: "borrow/sureReturn?realBookId="+e,
+				type: 'GET'
+			}).then(res1 => {
+				console.log("res1",res1);
+				if(res1 == true){
+					uni.redirectTo({
+						url: '/pages_borrow_books/pages/return-books/return-books'
+					})
 
-		methods: {
-			
-			cl(){
-				uni.showModal({
-					title:'温馨提示',
-					style:'color:#494949;font-size: 30rpx;border-radius: 20rpx;',
-					content:'确认读完后将无法取消，其他人将可以在系统上向你借书',
-					
-					success:function (res) {
-						if(res.confirm){
-							console.log('确认');
-						}
-						else if (res.cancel){
-							console.log('取消');
-						}
-					}
-				});
+				}else{
+					uni.redirectTo({
+						url: '/pages_borrow_books/pages/return-books/return-books'
+					})
+					uni.showToast({
+						icon: 'none',
+						title: res1.message
+					})
+				}
+			}).catch(err => {
+				console.log("err", err);
+			})
+		},
+		//查找当前读者的还书列表(已点击)
+		async getSureReturn1(){
+			var that = this;
+			let bookInfoList = [];
+			var params = {
+				url: "borrowList/myBorrowingList",
+				type: 'GET',
+				data: {
+					"isReturned":false,
+					"sureReturn":true
+				}
 			}
-				
+			const res = await app.myRequest(params);
+			that.SureReturn1 = res;
+			console.log("SureReturn1",res)
+		},
+		//图片加载不出来
+		imageError(){
+			let that = this;
+			// console.log(index)
+			that.book.picturePath = "/static/images/temporary.jpg"
+		},
+		//去借书
+		toBorrow(){
+			uni.switchTab({
+			    url: '/pages/main/main'
+			});
+		},
+		//联系预约人
+		contactOrderAgent(){
+			uni.navigateTo({
+				url: '/pages_borrow_books/pages/return-books/contact-order-agent'
+			})
+		},
+		//面对面还书
+		faceTofaceReturn(e,w){
+			uni.navigateTo({
+				url: '/pages_borrow_books/pages/return/return?bookName=' + e + '&realBookId='+w
+			})
 		},
-	}
-	
-	
-	
+		bookName:function(e){
+			var e1 = e + " ";
+			return e1.length;
+			},
+		//查看这册书的状态和信息
+		/* async getRealBookInfo(e){
+			var that = this;
+			var params = {
+				url: "borrow/bookInfo?realBookId=" + e,
+				type: 'GET'
+			}
+			const res = await app.myRequest(params)
+			return res
+		}, */
+		happenTimeFun(num){//时间戳数据处理
+			 let date = new Date(num);
+			 //时间戳为10位需*1000，时间戳为13位的话不需乘1000
+			 let y = date.getFullYear();
+			 let MM = date.getMonth() + 1;
+			 MM = MM < 10 ? ('0' + MM) : MM;//月补0
+			 let d = date.getDate();
+			 d = d < 10 ? ('0' + d) : d;//天补0
+			 let h = date.getHours();
+			 h = h < 10 ? ('0' + h) : h;//小时补0
+			 let m = date.getMinutes();
+			 m = m < 10 ? ('0' + m) : m;//分钟补0
+			 let s = date.getSeconds();
+			 s = s < 10 ? ('0' + s) : s;//秒补0
+			 return y + '-' + MM + '-' + d; //年月日
+		 },
+	  }
+	};
 </script>
 
 <style>
-	
-.book-name{
-	font-size: 36rpx;
-	margin-top: -20rpx;
-	color: #333333;
-}	
-	
-.br {
-		margin-top: 20rpx;
-		/* width: 100%; */
-		height: 1rpx;
-		background-color: #EEEEEE;
-	}
-.show{
-	/* margin-bottom: auto; */
-	width: auto;
-	height: auto;
-	/* background-color: #F8F8F8; */
+.book-name {
+  font-size: 36rpx;
+  margin-top: -20rpx;
+  color: #333333;
 }
-.mid {	
-	/* margin-top:20rpx; */
+.emptyList {
 	width: 100%;
-	height: 480rpx;
+	height: 100rpx;
+	font-size: 40rpx;
+	color: red;
+	text-align: center;
+	margin-top: 60rpx;
 }
-.zt1{
-	color: #555555;
-	font-size: 26rpx;
-	margin-left: 30rpx;
-	line-height: center;
-	color: #646464;
+
+.br {
+  margin-top: 20rpx;
+  /* width: 100%; */
+  height: 1rpx;
+  background-color: #eeeeee;
 }
-.zt{
-	height: 70rpx;
-	display: flex;
-	align-items: center;
-	
+
+
+.br1 {
+  margin-top: 70rpx;
+  /* width: 100%; */
+  height: 1rpx;
+  background-color: #eeeeee;
+}
+.show {
+  /* margin-bottom: auto; */
+  width: auto;
+  height: auto;
+  /* background-color: #F8F8F8; */
+}
+.mid {
+  /* margin-top:20rpx; */
+  width: 100%;
+  height: 360rpx;
+}
+.zt1 {
+  color: #555555;
+  font-size: 26rpx;
+  margin-left: 30rpx;
+  line-height: center;
+  color: #646464;
+}
+.zt {
+  height: 70rpx;
+  display: flex;
+  align-items: center;
 }
 .midone {
-	width: 90%;
-	height: 300rpx;
-	font-size: 30rpx;
-	margin-top: 20rpx;
-	align-items: center;
-	display: flex;
+  width: 90%;
+  height: 300rpx;
+  font-size: 30rpx;
+  margin-top: 20rpx;
+  align-items: center;
+  display: flex;
 }
 
-.imag{
-	margin-left:30rpx;
+.imag {
+  margin-left: 30rpx;
+  margin-top: 80rpx;
+  margin-right: 20rpx;
 }
 
-.s1{
-	font-size: 24rpx;
-	margin-top: 5rpx;
-	height:35rpx;
-	align-items: center;
-	color: #999999;
-	display: flex;
+.s1 {
+  font-size: 24rpx;
+  margin-top: 5rpx;
+  height: 35rpx;
+  align-items: center;
+  color: #999999;
+  display: flex;
 }
-.s2{
-	font-size: 24rpx;
-	height:35rpx;
-	margin-top: 5rpx;
-	align-items: center;
-	color: #999999;
-	display: flex;
+.s2 {
+  font-size: 24rpx;
+  height: 35rpx;
+  margin-top: 5rpx;
+  align-items: center;
+  color: #999999;
+  display: flex;
 }
-.btns{
-	font-size: 22rpx;
-	height:35rpx;
-	margin-top: 20rpx;
-	align-items: center;
-	color: #999999;
-	display: flex;
-	
+.btns {
+  font-size: 22rpx;
+  height: 35rpx;
+  margin-top: 20rpx;
+  align-items: center;
+  color: #999999;
+  display: flex;
 }
-.one{
-	background-color: #EBEBEB;
-	height: 45rpx;
-	width: 135rpx;
-	border-radius: 23rpx;
-	line-height:45rpx;
-	text-align: center;
-	opacity:1;
-	margin-left: 200rpx;
+.one {
+  background-color: #ebebeb;
+  height: 45rpx;
+  width: 135rpx;
+  border-radius: 23rpx;
+  line-height: 45rpx;
+  text-align: center;
+  opacity: 1;
+  margin-left: 200rpx;
 }
-.two{
-	background-color: #5E49F5;
-	color: #FFFFFF;
-	height: 45rpx;
-	width: 135rpx;
-	margin-left: 355rpx;
-	border-radius: 23rpx;
-	opacity:1;
+.two {
+  background-color: #5e49f5;
+  color: #ffffff;
+  height: 45rpx;
+  width: 135rpx;
+  margin-left: 355rpx;
+  border-radius: 23rpx;
+  opacity: 1;
 }
 
-
-
-.three{
-	background-color: #EBEBEB;
-	height: 45rpx;
-	width: 135rpx;
-	margin-left: 20rpx;
-	border-radius: 23rpx;
-	line-height:45rpx;
-	text-align: center;
-	opacity:1;
+.three {
+  background-color: #ebebeb;
+  height: 45rpx;
+  width: 135rpx;
+  margin-left: 20rpx;
+  border-radius: 23rpx;
+  line-height: 45rpx;
+  text-align: center;
+  opacity: 1;
 }
 
-.s4{
-	font-size: 24rpx;
-	height:35rpx;
-	margin-top: 5rpx;
-	align-items: center;
-	color: #999999;
+.s4 {
+  font-size: 24rpx;
+  height: 35rpx;
+  margin-top: 5rpx;
+  align-items: center;
+  color: #999999;
 }
 
-.s6{
-	color: #999999;
-	
+.s6 {
+  color: #999999;
 }
 
-.s7{
-	height:35rpx;
-	align-items: center;
-	width: auto;
-	display: flex;
+.s7 {
+  height: 35rpx;
+  align-items: center;
+  width: auto;
+  display: flex;
 }
 
-.s8{
-	
-	display: flex;
+.s8 {
+  display: flex;
 }
-.dt{
-	margin-top: 20rpx;
-	margin-left: 30rpx;
-	font-size: 26rpx;
-	color: #555555;
-	margin-bottom: 20rpx;
-	display: flex;
+.dt {
+  margin-top: 20rpx;
+  margin-left: 30rpx;
+  font-size: 26rpx;
+  color: #555555;
+  margin-bottom: 20rpx;
+  display: flex;
 }
-.ti{
-	color: #999999;
-	margin-top: 30rpx;
-	font-size: 23rpx;
-	margin-left: 230rpx;
+.ti {
+  color: #999999;
+  margin-top: 30rpx;
+  font-size: 23rpx;
+  margin-left: 230rpx;
 }
 
-
-
-.wz{
-	font-size: 28rpx;
-	margin-top: 8rpx;
-	height: 90rpx;
-	
+.wz {
+  font-size: 28rpx;
+  margin-top: 8rpx;
+  height: 90rpx;
 }
 .shumu {
-	font-size: 25rpx;
-	margin-top: -130rpx;
-	color:   #999999;
-	width: 120rpx;
-	display: block;
+  font-size: 25rpx;
+  margin-top: -130rpx;
+  color: #999999;
+  width: 120rpx;
+  display: block;
 }
-.shumuone{
-	font-size: 25rpx;
-	color: #999999;
-	/* background-color: #4CD964; */
+.shumuone {
+  font-size: 25rpx;
+  color: #999999;
+  /* background-color: #4CD964; */
 }
-.shumutwo{
-	margin-left: 250rpx;
-	font-size: 20rpx;
-	color:  #999999;
-	margin-top: -30rpx;
+.shumutwo {
+  margin-left: 250rpx;
+  font-size: 20rpx;
+  color: #999999;
+  margin-top: -30rpx;
 }
-.shumuthree{
-	margin-top: 10rpx;
-	font-size: 25rpx;
-	color: #999999;
+.shumuthree {
+  margin-top: 10rpx;
+  font-size: 25rpx;
+  color: #999999;
 }
-
 </style>
diff --git a/pages_borrow_books/pages/return/return.vue b/pages_borrow_books/pages/return/return.vue
index 3ef15bb629e07f546c16918e4b313834a09ba0f9..d1637b5eefaaa65534650294e3304a033559a37b 100644
--- a/pages_borrow_books/pages/return/return.vue
+++ b/pages_borrow_books/pages/return/return.vue
@@ -1,44 +1,109 @@
 <template>
-	<view>
-		<view class="">
-			<image class="erweima" src="../../static/images/qr_code.png"></image>
-		</view>
-		<view class="erweima-action">扫描二维码</view>
-		<view class="erweima-borrow">借走《巨人的陨落》</view>
-	</view>
+  <view>
+	  <!-- 顶部 -->
+	  <u-navbar zhead="65rpx" height="44" title="面对面还书" title-color="white" title-size="40" :background="background"
+	  			 back-icon-color="white" back-icon-size="50">
+	  				<view class="navbar-right" slot="right">
+	  					<view class="right_list" @click="bindInBatch">
+	  					</view>
+	  				</view>
+	  			</u-navbar>
+    <view class="">
+      <image class="erweima" :src="srImg"></image>
+    </view>
+    <view class="erweima-action">扫描二维码</view>
+    <view class="erweima-borrow">借走《{{bookNames}}》</view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			
-		}
-	}
+import QR from "../../components/wxqrcode.js" // 二维码生成器
+let app = getApp();
+export default {
+  data() {
+    return {
+      background: {
+        background: "#6C40F3",
+      },
+		bookNames : "",
+		srImg : "",
+		uuid : ""
+	};
+  },
+  onLoad(e){
+  	 console.log(e);
+	 this.bookNames = e.bookName;
+	 this.returnByFaceToFace(e.realBookId);
+	 this.wxqrcode();
+
+  },
+  methods: {
+	  bookName:function(e){
+	  	var e1 = e + " ";
+	  	return e1.length;
+	  	},
+	  async returnByFaceToFace(e){
+		  var that = this;
+		  var params = {
+		  	url: "borrow/returnByFaceToFace",
+		  	type: 'GET',
+		  	data: {
+		  		"realBookId":e
+		  	}
+		  }
+		  const res = await app.myRequest(params);
+		  that.uuid = res;
+		  console.log('uuid',res)
+
+	  },
+	  async borrowByFaceToFace(){
+		  var that = this;
+		  var params = {
+		  	url: "borrow/borrowByFaceToFace",
+		  	type: 'GET',
+		  	data: {
+		  		"uuid":that.uuid
+		  	}
+		  }
+		  const res = await app.myRequest(params);
+		  let returnResult = "";
+		  if(res == true){
+			  returnResult = "借书成功！"
+		  }else{
+			  returnResult = "借书失败！"
+		  }
+		  return returnResult;
+
+	  },
+	  async wxqrcode(){
+		  var that = this;
+		  let img = QR.createQrCodeImg(that.borrowByFaceToFace, {
+		       size: parseInt(300)//二维码大小
+		  })
+		  that.srImg = img;
+		  console.log("img",that.srImg);
+	  }
+  },
+};
 </script>
 
 <style>
-
-	.erweima{
-		width:262rpx; 
-		height: 262rpx; 
-		margin-top: 32%; 
-		margin-left: 32%;
-	}
-	.erweima-action{
-		margin-top: 5rpx;
-		margin-left: 40%;
-		font-size: 30rpx;
-		color: #646464;
-	}
-	.erweima-borrow{
-		margin-top: 10rpx;
-		margin-left: 37%;
-		font-size: 24rpx;
-		color: #646464;
-	}
+.erweima {
+  width: 262rpx;
+  height: 262rpx;
+  margin-top: 32%;
+  margin-left: 32%;
+}
+.erweima-action {
+  margin-top: 5rpx;
+  margin-left: 40%;
+  font-size: 30rpx;
+  color: #646464;
+}
+.erweima-borrow {
+  margin-top: 10rpx;
+  margin-left: 37%;
+  font-size: 24rpx;
+  color: #646464;
+}
 </style>
diff --git a/pages_read_circle/pages/index/MyExper.vue b/pages_read_circle/pages/index/MyExper.vue
index 614922a6c7e6229d33b4e01ce21b753835dfc048..d03b123f395be1c16ebd49763e7ffa83caa9b762 100644
--- a/pages_read_circle/pages/index/MyExper.vue
+++ b/pages_read_circle/pages/index/MyExper.vue
@@ -1,5 +1,13 @@
 <template>
 	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="我要发表" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<view class="top">
 			<textarea class="te" placeholder="这一刻的想法......" maxlength="500"></textarea>
 		</view>
@@ -10,7 +18,11 @@
 <script>
 export default {
 	data() {
-		return {};
+		return {
+			background: {
+				background: "#6C40F3",
+			},
+		};
 	},
 	methods: {}
 };
diff --git a/pages_read_circle/pages/index/MyExperience.vue b/pages_read_circle/pages/index/MyExperience.vue
index d024e586a8e17348cce63b673b50a7607ecb3499..9b6bfff4aedb58fbea63780396dcd76b7958ff84 100644
--- a/pages_read_circle/pages/index/MyExperience.vue
+++ b/pages_read_circle/pages/index/MyExperience.vue
@@ -1,312 +1,488 @@
 <template>
 	<view>
-		<view class="top">
-			<view><image class="imag" src="../../static/images/头像2.jpg" style="width:90rpx;height: 90rpx;border-radius: 100%;"></image>
-			</view>
-			<navigator url="./MyExper">
-			<view class="header-input">
-				<input @input="goToSearch" placeholder="这一刻我想说..." placeholderStyle="color:#BBBBBB" type="text"></input>
-				<view>
-					<image class="image" src="../../static/images/fabiao.png"></image>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="我的心得" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
 				</view>
 			</view>
-			</navigator>
-		</view>
-		<view class="mid">
-			<view class="midone">
-				<navigator url="./MyExper">
-				<image class="ima_one" src="../../static/images/woyaofabu.png"style="width: 80rpx;height: 80rpx;"></image>
-				<view class="imawz">去发表</view>
-				</navigator>
-			</view>
-			<view class="midone">
-				<navigator url="yifabiao">
-				<image class="ima_one" src="../../static/images/yifabu.png"style="width: 80rpx;height: 80rpx;"></image>
-				<view class="imawz">已发表</view>
-				</navigator>
-			</view>
-			<view class="midone">
-				<image class="ima_one" src="../../static/images/caogao.png"style="width: 80rpx;height: 80rpx;"></image>
-				<view class="imawz">草稿箱</view>
-			</view>
-			<view class="midone">
+		</u-navbar>
+		<view class="top">
+			<view class="topone">
+				<view class="title">心得墙</view>
 				<navigator url="SerchExper">
-				<image class="ima_one" src="../../static/images/sousuo.png"style="width: 80rpx;height: 80rpx;"></image>
-				<view class="imawz">搜心得</view>
+					<view class="search">
+						<view class="Sc">查看我的</view>
+						<image src="/static/images/search_icon2x.png" style="width: 55rpx;height: 55rpx;"></image>
+					</view>
 				</navigator>
 			</view>
 		</view>
-		<view class="under">
-			<view class="show">
-				<view class="showone">
-					<view class="person">
-						<view class="tou">
-							<image class="imagetwo" src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="bn">
-							<text class="name">爱丽丝</text>
-						</view>
-						<view class="tw">
-							<view class="time">2020-08-09 14:10</view>
-						</view>
-						<view class="delate"@click="cl">
-							<image class="imgethree" src="../../static/images/schu.png"style="width: 28rpx;height: 30rpx;"></image>
-						</view>
-					</view>
-					<view class="zy">
-						<text>《预见未来》今天又是美好的一天！好好解决实际缴纳那你说的均为额欸威尔和挑挑剔剔哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text>
-					</view>
+
+		<view class="mid">
+			<view class="backG">
+				<image src="/static/images/after.jpg"></image>
+			</view>
+		</view>
+		<view class="midone">
+			<navigator url="./draft">
+				<view>
+					<image class="imag" src="/static/images/caogao.png" style="width:85rpx;height: 85rpx;border-radius: 100%;"></image>
 				</view>
-				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png"style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
+			</navigator>
+			<navigator url="./publish">
+				<view class="header-input">
+					<input @input="goToSearch" placeholder="我也要发表..." placeholderStyle="color:#BBBBBB" type="text"></input>
+					<view>
+						<image class="image" src="/static/images/fabiao.png"></image>
 					</view>
 				</view>
-			</view>
-			<view class="show">
+			</navigator>
+		</view>
+		<view class="br2"></view>
+		<view class="under">
+			<!-- 第一条心得 -->
+			<view class="show" v-for="(i,index) in info" :key=index>
 				<view class="showone">
 					<view class="person">
 						<view class="tou">
-							<image class="imagetwo" src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
+							<image :src="i.other.rank.reader.avatar" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
 						</view>
-						<view class="bn">
-							<text class="name">爱丽丝</text>
+						<view class="Ttitle" @click="toPersonalHome(i.other.rank.reader.readerId)">
+							<view class="Ntitle">
+								<view class="name">{{i.other.rank.reader.readerName}}</view>
+								<view class="dj">
+									<view class="vip">LV.{{i.other.rank.max}}</view>
+								</view>
+							</view>
+							<view class="time">{{i.issueTime}}</view>
 						</view>
-						<view class="tw">
-							<view class="time">2020-08-09 14:10</view>
-						</view>
-						<view class="delate"@click="cl">
-							<image class="imgethree" src="../../static/images/schu.png"style="width: 28rpx;height: 30rpx;"></image>
-						</view>
-					</view>
-					<view class="zy">
-						<text>《预见未来》今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text>
 					</view>
-				</view>
-				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png"style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
+					<view class="zy" @click="toDetil(i.other.id)">
+						<text>
+							{{i.other.content}}
+						</text>
 					</view>
-				</view>
-			</view>
-			<view class="show">
-				<view class="showone">
-					<view class="person">
-						<view class="tou">
-							<image class="imagetwo" src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="bn">
-							<text class="name">爱丽丝</text>
+					<view class="pictrue" v-if="i.issueImags != 0">
+						<view class="imgs" v-for="iamg in i.issueImags">
+							<image @click="imgYu" :data-img="iamg" :data-list="iamg" class="img" :src="iamg" style="width: 236rpx; height: 236rpx;"></image>
 						</view>
-						<view class="tw">
-							<view class="time">2020-08-09 14:10</view>
-						</view>
-						<view class="delate"@click="cl">
-							<image class="imgethree" src="../../static/images/schu.png"style="width: 28rpx;height: 30rpx;"></image>
-						</view>
-					</view>
-					<view class="zy">
-						<text>《预见未来》今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text>
 					</view>
 				</view>
+				<view class="input">
+					<input class="input_comment" v-model="comment" confirm-type="send" @confirm="confirm(index,i.other.id)" :placeholder="placeholder"/>
+				</view>
 				<view class="showtwo">
 					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
+						<image @tap="like(index,i.other.id)" class="wave" :src="i.praseStatus==1?'/static/images/dianzan.png':'/static/images/give_like.png'"></image>
+						<text id="t">{{i.praiseNum}}</text>
 					</view>
 					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png"style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
+						<image @tap="comment(index,i.other.id)" class="wave" src="/static/images/pinglun.png" style="width: 38rpx;height: 36rpx;"></image>
+						<text id="t">{{i.commentNum}}</text>
 					</view>
 				</view>
 			</view>
 		</view>
-	
+
 	</view>
 </template>
+
 <script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
 		data() {
 			return {
-				
+				background: {
+					background: "#6C40F3",
+				},
+				issueType: 1, //发布的类型 1心得
+				id: 0, //id=0查询全部作品
+				page: 0,
+				size: 20,
+				sort: "issueTime,desc", // 按照发布时间排序
+				info: [],
+				imgList: [],
+				url:"",
+				placeholder:"评论...",
+				comment:"",
 			}
 		},
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
+		onShow() {
+			this.getInfo()
+		},
 		methods: {
-			cl(){
-				uni.showModal({
-					title:'提示',
-					content:'是否删除该心得',
-					success:function (res) {
-						if(res.confirm){
-							console.log('确认');
-						}
-						else if (res.cancel){
-							console.log('取消');
-						}
+			//获取内容
+			async getInfo() {
+				var that = this;
+				var params = {
+					url: "circleReviewContent/query",
+					type: 'GET',
+					data: {
+						issueType: that.issueType,
+						id: that.id,
+						page: that.page,
+						size: that.size,
+						sort: that.sort,
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log("后台传来的：", res)
+				that.info = res.contentMap
+			},
+
+			// 点赞
+			like(index, id) {
+				if(this.info[index].praseStatus==1){
+					this.info[index].praseStatus = 0;
+					this.info[index].praiseNum = this.info[index].praiseNum -1;
+					//点赞计入服务器
+					this.url = "praise/notLike";
+					this.likeImport(id);
+				}else{
+					this.info[index].praseStatus=1;
+					this.info[index].praiseNum = this.info[index].praiseNum +1;
+					this.url = "praise/like";
+					this.likeImport(id);
+				}
+				
+			},
+			//点击完成发送评论	
+			async confirm(index,id){
+				console.log("评论index:",index)
+				console.log("作品id:",id)
+				console.log("内容：",this.comment)
+				let that = this
+				that.placeholder = "评论..."
+				uni.request({
+					url: getApp().globalData.URL + 'comment/addComment', //仅为示例，并非真实接口地址。
+					data: {
+						id:id,
+						content:that.comment,
+					},
+					method: "POST",
+					header: {
+						'Authorization': that.token
+					},
+					success: (res) => {
+						console.log("评论成功：",res);
+					},
+					fail: (res) => {
+						console.log("评论失败：",res);
 					}
 				});
-			}
+			},
+			
+			//喜欢
+			async likeImport(id) {
+				var that = this;
+				var params = {
+					url: that.url,
+					type: 'GET',
+					data: {
+						composeId:id
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log("后台传来的：", res)
+			},
+			
+			//图片点击事件
+			imgYu(event) {
+				console.log(event);
+				var src = event.currentTarget.dataset.src; //获取data-src
+				this.imgList = [event.currentTarget.dataset.list]; //获取data-list
+				//图片预览
+				uni.previewImage({
+					current: src, // 当前显示图片的http链接
+					urls: this.imgList // 需要预览的图片http链接列表
+				})
+			},
+
+			//去详情页
+			toDetil(id) {
+				uni.navigateTo({
+					url: "../readCircle/readExperience?id=" + id
+				})
+			},
+
+			//去他的主页
+			toPersonalHome(friendId) {
+				uni.navigateTo({
+					url: "/pages/friend/friendXQ?friendId=" + friendId,
+				})
+			},
 		}
 	}
 </script>
+<style>
+	.input{
+		margin: 0 auto;
+		 width: 95%;
+		 height: 50rpx;
+		 background-color: white;
+		 border-radius: 10rpx;
+		 margin-bottom: 10rpx;
+	}
+	.input_comment{
+		margin-left: 25rpx;
+		color: #707070;
+	}
+	.topone {
+		/* background-color: #f5f5f5; */
+		display: flex;
+		height: 60rpx;
+	}
 
+	.title {
+		width: 66%;
+		font-size: 28rpx;
+		margin-top: 15rpx;
+		margin-left: 30rpx;
+	}
 
-<style>
-	.imag{
+	.search {
+		display: flex;
+		font-size: 28rpx;
+		margin-top: 15rpx;
+		margin-left: 35rpx;
+	}
+
+	.search image {
+		margin-top: -5rpx;
+	}
+
+	.Sc {
+		margin-left: 5rpx;
+		font-size: 28rpx;
+		/* color: red; */
+	}
+
+	.br2 {
+		width: 100%;
+		height: 18rpx;
+		/* margin-top: 20rpx; */
+		background-color: #F5F5F5;
+	}
+
+	.midone {
+		height: 95rpx;
+		margin-top: 10rpx;
+		display: flex;
+	}
+
+	.imag {
 		margin-left: 20rpx;
-		margin-top: 20rpx;
+		margin-top: -5rpx;
 	}
+
 	.header-input {
-	    margin-left: 140rpx;
-	    margin-top: -90rpx;
-	    width: 580rpx;
-	    height: 72rpx;
-	    border-radius: 36rpx;
-	    background-color: rgba(255,0,2,0.05);
-	    /* border: 1rpx solid  #007AFF; */
-	    display: flex;
-	    flex-direction: row;
-	}
-	
+		margin-left: 35rpx;
+		margin-top: 5rpx;
+		width: 580rpx;
+		height: 70rpx;
+		border-radius: 36rpx;
+		background-color: rgba(255, 0, 2, 0.05);
+		/* border: 1rpx solid  #007AFF; */
+		display: flex;
+		flex-direction: row;
+	}
+
 	.header-input input {
-	    margin-left: 31rpx;
-	    width: 564rpx;
-	    height: 66rpx;
-	    line-height: 66rpx;
-	    /* border-right: 1rpx solid #dfdfdf; */
-	    font-size: 28rpx;
-		/* background-color: #007AFF; */
+		margin-left: 31rpx;
+		width: 564rpx;
+		height: 66rpx;
+		line-height: 66rpx;
+		/* border-right: 1rpx solid #dfdfdf; */
+		font-size: 26rpx;
 	}
-	
+
 	.header-input view {
-	    width: 96rpx;
-	    height: 66rpx;
+		width: 96rpx;
+		height: 66rpx;
 	}
-	
+
 	.image {
-	    margin-left: 20rpx;
-	    margin-top: 11rpx;
-	    width: 44rpx;
-	    height: 44rpx;
+		margin-left: 20rpx;
+		margin-top: 11rpx;
+		width: 44rpx;
+		height: 44rpx;
 	}
-	.mid{
+
+	.mid {
 		width: 100%;
-		height: 170rpx;
-		display: flex;
-		margin-top: 20rpx;
+		height: 310rpx;
 		text-align: center;
-		box-shadow:   #F1F1F1 0rpx 8rpx 0rpx 8rpx;
-		/* border-radius: 20rpx; */
 	}
-	.ima_one{
+
+	.backG {
+		width: 94%;
+		height: 300rpx;
+		margin: 20rpx 20rpx;
+	}
+
+	.backG image {
+		border-radius: 15rpx;
+		height: 300rpx;
+		width: 700rpx;
+	}
+
+
+	.ima_one {
 		margin-top: 15rpx;
 		margin-left: 85rpx;
 	}
-	.imawz{
+
+	.imawz {
 		font-size: 26rpx;
 		margin-left: 82rpx;
 		color: #999999;
 	}
+
+	/* 中间 */
 	.under {
 		line-height: 150rpx;
 		/* 设置行高*/
 	}
-	
+
 	.show {
 		height: auto;
 		margin-top: 40rpx;
-		color: #F1F1F1;
+		color: #f1f1f1;
 	}
-	
-	.showone{
-		/* background-image: url(../../image/after.jpg); */
+
+	.showone {
 		color: #999999;
-		background-color:  #FFFFFF;
 		height: auto;
-		background-size: 100%;
-		border-radius: 10rpx;
 		margin-top: 10rpx;
-		border-bottom: none;
-		line-height: 100rpx;
+		border-radius: 50rpx;
 	}
-	
+
 	.person {
 		line-height: 20rpx;
 		display: flex;
+		height: 100rpx;
 	}
-	
+
 	.tou {
-		/* height: 50%; */
-		/* display: block; */
-	}
-	
-	.imagetwo {
 		margin-top: 0rpx;
 		margin-left: 20rpx;
 	}
-	
+
+	.Ttitle {
+		height: 50rpx;
+	}
+
+	.Ntitle {
+		display: flex;
+	}
+
 	.name {
+		height: 30rpx;
+		color: #00aaff;
+		margin-top: 20rpx;
 		font-size: 30rpx;
-		margin: 20rpx;
-		top: 90rpx;
-		color: #00BFFF;
-		/* background-color: #007AFF; */
+		margin-left: 20rpx;
 	}
-	
+
+	.dj {
+		color: #f0ad4e;
+		font-size: 25rpx;
+		border-radius: 10rpx;
+		border: 1rpx solid #f0ad4e;
+		height: 35rpx;
+		margin-top: 12rpx;
+		width: 80rpx;
+		margin-left: 10rpx;
+	}
+
+	.vip {
+		margin-top: 6rpx;
+		text-align: center;
+	}
+
 	.bn {
 		height: 100%;
-		margin-top: 20rpx;
-		/* background-color: #007AFF; */
-	
-	}
-	.tw {
-		margin-top: -130rpx;
-		margin-left: 500p;
+		margin-top: 0rpx;
 	}
-	
+
 	.time {
 		font-size: 20rpx;
-		margin-top: 190rpx;
-		margin-left: -110rpx;
-	}
-	.delate{
-		margin-left: 400rpx;
-		margin-top: 20rpx;
-		/* background-color: #00BFFF; */
-		width: 28rpx;
-		height: 30rpx;
+		margin-top: 10rpx;
+		margin-left: 18rpx;
+		/* background-color: #4CD964; */
 	}
+
 	.zy {
-		margin-top: 10rpx;
-		line-height: 40rpx;
+		/* margin-top: 10rpx;
 		margin-left: 25rpx;
-		margin-right: 20rpx;
+		margin-right: 20rpx; */
+		margin: 10rpx 20rpx;
+		line-height: 40rpx;
 		font-size: 28rpx;
 		font-weight: 300rpx;
-		color: #808080;
+		color: #555555;
+		padding-bottom: 15rpx;
+	}
+
+	.pictrue {
+		display: flex;
+		height: 270rpx;
+		margin: 0rpx 15rpx;
 	}
-	
-	.showtwo{
+
+	.book {
+		height: 240rpx;
+		margin: 20rpx 30rpx;
+		/* background-color: #007AFF; */
+		box-shadow: #f1f1f1 0rpx 0rpx 10rpx 5rpx;
+		border-radius: 8rpx;
+	}
+
+	.booktp {
+		margin-top: 30rpx;
+		margin-left: 30rpx;
+	}
+
+	.bookn {
+		margin-top: -260rpx;
+		margin-left: 200rpx;
+		font-size: 40rpx;
+		color: #333333;
+	}
+
+	.zzn {
+		font-size: 32rpx;
+		color: #333333;
+		margin-top: -100rpx;
+		margin-left: 200rpx;
+	}
+
+	.imgs {
+		display: flex;
+	}
+
+	.img {
+		margin: 16rpx 5rpx;
+	}
+
+	.showtwo {
 		display: flex;
-		border: 2rpx solid  #F1F1F1;
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		border-top: none;
 		height: 80rpx;
 		align-items: center;
-		box-shadow:   #F1F1F1 0rpx 8rpx 0rpx 8rpx;
-	
+		box-shadow: #f1f1f1 0rpx 8rpx 0rpx 8rpx;
 	}
-	
+
 	.wave {
 		z-index: 3;
 		right: 0;
@@ -316,27 +492,23 @@
 		width: 40rpx;
 		padding-top: 10rpx;
 		margin-top: 50rpx;
-		/* animation: wave 10s linear infinite;  */
+		/* animation: wave 10s linear infinite; */
 	}
-	
+
 	.dz {
 		margin-left: 450rpx;
 		display: flex;
-		/* background-color: #007AFF; */
 	}
-	
+
 	.pl {
 		margin-left: 80rpx;
 		display: flex;
-		/* background-color: #007AFF; */
 	}
+
 	#t {
 		font-size: 25rpx;
-		color: #BBBBBB;
+		color: #bbbbbb;
 		margin-left: 5rpx;
 		margin-top: 10rpx;
-		/* background-color: #4CD964; */
 	}
-	
-	
 </style>
diff --git a/pages_read_circle/pages/index/SerchExper.vue b/pages_read_circle/pages/index/SerchExper.vue
index 63e3b2f9ecf99916870398e9d7b91d2ac9058a9a..d64917158b722adaf509d0732eb0f37f687e9a48 100644
--- a/pages_read_circle/pages/index/SerchExper.vue
+++ b/pages_read_circle/pages/index/SerchExper.vue
@@ -1,108 +1,113 @@
 <template>
 	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="搜索心得" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<view class="top">
 		<view class="header-input">
-			<input @input="goToSearch" placeholder="输入名字、专业查找" placeholderStyle="color:#BBBBBB" type="text"></input>
+			<input @input="goToSearch" placeholder="输入关键字查找" placeholderStyle="color:#BBBBBB" type="text"></input>
 			<view>
-				<image class="image" src="../../static/images/search_icon.png">
+				<image class="image" src="/static/images/search_icon.png">
 				</image>
 			</view>
 		</view>
 		</view>
 		<view class="under">
+			<!-- 第一条心得 -->
 			<view class="show">
 				<view class="showone">
 					<view class="person">
 						<view class="tou">
-							<image class="imagetwo" src="../../static/images/after.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="bn">
-							<text class="name">爱丽丝</text>
+							<image src="/static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
 						</view>
-						<view class="tw">
+						<view class="Ttitle">
+							<view class="Ntitle">
+								<view class="name">爱丽丝</view>
+								<view class="dj">
+								<view class="vip">LV.11</view>
+								</view>
+							</view>
 							<view class="time">2020-08-09 14:10</view>
 						</view>
-						<view class="delate"@click="cl">
-							<image class="imgethree" src="../../static/images/schu.png"style="width: 28rpx;height: 30rpx;"></image>
+						<view class="delate" @click="cl">
+							<image src="/static/images/SC.png" style="width: 40rpx;height: 40rpx;"></image>
 						</view>
-					</view>
+						</view>
+					<navigator url="../readCircle/readExperience">
 					<view class="zy">
-						<text>《预见未来》今天又是美好的一天！好好解决实际缴纳那你说的均为额欸威尔和挑挑剔剔哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text>
+						<text>
+							《预见未来》哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈灌灌灌帆帆帆帆烦烦烦哈哈哈哈哈哈哈哈哈哈后哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好好...
+						</text>
 					</view>
+					<view class="tab">
+						<view class="imgs">
+							<image class="img" src="/static/images/书1.jpg" style="width: 220rpx; height: 240rpx;"></image>
+							<image class="img" src="/static/images/书3.jpg" style="width: 220rpx; height: 240rpx;"></image>
+							<image class="img" src="/static/images/书2.jpg" style="width: 220rpx; height: 240rpx;"></image>
+						</view>
+					</view>
+					</navigator>
 				</view>
+
 				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png"style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
-					</view>
+
 				</view>
 			</view>
+			<!-- 第二条心得 -->
 			<view class="show">
 				<view class="showone">
 					<view class="person">
 						<view class="tou">
-							<image class="imagetwo" src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="bn">
-							<text class="name">爱丽丝</text>
+							<image src="/static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
 						</view>
-						<view class="tw">
+						<view class="Ttitle">
+							<view class="Ntitle">
+								<view class="name">爱丽丝hsudifnshk爱吃鱼</view>
+								<view class="dj">
+								<view class="vip">LV.11</view>
+								</view>
+							</view>
 							<view class="time">2020-08-09 14:10</view>
 						</view>
-						<view class="delate"@click="cl">
-							<image class="imgethree" src="../../static/images/schu.png"style="width: 28rpx;height: 30rpx;"></image>
+						<view class="delate" @click="cl">
+							<image src="/static/images/SC.png" style="width: 40rpx;height: 40rpx;"></image>
 						</view>
-					</view>
-					<view class="zy">
-						<text>《预见未来》今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text>
-					</view>
+						</view>
+					<view class="zy"><text>今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈苏杭可免则烦恼斤斤计较经济界就哈哈哈哈哈哈</text></view>
 				</view>
 				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png"style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
-					</view>
+
 				</view>
 			</view>
 			<view class="show">
 				<view class="showone">
 					<view class="person">
 						<view class="tou">
-							<image class="imagetwo" src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
+							<image src="/static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
 						</view>
-						<view class="bn">
-							<text class="name">爱丽丝</text>
-						</view>
-						<view class="tw">
+						<view class="Ttitle">
+							<view class="Ntitle">
+								<view class="name">爱丽丝hsudifnshk爱吃鱼</view>
+								<view class="dj">
+								<view class="vip">LV.11</view>
+								</view>
+							</view>
 							<view class="time">2020-08-09 14:10</view>
 						</view>
-						<!--删除-->
-						<view class="delate"@click="cl">
-							<image class="imgethree" src="../../static/images/schu.png"style="width: 28rpx;height: 30rpx;"></image>
+						<view class="delate" @click="cl">
+							<image src="/static/images/SC.png" style="width: 40rpx;height: 40rpx;"></image>
 						</view>
-						<!--删除-->
-					</view>
-					<view class="zy">
-						<text>《预见未来》今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text>
-					</view>
+						</view>
+					<view class="zy"><text>今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text></view>
 				</view>
+
 				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png"style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
-					</view>
+
 				</view>
 			</view>
 		</view>
@@ -113,6 +118,9 @@
 	export default {
 		data() {
 			return {
+				background: {
+					background: "#6C40F3",
+				},
 			}
 		},
 		methods: {
@@ -151,7 +159,7 @@
 	    display: flex;
 	    flex-direction: row;
 		/* border-bottom: 1upx solid #ccc; */
-	} 
+	}
 	.header-input input {
 	    margin-left: 31rpx;
 	    width: 564rpx;
@@ -160,83 +168,87 @@
 	    /* border-right: 1rpx solid #dfdfdf; */
 	    font-size: 28rpx;
 	}
-	
+
 	.header-input view {
 	    width: 96rpx;
 	    height: 66rpx;
 	}
-	
+
 	.image {
 	    margin-left: 20rpx;
 	    margin-top: 11rpx;
 	    width: 55rpx;
 	    height: 55rpx;
 	}
+	/* 中间 */
 	.under {
 		line-height: 150rpx;
 		/* 设置行高*/
 	}
-	
+
 	.show {
 		height: auto;
 		margin-top: 40rpx;
-		color: #F1F1F1;
+		color: #f1f1f1;
 	}
-	
-	.showone{
-		/* background-image: url(../../image/after.jpg); */
+
+	.showone {
 		color: #999999;
-		background-color:  #FFFFFF;
 		height: auto;
-		background-size: 100%;
-		border-radius: 10rpx;
 		margin-top: 10rpx;
-		border-bottom: none;
-		line-height: 100rpx;
+		border-radius: 50rpx;
 	}
-	
+
 	.person {
 		line-height: 20rpx;
 		display: flex;
+		height: 100rpx;
 	}
-	
-	.tou {
-		/* height: 50%; */
-		/* display: block; */
-	}
-	
-	.imagetwo {
+	.tou{
 		margin-top: 0rpx;
 		margin-left: 20rpx;
 	}
-	
+	.Ttitle{
+		height: 50rpx;
+		width: 78%;
+		/* background-color: #000000; */
+	}
+	.Ntitle{
+		display: flex;
+		}
 	.name {
+		height: 30rpx;
+		color: #00aaff;
+		margin-top: 20rpx;
 		font-size: 30rpx;
-		margin: 20rpx;
-		top: 90rpx;
-		color: #00BFFF;
-		/* background-color: #007AFF; */
+		margin-left: 20rpx;
+	}
+	.dj{
+		color: #f0ad4e;
+		font-size: 25rpx;
+		border-radius: 10rpx;
+		border: 1rpx solid #f0ad4e;
+		height: 35rpx;
+		margin-top: 12rpx;
+		width: 80rpx;
+		margin-left: 10rpx;
+	}
+	.vip {
+		margin-top: 6rpx;
+		text-align: center;
 	}
-	
 	.bn {
 		height: 100%;
-		margin-top: 20rpx;
-		/* background-color: #007AFF; */
-	
-	}
-	.tw {
-		margin-top: -130rpx;
-		margin-left: 500p;
+		margin-top: 0rpx;
 	}
-	
 	.time {
 		font-size: 20rpx;
-		margin-top: 190rpx;
-		margin-left: -110rpx;
+		margin-top: 10rpx;
+		margin-left: 18rpx;
+		/* background-color: #4CD964; */
 	}
 	.delate{
-		margin-left: 400rpx;
-		margin-top: 20rpx;
+		margin-top: 15rpx;
 		/* background-color: #00BFFF; */
 		width: 28rpx;
 		height: 30rpx;
@@ -248,20 +260,55 @@
 		margin-right: 20rpx;
 		font-size: 28rpx;
 		font-weight: 300rpx;
-		color: #808080;
+		color: #555555;
+	}
+	.tab {
+		height: 250rpx;
+		margin: 10rpx 10rpx;
 	}
-	
-	.showtwo{
+	.book {
+		height: 240rpx;
+		margin: 20rpx 30rpx;
+		/* background-color: #007AFF; */
+		box-shadow: #f1f1f1 0rpx 0rpx 10rpx 5rpx;
+		border-radius: 8rpx;
+	}
+	.booktp {
+		margin-top: 30rpx;
+		margin-left: 30rpx;
+	}
+	.bookn {
+		margin-top: -260rpx;
+		margin-left: 200rpx;
+		font-size: 40rpx;
+		color: #333333;
+	}
+	.zzn {
+		font-size: 32rpx;
+		color: #333333;
+		margin-top: -100rpx;
+		margin-left: 200rpx;
+	}
+	.imgs {
+		display: flex;
+		width: 95%;
+		margin-left: 20rpx;
+		margin-top: 10rpx;
+	}
+	.img {
+		size: 100%;
+		margin: 10rpx 12rpx;
+	}
+
+	.showtwo {
 		display: flex;
-		border: 2rpx solid  #F1F1F1;
-		background-color: #FFFFFF;
+		background-color: #ffffff;
 		border-top: none;
 		height: 80rpx;
 		align-items: center;
-		box-shadow:   #F1F1F1 0rpx 8rpx 0rpx 8rpx;
-	
+		box-shadow: #f1f1f1 0rpx 8rpx 0rpx 8rpx;
 	}
-	
+
 	.wave {
 		z-index: 3;
 		right: 0;
@@ -271,27 +318,22 @@
 		width: 40rpx;
 		padding-top: 10rpx;
 		margin-top: 50rpx;
-		/* animation: wave 10s linear infinite;  */
+		/* animation: wave 10s linear infinite; */
 	}
-	
+
 	.dz {
 		margin-left: 450rpx;
 		display: flex;
-		/* background-color: #007AFF; */
 	}
-	
+
 	.pl {
 		margin-left: 80rpx;
 		display: flex;
-		/* background-color: #007AFF; */
 	}
 	#t {
 		font-size: 25rpx;
-		color: #BBBBBB;
+		color: #bbbbbb;
 		margin-left: 5rpx;
 		margin-top: 10rpx;
-		/* background-color: #4CD964; */
 	}
-	
-	
 </style>
diff --git a/pages_read_circle/pages/index/draft.vue b/pages_read_circle/pages/index/draft.vue
new file mode 100644
index 0000000000000000000000000000000000000000..34b9f77e44b0aae47dfbe91b858fe75bdec5dd5b
--- /dev/null
+++ b/pages_read_circle/pages/index/draft.vue
@@ -0,0 +1,311 @@
+<template>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="草稿" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
+		<view class="under">
+			<!-- 第一条心得 -->
+			<view class="show">
+				<view class="showone">
+					<view class="person">
+						<view class="tou">
+							<image src="/static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
+						</view>
+						<view class="Ttitle">
+							<view class="Ntitle">
+								<view class="name">爱丽丝</view>
+								<view class="dj">
+									<view class="vip">LV.11</view>
+								</view>
+							</view>
+							<view class="time">2020-08-09 14:10</view>
+						</view>
+						<view class="delate" @click="cl">
+							<image src="/static/images/SC.png" style="width: 40rpx;height: 40rpx;"></image>
+						</view>
+					</view>
+					<navigator url="../readCircle/readExperience">
+						<view class="zy">
+							<text>
+								《预见未来》哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈灌灌灌帆帆帆帆烦烦烦哈哈哈哈哈哈哈哈哈哈后哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好好...
+							</text>
+						</view>
+						<view class="tab">
+							<view class="imgs">
+								<image class="img" src="/static/images/书1.jpg" style="width: 220rpx; height: 240rpx;"></image>
+								<image class="img" src="/static/images/书3.jpg" style="width: 220rpx; height: 240rpx;"></image>
+								<image class="img" src="/static/images/书2.jpg" style="width: 220rpx; height: 240rpx;"></image>
+							</view>
+						</view>
+					</navigator>
+				</view>
+
+				<view class="showtwo">
+
+				</view>
+			</view>
+			<!-- 第二条心得 -->
+			<view class="show">
+				<view class="showone">
+					<view class="person">
+						<view class="tou">
+							<image src="/static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
+						</view>
+						<view class="Ttitle">
+							<view class="Ntitle">
+								<view class="name">爱丽丝hsudifnshk爱吃鱼</view>
+								<view class="dj">
+									<view class="vip">LV.11</view>
+								</view>
+							</view>
+							<view class="time">2020-08-09 14:10</view>
+						</view>
+						<view class="delate" @click="cl">
+							<image src="/static/images/SC.png" style="width: 40rpx;height: 40rpx;"></image>
+						</view>
+					</view>
+					<view class="zy"><text>今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈苏杭可免则烦恼斤斤计较经济界就哈哈哈哈哈哈</text></view>
+				</view>
+				<view class="showtwo">
+
+				</view>
+			</view>
+			<view class="show">
+				<view class="showone">
+					<view class="person">
+						<view class="tou">
+							<image src="/static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
+						</view>
+						<view class="Ttitle">
+							<view class="Ntitle">
+								<view class="name">爱丽丝hsudifnshk爱吃鱼</view>
+								<view class="dj">
+									<view class="vip">LV.11</view>
+								</view>
+							</view>
+							<view class="time">2020-08-09 14:10</view>
+						</view>
+						<view class="delate" @click="cl">
+							<image src="/static/images/SC.png" style="width: 40rpx;height: 40rpx;"></image>
+						</view>
+					</view>
+					<view class="zy"><text>今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text></view>
+				</view>
+
+				<view class="showtwo">
+
+				</view>
+			</view>
+		</view>
+
+	</view>
+</template>
+<script>
+	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+			}
+		},
+		methods: {
+			cl() {
+				uni.showModal({
+					title: '提示',
+					content: '是否删除该心得',
+					success: function(res) {
+						if (res.confirm) {
+							console.log('确认');
+						} else if (res.cancel) {
+							console.log('取消');
+						}
+					}
+				});
+			}
+		}
+	}
+</script>
+
+
+<style>
+	/* 中间 */
+	.under {
+		line-height: 150rpx;
+		/* 设置行高*/
+	}
+
+	.show {
+		height: auto;
+		margin-top: 40rpx;
+		color: #f1f1f1;
+	}
+
+	.showone {
+		color: #999999;
+		height: auto;
+		margin-top: 10rpx;
+		border-radius: 50rpx;
+	}
+
+	.person {
+		line-height: 20rpx;
+		display: flex;
+		height: 100rpx;
+	}
+
+	.tou {
+		margin-top: 0rpx;
+		margin-left: 20rpx;
+	}
+
+	.Ttitle {
+		height: 50rpx;
+		width: 78%;
+		/* background-color: #000000; */
+	}
+
+	.Ntitle {
+		display: flex;
+	}
+
+	.name {
+		height: 30rpx;
+		color: #00aaff;
+		margin-top: 20rpx;
+		font-size: 30rpx;
+		margin-left: 20rpx;
+	}
+
+	.dj {
+		color: #f0ad4e;
+		font-size: 25rpx;
+		border-radius: 10rpx;
+		border: 1rpx solid #f0ad4e;
+		height: 35rpx;
+		margin-top: 12rpx;
+		width: 80rpx;
+		margin-left: 10rpx;
+	}
+
+	.vip {
+		margin-top: 6rpx;
+		text-align: center;
+	}
+
+	.bn {
+		height: 100%;
+		margin-top: 0rpx;
+	}
+
+	.time {
+		font-size: 20rpx;
+		margin-top: 10rpx;
+		margin-left: 18rpx;
+		/* background-color: #4CD964; */
+	}
+
+	.delate {
+		margin-top: 15rpx;
+		/* background-color: #00BFFF; */
+		width: 28rpx;
+		height: 30rpx;
+	}
+
+	.zy {
+		margin-top: 10rpx;
+		line-height: 40rpx;
+		margin-left: 25rpx;
+		margin-right: 20rpx;
+		font-size: 28rpx;
+		font-weight: 300rpx;
+		color: #555555;
+	}
+
+	.tab {
+		height: 250rpx;
+		margin: 10rpx 10rpx;
+	}
+
+	.book {
+		height: 240rpx;
+		margin: 20rpx 30rpx;
+		/* background-color: #007AFF; */
+		box-shadow: #f1f1f1 0rpx 0rpx 10rpx 5rpx;
+		border-radius: 8rpx;
+	}
+
+	.booktp {
+		margin-top: 30rpx;
+		margin-left: 30rpx;
+	}
+
+	.bookn {
+		margin-top: -260rpx;
+		margin-left: 200rpx;
+		font-size: 40rpx;
+		color: #333333;
+	}
+
+	.zzn {
+		font-size: 32rpx;
+		color: #333333;
+		margin-top: -100rpx;
+		margin-left: 200rpx;
+	}
+
+	.imgs {
+		display: flex;
+		width: 95%;
+		margin-left: 20rpx;
+		margin-top: 10rpx;
+	}
+
+	.img {
+		size: 100%;
+		margin: 10rpx 12rpx;
+	}
+
+	.showtwo {
+		display: flex;
+		background-color: #ffffff;
+		border-top: none;
+		height: 80rpx;
+		align-items: center;
+		box-shadow: #f1f1f1 0rpx 8rpx 0rpx 8rpx;
+	}
+
+	.wave {
+		z-index: 3;
+		right: 0;
+		bottom: 0;
+		opacity: 0.725;
+		height: 40rpx;
+		width: 40rpx;
+		padding-top: 10rpx;
+		margin-top: 50rpx;
+		/* animation: wave 10s linear infinite; */
+	}
+
+	.dz {
+		margin-left: 450rpx;
+		display: flex;
+	}
+
+	.pl {
+		margin-left: 80rpx;
+		display: flex;
+	}
+
+	#t {
+		font-size: 25rpx;
+		color: #bbbbbb;
+		margin-left: 5rpx;
+		margin-top: 10rpx;
+	}
+</style>
diff --git a/pages_read_circle/pages/index/publish.vue b/pages_read_circle/pages/index/publish.vue
index 31248124de18ee58c8b4cbce2defd8062e9a0829..86e551711854cb701f8dda2ba96799f9e9d65233 100644
--- a/pages_read_circle/pages/index/publish.vue
+++ b/pages_read_circle/pages/index/publish.vue
@@ -1,192 +1,334 @@
 <template>
-	<view class="all">
-		<view class="top">
-			<!-- 简介 -->
-			<view class="toptwo">
-				<view class="jjNR">
-					<textarea class="jjk" placeholder="这一刻的想法..." maxlength="5000" ></textarea>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="发表" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
 				</view>
 			</view>
-			<!-- 封面 -->
-			<view class="topthree">
-				<view class="img">
-					<image class="tp" src="../../static/images/tj.jpg" :loading="loading" :disabled="disabled" @click="upload"></image>
+		</u-navbar>
+		<view class="tq"></view>
+		<view class="all">
+			<form @submit='issueSubmit'>
+				<view class="top">
+					<!-- 简介 -->
+					<view class="toptwo">
+						<textarea name="content" class="te" placeholder="这一刻的想法......" maxlength="500"></textarea>
+					</view>
+					<!-- 封面 -->
+					<view class='img'>
+						<view class='add'>
+							<view v-for="item in imgArr" :key="index">
+								<image class="tp1" @click="imgYu" :data-list="item.path" :data-src="item.path" :src="item.path"></image>
+							</view>
+							<image class="tp" src='/static/images/tj.jpg' @click='chooseImage' mode="aspectFit"></image>
+						</view>
+					</view>
 				</view>
-			</view>
-		</view>
-		<!--  -->
-		<view class="qt">
-			<view class="qq">
-				所在位置
-				<image class="image" src="../../static/images/dingwei.png" style="width: 20rpx; height: 20rpx;"></image>
-			</view>
-			<view class="qq">
-				<view class="one">
-					提醒ta看
+				<!--  -->
+				<view class="qt">
+					<button class="fb" form-type='submit'>发表</button>
 				</view>
-				<image class="image" src="../../static/images/aite.png" style="width: 20rpx; height: 20rpx;"></image>
-			</view>
-			<button class="fb">发表</button>
+			</form>
 		</view>
 	</view>
 </template>
 
 <script>
-	var _self;
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
-	 data:{
-	  percent:0,
-	  loading:false,
-	  disabled:false
-	 },
-	 methods : {
-	  upload : function(){
-	   _self = this;
-	   uni.chooseImage({
-	    count: 1,
-	    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
-	    sourceType: ['album'], //从相册选择
-	    success: function (res) {
-	     const tempFilePaths = res.tempFilePaths;
-	     const uploadTask = uni.uploadFile({
-	      url : "https://jxsbbx.gzmu.edu.cn/schoolcloud/",
-	      filePath: tempFilePaths[0],
-	      name: 'file',
-		  // fileType: 'image',
-	      formData: {
-	       'user': 'test'
-	      },
-	      success: function (uploadFileRes) {
-	       console.log(uploadFileRes.data);
-	      }
-	     });
-	 
-	     uploadTask.onProgressUpdate(function (res) {
-	      _self.percent = res.progress;
-	      console.log('上传进度' + res.progress);
-	      console.log('已经上传的数据长度' + res.totalBytesSent);
-	      console.log('预期需要上传的数据总长度' + res.totalBytesExpectedToSend);
-	     });
-	    },
-	    error : function(e){
-	     console.log(e);
-	    }
-	   });
-	  }
-	 },
-	    onLoad:function(){
-	  
-	    }
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+				imgArr: [], //图片数组
+				chooseViewShow: true,
+				ImgNumber: 3, //单次可选图片个数
+				urls: [],
+				facilityArray: ['动态', '心得'],
+				facility: '请选择',
+				issueType: 0, //发布类型
+				userType: 1, //用户类型
+				tfanlt: '', // 内容描述
+				isShowTextarea: false,
+				onFocus: false,
+
+			}
+		},
+		onLoad(e) {
+
+		},
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
+		methods: {
+			//提交信息
+			issueSubmit(e) {
+				let that = this;
+				let datas = e.detail.value;
+				datas.titleName = "心得";
+				datas.readerId = that.userinfo.readerId;
+				datas.issueType = 1; //心得
+				datas.issueImags = this.urls.toString();
+				datas.content = datas.content; //审核状态
+				datas.verifyStatus = 0;
+				console.log("这是datas：", datas);
+				if (!that.userinfo.readerId) {
+					uni.showToast({
+						title: '请先注册',
+						icon: 'none',
+						type: 'warning'
+					});
+					return;
+				} else if (datas.content == "") {
+					uni.showToast({
+						title: '发布内容不能为空',
+						icon: 'none',
+						type: 'warning'
+					})
+				} else {
+					uni.showLoading({
+						title: '发布中...',
+						mask: 'true'
+					})
+					setTimeout(function() {
+						uni.hideLoading() //关闭加载页面
+					}, 1000)
+					uni.request({
+						url: getApp().globalData.URL + 'circleReviewContent/add', //仅为示例，并非真实接口地址。
+						data: datas,
+						method: "POST",
+						header: {
+							'Authorization': that.token
+						},
+						success: (res) => {
+							console.log(res);
+							setTimeout(() => {
+								//提示
+								that.showModal("发布成功！")
+								//延时关闭  加载中的 loading框
+								uni.hideLoading()
+							}, 1000)
+							//返回上一级
+							uni.navigateBack()
+						},
+						fail: () => {
+							setTimeout(() => {
+								that.showModal("发布失败！")
+								uni.hideLoading()
+							}, 2000)
+						}
+					});
+				}
+			},
+			/** 选择图片 */
+			chooseImage() {
+				var that = this;
+				var upload_picture_list = this.imgArr
+				console.log(this.imgArr.length)
+				if (this.imgArr.length == 3) {
+					uni.showToast({
+						title: "最多上传三张图片",
+						icon: 'none',
+						duration: 2000
+					})
+					return;
+				}
+				uni.chooseImage({
+					count: this.ImgNumber - this.imgArr.length, //最多选择4张图片
+					sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['camera', 'album'], // 可以指定来源是相册还是相机，默认二者都有
+					success: function(res) {
+						var tempFiles = res.tempFiles
+						for (var i in tempFiles) {
+							tempFiles[i]['upload_percent'] = 0
+							tempFiles[i]['path_server'] = ''
+							upload_picture_list.push(tempFiles[i])
+						}
+						if (res.tempFilePaths.count == 0) {
+							return;
+						}
+						//上传图片
+						console.log("upload_picture_list:", upload_picture_list)
+						that.imgArr = upload_picture_list
+						that.uploadFile(upload_picture_list); //开始上传
+					}
+				})
+			},
+			up_data(obj) {
+				this.imgArr = obj
+			},
+			uploadFile(imgArr) {
+				//循环把图片上传到服务器 并显示进度   
+				for (var j in imgArr) {
+					if (imgArr[j]['upload_percent'] == 0) {
+						this.upload_file_server(imgArr, j)
+					}
+				}
+			},
+			upload_file_server(upload_picture_list, j) {
+				//图片上传
+				let that = this
+				const uplyk = uni.uploadFile({
+					url: getApp().globalData.URL + 'imgUpload/upload',
+					filePath: upload_picture_list[j]['path'], //上传的文件本地地址 
+					name: 'multipartFile',
+					success: function(res) {
+						console.log("上传图片后返回的信息：", res);
+						var datas = JSON.parse(res.data);
+						if (datas.errno == 0) {
+							var filename = getApp().globalData.Link + "upload/picture/" + datas.data[0];
+							that.urls = that.urls.concat(filename)
+							upload_picture_list[j]['path'] = upload_picture_list[j].path;
+						} else {
+							that.showModal("图片上传失败了！")
+						}
+						//that.up_data(upload_picture_list)
+					}
+				})
+			},
+			/** 显示图片 */
+			showImage(e) {
+				let imgArr = this.imgArr;
+				let itemIndex = e.currentTarget.dataset.id;
+				let img = [];
+				for (var i = 0; i < imgArr.length; i++) {
+					img.push(imgArr[i].path);
+				}
+				wx.previewImage({
+					current: img[itemIndex] // 当前显示图片的http链接
+				})
+
+			},
+			
+			//图片点击事件
+			imgYu(event) {
+				console.log(event);
+				var src = event.currentTarget.dataset.src; //获取data-src
+				var imgList = [event.currentTarget.dataset.list]; //获取data-list
+				//图片预览
+				uni.previewImage({
+					current: src, // 当前显示图片的http链接
+					urls: imgList // 需要预览的图片http链接列表
+				})
+			},
+			
+			//提示框
+			showModal(val) {
+				uni.showToast({
+					title: val,
+					icon: 'none'
+				});
+			},
+		}
 	}
 </script>
 
 <style>
-	.all{
-		background-color: #FFFFFF;
-		width: 90%;
-		height: 80%;
-		margin-left: 40rpx;
-		margin-right: 40rpx;
+	/* 导航栏 */
+	.tq {
+		height: 40rpx;
+		background-color: #6C40F3;
 	}
-	
-	.topone{
+
+	.tab {
 		display: flex;
+		background-color: #6C40F3;
 	}
-	.title{
-		margin-top: 50rpx;
-		margin-left: 30rpx;
-		width: 18%;
+
+	.tit2 {
+		margin-top: 20rpx;
+		color: #FFFFFF;
+		text-align: center;
+		margin-left: 55rpx;
+		/* display: flex; */
+		font-size: 40rpx;
+		width: 65%;
+
 	}
-	.shuru{
-		margin-left: 5rpx;
-		margin-top: 50rpx;
-		width: 550rpx;
-		height: 60rpx;
-		border-radius: 10rpx;
-		background-color: #FFFFFF;
-		border:1rpx solid #E3E3E3;
+
+	.back {
+		margin-top: 15rpx;
+		margin-left: 10rpx;
 	}
-	.shuru input{
-		margin: 10rpx 15rpx;
-		font-size: 26rpx;
+
+	.shua1 {
+		margin-top: 28rpx;
+		margin-left: 15rpx;
+
 	}
-	/* 简介 */
-	.toptwo{
-		display: flex;
+
+	/* 发表 */
+	.all {
+		background-color: #FFFFFF;
+		width: 91%;
+		margin: 35rpx 35rpx;
 	}
-	.jjtitle{
-		margin-top: 60rpx;
-		margin-left: 30rpx;
-		width: 18%;
+
+	.top {
+		border-radius: 20rpx;
+		margin: 0rpx 0rpx;
+		height: 580rpx;
+		border: #EBEBEB 3rpx solid;
 	}
-	.jjNR{
-		margin-left: 5rpx;
-		margin-top: 30rpx;
-		border-radius: 10rpx;
-		background-color: #FFFFFF;
-		/* border:1rpx solid #E3E3E3; */
+
+	.topone {
+		display: flex;
 	}
-	.jjk{
-		margin: 10rpx 10rpx;
+
+	.te {
+		margin: 20rpx 30rpx;
+		width: 92%;
 		font-size: 32rpx;
-		width: 630rpx;
-		height: 300rpx;
+		color: #000000;
 	}
-	/* 封面 */
-	.topthree{
+
+
+	/* 简介 */
+	.toptwo {
 		display: flex;
 	}
-	.tptitle{
-		margin-top: 60rpx;
-		margin-left: 30rpx;
-		width: 18%;
+
+
+
+	/* 封面 */
+	.topthree {
+		display: flex;
 	}
-	.tp{
+
+	.tp {
 		width: 160rpx;
 		height: 160rpx;
-		margin: 30rpx 5rpx ;
+		margin-left: 10rpx;
+		margin-bottom: 20rpx;
 		/* 虚线 */
-		/* border: 3rpx dashed #C0C0C0; */
-		}
-	
-	
-	.show{
-		width: auto;
-		height: 200rpx;
-		
-		/* border: #000000 1rpx solid; */
 	}
-	
-	.im{
-		width: auto;
-		height: 200rpx;
-		margin-top: 20rpx;
-		border: #4CD964 1rpx solid;
-		display: flex;
+
+	.tp1 {
+		margin-bottom: 20rpx;
 	}
-	.image{
+
+	.image {
 		margin-left: 550rpx;
-		/* background-color: #000000; */
 		align-items: center;
 	}
-	.wa{
-		/* background-color: #000000; */
-		width: 195rpx;
-		height: 195rpx;
-		margin: 5rpx 5rpx 5rpx 5rpx;
-	}
-	.qt{
-		margin-top: 140rpx;
+
+	.qt {
+		margin-top: 50rpx;
 		width: auto;
 		height: 350rpx;
 		align-items: center;
-		/* border: #007AFF 1rpx solid; */
-		/* border-top: #F8F8F8 2rpx solid; */
 		text-align: left;
-		/* border-bottom: 1px solid #ccc; */
-		
+
 	}
-	.qq{
+
+	.qq {
 		width: auto;
 		height: 80rpx;
 		font-size: 25rpx;
@@ -195,31 +337,40 @@
 		display: flex;
 		justify-content: left;
 		border-bottom: #F8F8F8 2rpx solid;
-		
-	}
-	.tx{
-		margin-top: 40rpx;
-		
-	}
-	
-	.te{
-		height: 160rpx;
-	}
-	.btn{
-		width: 100rpx;
-		height: 20rpx;
-		margin-left: auto;
+
 	}
-	.fb{
+
+	.fb {
 		color: #FFFFFF;
 		font-size: 28rpx;
 		margin-top: 100rpx;
 		width: 500rpx;
 		background-color: #6C40F3;
 	}
-	.one{
+
+	.one {
 		align-items: center;
 		display: flex;
-		
+
+	}
+
+	/* 添加照片 */
+	.img {
+		display: flex;
+		flex-wrap: wrap;
+	}
+
+	.add {
+		margin-top: 40rpx;
+		width: 100%;
+		display: flex;
+		background-color: #fff;
+		height: 160rpx;
+	}
+
+	.add image {
+		margin-right: 8rpx;
+		width: 160rpx;
+		height: 160rpx;
 	}
 </style>
diff --git a/pages_read_circle/pages/index/wuliu.vue b/pages_read_circle/pages/index/wuliu.vue
index 2d36068f4baf0907f275588968f39a71f34b86e1..c175e64fc99c121af1ce57162c9c899d9256b894 100644
--- a/pages_read_circle/pages/index/wuliu.vue
+++ b/pages_read_circle/pages/index/wuliu.vue
@@ -1,63 +1,87 @@
 <template>
-	<view>
-		<view class="top">
-			<view class="topone">
-				<image class="topima" src="../../static/images/gshunfen.png" style="width: 90rpx;height: 90rpx;"></image>
-				<view class="top_one_wz">圆通快递</view>
-				<view class="topTb">
-					<switch checked @change="switchChange(1)" />
-				<!-- <image class="Tb" src="../../static/images/kaiqi.png" style="width: 70rpx;height: 70rpx;"></image> -->	
-				</view>
-			</view>
-			<view class="topone">
-				<image class="topima" src="../../static/images/yuanton.png" style="width: 90rpx;height: 90rpx;"></image>
-				<view class="top_one_wz">圆通快递</view>
-				<view class="topTb">
-					<switch checked="true" @change="switchChange(1)" />
-				<!-- <image class="Tb" src="../../static/images/gb.png" style="width: 70rpx;height: 70rpx;"></image> -->	
-				</view>
-			</view>
-			<view class="topone">
-				<image class="topima" src="../../static/images/gshunfen.png" style="width: 85rpx;height: 80rpx;"></image>
-				<view class="top_one_wz">顺丰快递</view>
-				<view class="topTb">
-					<switch checked="false" @change="switchChange(1)" />
-				<!-- <image class="Tb" src="../../static/images/gb.png" style="width: 70rpx;height: 70rpx;"></image> -->	
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+	  <!-- 顶部 -->
+	  <u-navbar zhead="65rpx" height="44" title="物流设置" title-color="white" title-size="40" :background="background"
+	   back-icon-color="white" back-icon-size="50">
+	  	<view class="navbar-right" slot="right">
+	  		<view class="right_list" @click="bindInBatch">
+	  		</view>
+	  	</view>
+	  </u-navbar>
+    <view class="top">
+      <view class="topone">
+        <image
+          class="topima"
+          src="/static/images/gshunfen.png"
+          style="width: 90rpx; height: 90rpx"
+        ></image>
+        <view class="top_one_wz">圆通快递</view>
+        <view class="topTb">
+          <switch checked @change="switchChange(1)" />
+          <!-- <image class="Tb" src="/static/images/kaiqi.png" style="width: 70rpx;height: 70rpx;"></image> -->
+        </view>
+      </view>
+      <view class="topone">
+        <image
+          class="topima"
+          src="/static/images/yuanton.png"
+          style="width: 90rpx; height: 90rpx"
+        ></image>
+        <view class="top_one_wz">圆通快递</view>
+        <view class="topTb">
+          <switch checked="true" @change="switchChange(1)" />
+          <!-- <image class="Tb" src="/static/images/gb.png" style="width: 70rpx;height: 70rpx;"></image> -->
+        </view>
+      </view>
+      <view class="topone">
+        <image
+          class="topima"
+          src="/static/images/gshunfen.png"
+          style="width: 85rpx; height: 80rpx"
+        ></image>
+        <view class="top_one_wz">顺丰快递</view>
+        <view class="topTb">
+          <switch checked="false" @change="switchChange(1)" />
+          <!-- <image class="Tb" src="/static/images/gb.png" style="width: 70rpx;height: 70rpx;"></image> -->
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
 export default {
-	data() {
-		return {};
-	},
-	methods: {
-		switchChange: function (e){
-			console.log("改变的值e：",e)
-		}
-	}
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
+		},
+	};
+  },
+  methods: {
+    switchChange: function (e) {
+      console.log("改变的值e：", e);
+    },
+  },
 };
 </script>
 
 <style>
 .topone {
-	border-bottom: 1rpx solid #E3E3E3;
-	height: 120rpx;
+  border-bottom: 1rpx solid #e3e3e3;
+  height: 120rpx;
 }
 .topima {
-	margin-top: 20rpx;
-	margin-left: 20rpx;
+  margin-top: 20rpx;
+  margin-left: 20rpx;
 }
 .top_one_wz {
-	margin-top: -75rpx;
-	margin-left: 120rpx;
-	font-size: 32rpx;
+  margin-top: -75rpx;
+  margin-left: 120rpx;
+  font-size: 32rpx;
 }
-.topTb{
-	margin-left: 640rpx;
-	margin-top: -50rpx;
+.topTb {
+  margin-left: 640rpx;
+  margin-top: -50rpx;
 }
 </style>
diff --git a/pages_read_circle/pages/index/yifabiao.vue b/pages_read_circle/pages/index/yifabiao.vue
index 10141a7b8469f07ad35c93e900de1eb6c4716d54..2913b6943f65896c884a73d2ded52fb3b59d9547 100644
--- a/pages_read_circle/pages/index/yifabiao.vue
+++ b/pages_read_circle/pages/index/yifabiao.vue
@@ -1,246 +1,294 @@
 <template>
-	<view>
-		<view class="under">
-			<view class="show">
-				<view class="showone">
-					<view class="person">
-						<view class="tou">
-							<image class="imagetwo" src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="bn">
-							<text class="name">爱丽丝</text>
-						</view>
-						<view class="tw">
-							<view class="time">2020-08-09 14:10</view>
-						</view>
-						<view class="delate"@click="cl">
-							<image class="imgethree" src="../../static/images/schu.png"style="width: 28rpx;height: 30rpx;"></image>
-						</view>
-					</view>
-					<view class="zy">
-						<text>《预见未来》今天又是美好的一天！好好解决实际缴纳那你说的均为额欸威尔和挑挑剔剔哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text>
-					</view>
-				</view>
-				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png"style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
-					</view>
-				</view>
-			</view>
-			<view class="show">
-				<view class="showone">
-					<view class="person">
-						<view class="tou">
-							<image class="imagetwo" src="../../static/images/notice.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="bn">
-							<text class="name">爱丽丝</text>
-						</view>
-						<view class="tw">
-							<view class="time">2020-08-09 14:10</view>
-						</view>
-						<view class="delate"@click="cl">
-							<image class="imgethree" src="../../static/images/schu.png"style="width: 28rpx;height: 30rpx;"></image>
-						</view>
-					</view>
-					<view class="zy">
-						<text>《预见未来》今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text>
-					</view>
-				</view>
-				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png"style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
-					</view>
-				</view>
-			</view>
-			<view class="show">
-				<view class="showone">
-					<view class="person">
-						<view class="tou">
-							<image class="imagetwo" src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="bn">
-							<text class="name">爱丽丝</text>
-						</view>
-						<view class="tw">
-							<view class="time">2020-08-09 14:10</view>
-						</view>
-						<view class="delate"@click="cl">
-							<image class="imgethree" src="../../static/images/schu.png"style="width: 28rpx;height: 30rpx;"></image>
-						</view>
-					</view>
-					<view class="zy">
-						<text>《预见未来》今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text>
-					</view>
-				</view>
-				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png"style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+	  <!-- 顶部 -->
+	  <u-navbar zhead="65rpx" height="44" title="已发表" title-color="white" title-size="40" :background="background"
+	   back-icon-color="white" back-icon-size="50">
+	  	<view class="navbar-right" slot="right">
+	  		<view class="right_list" @click="bindInBatch">
+	  		</view>
+	  	</view>
+	  </u-navbar>
+    <view class="under">
+      <view class="show">
+        <view class="showone">
+          <view class="person">
+            <view class="tou">
+              <image
+                class="imagetwo"
+                src="/static/images/头像2.jpg"
+                style="width: 90rpx; height: 90rpx; border-radius: 50%"
+              ></image>
+            </view>
+            <view class="bn">
+              <text class="name">爱丽丝</text>
+            </view>
+            <view class="tw">
+              <view class="time">2020-08-09 14:10</view>
+            </view>
+            <view class="delate" @click="cl">
+              <image
+                class="imgethree"
+                src="/static/images/schu.png"
+                style="width: 28rpx; height: 30rpx"
+              ></image>
+            </view>
+          </view>
+          <view class="zy">
+            <text
+              >《预见未来》今天又是美好的一天！好好解决实际缴纳那你说的均为额欸威尔和挑挑剔剔哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text
+            >
+          </view>
+        </view>
+        <view class="showtwo">
+          <view class="dz">
+            <image class="wave" src="/static/images/zan.png"></image>
+            <text id="t">9999</text>
+          </view>
+          <view class="pl">
+            <image
+              class="wave"
+              src="/static/images/pinglun.png"
+              style="width: 38rpx; height: 36rpx"
+            ></image>
+            <text id="t">1.3w</text>
+          </view>
+        </view>
+      </view>
+      <view class="show">
+        <view class="showone">
+          <view class="person">
+            <view class="tou">
+              <image
+                class="imagetwo"
+                src="/static/images/notice.jpg"
+                style="width: 90rpx; height: 90rpx; border-radius: 50%"
+              ></image>
+            </view>
+            <view class="bn">
+              <text class="name">爱丽丝</text>
+            </view>
+            <view class="tw">
+              <view class="time">2020-08-09 14:10</view>
+            </view>
+            <view class="delate" @click="cl">
+              <image
+                class="imgethree"
+                src="/static/images/schu.png"
+                style="width: 28rpx; height: 30rpx"
+              ></image>
+            </view>
+          </view>
+          <view class="zy">
+            <text
+              >《预见未来》今
+              哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text
+            >
+          </view>
+        </view>
+        <view class="showtwo">
+          <view class="dz">
+            <image class="wave" src="/static/images/zan.png"></image>
+            <text id="t">9999</text>
+          </view>
+          <view class="pl">
+            <image
+              class="wave"
+              src="/static/images/pinglun.png"
+              style="width: 38rpx; height: 36rpx"
+            ></image>
+            <text id="t">1.3w</text>
+          </view>
+        </view>
+      </view>
+      <view class="show">
+        <view class="showone">
+          <view class="person">
+            <view class="tou">
+              <image
+                class="imagetwo"
+                src="/static/images/头像2.jpg"
+                style="width: 90rpx; height: 90rpx; border-radius: 50%"
+              ></image>
+            </view>
+            <view class="bn">
+              <text class="name">爱丽丝</text>
+            </view>
+            <view class="tw">
+              <view class="time">2020-08-09 14:10</view>
+            </view>
+            <view class="delate" @click="cl">
+              <image
+                class="imgethree"
+                src="/static/images/schu.png"
+                style="width: 28rpx; height: 30rpx"
+              ></image>
+            </view>
+          </view>
+          <view class="zy">
+            <text
+              >《预见未来》今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text
+            >
+          </view>
+        </view>
+        <view class="showtwo">
+          <view class="dz">
+            <image class="wave" src="/static/images/zan.png"></image>
+            <text id="t">9999</text>
+          </view>
+          <view class="pl">
+            <image
+              class="wave"
+              src="/static/images/pinglun.png"
+              style="width: 38rpx; height: 36rpx"
+            ></image>
+            <text id="t">1.3w</text>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
+export default {
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
 		},
-		methods: {
-			cl(){
-				uni.showModal({
-					title:'提示',
-					content:'是否删除该心得',
-					success:function (res) {
-						if(res.confirm){
-							console.log('确认');
-						}
-						else if (res.cancel){
-							console.log('取消');
-						}
-					}
-				});
-			}
-		}
-	}
+	};
+  },
+  methods: {
+    cl() {
+      uni.showModal({
+        title: "提示",
+        content: "是否删除该心得",
+        success: function (res) {
+          if (res.confirm) {
+            console.log("确认");
+          } else if (res.cancel) {
+            console.log("取消");
+          }
+        },
+      });
+    },
+  },
+};
 </script>
 
 <style>
 .under {
-		line-height: 150rpx;
-		/* 设置行高*/
-	}
-	
-	.show {
-		height: auto;
-		margin-top: 40rpx;
-		color: #F1F1F1;
-	}
-	
-	.showone{
-		/* 背景图片 */
-		/* background-image: url(../../image/after.jpg); */
-		color: #999999;
-		height: auto;
-		margin-top: 10rpx;
-	}
-	
-	.person {
-		line-height: 20rpx;
-		display: flex;
-	}
-	
-	.tou {
-		/* height: 50%; */
-		/* display: block; */
-	}
-	
-	.imagetwo {
-		margin-top: 0rpx;
-		margin-left: 20rpx;
-	}
-	
-	.name {
-		font-size: 30rpx;
-		margin: 20rpx;
-		top: 90rpx;
-		color: #00BFFF;
-		/* background-color: #007AFF; */
-	}
-	
-	.bn {
-		height: 100%;
-		margin-top: 20rpx;
-		/* background-color: #007AFF; */
-	
-	}
-	.tw {
-		margin-top: -130rpx;
-		margin-left: 500p;
-	}
-	
-	.time {
-		font-size: 20rpx;
-		margin-top: 190rpx;
-		margin-left: -110rpx;
-	}
-	.delate{
-		margin-left: 400rpx;
-		margin-top: 20rpx;
-		/* background-color: #00BFFF; */
-		width: 28rpx;
-		height: 30rpx;
-	}
-	.zy {
-		margin-top: 10rpx;
-		line-height: 40rpx;
-		margin-left: 25rpx;
-		margin-right: 20rpx;
-		font-size: 28rpx;
-		font-weight: 300rpx;
-		color: #808080;
-	}
-	
-	.showtwo{
-		display: flex;
-		/* border: 2rpx solid  #F1F1F1; */
-		background-color: #FFFFFF;
-		border-top: none;
-		height: 80rpx;
-		align-items: center;
-		box-shadow:   #F1F1F1 0rpx 8rpx 0rpx 8rpx;
-	
-	}
-	
-	.wave {
-		z-index: 3;
-		right: 0;
-		bottom: 0;
-		opacity: 0.725;
-		height: 40rpx;
-		width: 40rpx;
-		padding-top: 10rpx;
-		margin-top: 50rpx;
-		/* animation: wave 10s linear infinite;  */
-	}
-	
-	.dz {
-		margin-left: 450rpx;
-		display: flex;
-		/* background-color: #007AFF; */
-	}
-	
-	.pl {
-		margin-left: 80rpx;
-		display: flex;
-		/* background-color: #007AFF; */
-	}
-	#t {
-		font-size: 25rpx;
-		color: #BBBBBB;
-		margin-left: 5rpx;
-		margin-top: 10rpx;
-		/* background-color: #4CD964; */
-	}
-	
-	
+  line-height: 150rpx;
+  /* 设置行高*/
+}
+
+.show {
+  height: auto;
+  margin-top: 40rpx;
+  color: #f1f1f1;
+}
+
+.showone {
+  /* 背景图片 */
+  /* background-image: url(../../image/after.jpg); */
+  color: #999999;
+  height: auto;
+  margin-top: 10rpx;
+}
+
+.person {
+  line-height: 20rpx;
+  display: flex;
+}
+
+.tou {
+  /* height: 50%; */
+  /* display: block; */
+}
+
+.imagetwo {
+  margin-top: 0rpx;
+  margin-left: 20rpx;
+}
+
+.name {
+  font-size: 30rpx;
+  margin: 20rpx;
+  top: 90rpx;
+  color: #00bfff;
+  /* background-color: #007AFF; */
+}
+
+.bn {
+  height: 100%;
+  margin-top: 20rpx;
+  /* background-color: #007AFF; */
+}
+.tw {
+  margin-top: -130rpx;
+  margin-left: 500p;
+}
+
+.time {
+  font-size: 20rpx;
+  margin-top: 190rpx;
+  margin-left: -110rpx;
+}
+.delate {
+  margin-left: 400rpx;
+  margin-top: 20rpx;
+  /* background-color: #00BFFF; */
+  width: 28rpx;
+  height: 30rpx;
+}
+.zy {
+  margin-top: 10rpx;
+  line-height: 40rpx;
+  margin-left: 25rpx;
+  margin-right: 20rpx;
+  font-size: 28rpx;
+  font-weight: 300rpx;
+  color: #808080;
+}
+
+.showtwo {
+  display: flex;
+  /* border: 2rpx solid  #F1F1F1; */
+  background-color: #ffffff;
+  border-top: none;
+  height: 80rpx;
+  align-items: center;
+  box-shadow: #f1f1f1 0rpx 8rpx 0rpx 8rpx;
+}
+
+.wave {
+  z-index: 3;
+  right: 0;
+  bottom: 0;
+  opacity: 0.725;
+  height: 40rpx;
+  width: 40rpx;
+  padding-top: 10rpx;
+  margin-top: 50rpx;
+  /* animation: wave 10s linear infinite;  */
+}
+
+.dz {
+  margin-left: 450rpx;
+  display: flex;
+  /* background-color: #007AFF; */
+}
+
+.pl {
+  margin-left: 80rpx;
+  display: flex;
+  /* background-color: #007AFF; */
+}
+#t {
+  font-size: 25rpx;
+  color: #bbbbbb;
+  margin-left: 5rpx;
+  margin-top: 10rpx;
+  /* background-color: #4CD964; */
+}
 </style>
diff --git a/pages_read_circle/pages/mycollection/mycollbook.vue b/pages_read_circle/pages/mycollection/mycollbook.vue
index ac7fd239477995e2008f54fc84f69603fd4e5450..b8f214ea3d500a4bdfd5c6be5fef744921137581 100644
--- a/pages_read_circle/pages/mycollection/mycollbook.vue
+++ b/pages_read_circle/pages/mycollection/mycollbook.vue
@@ -1,15 +1,14 @@
 <template>
 	<view>
-		
 		<view class="mid">
 			<view class="midone">
 				<view class="zhengti">
-					<image src="../../static/images/书1.jpg" style="width: 125rpx; height: 170rpx;"></image>
+					<image src="/static/images/书1.jpg" style="width: 125rpx; height: 170rpx"></image>
 					<view class="midwz">致敬老师</view>
-					<image src="../../static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image>
+					<image src="/static/images/shoucang1.png" style="width: 40rpx; height: 30rpx"></image>
 				</view>
 				<view class="shumu">作者：
-				<view class="shumutwo">于思蓝</view>
+					<view class="shumutwo">于思蓝</view>
 				</view>
 				<view class="shumuone">出版社：为人民服务出版社</view>
 				<view class="shumuone">出版时间：2020-09</view>
@@ -17,12 +16,12 @@
 			</view>
 			<view class="midone">
 				<view class="zhengti">
-					<image src="../../static/images/书2.jpg" style="width: 125rpx; height: 170rpx;"></image>
+					<image src="/static/images/书2.jpg" style="width: 125rpx; height: 170rpx"></image>
 					<view class="midwz">预见未来</view>
-					<image src="../../static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image>
+					<image src="/static/images/shoucang1.png" style="width: 40rpx; height: 30rpx"></image>
 				</view>
 				<view class="shumu">作者：
-				<view class="shumutwo">大鱼</view>
+					<view class="shumutwo">大鱼</view>
 				</view>
 				<view class="shumuone">出版社：为人民服务出版社</view>
 				<view class="shumuone">出版时间：2020-09</view>
@@ -30,12 +29,12 @@
 			</view>
 			<view class="midone">
 				<view class="zhengti">
-					<image src="../../static/images/书3.jpg" style="width: 125rpx; height: 170rpx;"></image>
+					<image src="/static/images/书3.jpg" style="width: 125rpx; height: 170rpx"></image>
 					<view class="midwz">你是人间四月天</view>
-					<image src="../../static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image>
+					<image src="/static/images/shoucang1.png" style="width: 40rpx; height: 30rpx"></image>
 				</view>
 				<view class="shumu">作者：
-				<view class="shumutwo">余小鱼</view>
+					<view class="shumutwo">余小鱼</view>
 				</view>
 				<view class="shumuone">出版社：为人民服务出版社</view>
 				<view class="shumuone">出版时间：2020-09</view>
@@ -48,72 +47,78 @@
 <script></script>
 
 <style>
+	.mid {
+		margin-top: 20rpx;
+		width: 100%;
+		/* height: 200rpx; */
+		/* background-color: #007AFF; */
+	}
 
-.mid {	
-	margin-top:20rpx;
-	width: 100%;
-	/* height: 200rpx; */
-	/* background-color: #007AFF; */
-}
-.midone {
-	width: 100%;
-	height: 200rpx;
-	font-size: 30rpx;
-	margin-top: 35rpx;
-	align-items: center;
-	border-bottom: 3rpx solid #bbbbbb;
-	/* background-color: #2C405A; */
-}
-.zhengti {
-	margin-left:30rpx;
-	display: flex;
-}
-.imag{
-	margin-left:30rpx;
-}
-.ima{
-	width: 40rpx;
-	height: 30rpx;
-	/* margin-left: 400rpx; */
-}
-.midwz {
-	font-size: 30rpx;
-	height:35rpx;
-	width: 520rpx;
-	margin-top: -5rpx;
-	align-items: center;
-	margin-left: 28rpx;
-	/* background-color:  #333333; */
-}
-.shumu {
-	margin-left: 180rpx;
-	height: 30rpx;
-	font-size: 25rpx;
-	margin-top: -130rpx;
-	color:   #999999;
-	/* background-color: #4CD964; */
-	width:100%;
-	
-}
-.shumuone{
-	margin-left: 180rpx;
-	font-size: 25rpx;
-	color: #999999;
-	/* background-color: #4CD964; */
-}
-.shumutwo{
-	margin-left:70rpx;
-	font-size: 25rpx;
-	color:  #007AFF;
-	margin-top: -32rpx;
-	/* background-color:  #F0AD4E; */
-}
-.shumuthree{
-	margin-top: 10rpx;
-	font-size: 25rpx;
-	color: #F0AD4E;
-	margin-left: 180rpx;
-	/* background-color: #3F536E; */
-}
+	.midone {
+		width: 100%;
+		height: 200rpx;
+		font-size: 30rpx;
+		margin-top: 35rpx;
+		align-items: center;
+		border-bottom: 3rpx solid #bbbbbb;
+		/* background-color: #2C405A; */
+	}
 
+	.zhengti {
+		margin-left: 30rpx;
+		display: flex;
+	}
+
+	.imag {
+		margin-left: 30rpx;
+	}
+
+	.ima {
+		width: 40rpx;
+		height: 30rpx;
+		/* margin-left: 400rpx; */
+	}
+
+	.midwz {
+		font-size: 30rpx;
+		height: 35rpx;
+		width: 520rpx;
+		margin-top: -5rpx;
+		align-items: center;
+		margin-left: 28rpx;
+		/* background-color:  #333333; */
+	}
+
+	.shumu {
+		margin-left: 180rpx;
+		height: 30rpx;
+		font-size: 25rpx;
+		margin-top: -130rpx;
+		color: #999999;
+		/* background-color: #4CD964; */
+		width: 100%;
+	}
+
+	.shumuone {
+		margin-left: 180rpx;
+		font-size: 25rpx;
+		color: #999999;
+		/* background-color: #4CD964; */
+	}
+
+	.shumutwo {
+		margin-left: 70rpx;
+		font-size: 25rpx;
+		color: #007aff;
+		margin-top: -32rpx;
+		/* background-color:  #F0AD4E; */
+	}
+
+	.shumuthree {
+		margin-top: 10rpx;
+		font-size: 25rpx;
+		color: #f0ad4e;
+		margin-left: 180rpx;
+		/* background-color: #3F536E; */
+	}
 </style>
diff --git a/pages_read_circle/pages/mycollection/mycollection.vue b/pages_read_circle/pages/mycollection/mycollection.vue
index 4f2c2da775e887e9f91a7fb7ce62af87e13b6f77..7d4fb25db598faa19581a4bbf8c14c25e2894f73 100644
--- a/pages_read_circle/pages/mycollection/mycollection.vue
+++ b/pages_read_circle/pages/mycollection/mycollection.vue
@@ -1,14 +1,24 @@
 <template>
 	<view>
+		<u-navbar zhead="65rpx" height="44" title="我的收藏" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+					<navigator url="/pages_read_circle/pages/mycollection/xinjiang">
+					<image class="shua1" style="height: 40rpx; width: 40rpx;margin-right: 20rpx;" src="/static/images/add_icon.png"></image>
+					</navigator>
+				</view>
+			</view>
+		</u-navbar>
 		<!-- 顶部 -->
-		<view class="tq"></view>
-		<view class="tab" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
+		<!-- <view class="tq"></view>
+		<view class="tab" style="width: 100%; height: 90rpx">
+			<image @click="back" class="back" src="/static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx"></image>
 			<view class="tit2">我的收藏</view>
 			<navigator url="/pages_read_circle/pages/mycollection/xinjiang">
-			<image class="shua1" src="../../static/images/add_icon.png" style="width: 40rpx; height: 40rpx;"></image>
+				<image class="shua1" src="/static/images/add_icon.png" style="width: 40rpx; height: 40rpx"></image>
 			</navigator>
-		</view>
+		</view> -->
 		<!-- 分割线br2 -->
 		<view class="br2"></view>
 		<!-- 中间 -->
@@ -16,14 +26,14 @@
 			<view class="topone">
 				<view class="title">文学</view>
 				<view class="delate">
-					<image src="../../static/images/red_clearance_icon.png" style="width: 35rpx;height: 35rpx;"></image>
+					<image src="/static/images/red_clearance_icon.png" style="width: 35rpx; height: 35rpx"></image>
 					<view class="Sc">删除</view>
 				</view>
 			</view>
 			<view class="midone">
 				<view class="zhengti">
-					<image src="../../static/images/书1.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">致敬老师</view>
+					<image src="http://183.63.187.41/ImageService/BookImage.aspx?Text200a=&Text010a=978-7-111-55515-5&Text200f=&Text210c=" style="width: 125rpx; height: 170rpx"></image>
+					<view class="midwz">大数据与机器学习</view>
 				</view>
 				<view class="shumu">
 					作者：
@@ -37,9 +47,9 @@
 			<view class="br1"></view>
 			<view class="midone">
 				<view class="zhengti">
-					<image src="../../static/images/书3.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">你是人间四月天</view>
-					<!-- <image src="../../static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image> -->
+					<image src="http://183.63.187.41/ImageService/BookImage.aspx?Text200a=&Text010a=978-7-111-54302-2&Text200f=&Text210c=" style="width: 125rpx; height: 170rpx"></image>
+					<view class="midwz">深入理解机器学习</view>
+					<!-- <image src="/static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image> -->
 				</view>
 				<view class="shumu">
 					作者：
@@ -54,15 +64,15 @@
 			<view class="topone">
 				<view class="title">武侠小说</view>
 				<view class="delate">
-					<image src="../../static/images/red_clearance_icon.png" style="width: 35rpx;height: 35rpx;"></image>
+					<image src="/static/images/red_clearance_icon.png" style="width: 35rpx; height: 35rpx"></image>
 					<view class="Sc">删除</view>
 				</view>
 			</view>
 			<view class="midone">
 				<view class="zhengti">
-					<image src="../../static/images/书1.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">致敬老师</view>
-					<!-- <image src="../../static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image> -->
+					<image src="http://183.63.187.41/ImageService/BookImage.aspx?Text200a=&Text010a=978-7-121-28214-0&Text200f=&Text210c=" style="width: 125rpx; height: 170rpx"></image>
+					<view class="midwz">Spark MLlib机器学习</view>
+					<!-- <image src="/static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image> -->
 				</view>
 				<view class="shumu">
 					作者：
@@ -76,9 +86,9 @@
 			<view class="br1"></view>
 			<view class="midone">
 				<view class="zhengti">
-					<image src="../../static/images/书3.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">你是人间四月天</view>
-					<!-- <image src="../../static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image> -->
+					<image src="http://183.63.187.41/ImageService/BookImage.aspx?Text200a=&Text010a=9789868902886&Text200f=&Text210c=" style="width: 125rpx; height: 170rpx"></image>
+					<view class="midwz">两岸随笔：中国未来统一问题的观察与思考</view>
+					<!-- <image src="/static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image> -->
 				</view>
 				<view class="shumu">
 					作者：
@@ -88,36 +98,13 @@
 				<view class="shumuone">出版时间：2020-09</view>
 				<view class="shumuthree">广东省立中山图书馆馆藏</view>
 			</view>
-		</view>
-		<view class="mid">
-			<view class="topone">
-				<view class="title">文学</view>
-				<view class="delate">
-					<image src="../../static/images/red_clearance_icon.png" style="width: 35rpx;height: 35rpx;"></image>
-					<view class="Sc">删除</view>
-				</view>
-			</view>
-			<view class="midone">
-				<view class="zhengti">
-					<image src="../../static/images/书1.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">致敬老师</view>
-					<!-- <image src="../../static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image> -->
-				</view>
-				<view class="shumu">
-					作者：
-					<view class="shumutwo">于思蓝</view>
-				</view>
-				<view class="shumuone">出版社：为人民服务出版社</view>
-				<view class="shumuone">出版时间：2020-09</view>
-				<view class="shumuthree">广东省立中山图书馆馆藏</view>
-			</view>
 			<!-- 分割线br1 -->
 			<view class="br1"></view>
 			<view class="midone">
 				<view class="zhengti">
-					<image src="../../static/images/书3.jpg" style="width: 125rpx; height: 170rpx;"></image>
-					<view class="midwz">你是人间四月天</view>
-					<!-- <image src="../../static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image> -->
+					<image src="http://183.63.187.41/ImageService/BookImage.aspx?Text200a=&Text010a=9789868902886&Text200f=&Text210c=" style="width: 125rpx; height: 170rpx"></image>
+					<view class="midwz">两岸随笔：中国未来统一问题的观察与思考</view>
+					<!-- <image src="/static/images/shoucang1.png" style="width: 40rpx; height: 30rpx;"></image> -->
 				</view>
 				<view class="shumu">
 					作者：
@@ -132,175 +119,234 @@
 </template>
 
 <script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
 		data() {
 			return {
-				
-			}
+				background: {
+					background: "#6C40F3",
+				},
+				info: {}, //后台数据
+			};
+		},
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
+		/* 点击tab栏发生的函数*/
+		onTabItemTap() {
+			this.getInfo();
+			console.log("登录获取的信息userInfo：",this.userinfo)
+			console.log("登录获取的信息Token：",this.token)
 		},
 		methods: {
-			back(){
-				uni.navigateBack({
-					delta:1
+			//获取信息
+			async getInfo() {
+				var that = this;
+				let rid = parseInt(that.userinfo.readerId)
+				var params = {
+					url: "reader/personal",
+					type: "GET",
+					data: {
+						readerId:rid
+					},
+				};
+				const res = await app.myRequest(params);
+				console.log(res);
+				that.info = res.readerInfo;
+			},
+			toPersonal_home(e){
+				uni.navigateTo({
+					url:"../../pages_read_circle/pages/personal/personal_home?id="+e
+				})
+			},
+			reading(){
+				uni.navigateTo({
+					url:"../../pages_borrow_books/pages/reading/reading"
 				})
 			}
-		}
-	}
+		},
+	};
 </script>
 
 <style>
-/* 顶部导航条 */
-.tq{
-		height: 80rpx;
-		background-color:#6C40F3;
+	/* 顶部导航条 */
+	.tq {
+		height: 90rpx;
+		background-color: #6c40f3;
 	}
-.tab {
+
+	.tab {
 		display: flex;
-		background-color:#6C40F3;
+		background-color: #6c40f3;
 	}
-.tit2 {
+
+	.tit2 {
 		margin-top: 20rpx;
-		color:#FFFFFF ;
+		color: #ffffff;
 		text-align: center;
 		margin-left: 55rpx;
 		/* display: flex; */
 		font-size: 40rpx;
 		width: 65%;
-	
 	}
+
 	.back {
 		margin-top: 15rpx;
 		margin-left: 10rpx;
 	}
+
 	.shua1 {
+		margin-top: 20rpx;
+		/* margin-left: 60rpx; */
+	}
+
+	.br1 {
+		width: 90%;
+		height: 3rpx;
+		background-color: #dcdcdc;
+		margin-left: 30rpx;
+	}
+
+	.br2 {
+		/* margin-left: 20rpx; */
+		width: 100%;
+		/* height: 10rpx; */
+		/* background-color: #DCDFE6; */
+	}
+
+	.top {
+		border-bottom: #d2d2d2 1rpx solid;
+		/* background-color: #6C40F3; */
+		display: flex;
+		height: 90rpx;
+	}
+
+	.wz {
+		width: 40%;
+		font-size: 32rpx;
+		margin-top: 30rpx;
+		margin-left: 30rpx;
+	}
+
+	.Xjiang {
+		display: flex;
+		font-size: 30rpx;
 		margin-top: 28rpx;
-		margin-left: 60rpx;
+		margin-left: 345rpx;
+	}
+
+	.image {
+		/* margin-top: -5rpx; */
+		/* margin-l: 600rpx; */
+	}
+
+	.xinjian {
+		margin-left: 5rpx;
+		/* margin-top: -55rpx; */
+		font-size: 30rpx;
+	}
 
+	.topone {
+		background-color: #f5f5f5;
+		display: flex;
+		height: 60rpx;
+	}
+
+	.title {
+		width: 75%;
+		/* background-color: #000000; */
+		font-size: 28rpx;
+		margin-top: 10rpx;
+		margin-left: 30rpx;
+	}
+
+	.delate {
+		display: flex;
+		font-size: 28rpx;
+		margin-top: 15rpx;
+		margin-left: 35rpx;
 	}
 
-.br1 {
-	width: 90%;
-	height: 3rpx;
-	background-color: #dcdcdc;
-	margin-left: 30rpx;
-}
-.br2 {
-	/* margin-left: 20rpx; */
-	width: 100%;
-	/* height: 10rpx; */
-	/* background-color: #DCDFE6; */
-}
-.top {
-	border-bottom: #d2d2d2 1rpx solid;
-	/* background-color: #6C40F3; */
-	display: flex;
-	height: 90rpx;
-}
-.wz {
-	width: 40%;
-	font-size: 32rpx;
-	margin-top: 30rpx;
-	margin-left: 30rpx;
-}
-.Xjiang {
-	display: flex;
-	font-size: 30rpx;
-	margin-top: 28rpx;
-	margin-left: 345rpx;
-}
-.image {
-	/* margin-top: -5rpx; */
-	/* margin-l: 600rpx; */
-}
-.xinjian {
-	margin-left: 5rpx;
-	/* margin-top: -55rpx; */
-	font-size: 30rpx;
-}
-.topone {
-	background-color: #f5f5f5;
-	display: flex;
-	height: 60rpx;
-}
-.title {
-	width: 75%;
-	/* background-color: #000000; */
-	font-size: 28rpx;
-	margin-top: 10rpx;
-	margin-left: 30rpx;
-}
-.delate {
-	display: flex;
-	font-size: 28rpx;
-	margin-top: 15rpx;
-	margin-left: 35rpx;
-}
-.Sc {
-	margin-left: 5rpx;
-	font-size: 28rpx;
-	color: red;
-}
-.mid {
-	height: auto;
-	/* background-color: #007AFF; */
-}
-.midone {
-	width: 100%;
-	height: 200rpx;
-	font-size: 30rpx;
-	margin-top: 35rpx;
-	align-items: center;
-	/* border-bottom: 3rpx solid #bbbbbb; */
-	/* background-color: #2C405A; */
-}
-.zhengti {
-	margin-left: 30rpx;
-	display: flex;
-}
-.imag {
-	margin-left: 30rpx;
-}
-.ima {
-	width: 40rpx;
-	height: 30rpx;
-	/* margin-left: 400rpx; */
-}
-.midwz {
-	font-size: 30rpx;
-	height: 35rpx;
-	width: 520rpx;
-	margin-top: -5rpx;
-	align-items: center;
-	margin-left: 28rpx;
-	/* background-color:  #333333; */
-}
-.shumu {
-	margin-left: 180rpx;
-	height: 30rpx;
-	font-size: 25rpx;
-	margin-top: -130rpx;
-	color: #999999;
-	/* background-color: #4CD964; */
-	width: 100%;
-}
-.shumuone {
-	margin-left: 180rpx;
-	font-size: 25rpx;
-	color: #999999;
-	/* background-color: #4CD964; */
-}
-.shumutwo {
-	margin-left: 70rpx;
-	font-size: 25rpx;
-	color: #007aff;
-	margin-top: -32rpx;
-	/* background-color:  #F0AD4E; */
-}
-.shumuthree {
-	margin-top: 10rpx;
-	font-size: 25rpx;
-	color: #f0ad4e;
-	margin-left: 180rpx;
-	/* background-color: #3F536E; */
-}
+	.Sc {
+		margin-left: 5rpx;
+		font-size: 28rpx;
+		color: red;
+	}
+
+	.mid {
+		height: auto;
+		/* background-color: #007AFF; */
+	}
+
+	.midone {
+		width: 100%;
+		height: 200rpx;
+		font-size: 30rpx;
+		margin-top: 35rpx;
+		align-items: center;
+		/* border-bottom: 3rpx solid #bbbbbb; */
+		/* background-color: #2C405A; */
+	}
+
+	.zhengti {
+		margin-left: 30rpx;
+		display: flex;
+	}
+
+	.imag {
+		margin-left: 30rpx;
+	}
+
+	.ima {
+		width: 40rpx;
+		height: 30rpx;
+		/* margin-left: 400rpx; */
+	}
+
+	.midwz {
+		font-size: 30rpx;
+		height: 35rpx;
+		width: 520rpx;
+		margin-top: -5rpx;
+		align-items: center;
+		margin-left: 28rpx;
+		/* background-color:  #333333; */
+	}
+
+	.shumu {
+		margin-left: 180rpx;
+		height: 30rpx;
+		font-size: 25rpx;
+		margin-top: -130rpx;
+		color: #999999;
+		/* background-color: #4CD964; */
+		width: 100%;
+	}
+
+	.shumuone {
+		margin-left: 180rpx;
+		font-size: 25rpx;
+		color: #999999;
+		/* background-color: #4CD964; */
+	}
+
+	.shumutwo {
+		margin-left: 70rpx;
+		font-size: 25rpx;
+		color: #007aff;
+		margin-top: -32rpx;
+		/* background-color:  #F0AD4E; */
+	}
+
+	.shumuthree {
+		margin-top: 10rpx;
+		font-size: 25rpx;
+		color: #f0ad4e;
+		margin-left: 180rpx;
+		/* background-color: #3F536E; */
+	}
 </style>
diff --git a/pages_read_circle/pages/mycollection/xinjiang.vue b/pages_read_circle/pages/mycollection/xinjiang.vue
index 7ef5e3b093e753b30e58967f384a73c78853beb0..1399199bdd898a805b4d495a42a3170efea6326d 100644
--- a/pages_read_circle/pages/mycollection/xinjiang.vue
+++ b/pages_read_circle/pages/mycollection/xinjiang.vue
@@ -1,4 +1,13 @@
 <template>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="添加图书" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 	<view class="all">
 			<form>
 				<!-- 头部三个 -->
@@ -32,7 +41,7 @@
 				<view class="topthree">
 					<view class="tptitle">封面</view>
 					<view class="img">
-						<image class="wa" src="../../static/images/tj.jpg" :loading="loading" :disabled="disabled" @click="upload"></image>
+						<image class="wa" src="/static/images/tj.jpg" :loading="loading" :disabled="disabled" @click="upload"></image>
 					</view>
 				</view>
 				<!-- <button class="tj" form-type="submit">提交</button> -->
@@ -40,11 +49,20 @@
 			<button class="tj" form-type="submit">提交</button>
 			</form>
 	</view>
+	</view>
 </template>
 
 <script>
 	var _self;
 	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+				info: {}, //后台数据
+			};
+		},
 	 data:{
 	  percent:0,
 	  loading:false,
@@ -71,7 +89,7 @@
 	       console.log(uploadFileRes.data);
 	      }
 	     });
-	 
+
 	     uploadTask.onProgressUpdate(function (res) {
 	      _self.percent = res.progress;
 	      console.log('上传进度' + res.progress);
@@ -86,7 +104,7 @@
 	  }
 	 },
 	    onLoad:function(){
-	  
+
 	    }
 	}
 </script>
diff --git a/pages_read_circle/pages/personal-library/personal-library.vue b/pages_read_circle/pages/personal-library/personal-library.vue
index d25ce9261b5f6d8dc68571cc4070917429b0cf4a..48f3d233df74dc41e3e02d41bb3ba09549c5ca96 100644
--- a/pages_read_circle/pages/personal-library/personal-library.vue
+++ b/pages_read_circle/pages/personal-library/personal-library.vue
@@ -2,126 +2,168 @@
 	<view class="all">
 		<view class="find">
 			<view class="">
-				<input placeholder="搜索图书馆"  style="width: 400rpx; height:  50rpx; font-size: 25rpx; border: solid 2rpx #EEEEEE;border-radius: 5rpx;"/>
+				<input placeholder="搜索图书馆" style="
+            width: 400rpx;
+            height: 50rpx;
+            font-size: 25rpx;
+            border: solid 2rpx #eeeeee;
+            border-radius: 5rpx;
+          " />
 			</view>
 			<view class="">
-				<button type="warn" style="width: 110rpx; height: 55rpx; font-size: 15rpx; margin-right: 100rpx; " >搜索</button>
+				<button type="warn" style="
+            width: 110rpx;
+            height: 55rpx;
+            font-size: 15rpx;
+            margin-right: 100rpx;
+          ">
+					搜索
+				</button>
 			</view>
 		</view>
 		<view class="show">
 			<view class="img">
-				<image src="../../static/images/person_library.jpg" style="width: 80rpx; height: 80rpx; border-radius: 50%; margin-top: 10rpx;"></image>
+				<image src="/static/images/person_library.jpg" style="
+            width: 80rpx;
+            height: 80rpx;
+            border-radius: 50%;
+            margin-top: 10rpx;
+          "></image>
 			</view>
 			<view class="name">樱桃馆</view>
 			<navigator url="/pages_read_circle/pages/personal-library/shareBook">
 				<view class="share">
-					<image src="../../static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx;"></image>
+					<image src="/static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx"></image>
 				</view>
 			</navigator>
 		</view>
 		<view class="show">
 			<view class="img">
-				<image src="../../static/images/person_library.jpg" style="width: 80rpx; height: 80rpx; border-radius: 50%; margin-top: 10rpx;"></image>
+				<image src="/static/images/person_library.jpg" style="
+            width: 80rpx;
+            height: 80rpx;
+            border-radius: 50%;
+            margin-top: 10rpx;
+          "></image>
 			</view>
 			<view class="name">木子图书馆</view>
 			<view class="share">
-				<image src="../../static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx;"></image>
+				<image src="/static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx"></image>
 			</view>
 		</view>
-		
+
 		<view class="show">
 			<view class="img">
-				<image src="../../static/images/person_library.jpg" style="width: 80rpx; height: 80rpx; border-radius: 50%; margin-top: 10rpx;"></image>
+				<image src="/static/images/person_library.jpg" style="
+            width: 80rpx;
+            height: 80rpx;
+            border-radius: 50%;
+            margin-top: 10rpx;
+          "></image>
 			</view>
 			<view class="name">小明图书</view>
 			<view class="share">
-				<image src="../../static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx;"></image>
+				<image src="/static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx"></image>
 			</view>
 		</view>
-		
+
 		<view class="show">
 			<view class="img">
-				<image src="../../static/images/person_library.jpg" style="width: 80rpx; height: 80rpx; border-radius: 50%; margin-top: 10rpx;"></image>
+				<image src="/static/images/person_library.jpg" style="
+            width: 80rpx;
+            height: 80rpx;
+            border-radius: 50%;
+            margin-top: 10rpx;
+          "></image>
 			</view>
 			<view class="name">小明图书</view>
 			<view class="share">
-				<image src="../../static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx;"></image>
+				<image src="/static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx"></image>
 			</view>
 		</view>
-		
+
 		<view class="show">
 			<view class="img">
-				<image src="../../static/images/person_library.jpg" style="width: 80rpx; height: 80rpx; border-radius: 50%; margin-top: 10rpx;"></image>
+				<image src="/static/images/person_library.jpg" style="
+            width: 80rpx;
+            height: 80rpx;
+            border-radius: 50%;
+            margin-top: 10rpx;
+          "></image>
 			</view>
 			<view class="name">小明图书</view>
 			<view class="share">
-				<image src="../../static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx;"></image>
+				<image src="/static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx"></image>
 			</view>
 		</view>
-		
+
 		<view class="show">
 			<view class="img">
-				<image src="../../static/images/person_library.jpg" style="width: 80rpx; height: 80rpx; border-radius: 50%; margin-top: 10rpx;"></image>
+				<image src="/static/images/person_library.jpg" style="
+            width: 80rpx;
+            height: 80rpx;
+            border-radius: 50%;
+            margin-top: 10rpx;
+          "></image>
 			</view>
 			<view class="name">小明图书</view>
 			<view class="share">
-				<image src="../../static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx;"></image>
+				<image src="/static/images/upload_one.png" style="width: 60rpx; height: 60rpx; margin-top: -10rpx"></image>
 			</view>
 		</view>
-		
 	</view>
 </template>
 
 <script>
 	export default {
 		data() {
-			return {
-				
-			}
+			return {};
 		},
-		methods: {
-			
-		}
-	}
+		methods: {},
+	};
 </script>
 
 <style>
-	.all{
+	.all {
 		width: 100%;
 	}
-	.share{
+
+	.share {
 		font-size: 25rpx;
 		margin-top: 50rpx;
 		margin-left: 280rpx;
-		color: #DD524D;
+		color: #dd524d;
 	}
-	.show{
-			background-color: #F5F5F5;
-			width: 100%;
-			height: 100%;
-			display: flex;
-			margin-top: 5rpx;
-			margin-bottom: 5rpx;
-		}
-	.img{
+
+	.show {
+		background-color: #f5f5f5;
+		width: 100%;
+		height: 100%;
+		display: flex;
+		margin-top: 5rpx;
+		margin-bottom: 5rpx;
+	}
+
+	.img {
 		margin-left: 30rpx;
 		margin-top: 10rpx;
 		margin-bottom: 10rpx;
 		height: 100rpx;
-		border: #00BFFF 5rpx dashed;
+		border: #00bfff 5rpx dashed;
 		border-radius: 45%;
 	}
-	.name{
+
+	.name {
 		font-size: 25rpx;
 		margin-top: 50rpx;
 		margin-left: 40rpx;
 		margin-right: 30rpx;
 		width: 150rpx;
 	}
-	.all{
-		
-	}
-	.find{
+
+	.all {}
+
+	.find {
 		display: flex;
 		margin-top: 20rpx;
 		margin-left: 90rpx;
diff --git a/pages_read_circle/pages/personal-library/shareBook.vue b/pages_read_circle/pages/personal-library/shareBook.vue
index e203c33d5a9c27d1a1d858e3eeaca0c5ed4b49aa..0e3af66b7364dba62d2ab4adf2429877bfdfc41c 100644
--- a/pages_read_circle/pages/personal-library/shareBook.vue
+++ b/pages_read_circle/pages/personal-library/shareBook.vue
@@ -1,203 +1,193 @@
 <template>
-	<view>
-		<view class="show">
-			<view class="book-name">
-				<view class="name">书名</view>
-				<view class="name-input1">
-					<textarea class="name-input" placeholder="请输入书名" />
-				</view>
-			</view>
-			<view class="book-author">
-				<view class="author">作者</view>
-				<view class="author-input1">
-					<textarea class="author-input" placeholder="请输入作者名" />
-				</view>
-			</view>
-			<view class="book-publisher">
-				<view class="publisher">出版社</view>
-				<view class="publisher-input1">
-					<textarea class="publisher-input" placeholder="请输入出版社" />
-				</view>
-			</view>
-			<view class="book-summary">
-				<view class="summary">简介</view>
-				<view class="summary-input1">
-					<textarea class="summary-input" placeholder="请输入简介" />
-				</view>
-			</view>
-			<view class="book-cover">
-				<view class="cover">封面</view>
-				<view class="coversImag">
-					<image class="imageCover" src="../../static/images/add_more2.png"></image>
-				</view>
-			</view>
-		</view>
-		<view>
-			<button class="submit-btn">确定提交</button>
-		</view>
-	</view>
+  <view>
+    <view class="show">
+      <view class="book-name">
+        <view class="name">书名</view>
+        <view class="name-input1">
+          <textarea class="name-input" placeholder="请输入书名" />
+        </view>
+      </view>
+      <view class="book-author">
+        <view class="author">作者</view>
+        <view class="author-input1">
+          <textarea class="author-input" placeholder="请输入作者名" />
+        </view>
+      </view>
+      <view class="book-publisher">
+        <view class="publisher">出版社</view>
+        <view class="publisher-input1">
+          <textarea class="publisher-input" placeholder="请输入出版社" />
+        </view>
+      </view>
+      <view class="book-summary">
+        <view class="summary">简介</view>
+        <view class="summary-input1">
+          <textarea class="summary-input" placeholder="请输入简介" />
+        </view>
+      </view>
+      <view class="book-cover">
+        <view class="cover">封面</view>
+        <view class="coversImag">
+          <image class="imageCover" src="/static/images/add_more2.png"></image>
+        </view>
+      </view>
+    </view>
+    <view>
+      <button class="submit-btn">确定提交</button>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			
-		}
-	}
+export default {
+  data() {
+    return {};
+  },
+  methods: {},
+};
 </script>
 
 <style>
-	.show{
-		background-color:#F5F5F5 ;
-		height: 700rpx;
-		width: 100%;
-	}
-	.name{
-		margin-top: 40rpx;
-		margin-left: 30rpx;
-	}
-	.book-name{
-		font-size: 30rpx;
-		color: #333333;
-		display: flex;
-	}
-	.name-input1{
-		margin-top: 35rpx;
-		border: 1rpx solid #EBEBEB;
-		border-radius: 15rpx;
-		margin-left: 50rpx;
-		width:578rpx;
-		height: 60rpx;
-		background-color: #FFFFFF;
-	}
-	.name-input{
-		
-		align-items: center;
-		font-size: 22rpx;
-		margin-left: 20rpx;
-		color: #D7D7D7;
-		margin-top: 15rpx;
-		/* placeholder-style{
-			
+.show {
+  background-color: #f5f5f5;
+  height: 700rpx;
+  width: 100%;
+}
+.name {
+  margin-top: 40rpx;
+  margin-left: 30rpx;
+}
+.book-name {
+  font-size: 30rpx;
+  color: #333333;
+  display: flex;
+}
+.name-input1 {
+  margin-top: 35rpx;
+  border: 1rpx solid #ebebeb;
+  border-radius: 15rpx;
+  margin-left: 50rpx;
+  width: 578rpx;
+  height: 60rpx;
+  background-color: #ffffff;
+}
+.name-input {
+  align-items: center;
+  font-size: 22rpx;
+  margin-left: 20rpx;
+  color: #d7d7d7;
+  margin-top: 15rpx;
+  /* placeholder-style{
+
 		} */
-	}
+}
 
+.author {
+  margin-top: 40rpx;
+  margin-left: 30rpx;
+}
+.book-author {
+  font-size: 30rpx;
+  color: #333333;
+  display: flex;
+}
+.author-input1 {
+  margin-top: 35rpx;
+  border: 1rpx solid #ebebeb;
+  border-radius: 15rpx;
+  margin-left: 50rpx;
+  width: 578rpx;
+  height: 60rpx;
+  background-color: #ffffff;
+}
+.author-input {
+  align-items: center;
+  font-size: 22rpx;
+  margin-left: 20rpx;
+  color: #d7d7d7;
+  margin-top: 15rpx;
+  /* placeholder-style{
 
-	.author{
-		margin-top: 40rpx;
-		margin-left: 30rpx;
-	}
-	.book-author{
-		font-size: 30rpx;
-		color: #333333;
-		display: flex;
-	}
-	.author-input1{
-		margin-top: 35rpx;
-		border: 1rpx solid #EBEBEB;
-		border-radius: 15rpx;
-		margin-left: 50rpx;
-		width:578rpx;
-		height: 60rpx;
-		background-color: #FFFFFF;
-	}
-	.author-input{
-		
-		align-items: center;
-		font-size: 22rpx;
-		margin-left: 20rpx;
-		color: #D7D7D7;
-		margin-top: 15rpx;
-		/* placeholder-style{
-			
-		} */
-	}
-	
-	.publisher{
-		margin-top: 40rpx;
-		margin-left: 30rpx;
-	}
-	.book-publisher{
-		font-size: 30rpx;
-		color: #333333;
-		display: flex;
-	}
-	.publisher-input1{
-		margin-top: 35rpx;
-		border: 1rpx solid #EBEBEB;
-		border-radius: 15rpx;
-		margin-left: 22rpx;
-		width:578rpx;
-		height: 60rpx;
-		background-color: #FFFFFF;
-	}
-	.publisher-input{
-		
-		align-items: center;
-		font-size: 22rpx;
-		margin-left: 20rpx;
-		color: #D7D7D7;
-		margin-top: 15rpx;
-		/* placeholder-style{
-			
 		} */
-	}
+}
 
+.publisher {
+  margin-top: 40rpx;
+  margin-left: 30rpx;
+}
+.book-publisher {
+  font-size: 30rpx;
+  color: #333333;
+  display: flex;
+}
+.publisher-input1 {
+  margin-top: 35rpx;
+  border: 1rpx solid #ebebeb;
+  border-radius: 15rpx;
+  margin-left: 22rpx;
+  width: 578rpx;
+  height: 60rpx;
+  background-color: #ffffff;
+}
+.publisher-input {
+  align-items: center;
+  font-size: 22rpx;
+  margin-left: 20rpx;
+  color: #d7d7d7;
+  margin-top: 15rpx;
+  /* placeholder-style{
+
+		} */
+}
 
-	.summary{
-		margin-top: 40rpx;
-		margin-left: 30rpx;
-	}
-	.book-summary{
-		font-size: 30rpx;
-		color: #333333;
-		display: flex;
-	}
-	.summary-input1{
-		margin-top: 35rpx;
-		border: 1rpx solid #EBEBEB;
-		border-radius: 15rpx;
-		margin-left: 50rpx;
-		width:578rpx;
-		height: 200rpx;
-		background-color: #FFFFFF;
-	}
-	.summary-input{
-		
-		align-items: center;
-		font-size: 22rpx;
-		margin-left: 20rpx;
-		color: #D7D7D7;
-		margin-top: 15rpx;
-	}
-	.cover{
-		margin-top: 80rpx;
-		margin-left: 30rpx;
-	}
-	.book-cover{
-		font-size: 30rpx;
-		color: #333333;
-		display: flex;
-	}
-	.imageCover{
-		margin-top: 35rpx;
-		border-radius: 15rpx;
-		margin-left: 50rpx;
-		width:130rpx;
-		height: 130rpx;
-		border: 4rpx #DFDFDF dashed;
-		/* background-color: #FFFFFF; */
-	}
-	.submit-btn{
-		margin-top: 360rpx;
-		color: #FFFFFF;
-		background-color: #5E49F5;
-		height: 90rpx;
-		border-radius: 0;
-	}
+.summary {
+  margin-top: 40rpx;
+  margin-left: 30rpx;
+}
+.book-summary {
+  font-size: 30rpx;
+  color: #333333;
+  display: flex;
+}
+.summary-input1 {
+  margin-top: 35rpx;
+  border: 1rpx solid #ebebeb;
+  border-radius: 15rpx;
+  margin-left: 50rpx;
+  width: 578rpx;
+  height: 200rpx;
+  background-color: #ffffff;
+}
+.summary-input {
+  align-items: center;
+  font-size: 22rpx;
+  margin-left: 20rpx;
+  color: #d7d7d7;
+  margin-top: 15rpx;
+}
+.cover {
+  margin-top: 80rpx;
+  margin-left: 30rpx;
+}
+.book-cover {
+  font-size: 30rpx;
+  color: #333333;
+  display: flex;
+}
+.imageCover {
+  margin-top: 35rpx;
+  border-radius: 15rpx;
+  margin-left: 50rpx;
+  width: 130rpx;
+  height: 130rpx;
+  border: 4rpx #dfdfdf dashed;
+  /* background-color: #FFFFFF; */
+}
+.submit-btn {
+  margin-top: 360rpx;
+  color: #ffffff;
+  background-color: #5e49f5;
+  height: 90rpx;
+  border-radius: 0;
+}
 </style>
diff --git a/pages_read_circle/pages/personal-library/shareBook1.vue b/pages_read_circle/pages/personal-library/shareBook1.vue
index 9f33be65402735a3dc46572f9fcc099d0e04ba25..ea6c6d1442f1622a1ea2759fa5165bcb578ad665 100644
--- a/pages_read_circle/pages/personal-library/shareBook1.vue
+++ b/pages_read_circle/pages/personal-library/shareBook1.vue
@@ -1,95 +1,140 @@
 <template>
-	<view class="all">
-		<!-- <view class="">
+  <view class="all">
+    <!-- <view class="">
 			<button style="font-size: 20rpx; background-color: #00BFFF; width: 100rpx; height: 50rpx; margin-left: 620rpx;">提交</button>
 		</view> -->
-		<view class="tt">
-			<view class="name">
-				<view class="">
-					书名：
-				</view>
-				<view class="a1">
-					<textarea class="" maxlength="15" placeholder="输入书名~上限15字" style="font-size: 28rpx;  width: 500rpx; height: 60rpx; color: #00BFFF;"></textarea>
-				</view>
-			</view>
-			<view class="name">作者：
-				<view class="a1">
-					<textarea class="" maxlength="20" placeholder="输入作者~上限20字" style="font-size: 28rpx;  width: 500rpx; height: 60rpx; color: #00BFFF;"></textarea>
-				</view>
-			</view>
-		</view>
-		
-		<view class="tt">
-			<view class="name">
-				<view class="">
-					简介：
-				</view>
-				<view class="a1">
-					<textarea class="" maxlength="150" placeholder="输入简介~上限150字" style="font-size: 28rpx;  width: 500rpx; height: 60rpx; color: #00BFFF;"></textarea>
-				</view>
-			</view>
-			<view class="name">图书类型：
-				<view class="a1">
-					<textarea class="" maxlength="20" placeholder="请选择" style="font-size: 28rpx;  width: 500rpx; height: 60rpx; color: #00BFFF;"></textarea>
-				</view>
-			</view>
-		</view>
-		
-		
-		<view class="tt">
-			<view class="name">
-				<view class="">
-					书貌上传：
-				</view>
-				
-			</view>
-			<view class="name">
-				<view class="a1">
-					<view class="" style="font-size: 28rpx;  width: 500rpx; height: 300rpx; color: #00BFFF;">
-						
-						<image src="../../static/images/upload_image.png" style="width: 100rpx; height: 100rpx; margin-left: 550rpx; margin-top: 100rpx;"></image>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+    <view class="tt">
+      <view class="name">
+        <view class=""> 书名： </view>
+        <view class="a1">
+          <textarea
+            class=""
+            maxlength="15"
+            placeholder="输入书名~上限15字"
+            style="
+              font-size: 28rpx;
+              width: 500rpx;
+              height: 60rpx;
+              color: #00bfff;
+            "
+          ></textarea>
+        </view>
+      </view>
+      <view class="name"
+        >作者：
+        <view class="a1">
+          <textarea
+            class=""
+            maxlength="20"
+            placeholder="输入作者~上限20字"
+            style="
+              font-size: 28rpx;
+              width: 500rpx;
+              height: 60rpx;
+              color: #00bfff;
+            "
+          ></textarea>
+        </view>
+      </view>
+    </view>
+
+    <view class="tt">
+      <view class="name">
+        <view class=""> 简介： </view>
+        <view class="a1">
+          <textarea
+            class=""
+            maxlength="150"
+            placeholder="输入简介~上限150字"
+            style="
+              font-size: 28rpx;
+              width: 500rpx;
+              height: 60rpx;
+              color: #00bfff;
+            "
+          ></textarea>
+        </view>
+      </view>
+      <view class="name"
+        >图书类型：
+        <view class="a1">
+          <textarea
+            class=""
+            maxlength="20"
+            placeholder="请选择"
+            style="
+              font-size: 28rpx;
+              width: 500rpx;
+              height: 60rpx;
+              color: #00bfff;
+            "
+          ></textarea>
+        </view>
+      </view>
+    </view>
+
+    <view class="tt">
+      <view class="name">
+        <view class=""> 书貌上传： </view>
+      </view>
+      <view class="name">
+        <view class="a1">
+          <view
+            class=""
+            style="
+              font-size: 28rpx;
+              width: 500rpx;
+              height: 300rpx;
+              color: #00bfff;
+            "
+          >
+            <image
+              src="/static/images/upload_image.png"
+              style="
+                width: 100rpx;
+                height: 100rpx;
+                margin-left: 550rpx;
+                margin-top: 100rpx;
+              "
+            ></image>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
-		},
-		methods: {
-			
-		}
-	}
+export default {
+  data() {
+    return {};
+  },
+  methods: {},
+};
 </script>
 
 <style>
-	.all{
-		width: 100%;
-		height: 100%;
-		line-height: 80rpx;
-		/* border: #EEEEEE 1rpx solid; */
-		box-shadow: #FFFFFF;
-		color: #00BFFF;
-	}
-	.name{
-		margin-bottom: 5rpx;
-		border: 1rpx solid #EEEEEE;
-		background-color: #F8F8F8;
-		display: flex;
-		margin-left: 30rpx;
-		margin-right: 30rpx;
-	}
-	.a1{
-		align-items: center;
-		margin-top: 20rpx;
-	}
-	.tt{
-		margin-top: 30rpx;
-	}
+.all {
+  width: 100%;
+  height: 100%;
+  line-height: 80rpx;
+  /* border: #EEEEEE 1rpx solid; */
+  box-shadow: #ffffff;
+  color: #00bfff;
+}
+.name {
+  margin-bottom: 5rpx;
+  border: 1rpx solid #eeeeee;
+  background-color: #f8f8f8;
+  display: flex;
+  margin-left: 30rpx;
+  margin-right: 30rpx;
+}
+.a1 {
+  align-items: center;
+  margin-top: 20rpx;
+}
+.tt {
+  margin-top: 30rpx;
+}
 </style>
diff --git a/pages_read_circle/pages/personal/BandR_notice.vue b/pages_read_circle/pages/personal/BandR_notice.vue
index 134d9db9d0ec327fd035323f6924d006adcb148d..1292baaa7035f386ab6ad9693b1241a5ef5d6eeb 100644
--- a/pages_read_circle/pages/personal/BandR_notice.vue
+++ b/pages_read_circle/pages/personal/BandR_notice.vue
@@ -1,129 +1,134 @@
 <template>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="借还消息" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 	<view class="all">
-		<view class="mid">
+		<view class="mid" v-for="(item,index) in list" :key="index">
+			<view class="wd" v-show="!item.status">
+				<image  src="/static/images/WD.png"style="width: 18rpx;height: 18rpx; border-radius: 100%;" ></image>
+			</view>
 			<view class="zt">
-				<view class="zt1">预约成功</view>
-				<view class="zt2">2017-08-10</view>
+				<view class="zt1">{{item.title}}</view>
+				<view class="zt2" v-text="formatDate(item.time)">2017-08-10</view>
 			</view>
 			<view class="midone">
 				<view class="zhengti">
-					<image src="../../static/images/书1.jpg" style="width: 120rpx;height: 160rpx;"></image>
+					<image :src=item.picturePath style="width: 120rpx; height: 160rpx"></image>
 				</view>
 				<view class="xq">
-					<view class="midwz">您预约xxx成功...</view>
+					<view class="midwz">{{item.msg}}</view>
 					<navigator url=""></navigator>
 					<view class="s1">
 						查看详情>>
-						<!-- <image style="width: 30rpx; height: 30rpx;" src="../../static/images/dingwei.png"></image> -->
+						<!-- <image style="width: 30rpx; height: 30rpx;" src="/static/images/dingwei.png"></image> -->
 					</view>
 				</view>
 			</view>
 		</view>
-		<view class="mid">
-			<view class="zt">
-				<view class="zt1">您的订单已发货</view>
-				<view class="zt2">2017-08-10</view>
-			</view>
-			<view class="midone">
-				<view class="zhengti">
-					<image src="../../static/images/书1.jpg" style="width: 120rpx;height: 160rpx;"></image>
-				</view>
-				<view class="xq">
-					<view class="midwz">您的xxx订单xxx...</view>
-					<navigator url="/pages_borrow_books/pages/appointment/logistics">
-						<view class="s1">
-							查看详情>>
-							<!-- <image style="width: 30rpx; height: 30rpx;" src="../../static/images/dingwei.png"></image> -->
-						</view>
-					</navigator>
-				</view>
-			</view>
-		</view>
-		<view class="mid">
-			<view class="zt">
-				<view class="zt1">包裹已领取</view>
-				<view class="zt2">2017-08-10</view>
-			</view>
-			<view class="midone">
-				<view class="zhengti">
-					<image src="../../static/images/书1.jpg" style="width: 120rpx;height: 160rpx;"></image>
-				</view>
-				<view class="xq">
-					<view class="midwz">您的xxxxx成功哈哈哈哈哈哈哈哈...</view>
-					<navigator url="/pages_borrow_books/pages/appointment/confirm">
-						<view class="s1">
-							查看详情>>
-							<!-- <image style="width: 30rpx; height: 30rpx;" src="../../static/images/dingwei.png"></image> -->
-						</view>
-					</navigator>
-				</view>
-			</view>
-		</view>
-		<view class="mid">
-			<view class="zt">
-				<view class="zt1">包裹已领取</view>
-				<view class="zt2">2017-08-10</view>
-			</view>
-			<view class="midone">
-				<view class="zhengti">
-					<image src="../../static/images/书1.jpg" style="width: 120rpx;height: 160rpx;"></image>
-				</view>
-				<view class="xq">
-					<view class="midwz">您xxx成功...</view>
-					<navigator url="/pages_borrow_books/pages/appointment/confirm">
-						<view class="s1">
-							查看详情>>
-							<!-- <image style="width: 30rpx; height: 30rpx;" src="../../static/images/dingwei.png"></image> -->
-						</view>
-					</navigator>
-				</view>
-			</view>
-		</view>
-		<view class="mid">
-			<view class="zt">
-				<view class="zt1">包裹已领取</view>
-				<view class="zt2">2017-08-10</view>
-			</view>
-			<view class="midone">
-				<view class="zhengti">
-					<image src="../../static/images/书1.jpg" style="width: 120rpx;height: 160rpx;"></image>
-				</view>
-				<view class="xq">
-					<view class="midwz">您xxx成功...</view>
-					<navigator url="/pages_borrow_books/pages/appointment/confirm">
-						<view class="s1">
-							查看详情>>
-							<!-- <image style="width: 30rpx; height: 30rpx;" src="../../static/images/dingwei.png"></image> -->
-						</view>
-					</navigator>
-				</view>
-			</view>
-		</view>
+	</view>
 	</view>
 </template>
 
 <script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
 		data() {
-			return {};
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+				list:[]
+			};
+		},
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
+		onLoad() {
+			this.getDate()
+			//测试期间先注释
+			//this.updataStatus()  
 		},
-		methods: {}
+		methods: {
+				//获取数据
+				async getDate() {
+					var that = this;
+					let rid = parseInt(that.userinfo.readerId)
+					var params = {
+						url: "systemMessage/queryMessageType",
+						type: "GET",
+						data: {
+							readerId:rid,
+							type:4
+						},
+					};
+					const res = await app.myRequest(params);
+					console.log("+++后台数据：",res);
+					that.list = res
+				},
+				//更新已读
+				async updataStatus() {
+					var that = this;
+					let rid = parseInt(that.userinfo.readerId)
+					var params = {
+						url: "systemMessage/updateStatus",
+						type: "POST",
+						data: {
+							readerId:rid,
+							type:4
+						},
+					};
+					const res = await app.myRequest(params);
+					console.log("+++后台数据：",res);
+				},
+				//日期转换方法
+				formatDate(value) {
+					let date = new Date(value);
+					let y = date.getFullYear();
+					let MM = date.getMonth() + 1;
+					MM = MM < 10 ? ('0' + MM) : MM;
+					let d = date.getDate();
+					d = d < 10 ? ('0' + d) : d;
+					let h = date.getHours();
+					h = h < 10 ? ('0' + h) : h;
+					let m = date.getMinutes();
+					m = m < 10 ? ('0'+ m) : m;
+					let s = date.getSeconds();
+					s = s < 10 ? ('0' + s) : s;
+					return y + '-' + MM + '-' + d+'    '+h+':'+m ;
+				},
+			},
+		
 	};
 </script>
 
 <style>
 	.all {
-		height: 20024rpx;
 		margin-top: -20rpx;
-		background-color: #F2F2F2;
+		background-color: #f2f2f2;
+	}
+
+	.wd{
+		width: 20rpx;
+		height: 20rpx;
+		margin-left: 20rpx;
 	}
 
 	.mid {
 		height: auto;
-		margin: 20rpx 20rpx;
+		margin: 30rpx 20rpx;
 		border-radius: 20rpx;
-		border: #FFFFFF 1rpx solid;
-		background-color: #FFFFFF;
+		border: #ffffff 1rpx solid;
+		background-color: #ffffff;
 	}
 
 	.zt {
@@ -156,7 +161,7 @@
 		height: 160rpx;
 		/* height: 180rpx; */
 		width: 530rpx;
-		background-color: #F2F2F2;
+		background-color: #f2f2f2;
 	}
 
 	.midwz {
diff --git a/pages_read_circle/pages/personal/Lib_ser_chat.vue b/pages_read_circle/pages/personal/Lib_ser_chat.vue
index 4cf740e4a235f02c8c5d89e2fe5a0a89172f0880..43c87f9f3f1cf37342aaa4aadc087087e0269656 100644
--- a/pages_read_circle/pages/personal/Lib_ser_chat.vue
+++ b/pages_read_circle/pages/personal/Lib_ser_chat.vue
@@ -1,253 +1,272 @@
 <template>
-	<view class="bgConston">
-		<view class="userSession" :style="{ height: sHeight + 'px' }">
-			<block v-for="(userContext,index) in userContextItem " :key="userContext.userId">
-			<view class="userH" :class="{'userMe' :userContext.userId==''}">
-				<view class="userImg">
-					<image :src="userContext.userImg" mode="scaleToFill"></image>
+	<view>
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="客服" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
 				</view>
-				<view class="userType">
-					<!-- 是否显示用户昵称 -->
-					<!-- <template v-if="userContext.userId !=''">
+			</view>
+		</u-navbar>
+  <view class="bgConston">
+    <view class="userSession" :style="{ height: sHeight + 'px' }">
+      <block
+        v-for="(userContext, index) in userContextItem"
+        :key="userContext.userId"
+      >
+        <view class="userH" :class="{ userMe: userContext.userId == '' }">
+          <view class="userImg">
+            <image :src="userContext.userImg" mode="scaleToFill"></image>
+          </view>
+          <view class="userType">
+            <!-- 是否显示用户昵称 -->
+            <!-- <template v-if="userContext.userId !=''">
 						<view class="userN">
 							<text>{{userContext.userName}}</text>
 							<text>{{userContext.Time}}</text>
 						</view>
 					</template> -->
-					<!-- 文本格式 -->
-					<template v-if="userContext.type =='text'">
-						<view class="textType">
-							<text>{{userContext.context}}</text>
-						</view>
-					</template>
-					<!-- 图片格式 -->
-					<template v-else-if="userContext.type =='img'">
-						<view class="imgType">
-							<image :src="userContext.picImg" mode="scaleToFill"></image>
-						</view>
-					</template>
-					<!-- 视频格式 -->
-					<template v-else-if="userContext.type =='video'">
-						<view class="videoType">
-							<video :src="userContext.videoSrc" controls ="false"></video>
-						</view>
-					</template>
-					
-				</view>
-			</view>
-			</block>
-		</view>
-		<!-- 底部输入框 -->
-		<view class="userInput">
-			<input type="text" v-model="text" placeholder="文明发言" adjust-position="false" />
-			<view class="sumText" @tap="submit(text)">发送</view>
-		</view>
-	</view>
+            <!-- 文本格式 -->
+            <template v-if="userContext.type == 'text'">
+              <view class="textType">
+                <text>{{ userContext.context }}</text>
+              </view>
+            </template>
+            <!-- 图片格式 -->
+            <template v-else-if="userContext.type == 'img'">
+              <view class="imgType">
+                <image :src="userContext.picImg" mode="scaleToFill"></image>
+              </view>
+            </template>
+            <!-- 视频格式 -->
+            <template v-else-if="userContext.type == 'video'">
+              <view class="videoType">
+                <video :src="userContext.videoSrc" controls="false"></video>
+              </view>
+            </template>
+          </view>
+        </view>
+      </block>
+    </view>
+    <!-- 底部输入框 -->
+    <view class="userInput">
+      <input
+        type="text"
+        v-model="text"
+        placeholder="文明发言"
+        adjust-position="false"
+      />
+      <view class="sumText" @tap="submit(text)">发送</view>
+    </view>
+  </view>
+  </view>
 </template>
 
 <script>
 export default {
-	data() {
-		return {
-			sHeight:500,
-			
-			userContextItem:[{
-				
-				userId:1,
-				meId:"",
-				userName:"",
-				userImg:"../../static/images/service_woman.png",
-				type:"text",
-				context:"吾问无为谓jhhhh哈哈哈哈哈哈哈哈哈哈哈hh哇哇哇哇",
-				time:(new Date().getTime())
-			},
-			{
-				userId:"",
-				meId:2,
-				userName:"白百合",
-				userImg:"../../static/images/头像2.jpg",
-				type:"text",
-				context:"哈哈哈",
-				time:(new Date().getTime())
-			},
-			{
-			userId:1,
-			meId:"",
-			userName:"",
-			userImg:"../../static/images/service_woman.png",
-			type:"text",
-			context:"吾问无为谓哇哇哇哇",
-			time:(new Date().getTime())
-			}
-			]
-		}
-	},
-	onLoad() {
-		//获取系统信息
-		uni.getSystemInfo({
-			success: (res) => {
-				let height=res.windowHeight-uni.upx2px(100);
-				this.sHeight=height;
-			}
-		})
-	},
-	
-	methods: {
-		submit(text){
-			// 创建一组数据
-			let obj = {
-				userId:"",
-				meId: 2,
-				userName: "白百合",
-				userImg:"../../static/images/头像2.jpg",
-				type:"text",
-				context:text,
-				time:(new Date().getTime())
-			};
-			this.userContextItem.push(obj);
-		}
-		}
-}
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
+		},
+      sHeight: 500,
+
+      userContextItem: [
+        {
+          userId: 1,
+          meId: "",
+          userName: "",
+          userImg: "/static/images/service_woman.png",
+          type: "text",
+          context: "吾问无为谓jhhhh哈哈哈哈哈哈哈哈哈哈哈hh哇哇哇哇",
+          time: new Date().getTime(),
+        },
+        {
+          userId: "",
+          meId: 2,
+          userName: "白百合",
+          userImg: "/static/images/头像2.jpg",
+          type: "text",
+          context: "哈哈哈",
+          time: new Date().getTime(),
+        },
+        {
+          userId: 1,
+          meId: "",
+          userName: "",
+          userImg: "/static/images/service_woman.png",
+          type: "text",
+          context: "吾问无为谓哇哇哇哇",
+          time: new Date().getTime(),
+        },
+      ],
+    };
+  },
+  onLoad() {
+    //获取系统信息
+    uni.getSystemInfo({
+      success: (res) => {
+        let height = res.windowHeight - uni.upx2px(100);
+        this.sHeight = height;
+      },
+    });
+  },
+
+  methods: {
+    submit(text) {
+      // 创建一组数据
+      let obj = {
+        userId: "",
+        meId: 2,
+        userName: "白百合",
+        userImg: "/static/images/头像2.jpg",
+        type: "text",
+        context: text,
+        time: new Date().getTime(),
+      };
+      this.userContextItem.push(obj);
+    },
+  },
+};
 </script>
 
 <style>
-	.bgConston{
-		width: 100%;
-		height: 100%;
-		background-color: #F8F8F8;
-		margin: 0;
-		padding: 0;
-	}
-	/* 聊天 */
-	.userSession{
-		width: 100%;
-		height: auto;
-		border-top: 1upx solid #EDEDED;
-		overflow: auto;
-	}
-	.userH{
-		width: 80%;
-		height: auto;
-		display: flex;
-		flex: 1;
-		flex-wrap: wrap;
-		padding: 20upx;
-	}
-	.userMe{
-		width: 95%;
-		height: auto;
-		display: flex;
-		flex: 1;
-		flex-wrap: wrap;
-		padding: 20upx;
-		justify-content: flex-start;
-		flex-direction: row-reverse;
-		text-align: right;
-	}
-	.userImg{
-		width: 70upx;
-		height: 70upx;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		margin-right: 15upx;
-		margin-left: 15upx;
-	}
-	.userImg>image{
-		width: 65upx;
-		height: 65upx;
-		border-radius: 100%;
-	}
-	.userType{
-		display: flex;
-		justify-content: center;
-		flex-direction: column;
-		padding: 10upx;
-	}
-	.userN{
-		height: 50upx;
-		display: flex;
-		justify-content: space-around;
-	}
-	.userN>text{
-		height: 50upx;
-		min-height: 100upx;
-		color: #666;
-	}
-	.textType{
-		max-width: 400upx;
-		background-color: #FFFFFF;
-		border-radius: 10upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		padding: 10upx;
-	}
-	.textType>text{
-		font-size: 28upx;
-		color: #666;
-	}
-	.imgType{
-		max-width: 300upx;
-		max-height: 420upx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		background-color: #FFFFFF;
-		border-radius: 20upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-	}
-	.imgType>image{
-		width: 250upx;
-		height: 350upx;
-		padding: 20upx;
-	}
-	.videoType{
-		width: 300upx;
-		height: 400upx;
-		display: flex;
-		background-color: #FFFFFF;
-		border-radius: 20upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-		align-items: center;
-		justify-content: center;
-		padding: 10upx;
-	}
-	.videoType>video{
-		width: 270upx;
-		height: 370upx;
-	}
-	.userInput{
-		height: 100upx;
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		right: 0;
-		padding: 0 10upx;
-		display: flex;
-		justify-content: space-around;
-		align-items: center;
-		box-shadow: 0 0 5upx 0 #E3E3E3;
-	}
-	.userInput>input{
-		height: 50upx;
-		background: #F4F5F6;
-		border-radius: 15upx;
-		padding: 10upx 10upx;
-		flex: 1;
-		margin-right: 20upx;
-		font-size: 28upx;
-		
-	}
-	.userInput>view{
-		width: 120upx;
-		font-size: 24upx;
-		color: #FFFFFF;
-		height: 60upx;
-		background-color: #18C7F2;
-		border-radius: 20upx;
-		text-align: center;
-		line-height: 60upx;
-	}
+.bgConston {
+  width: 100%;
+  height: 100%;
+  background-color: #f8f8f8;
+  margin: 0;
+  padding: 0;
+}
+/* 聊天 */
+.userSession {
+  width: 100%;
+  height: auto;
+  border-top: 1upx solid #ededed;
+  overflow: auto;
+}
+.userH {
+  width: 80%;
+  height: auto;
+  display: flex;
+  flex: 1;
+  flex-wrap: wrap;
+  padding: 20upx;
+}
+.userMe {
+  width: 95%;
+  height: auto;
+  display: flex;
+  flex: 1;
+  flex-wrap: wrap;
+  padding: 20upx;
+  justify-content: flex-start;
+  flex-direction: row-reverse;
+  text-align: right;
+}
+.userImg {
+  width: 70upx;
+  height: 70upx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-right: 15upx;
+  margin-left: 15upx;
+}
+.userImg > image {
+  width: 65upx;
+  height: 65upx;
+  border-radius: 100%;
+}
+.userType {
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  padding: 10upx;
+}
+.userN {
+  height: 50upx;
+  display: flex;
+  justify-content: space-around;
+}
+.userN > text {
+  height: 50upx;
+  min-height: 100upx;
+  color: #666;
+}
+.textType {
+  max-width: 400upx;
+  background-color: #ffffff;
+  border-radius: 10upx;
+  box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 10upx;
+}
+.textType > text {
+  font-size: 28upx;
+  color: #666;
+}
+.imgType {
+  max-width: 300upx;
+  max-height: 420upx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #ffffff;
+  border-radius: 20upx;
+  box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
+}
+.imgType > image {
+  width: 250upx;
+  height: 350upx;
+  padding: 20upx;
+}
+.videoType {
+  width: 300upx;
+  height: 400upx;
+  display: flex;
+  background-color: #ffffff;
+  border-radius: 20upx;
+  box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
+  align-items: center;
+  justify-content: center;
+  padding: 10upx;
+}
+.videoType > video {
+  width: 270upx;
+  height: 370upx;
+}
+.userInput {
+  height: 100upx;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: 0 10upx;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  box-shadow: 0 0 5upx 0 #e3e3e3;
+}
+.userInput > input {
+  height: 50upx;
+  background: #f4f5f6;
+  border-radius: 15upx;
+  padding: 10upx 10upx;
+  flex: 1;
+  margin-right: 20upx;
+  font-size: 28upx;
+}
+.userInput > view {
+  width: 120upx;
+  font-size: 24upx;
+  color: #ffffff;
+  height: 60upx;
+  background-color: #18c7f2;
+  border-radius: 20upx;
+  text-align: center;
+  line-height: 60upx;
+}
 </style>
diff --git a/pages_read_circle/pages/personal/Mynotice.vue b/pages_read_circle/pages/personal/Mynotice.vue
index 393f68956b91431f283be60bd6ebb3cb166a9af5..1532c0a8863adf3af310b574adcfe95251b96d52 100644
--- a/pages_read_circle/pages/personal/Mynotice.vue
+++ b/pages_read_circle/pages/personal/Mynotice.vue
@@ -1,33 +1,55 @@
 <template>
 	<view>
-		<!-- 头部 -->
+		<!-- 顶部 -->
+		<u-navbar zhead="65rpx" height="44" title="消息" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<view class="top">
 			<navigator url="/pages_read_circle/pages/personal/XiTonMessage">
-			<view class="topone">
-				<view class="top_one_ima"><image src="../../static/images/ring_white.png" style="width: 60rpx;height: 60rpx;"></image></view>
-				<view class="top_one_wz">系统消息</view>
-				<view class="genduo">
-					<image class="image" src="../../static/images/more.png" style="width: 30rpx;height: 30rpx;"></image>
+				<view class="topone">
+					<view class="top_one_ima">
+						<image src="/static/images/ring_white.png" style="width: 60rpx; height: 60rpx"></image>
+					</view>
+					<view v-show="type0" style="margin-left: -20rpx;margin-top: 20rpx;">
+						<image src="/static/images/WD.png" style="width: 25rpx; height: 25rpx"></image>
+					</view>
+					<view class="top_one_wz">系统消息</view>
+					<view class="genduo">
+						<image class="image" src="/static/images/more.png" style="width: 25rpx; height: 25rpx"></image>
+					</view>
 				</view>
-			</view>
 			</navigator>
 			<navigator url="BandR_notice">
-			<view class="topone">
-				<view class="top_one_ima"><image src="../../static/images/ring_white.png" style="width: 60rpx;height: 60rpx;"></image></view>
-				<view class="top_one_wz">借还消息</view>
-				<view class="genduo">
-					<image class="image" src="../../static/images/more.png" style="width: 30rpx;height: 30rpx;"></image>
+				<view class="topone">
+					<view class="top_one_ima">
+						<image src="/static/images/ring_white.png" style="width: 60rpx; height: 60rpx"></image>
+					</view>
+					<view v-show=type1 style="margin-left: -20rpx;margin-top: 20rpx;">
+						<image src="/static/images/WD.png" style="width: 25rpx; height: 25rpx"></image>
+					</view>
+					<view class="top_one_wz">借还消息</view>
+					<view class="genduo">
+						<image class="image" src="/static/images/more.png" style="width: 25rpx; height: 25rpx"></image>
+					</view>
 				</view>
-			</view>
 			</navigator>
 			<navigator url="Shejiao_notice">
-			<view class="topone">
-				<view class="top_one_ima"><image src="../../static/images/ring_white.png" style="width: 60rpx;height: 60rpx;"></image></view>
-				<view class="top_one_wz">社交消息</view>
-				<view class="genduo">
-					<image class="image" src="../../static/images/more.png" style="width: 30rpx;height: 30rpx;"></image>
+				<view class="topone">
+					<view class="top_one_ima">
+						<image src="/static/images/ring_white.png" style="width: 60rpx; height: 60rpx"></image>
+					</view>
+					<view v-show=type2 style="margin-left: -20rpx;margin-top: 20rpx;">
+						<image src="/static/images/WD.png" style="width: 25rpx; height: 25rpx"></image>
+					</view>
+					<view class="top_one_wz">社交消息</view>
+					<view class="genduo">
+						<image class="image" src="/static/images/more.png" style="width: 25rpx; height: 25rpx"></image>
+					</view>
 				</view>
-			</view>
 			</navigator>
 		</view>
 		<!-- 分割线 -->
@@ -35,170 +57,303 @@
 		<!-- 中间 客服 -->
 		<view class="mid">
 			<navigator url="serve_chat">
-			<view class="midone">
-				<view class="mid_one_ima"><image src="../../static/images/service_woman.png"style="width: 90rpx;height: 70rpx;"></image></view>
-				<view class="mid_one_wz">书易客服</view>
-				<view class="mid_one_time">1天前</view>
-				<view class="mid_one_xx">好的</view>
-			</view>
+				<view class="midone">
+					<view class="mid_one_ima">
+						<image src="/static/images/service_woman.png" style="width: 90rpx; height: 70rpx"></image>
+					</view>
+					<view class="mid_one_wz">书易客服</view>
+					<view class="mid_one_time">1天前</view>
+					<view class="mid_one_xx">好的</view>
+				</view>
 			</navigator>
 			<navigator url="Lib_ser_chat">
-			<view class="midone">
-				<view class="mid_one_ima"><image src="../../static/images/service_woman.png"style="width: 90rpx;height: 70rpx;"></image></view>
-				<view class="mid_one_wz">图书馆客服</view>
-				<view class="mid_one_time">2天前</view>
-				<view class="mid_one_xx">好的</view>
-			</view>
+				<view class="midone">
+					<view class="mid_one_ima">
+						<image src="/static/images/service_woman.png" style="width: 90rpx; height: 70rpx"></image>
+					</view>
+					<view class="mid_one_wz">图书馆客服</view>
+					<view class="mid_one_time">2天前</view>
+					<view class="mid_one_xx">好的</view>
+				</view>
 			</navigator>
-			
 		</view>
 		<!-- 底部  好友消息 -->
-		<view class="under">
+		<!--<view class="under">
 			<navigator url="unChat">
-			<view class="underone">
-				<view class="under_one_ima"><image src="../../static/images/头像3.jpg"style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image></view>
-				<view class="under_one_imaWD"><image src="../../static/images/WD.png"style="width: 30rpx;height: 30rpx;" ></image></view>
-				<view class="under_one_wz">上官微软</view>
-				<view class="under_one_time">9天前</view>
-				<view class="under_one_xx">好的</view>
-			</view>
+				<view class="underone">
+					<view class="under_one_ima">
+						<image src="/static/images/QQ.png" style="width: 90rpx; height: 90rpx; border-radius: 50%"></image>
+					</view>
+					<view v-show=false class="under_one_imaWD">
+						<image src="/static/images/WD.png" style="width: 25rpx; height: 25rpx"></image>
+					</view>
+					<view class="under_one_wz">上官微软</view>
+					<view class="under_one_time">9天前</view>
+					<view class="under_one_xx">好的</view>
+				</view>
 			</navigator>
-		</view>
-		
+		</view>-->
+
 		<!-- 联系图书持有人 -->
 		<view class="under">
-			<navigator url="unChat">
-			<view class="underone">
-				<view class="under_one_ima"><image src="../../static/images/图书持有人头像.jpg"style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image></view>
-				<view class="under_one_imaWD"><image src="../../static/images/WD.png"style="width: 30rpx;height: 30rpx;" ></image></view>
-				<view class="under_one_wz">图书持有人</view>
-				<view class="under_one_time">10天前</view>
-				<view class="under_one_xx">我可能下个周才看完，看完才可以还书哟</view>
-			</view>
+			<navigator :url="`unChat?readerId=${(getAdverseReader(chat)).readerId}`" v-for="(chat,index) in chatList">
+				<view class="under_item">
+          <view class="under_item_header">
+            <u-badge v-if="!chat.status" type="error" count="7" :offset="[0,0]" :is-dot="true"></u-badge>
+            <u-avatar :src="(getAdverseReader(chat)).avatar" :size="80"></u-avatar>
+          </view>
+          <view class="under_item_content">
+            <view>{{(getAdverseReader(chat)).nickname}}</view>
+            <view class="under_item_content_info">{{chat.content || ""}}</view>
+          </view>
+          <view class="under_item_time">
+            <view >{{$u.timeFrom(chat.time)}}</view>
+          </view>
+
+
+
+					<!--<view class="under_one_ima">
+						<image :src="item.reader.avatar" style="width: 90rpx; height: 90rpx; border-radius: 50%"></image>
+					</view>
+					<view v-show=true class="under_one_imaWD">
+						<image src="/static/images/WD.png" style="width: 25rpx; height: 25rpx"></image>
+					</view>
+					<view class="under_one_wz">{{item.reader.nickname}}</view>
+					<view class="under_one_time">{{$u.timeFrom(item.message.time)}}</view>
+					<view class="under_one_xx">我可能下个周才看完，看完才可以还书哟</view>-->
+				</view>
 			</navigator>
 		</view>
 	</view>
 </template>
 
 <script>
-export default {
-	data() {
-		return {};
-	},
-	methods: {}
-};
+	import DateTools from '../../../tools/prototypeTools/DateTools.js'
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
+	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+				type0:false,
+				type1:false,
+				type2:false,
+        chatList:[],//读者消息列表，所有与当前读者有聊天记录的读者，并且包含最后一条记录的消息
+			};
+		},
+		computed: {
+			...mapState(["token", "userinfo"])
+		},
+		onShow() {
+      this.queryMessageType();
+			app.myRequest({
+        url:"readerChat/queryByReaderList",
+        type:"GET"
+      }).then(res=>{
+        if(res.length) this.chatList = res;
+      })
+		},
+		methods: {
+			async queryMessageType() {
+				var that = this;
+				let rid = parseInt(that.userinfo.readerId)
+				var params = {
+					url:"systemMessage/queryMessageTypeNum",
+					type: "GET",
+					data: {
+						readerId:rid
+					},
+				};
+				const res = await app.myRequest(params);
+				console.log("系统消息数量：",res)
+				if(res.type0>0){
+					that.type0 = true
+				}else{
+					that.type0 = false
+				}
+				if(res.type1>0){
+					that.type1 = true
+				}else{
+					that.type1 = false
+				}
+				if(res.type2>0){
+					that.type2 = true
+				}else{
+					that.type2 = false
+				}
+			},
+      getAdverseReader(chat){
+			  if(chat.toReader.readerId === this.userinfo.readerId){
+			    return chat.fromReader
+        }else {
+          return chat.toReader
+        }
+      }
+		},
+	};
 </script>
 
-<style>
-.top {
-	width: 100%;
-	height: auto;
-	/* background-color: #007AFF; */
-}
-.topone {
-	width: auto;
-	height: 100rpx;
-	display: flex;
-	border-bottom: 1rpx solid #f1f1f1;
-}
-.top_one_ima {
-	margin-left: 20rpx;
-	margin-top: 20rpx;
-}
+<style lang="scss" scoped>
+.under{
+  &_item{
+    width: 100%;
+    height: 150rpx;
+    align-items: center;
+    display: flex;
+    padding: 20rpx 54rpx 20rpx 20rpx;
+    border-bottom: 1rpx solid #f1f1f1;
 
-.top_one_wz {
-	font-size: 30rpx;
-	margin-left: 40rpx;
-	margin-top: 30rpx;
-}
-.genduo {
-	margin-left: 460rpx;
-	margin-top: 30rpx;
+    &_header{
+      position: relative;
+      margin-right: 40rpx;
+    }
+    &_content{
+      flex: 1;
+
+      &_info{
+        color: #999999;
+        font-size: 22rpx;
+      }
+    }
+    &_time{
+      color: #bbbbbb;
+      font-size: 22rpx;
+      height: 100%;
+    }
+  }
 }
-.br2 {
+
+
+	.top {
+		width: 100%;
+		height: auto;
+		/* background-color: #007AFF; */
+	}
+
+	.topone {
+		width: auto;
+		height: 100rpx;
+		display: flex;
+		border-bottom: 1rpx solid #f1f1f1;
+	}
+
+	.top_one_ima {
+		margin-left: 20rpx;
+		margin-top: 20rpx;
+	}
+
+	.top_one_wz {
+		font-size: 30rpx;
+		margin-left: 40rpx;
+		margin-top: 30rpx;
+	}
+
+	.genduo {
+		margin-left: 460rpx;
+		margin-top: 30rpx;
+	}
+
+	.br2 {
 		width: 100%;
 		height: 30rpx;
-		background-color: #F5F5F5;
+		background-color: #f5f5f5;
+	}
+
+	.mid {
+		width: 100%;
+		height: auto;
+	}
+
+	.midone {
+		width: auto;
+		height: 150rpx;
+		display: flex;
+		border-bottom: 1rpx solid #f1f1f1;
+	}
+
+	.mid_one_ima {
+		margin-left: 20rpx;
+		margin-top: 40rpx;
+	}
+
+	.mid_one_wz {
+		font-size: 30rpx;
+		margin-left: 35rpx;
+		margin-top: 40rpx;
+		/* background-color: #333333; */
+		width: 60%;
+		height: 40rpx;
+	}
+
+	.mid_one_xx {
+		font-size: 25rpx;
+		color: #999999;
+		margin-left: -550rpx;
+		margin-top: 85rpx;
+		height: 50rpx;
+		/* background-color: #4CD964; */
+	}
+
+	.mid_one_time {
+		font-size: 25rpx;
+		color: #bbbbbb;
+		margin-left: 40rpx;
+		margin-top: 40rpx;
+		/* background-color: #007AFF; */
+		height: 40rpx;
+	}
+
+	.under {
+		width: 100%;
+		height: auto;
+	}
+
+	.underone {
+		width: auto;
+		height: 150rpx;
+		display: flex;
+		border-bottom: 1rpx solid #f1f1f1;
+	}
+
+	.under_one_ima {
+		margin-left: 20rpx;
+		margin-top: 30rpx;
+	}
+
+	.under_one_imaWD {
+		margin-left: -30rpx;
+		margin-top: 20rpx;
+	}
+
+	.under_one_wz {
+		font-size: 30rpx;
+		margin-left: 35rpx;
+		margin-top: 40rpx;
+		/* background-color: #333333; */
+		width: 60%;
+		height: 40rpx;
+	}
+
+	.under_one_xx {
+		font-size: 25rpx;
+		color: #999999;
+		margin-left: -550rpx;
+		margin-top: 85rpx;
+		height: 50rpx;
+		/* background-color: #4CD964; */
+	}
+
+	.under_one_time {
+		font-size: 25rpx;
+		color: #bbbbbb;
+		margin-left: 40rpx;
+		margin-top: 40rpx;
+		/* background-color: #007AFF; */
+		height: 40rpx;
 	}
-.mid{
-	width: 100%;
-	height: auto;
-}
-.midone{
-	width: auto;
-	height: 150rpx;
-	display: flex;
-	border-bottom: 1rpx solid #f1f1f1;
-}
-.mid_one_ima {
-	margin-left: 20rpx;
-	margin-top: 40rpx;
-}
-.mid_one_wz {
-	font-size: 30rpx;
-	margin-left:35rpx;
-	margin-top: 40rpx;
-	/* background-color: #333333; */
-	width: 60%;
-	height: 40rpx;
-}
-.mid_one_xx{
-	font-size: 25rpx;
-	color: #999999;
-	margin-left: -550rpx;
-	margin-top: 85rpx;
-	height: 50rpx;
-	/* background-color: #4CD964; */
-}
-.mid_one_time{
-	font-size: 25rpx;
-	color: #BBBBBB;
-	margin-left: 40rpx;
-	margin-top: 40rpx;
-	/* background-color: #007AFF; */
-	height: 40rpx;
-}
-.under{
-	width: 100%;
-	height: auto;
-}
-.underone{
-	width: auto;
-	height: 150rpx;
-	display: flex;
-	border-bottom: 1rpx solid #f1f1f1;
-}
-.under_one_ima {
-	margin-left: 20rpx;
-	margin-top: 30rpx;
-}
-.under_one_imaWD {
-	
-	margin-left: -30rpx;
-	margin-top: 20rpx;
-}
-.under_one_wz {
-	font-size: 30rpx;
-	margin-left:35rpx;
-	margin-top: 40rpx;
-	/* background-color: #333333; */
-	width: 60%;
-	height: 40rpx;
-}
-.under_one_xx{
-	font-size: 25rpx;
-	color: #999999;
-	margin-left: -550rpx;
-	margin-top: 85rpx;
-	height: 50rpx;
-	/* background-color: #4CD964; */
-}
-.under_one_time{
-	font-size: 25rpx;
-	color: #BBBBBB;
-	margin-left: 40rpx;
-	margin-top: 40rpx;
-	/* background-color: #007AFF; */
-	height: 40rpx;
-}
 </style>
diff --git a/pages_read_circle/pages/personal/Shejiao_notice.vue b/pages_read_circle/pages/personal/Shejiao_notice.vue
index 55c3b194bec1afc7605d9257921a927388632a0f..7138eccf7288fea8e0ea392888bfaf546ea2d787 100644
--- a/pages_read_circle/pages/personal/Shejiao_notice.vue
+++ b/pages_read_circle/pages/personal/Shejiao_notice.vue
@@ -1,64 +1,116 @@
 <template>
-	<view class="all">
-		<view class="top">
-			<view class="wz">
-				<text>黄蓉已同意您的好友申请</text>
-			</view>
-			<view class="time">2017-10-08</view>
-			<view class="imaWD"><image src="../../static/images/WD.png"style="width: 18rpx;height: 18rpx; border-radius: 100%;" ></image></view>
-		</view>
-		<view class="top">
-			<view class="wz">
-				<text>郭靖请求添加您为好友</text>
-			</view>
-			<view class="time">2017-10-08</view>
-			<view class="imaWD"><image src="../../static/images/WD.png"style="width: 18rpx;height: 18rpx; border-radius: 100%;" ></image></view>
-		</view>
-		<view class="top">
-			<view class="wz">
-				<text>邓俊如已同意您的好友申请</text>
-			</view>
-			<view class="time">2017-10-08</view>
-		</view>	
-	</view>
+	<view>
+    <!-- 标题 -->
+    <u-navbar zhead="65rpx" height="44" title="社交消息" title-color="white" title-size="40" :background="background"
+              back-icon-color="white" back-icon-size="50">
+      <view class="navbar-right" slot="right">
+        <view class="right_list" @click="bindInBatch">
+        </view>
+      </view>
+    </u-navbar>
+    <view class="all">
+      <view class="top" v-for="(item,index) in list" :key=index>
+        <view class="wz">
+          <text>{{item.content}}</text>
+        </view>
+        <view class="time" v-text="$s.formatDate(item.message_time)"></view>
+        <view class="imaWD" v-show="!item.status">
+          <image src="/static/images/WD.png" style="width: 18rpx; height: 18rpx; border-radius: 100%"></image>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
 		data() {
 			return {
-				
-			}
+        background: {
+          background: "#6C40F3",
+        },
+				list:[]
+			};
 		},
+
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
+
+		onLoad() {
+			this.getDate();
+			this.updataStatus();
+		},
+
 		methods: {
-			
-		}
-	}
+				//获取数据
+				async getDate() {
+					var that = this;
+					let rid = parseInt(that.userinfo.readerId)
+					var params = {
+						url: "systemMessage/queryMessageType",
+						type: "GET",
+						data: {
+							readerId:rid,
+							type:2
+						},
+					};
+					const res = await app.myRequest(params);
+					console.log("+++后台数据：",res);
+					that.list = res
+				},
+				//更新已读
+				async updataStatus() {
+					var that = this;
+					let rid = parseInt(that.userinfo.readerId)
+					var params = {
+						url: "systemMessage/updateStatus",
+						type: "POST",
+						data: {
+							readerId:rid,
+							type:2
+						},
+					};
+					const res = await app.myRequest(params);
+					console.log("+++后台数据：",res);
+				},
+
+			},
+
+	};
 </script>
 
 <style>
-.all{
-	margin-top: 30rpx;
-	background-color: #FFFFFF;
-}
-.top{
-	height: 100rpx;
-	border: 1rpx solid #F4F4F5;
-}
-.wz{
-	margin-top: 30rpx;
-	font-size: 32rpx;
-	margin-left: 40rpx;
-}
-.time{
-	font-size: 28rpx;
-	margin-top: -35rpx;
-	margin-left: 570rpx;
-	color: #999999;
-	/* background-color: #007AFF; */
-}
-.imaWD{
-	margin-top: -75rpx;
-	margin-left: 30rpx;
-}
+	.all {
+		margin-top: 30rpx;
+		background-color: #ffffff;
+	}
+
+	.top {
+		height: 130rpx;
+		border: 1rpx solid #f4f4f5;
+	}
+
+	.wz {
+		margin-top: 30rpx;
+		font-size: 32rpx;
+		margin-left: 40rpx;
+	}
+
+	.time {
+		margin-top: -40rpx;
+		margin-left: 570rpx;
+		color: #999999;
+		/* background-color: #007AFF; */
+	}
+
+	.imaWD {
+		margin-top: -100rpx;
+		margin-left: 30rpx;
+	}
 </style>
diff --git a/pages_read_circle/pages/personal/XiTonMessage.vue b/pages_read_circle/pages/personal/XiTonMessage.vue
index 1b9aeb99a03a2fd171271a8b80f9b12c95b5269d..17a3231a5c515b1bf68ff87c42098e4969abf66a 100644
--- a/pages_read_circle/pages/personal/XiTonMessage.vue
+++ b/pages_read_circle/pages/personal/XiTonMessage.vue
@@ -1,170 +1,222 @@
 <template>
 	<view>
-		<view class="top">
-			<view class="topone">
-				<view class="top_one_ima"><image class="topima" src="../../static/images/ring_white.png" style="width: 60rpx;height: 60rpx;"></image></view>
-				<view class="top_one_wz">2017-10-08</view>
-				<view class="top_one_time">15:32:21</view>
-				<view class="zw"><text>系统更新系哈哈哈哈哈哈哈哈哈哈哈哈姐姐南面西南合成公式是不锈钢的运动会哈哈哈哈哈哈哈哈</text></view>
-			<!-- <view class="imaWD"><image src="../../static/images/WD.png"style="width: 18rpx;height: 18rpx; border-radius: 100%;" ></image></view> -->
-			</view>
-			
-			<!-- 回复 -->
-			<view class="toptwo">
-				<view class="huifu">
-					<image class="one" src="../../static/images/huifu.png"></image>
-					<text id="tone">回复</text>
-				</view>
-				<view class="sc">
-					<image class="two" src="/static/images/SC.png" style="width: 38rpx;height: 36rpx;"></image>
-					<text id="ttwo">删除</text>
-				</view>
-				<view class="imaWD"><image src="../../static/images/WD.png"style="width: 18rpx;height: 18rpx; border-radius: 100%;" ></image></view>
-			</view>
-		</view>
-		
-		<view class="top">
-			<view class="topone">
-				<view class="top_one_ima"><image class="topima" src="../../static/images/ring_white.png" style="width: 60rpx;height: 60rpx;"></image></view>
-
-				<view class="top_one_wz">2017-10-08</view>
-				<view class="top_one_time">15:32:21</view>
-				<view class="zw"><text>系统更新系哈哈哈哈哈哈哈哈哈哈哈哈姐姐南面西南合成公式是不锈钢的运动会哈哈哈哈哈哈哈哈</text></view>
-			</view>
-			<!-- 回复 -->
-			<view class="toptwo">
-				<view class="huifu">
-					<image class="one" src="../../static/images/huifu.png"></image>
-					<text id="tone">回复</text>
-				</view>
-				<view class="sc">
-					<image class="two" src="/static/images/SC.png" style="width: 38rpx;height: 36rpx;"></image>
-					<text id="ttwo">删除</text>
+		<!-- 标题 -->
+		<u-navbar zhead="65rpx" height="44" title="系统消息" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
 				</view>
-				<view class="imaWD"><image src="../../static/images/WD.png"style="width: 18rpx;height: 18rpx; border-radius: 100%;" ></image></view>
 			</view>
-		</view>
-		
-		<view class="top">
+		</u-navbar>
+		<view class="top" v-for="(item,index) in list" :key=index>
 			<view class="topone">
-				<view class="top_one_ima"><image class="topima" src="../../static/images/ring_white.png" style="width: 60rpx;height: 60rpx;"></image></view>
-		
-				<view class="top_one_wz">2017-10-08</view>
-				<view class="top_one_time">15:32:21</view>
-				<view class="zw"><text>系统更新系哈哈哈哈哈哈哈哈哈哈哈哈姐姐南面西南合成公式是不锈钢的运动会哈哈哈哈哈哈哈哈</text></view>
+				<view class="wd1">
+					<view class="top_one_ima">
+						<image class="topima" src="/static/images/ring_white.png" style="width: 60rpx; height: 60rpx"></image>
+					</view>
+					<view class="wd" v-show="!item.status">
+						<image  src="/static/images/WD.png"style="width: 18rpx;height: 18rpx; border-radius: 100%;" ></image>
+					</view>
+				</view>	
+				<view class="wd"></view>
+				<view class="top_one_wz" v-text="formatDate(item.message_time)"></view>
+				<view class="zw"><text>{{item.content}}</text></view>
 			</view>
-			<!-- 回复 -->
+			<!-- 详情 -->
 			<view class="toptwo">
 				<view class="huifu">
-					<image class="one" src="../../static/images/huifu.png"></image>
-					<text id="tone">回复</text>
+					<image class="one" src="/static/images/huifu.png"></image>
+					<text id="tone">详情</text>
 				</view>
 				<view class="sc">
-					<image class="two" src="/static/images/SC.png" style="width: 38rpx;height: 36rpx;"></image>
+					<image class="two" src="/static/images/SC.png" style="width: 38rpx; height: 36rpx"></image>
 					<text id="ttwo">删除</text>
 				</view>
-				<!-- <view class="imaWD"><image src="../../static/images/WD.png"style="width: 18rpx;height: 18rpx; border-radius: 100%;" ></image></view> -->
 			</view>
 		</view>
 	</view>
 </template>
 
 <script>
-export default {
-	data() {
-		return {};
-	},
-	methods: {}
-};
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
+	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+				list:[]
+			};
+		},
+		
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
+		
+		onLoad() {
+			this.getDate();
+			this.updataStatus();
+		},
+		methods: {
+			//获取数据
+			async getDate() {
+				var that = this;
+				let rid = parseInt(that.userinfo.readerId)
+				var params = {
+					url: "systemMessage/queryMessageType",
+					type: "GET",
+					data: {
+						readerId:rid,
+						type:0
+					},
+				};
+				const res = await app.myRequest(params);
+				console.log("+++后台数据：",res);
+				that.list = res
+			},
+			//更新已读
+			async updataStatus() {
+				var that = this;
+				let rid = parseInt(that.userinfo.readerId)
+				var params = {
+					url: "systemMessage/updateStatus",
+					type: "POST",
+					data: {
+						readerId:rid,
+						type:0
+					},
+				};
+				const res = await app.myRequest(params);
+				console.log("+++后台数据：",res);
+			},
+			//日期转换方法
+			formatDate(value) {
+				let date = new Date(value);
+				let y = date.getFullYear();
+				let MM = date.getMonth() + 1;
+				MM = MM < 10 ? ('0' + MM) : MM;
+				let d = date.getDate();
+				d = d < 10 ? ('0' + d) : d;
+				let h = date.getHours();
+				h = h < 10 ? ('0' + h) : h;
+				let m = date.getMinutes();
+				m = m < 10 ? ('0'+ m) : m;
+				let s = date.getSeconds();
+				s = s < 10 ? ('0' + s) : s;
+				return y + '-' + MM + '-' + d+'    '+h+':'+m ;
+			},
+		},
+	};
 </script>
 
 <style>
-.top {
-	height: auto;
-	/* margin-top: 0rpx; */
-	/* box-shadow: #C0C0C0 0rpx 0rpx 0rpx 5rpx; */
-}
-.topone {
-	height: auto;
-}
-.topima {
-	margin-top: 20rpx;
-	margin-left: 60rpx;
-	/* background-color: #007AFF; */
-}
-.imaWD {
-	width: 20rpx;
-	margin-top: -360rpx;
-	margin-left: -600rpx;
-	/* background-color: #007AFF; */
-}
-.top_one_wz {
-	font-size: 25rpx;
-	color: #999999;
-	margin-left: 150rpx;
-	margin-top: -60rpx;
-}
-.top_one_time {
-	font-size: 25rpx;
-	color: #999999;
-	margin-left: 320rpx;
-	margin-top: -33rpx;
-}
-.zw {
-	height: auto;
-	margin-top: 30rpx;
-	line-height: 40rpx;
-	margin-left: 25rpx;
-	margin-right: 20rpx;
-	color: #333333;
-	font-size: 30rpx;
-	/* font-weight: 500; */
-	/* 首行缩进 */
-	text-indent: 2em;
-}
-.toptwo {
-	display: flex;
-	border: 2rpx solid #f1f1f1;
-	background-color: #ffffff;
-	border-top: none;
-	height: 80rpx;
-	align-items: center;
-}
-
-.one {
-	height: 35rpx;
-	width: 30rpx;
-	padding-top: 15rpx;
-	margin-top: 50rpx;
-}
-.two {
-	height: 40rpx;
-	width: 60rpx;
-	padding-top: 10rpx;
-	margin-top: 50rpx;
-}
-
-.huifu {
-	margin-left: 450rpx;
-	display: flex;
-	margin-bottom: 40rpx;
-}
-
-.sc {
-	margin-left: 50rpx;
-	display: flex;
-	margin-bottom: 40rpx;
-}
-#tone {
-	font-size: 25rpx;
-	color: #bbbbbb;
-	margin-left: 5rpx;
-	margin-top: 60rpx;
-}
-#ttwo {
-	font-size: 25rpx;
-	color: #ff0000;
-	margin-left: 0rpx;
-	margin-top: 60rpx;
-}
+	.top {
+		height: auto;
+		/* margin-top: 0rpx; */
+		/* box-shadow: #C0C0C0 0rpx 0rpx 0rpx 5rpx; */
+	}
+
+	.wd{
+		margin-left: -55rpx;
+	}
+	
+	.wd1{
+		display: flex;
+	}
+
+	.topone {
+		height: auto;
+	}
+
+	.topima {
+		margin-top: 20rpx;
+		margin-left: 30rpx;
+		/* background-color: #007AFF; */
+	}
+
+	.imaWD {
+		width: 20rpx;
+		margin-top: -360rpx;
+		margin-left: -600rpx;
+		/* background-color: #007AFF; */
+	}
+
+	.top_one_wz {
+		font-size: 25rpx;
+		color: #999999;
+		margin-left: 120rpx;
+		margin-top: -60rpx;
+	}
+
+	.top_one_time {
+		font-size: 25rpx;
+		color: #999999;
+		margin-left: 320rpx;
+		margin-top: -33rpx;
+	}
+
+	.zw {
+		height: auto;
+		margin-top: 30rpx;
+		line-height: 40rpx;
+		margin-right: 20rpx;
+		color: #333333;
+		font-size: 30rpx;
+		/* font-weight: 500; */
+		/* 首行缩进 */
+		text-indent: 2em;
+	}
+
+	.toptwo {
+		display: flex;
+		border: 2rpx solid #f1f1f1;
+		background-color: #ffffff;
+		border-top: none;
+		height: 80rpx;
+		align-items: center;
+	}
+
+	.one {
+		height: 35rpx;
+		width: 30rpx;
+		padding-top: 15rpx;
+		margin-top: 50rpx;
+	}
+
+	.two {
+		height: 40rpx;
+		width: 60rpx;
+		padding-top: 10rpx;
+		margin-top: 50rpx;
+	}
+
+	.huifu {
+		margin-left: 450rpx;
+		display: flex;
+		margin-bottom: 40rpx;
+	}
+
+	.sc {
+		margin-left: 50rpx;
+		display: flex;
+		margin-bottom: 40rpx;
+	}
+
+	#tone {
+		font-size: 25rpx;
+		color: #bbbbbb;
+		margin-left: 5rpx;
+		margin-top: 60rpx;
+	}
+
+	#ttwo {
+		font-size: 25rpx;
+		color: #ff0000;
+		margin-left: 0rpx;
+		margin-top: 60rpx;
+	}
 </style>
diff --git a/pages_read_circle/pages/personal/personal_home.vue b/pages_read_circle/pages/personal/personal_home.vue
index 6c5a76bf94bca21e268ad70b783f3d3c5bd3a1c3..96b0ff9c4e9bb704adbe86492cbeffc884cb7758 100644
--- a/pages_read_circle/pages/personal/personal_home.vue
+++ b/pages_read_circle/pages/personal/personal_home.vue
@@ -2,176 +2,236 @@
 	<view>
 		<view class="tq"></view>
 		<view class="tab" style="width: 100%; height: 90rpx;">
-			<image @click="back" class="back" src="../../static/images/向左箭头.二级.返回@2x.png" style="width: 64rpx; height: 64rpx;"></image>
+			<image @click="back" class="back" src="/static/images/turn_left_two_return2x.png" style="width: 64rpx; height: 64rpx;"></image>
 			<view class="tit2">我的主页</view>
-			<navigator url="../Setup/Setup">
-			<image class="shua1" src="../../static/images/address_book_one.png" style="width: 45rpx; height: 45rpx;"></image>
+			<navigator url="/pages/Setup/sysSet">
+				<image class="shua1" src="/static/images/address_book_one.png" style="width: 45rpx; height: 45rpx;"></image>
 			</navigator>
-			<navigator url="../myinfomation/myinfomation">
-			<image class="shua1" src="../../static/images/address_book_compile.png" style="width: 40rpx; height: 40rpx;"></image>
+			<navigator url="/pages/Setup/Setup">
+				<image class="shua1" src="/static/images/address_book_compile.png" style="width: 40rpx; height: 40rpx;"></image>
 			</navigator>
 		</view>
 		<view class="top">
-			<view class="tou"><image class="topimage" src="../../static/images/头像2.jpg" style="width: 155rpx;height: 155rpx;border-radius: 50%;"></image></view>
+			<view class="tou">
+				<image class="topimage" :src="readerInfo.reader.avatar" style="width: 155rpx;height: 155rpx;border-radius: 50%;"></image>
+			</view>
 			<view class="dj">
-				<view class="vip">LV.11</view>
-				<view class="denji">书圣</view>
+				<view class="vip">LV.{{readerInfo.max}}</view>
+				<view class="denji">{{readerInfo.name}}</view>
 			</view>
 		</view>
 		<view class="one">
 			<view class="title">个性签名</view>
 		</view>
 		<view class="two">
-			<view class="gq">所有的胜利，与征服自己的胜利比起来，都是微不足道的。</view>
+			<view class="gq">{{readerInfo.reader.signature}}</view>
 		</view>
 		<view class="one">
 			<view class="title">借还历史</view>
 		</view>
 		<navigator url="/pages_borrow_books/pages/borrow_and_return/borrow_and_return">
-		<view class="mid">
-			<view class="imgs">
-				<image class="img" src="../../static/images/书1.jpg" style="width: 220rpx; height: 240rpx;"></image>
-				<image class="img" src="../../static/images/书3.jpg" style="width: 220rpx; height: 240rpx;"></image>
-				<image class="img" src="../../static/images/书2.jpg" style="width: 220rpx; height: 240rpx;"></image>
+			<view class="mid" v-for="item in recentlyBook">
+				<view class="imgs">
+					<image class="img" :src="item.picture_path" style="width: 180rpx; height: 200rpx;"></image>
+				</view>
 			</view>
-		</view>
 		</navigator>
+		<view v-if="recentlyBook.length==0" class="recentlyBook" @click="toBorrow()">
+			还没有记录，<span style="color: #00AAFF;">快去借书吧!</span>
+		</view>
 		<view class="one">
 			<view class="title">我的心得</view>
 		</view>
 		<navigator url="/pages_read_circle/pages/index/MyExperience">
-		<view class="below">
-			<view class="belowone">
-				<view class="note">
-					<view class="notetitle">
-						《学习心得》
+			<view class="below">
+				<view class="belowone">
+					<view class="note">
+						<view class="notetitle">
+							《学习心得》
+						</view>
+						<view class="time">
+							2020-08-09
+						</view>
 					</view>
-					<view class="time">
-						2020-08-09
+					<view class="nr">
+						三十八度六
 					</view>
 				</view>
-				<view class="nr">
-					三十八度六
-				</view>
-			</view>
-			<view class="br1"></view>
-			<view class="belowone">
-				<view class="note">
-					<view class="notetitle">
-						《学习心得》
+				<view class="br1"></view>
+				<view class="belowone">
+					<view class="note">
+						<view class="notetitle">
+							《学习心得》
+						</view>
+						<view class="time">
+							2020-08-09
+						</view>
 					</view>
-					<view class="time">
-						2020-08-09
+					<view class="nr">
+						三十八度六
 					</view>
 				</view>
-				<view class="nr">
-					三十八度六
-				</view>
 			</view>
-		</view>
 		</navigator>
 	</view>
 </template>
 <script>
+	let app = getApp();
+	import {
+		mapState,
+		mapMutations
+	} from 'vuex'
 	export default {
 		data() {
 			return {
-				
+				readerInfo: {}, //读者信息
+				recentlyBook: [], //最近读的
 			}
 		},
+		computed: {
+			...mapState(["token", "userinfo"]),
+		},
+		onLoad(e) {
+			console.log("读者id:",e)
+			let id = parseInt(e.id);
+			this.getInfo(id);
+		},
 		methods: {
-			back(){
+			//获取信息
+			async getInfo(id) {
+				var that = this;
+				var params = {
+					url: "reader/personal",
+					type: 'GET',
+					data: {
+						readerId: id
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log(res)
+				that.readerInfo = res.readerInfo;
+				that.recentlyBook = res.zjds;
+			},
+			back() {
 				uni.navigateBack({
-					delta:1
+					delta: 1
 				})
+			},
+			toBorrow(){
+				uni.navigateTo({
+				    url: '/pages/classify/classify'
+				});
 			}
 		}
 	}
 </script>
 <style>
-/* 顶部导航条 */
-.tq{
-		height: 80rpx;
-		background-color:#6C40F3;
+	/* 顶部导航条 */
+	.tq {
+		height: 120rpx;
+		background-color: #6C40F3;
 	}
-.tab {
+
+	.tab {
 		display: flex;
-		background-color:#6C40F3;
+		background-color: #6C40F3;
 	}
-.tit2 {
+
+	.tit2 {
 		margin-top: 20rpx;
-		color:#FFFFFF ;
+		color: #FFFFFF;
 		text-align: center;
 		margin-left: 55rpx;
 		/* display: flex; */
 		font-size: 40rpx;
 		width: 65%;
-	
+
 	}
+
 	.back {
 		margin-top: 15rpx;
 		margin-left: 10rpx;
 	}
+
 	.shua1 {
 		margin-top: 28rpx;
 		margin-left: 15rpx;
 
 	}
-/* 头像 */
-.top {
-	height: 270rpx;
-	text-align: center;
-}
-.tou {
-	height: 140rpx;
-	background-color: #6c40f3;
-	/* border: 1rpx solid #f0ad4e; */
-}
-.topimage {
-	margin-top: 50rpx;
-	align-items: center;
-	border: 5rpx solid #ffffff;
-}
-/* 等级 */
-.dj {
-	display: flex;
-	align-items: center;
-	/* background-color: #18B566; */
-}
-.vip {
-	margin-left: 308rpx;
-	color: #f0ad4e;
-	font-size: 25rpx;
-	border-radius: 10rpx;
-	border: 1rpx solid #f0ad4e;
-	height: 35rpx;
-	margin-top: 80rpx;
-	width: 80rpx;
-	align-items: center;
-	/* margin-left: 300rpx; */
-}
-.denji{
-	align-items: center;
-	color: #f0ad4e;
-	font-size: 28rpx;
-	margin-left: 5rpx;
-	margin-top: 80rpx;
-}
-/* 标题 */
-.one {
-	background-color: #f5f5f5;
-	display: flex;
-	height: 60rpx;
-}
-.title {
-	width: 75%;
-	/* background-color: #000000; */
-	font-size: 28rpx;
-	color: #333333;
+
+	/* 头像 */
+	.top {
+		height: 270rpx;
+		text-align: center;
+	}
+
+	.tou {
+		height: 140rpx;
+		background-color: #6c40f3;
+		/* border: 1rpx solid #f0ad4e; */
+	}
+
+	.topimage {
+		margin-top: 50rpx;
+		align-items: center;
+		border: 5rpx solid #ffffff;
+	}
+
+	/* 等级 */
+	.dj {
+		display: flex;
+		align-items: center;
+		/* background-color: #18B566; */
+	}
+
+	.vip {
+		margin-left: 308rpx;
+		color: #f0ad4e;
+		font-size: 25rpx;
+		border-radius: 10rpx;
+		border: 1rpx solid #f0ad4e;
+		height: 35rpx;
+		margin-top: 80rpx;
+		width: 80rpx;
+		align-items: center;
+		/* margin-left: 300rpx; */
+	}
+
+	.denji {
+		align-items: center;
+		color: #f0ad4e;
+		font-size: 28rpx;
+		margin-left: 5rpx;
+		margin-top: 80rpx;
+	}
+
+	/* 标题 */
+	.one {
+		background-color: #f5f5f5;
+		display: flex;
+		height: 60rpx;
+	}
+
+	.title {
+		width: 75%;
+		/* background-color: #000000; */
+		font-size: 28rpx;
+		color: #333333;
+		margin-top: 10rpx;
+		margin-left: 30rpx;
+	}
+
+	.recentlyBook {
+		background-color: #FFFFFF;
+		color: #c3c3c3;
+		font-size: 24rpx;
+		/* margin-top: 10rpx;
 	margin-top: 10rpx;
-	margin-left: 30rpx;
-}
-/* .delate {
+	margin-left: 30rpx; */
+		margin: 10rpx 30rpx;
+	}
+
+	/* .delate {
 	background-color: #000000;
 	display: flex;
 	font-size: 28rpx;
@@ -183,71 +243,83 @@
 	font-size: 28rpx;
 	color: red;
 } */
-.two{
-	/* background-color: #f5f5f5; */
-	display: flex;
-	height: 60rpx;
-}
-.gq {
-	width: 100%;
-	color: #c3c3c3;
-	/* background-color: #000000; */
-	font-size: 24rpx;
-	margin-top: 10rpx;
-	margin-left: 30rpx;
-}
-.mid {
-	background-color: #FFFFFF;
-	height: 260rpx;
-	margin: 10rpx 10rpx;
-}
-.imgs {
-	display: flex;
-	width: 95%;
-	margin-left: 20rpx;
-	margin-top: 10rpx;
-}
-.img {
-	size: 100%;
-	margin: 10rpx 12rpx;
-}
-/* 读书笔记内容 */
-.below{
-	/* margin: 12rpx 12rpx; */
-}
-.belowone{
-	height: 160rpx;
-	/* background-color: #008000; */
-}
-.note{
-	/* margin-top: 50rpx;
+	.two {
+		/* background-color: #f5f5f5; */
+		display: flex;
+		height: 60rpx;
+	}
+
+	.gq {
+		width: 100%;
+		color: #c3c3c3;
+		/* background-color: #000000; */
+		font-size: 24rpx;
+		margin-top: 10rpx;
+		margin-left: 30rpx;
+	}
+
+	.mid {
+		background-color: #FFFFFF;
+		height: 260rpx;
+		margin: 10rpx 10rpx;
+		display: inline-block;
+	}
+
+	.imgs {
+		width: 95%;
+		margin-left: 20rpx;
+		margin-top: 10rpx;
+		/* display: inline-flex; */
+	}
+
+	.img {
+		size: 100%;
+		margin: 10rpx 12rpx;
+	}
+
+	/* 读书笔记内容 */
+	.below {
+		/* margin: 12rpx 12rpx; */
+	}
+
+	.belowone {
+		height: 160rpx;
+		/* background-color: #008000; */
+	}
+
+	.note {
+		/* margin-top: 50rpx;
 	margin-left: 30rpx; */
-	/* background-color: #00BFFF; */
-	display: flex;
-}
-.notetitle{
-	margin-top: 50rpx;
-	margin-left: 30rpx;
-	font-size: 26rpx;
-	/* background-color: #000000; */
-	width: 70%;
-}
-.time{
-	margin-top: 50rpx;
-	margin-left: 15rpx;
-	font-size: 26rpx;
-	color: #E6E6E6;
-}
-.nr{
-	margin-left: 30rpx;
-	margin-top: 10rpx;
-	font-size: 24rpx;
-	color: #999999;
-}
-.br1 {
+		/* background-color: #00BFFF; */
+		display: flex;
+	}
+
+	.notetitle {
+		margin-top: 50rpx;
+		margin-left: 30rpx;
+		font-size: 26rpx;
+		/* background-color: #000000; */
+		width: 70%;
+	}
+
+	.time {
+		margin-top: 50rpx;
+		margin-left: 15rpx;
+		font-size: 26rpx;
+		color: #E6E6E6;
+	}
+
+	.nr {
+		margin-left: 30rpx;
+		margin-top: 10rpx;
+		font-size: 24rpx;
+		color: #999999;
+	}
+
+	.br1 {
 		width: 100%;
 		height: 3rpx;
 		background-color: #F4F5F6;
 		margin-left: 30rpx;
-	}	
+	}
 </style>
diff --git a/pages_read_circle/pages/personal/serve_chat.vue b/pages_read_circle/pages/personal/serve_chat.vue
index 120855a320f0c5b649b0255f79dcdcd7a4eae2f5..6933140a743b89de4df7ec2da11c48c68679b056 100644
--- a/pages_read_circle/pages/personal/serve_chat.vue
+++ b/pages_read_circle/pages/personal/serve_chat.vue
@@ -1,253 +1,271 @@
 <template>
-	<view class="bgConston">
-		<view class="userSession" :style="{ height: sHeight + 'px' }">
-			<block v-for="(userContext,index) in userContextItem " :key="userContext.userId">
-			<view class="userH" :class="{'userMe' :userContext.userId==''}">
-				<view class="userImg">
-					<image :src="userContext.userImg" mode="scaleToFill"></image>
+	<view>
+		<u-navbar zhead="65rpx" height="44" title="书易客服" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
 				</view>
-				<view class="userType">
-					<!-- 是否显示用户昵称 -->
-					<!-- <template v-if="userContext.userId !=''">
+			</view>
+		</u-navbar>
+  <view class="bgConston">
+    <view class="userSession" :style="{ height: sHeight + 'px' }">
+      <block
+        v-for="(userContext, index) in userContextItem"
+        :key="userContext.userId"
+      >
+        <view class="userH" :class="{ userMe: userContext.userId == '' }">
+          <view class="userImg">
+            <image :src="userContext.userImg" mode="scaleToFill"></image>
+          </view>
+          <view class="userType">
+            <!-- 是否显示用户昵称 -->
+            <!-- <template v-if="userContext.userId !=''">
 						<view class="userN">
 							<text>{{userContext.userName}}</text>
 							<text>{{userContext.Time}}</text>
 						</view>
 					</template> -->
-					<!-- 文本格式 -->
-					<template v-if="userContext.type =='text'">
-						<view class="textType">
-							<text>{{userContext.context}}</text>
-						</view>
-					</template>
-					<!-- 图片格式 -->
-					<template v-else-if="userContext.type =='img'">
-						<view class="imgType">
-							<image :src="userContext.picImg" mode="scaleToFill"></image>
-						</view>
-					</template>
-					<!-- 视频格式 -->
-					<template v-else-if="userContext.type =='video'">
-						<view class="videoType">
-							<video :src="userContext.videoSrc" controls ="false"></video>
-						</view>
-					</template>
-					
-				</view>
-			</view>
-			</block>
-		</view>
-		<!-- 底部输入框 -->
-		<view class="userInput">
-			<input type="text" v-model="text" placeholder="文明发言" adjust-position="false" />
-			<view class="sumText" @tap="submit(text)">发送</view>
-		</view>
-	</view>
+            <!-- 文本格式 -->
+            <template v-if="userContext.type == 'text'">
+              <view class="textType">
+                <text>{{ userContext.context }}</text>
+              </view>
+            </template>
+            <!-- 图片格式 -->
+            <template v-else-if="userContext.type == 'img'">
+              <view class="imgType">
+                <image :src="userContext.picImg" mode="scaleToFill"></image>
+              </view>
+            </template>
+            <!-- 视频格式 -->
+            <template v-else-if="userContext.type == 'video'">
+              <view class="videoType">
+                <video :src="userContext.videoSrc" controls="false"></video>
+              </view>
+            </template>
+          </view>
+        </view>
+      </block>
+    </view>
+    <!-- 底部输入框 -->
+    <view class="userInput">
+      <input
+        type="text"
+        v-model="text"
+        placeholder="文明发言"
+        adjust-position="false"
+      />
+      <view class="sumText" @tap="submit(text)">发送</view>
+    </view>
+  </view>
+  </view>
 </template>
 
 <script>
 export default {
-	data() {
-		return {
-			sHeight:500,
-			
-			userContextItem:[{
-				
-				userId:1,
-				meId:"",
-				userName:"",
-				userImg:"../../static/images/service_woman.png",
-				type:"text",
-				context:"吾问无为谓jhhhh哈哈哈哈哈哈哈哈哈哈哈hh哇哇哇哇",
-				time:(new Date().getTime())
-			},
-			{
-				userId:"",
-				meId:2,
-				userName:"白百合",
-				userImg:"../../static/images/头像2.jpg",
-				type:"text",
-				context:"哈哈哈",
-				time:(new Date().getTime())
-			},
-			{
-			userId:1,
-			meId:"",
-			userName:"",
-			userImg:"../../static/images/service_woman.png",
-			type:"text",
-			context:"吾问无为谓哇哇哇哇",
-			time:(new Date().getTime())
-			}
-			]
-		}
-	},
-	onLoad() {
-		//获取系统信息
-		uni.getSystemInfo({
-			success: (res) => {
-				let height=res.windowHeight-uni.upx2px(100);
-				this.sHeight=height;
-			}
-		})
+  data() {
+    return {
+	background: {
+		background: "#6C40F3",
 	},
-	
-	methods: {
-		submit(text){
-			// 创建一组数据
-			let obj = {
-				userId:"",
-				meId: 2,
-				userName: "白百合",
-				userImg:"../../static/image/头像2.jpg",
-				type:"text",
-				context:text,
-				time:(new Date().getTime())
-			};
-			this.userContextItem.push(obj);
-		}
-		}
-}
+      sHeight: 500,
+
+      userContextItem: [
+        {
+          userId: 1,
+          meId: "",
+          userName: "",
+          userImg: "/static/images/service_woman.png",
+          type: "text",
+          context: "吾问无为谓jhhhh哈哈哈哈哈哈哈哈哈哈哈hh哇哇哇哇",
+          time: new Date().getTime(),
+        },
+        {
+          userId: "",
+          meId: 2,
+          userName: "白百合",
+          userImg: "/static/images/头像2.jpg",
+          type: "text",
+          context: "哈哈哈",
+          time: new Date().getTime(),
+        },
+        {
+          userId: 1,
+          meId: "",
+          userName: "",
+          userImg: "/static/images/service_woman.png",
+          type: "text",
+          context: "吾问无为谓哇哇哇哇",
+          time: new Date().getTime(),
+        },
+      ],
+    };
+  },
+  onLoad() {
+    //获取系统信息
+    uni.getSystemInfo({
+      success: (res) => {
+        let height = res.windowHeight - uni.upx2px(100);
+        this.sHeight = height;
+      },
+    });
+  },
+
+  methods: {
+    submit(text) {
+      // 创建一组数据
+      let obj = {
+        userId: "",
+        meId: 2,
+        userName: "白百合",
+        userImg: "../../static/image/头像2.jpg",
+        type: "text",
+        context: text,
+        time: new Date().getTime(),
+      };
+      this.userContextItem.push(obj);
+    },
+  },
+};
 </script>
 
 <style>
-	.bgConston{
-		width: 100%;
-		height: 100%;
-		background-color: #F8F8F8;
-		margin: 0;
-		padding: 0;
-	}
-	/* 聊天 */
-	.userSession{
-		width: 100%;
-		height: auto;
-		border-top: 1upx solid #EDEDED;
-		overflow: auto;
-	}
-	.userH{
-		width: 80%;
-		height: auto;
-		display: flex;
-		flex: 1;
-		flex-wrap: wrap;
-		padding: 20upx;
-	}
-	.userMe{
-		width: 95%;
-		height: auto;
-		display: flex;
-		flex: 1;
-		flex-wrap: wrap;
-		padding: 20upx;
-		justify-content: flex-start;
-		flex-direction: row-reverse;
-		text-align: right;
-	}
-	.userImg{
-		width: 70upx;
-		height: 70upx;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		margin-right: 15upx;
-		margin-left: 15upx;
-	}
-	.userImg>image{
-		width: 65upx;
-		height: 65upx;
-		border-radius: 100%;
-	}
-	.userType{
-		display: flex;
-		justify-content: center;
-		flex-direction: column;
-		padding: 10upx;
-	}
-	.userN{
-		height: 50upx;
-		display: flex;
-		justify-content: space-around;
-	}
-	.userN>text{
-		height: 50upx;
-		min-height: 100upx;
-		color: #666;
-	}
-	.textType{
-		max-width: 400upx;
-		background-color: #FFFFFF;
-		border-radius: 10upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		padding: 10upx;
-	}
-	.textType>text{
-		font-size: 28upx;
-		color: #666;
-	}
-	.imgType{
-		max-width: 300upx;
-		max-height: 420upx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		background-color: #FFFFFF;
-		border-radius: 20upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-	}
-	.imgType>image{
-		width: 250upx;
-		height: 350upx;
-		padding: 20upx;
-	}
-	.videoType{
-		width: 300upx;
-		height: 400upx;
-		display: flex;
-		background-color: #FFFFFF;
-		border-radius: 20upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-		align-items: center;
-		justify-content: center;
-		padding: 10upx;
-	}
-	.videoType>video{
-		width: 270upx;
-		height: 370upx;
-	}
-	.userInput{
-		height: 100upx;
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		right: 0;
-		padding: 0 10upx;
-		display: flex;
-		justify-content: space-around;
-		align-items: center;
-		box-shadow: 0 0 5upx 0 #E3E3E3;
-	}
-	.userInput>input{
-		height: 50upx;
-		background: #F4F5F6;
-		border-radius: 15upx;
-		padding: 10upx 10upx;
-		flex: 1;
-		margin-right: 20upx;
-		font-size: 28upx;
-		
-	}
-	.userInput>view{
-		width: 120upx;
-		font-size: 24upx;
-		color: #FFFFFF;
-		height: 60upx;
-		background-color: #18C7F2;
-		border-radius: 20upx;
-		text-align: center;
-		line-height: 60upx;
-	}
+.bgConston {
+  width: 100%;
+  height: 100%;
+  background-color: #f8f8f8;
+  margin: 0;
+  padding: 0;
+}
+/* 聊天 */
+.userSession {
+  width: 100%;
+  height: auto;
+  border-top: 1upx solid #ededed;
+  overflow: auto;
+}
+.userH {
+  width: 80%;
+  height: auto;
+  display: flex;
+  flex: 1;
+  flex-wrap: wrap;
+  padding: 20upx;
+}
+.userMe {
+  width: 95%;
+  height: auto;
+  display: flex;
+  flex: 1;
+  flex-wrap: wrap;
+  padding: 20upx;
+  justify-content: flex-start;
+  flex-direction: row-reverse;
+  text-align: right;
+}
+.userImg {
+  width: 70upx;
+  height: 70upx;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin-right: 15upx;
+  margin-left: 15upx;
+}
+.userImg > image {
+  width: 65upx;
+  height: 65upx;
+  border-radius: 100%;
+}
+.userType {
+  display: flex;
+  justify-content: center;
+  flex-direction: column;
+  padding: 10upx;
+}
+.userN {
+  height: 50upx;
+  display: flex;
+  justify-content: space-around;
+}
+.userN > text {
+  height: 50upx;
+  min-height: 100upx;
+  color: #666;
+}
+.textType {
+  max-width: 400upx;
+  background-color: #ffffff;
+  border-radius: 10upx;
+  box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  padding: 10upx;
+}
+.textType > text {
+  font-size: 28upx;
+  color: #666;
+}
+.imgType {
+  max-width: 300upx;
+  max-height: 420upx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  background-color: #ffffff;
+  border-radius: 20upx;
+  box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
+}
+.imgType > image {
+  width: 250upx;
+  height: 350upx;
+  padding: 20upx;
+}
+.videoType {
+  width: 300upx;
+  height: 400upx;
+  display: flex;
+  background-color: #ffffff;
+  border-radius: 20upx;
+  box-shadow: 3upx 3upx 3upx 3upx #e3e3e3;
+  align-items: center;
+  justify-content: center;
+  padding: 10upx;
+}
+.videoType > video {
+  width: 270upx;
+  height: 370upx;
+}
+.userInput {
+  height: 100upx;
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  padding: 0 10upx;
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  box-shadow: 0 0 5upx 0 #e3e3e3;
+}
+.userInput > input {
+  height: 50upx;
+  background: #f4f5f6;
+  border-radius: 15upx;
+  padding: 10upx 10upx;
+  flex: 1;
+  margin-right: 20upx;
+  font-size: 28upx;
+}
+.userInput > view {
+  width: 120upx;
+  font-size: 24upx;
+  color: #ffffff;
+  height: 60upx;
+  background-color: #18c7f2;
+  border-radius: 20upx;
+  text-align: center;
+  line-height: 60upx;
+}
 </style>
diff --git a/pages_read_circle/pages/personal/unChat.vue b/pages_read_circle/pages/personal/unChat.vue
index 331aa6a972269d631b58a897361d3ac78cd36fbe..ddba17fcd2a4392c19f2ee78a48db153ec649eb5 100644
--- a/pages_read_circle/pages/personal/unChat.vue
+++ b/pages_read_circle/pages/personal/unChat.vue
@@ -1,256 +1,263 @@
 <template>
-	<view class="bgConston">
-		<view class="userSession" :style="{ height: sHeight + 'px' }">
-			<block v-for="(userContext,index) in userContextItem " :key="userContext.userId">
-			<view class="userH" :class="{'userMe' :userContext.userId==''}">
-				<view class="userImg">
-					<image :src="userContext.userImg" mode="scaleToFill"></image>
-				</view>
-				<view class="userType">
-					<!-- 是否显示用户昵称 -->
-					<template v-if="userContext.userId !=''">
-						<view class="userN">
-							<text>{{userContext.userName}}</text>
-							<text>{{userContext.Time}}</text>
-						</view>
-					</template>
-					<!-- 文本格式 -->
-					<template v-if="userContext.type =='text'">
-						<view class="textType">
-							<text>{{userContext.context}}</text>
-						</view>
-					</template>
-					<!-- 图片格式 -->
-					<template v-else-if="userContext.type =='img'">
-						<view class="imgType">
-							<image :src="userContext.picImg" mode="scaleToFill"></image>
-						</view>
-					</template>
-					<!-- 视频格式 -->
-					<template v-else-if="userContext.type =='video'">
-						<view class="videoType">
-							<video :src="userContext.videoSrc" controls ="false"></video>
-						</view>
-					</template>
-					
-				</view>
-			</view>
-			</block>
-		</view>
-		<!-- 底部输入框 -->
-		<view class="userInput">
-			<input type="text" v-model="text" placeholder="文明发言" adjust-position="false" />
-			<view class="sumText" @tap="submit(text)">发送</view>
-		</view>
-	</view>
+  <view>
+    <!-- 标题 -->
+    <u-navbar zhead="65rpx" height="44" title="聊天" title-color="white" title-size="40" :background="background"
+              back-icon-color="white" back-icon-size="50">
+      <view class="navbar-right" slot="right">
+        <view class="right_list" @click="bindInBatch">
+        </view>
+      </view>
+    </u-navbar>
+    <view class="chat">
+      <view style="width: 100%;margin-bottom: 40rpx" v-for="(chat,index) in chatList" :key="index">
+        <view class="chat_time">{{$u.timeFormat(chat.time,'yyyy-mm-dd hh:MM')}}</view>
+        <view :class="['chat_item',(userinfo.readerId===chat.fromReaderId) && 'chat_item_my']">
+          <view class="u-flex header">
+            <u-avatar :src="chat.fromReader.avatar" :size="60"></u-avatar>
+            <text style="padding: 0 10rpx">{{chat.fromReader.nickname}}</text>
+          </view>
+          <block v-if="chat.type===1">
+            <view class="content">
+              <text style="word-break:break-all;word-wrap:break-word">
+                {{chat.content}}
+              </text>
+            </view>
+          </block>
+          <block v-else-if="chat.type===2">
+            <view class="reserva">
+              <view class="reserva_header">
+                <view class="reserva_header_title">{{chat.content}}</view>
+                <view class="reserva_header_time">{{$u.timeFormat(chat.time,"yyyy-mm-dd  hh:MM")}}</view>
+              </view>
+              <view class="reserva_content">
+                <view class="reserva_content_image">
+                  <u-image :src="chat.borrowreturnMessage.realBook.book.picturePath" width="100%" height="100%"></u-image>
+                </view>
+                <view class="reserva_content_info">
+                  <view>我预约了您的书【{{chat.borrowreturnMessage.realBook.book.bookName}}】</view>
+                  <view>查看详情>></view>
+                </view>
+              </view>
+            </view>
+          </block>
+        </view>
+      </view>
+    </view>
+    <view style="height: 150rpx"></view>
+    <view class="chatInput">
+      <u-input v-model="content" style="width: 100%" type="textarea" :maxlength="2000" placeholder=" " :clearable="false" :height="30" placeholder-style="line-height: 70rpx" :custom-style="{borderRadius: '35rpx',backgroundColor: '#fff',padding: '20rpx 20rpx',maxHeight:'200rpx',width:'100%'}"></u-input>
+      <u-button @click="submit" type="primary" :disabled="!content" :custom-style="{borderRadius:'40rpx',marginLeft:'20rpx',height:'70rpx'}">发送</u-button>
+    </view>
+  </view>
 </template>
 
 <script>
+//TODO 必读：约定所有消息为{data,time,type格式}
+const app = getApp();
+import {
+  mapState,
+} from 'vuex'
 export default {
-	data() {
-		return {
-			sHeight:500,
-			
-			userContextItem:[
-				{
-				
-				userId:1,
-				meId:"",
-				userName:"纵横天下",
-				userImg:"../../static/images/头像3.jpg",
-				type:"text",
-				context:"吾问无为谓jhhhh哈哈哈哈哈哈哈哈哈哈哈hh哇哇哇哇",
-				time:(new Date().getTime())
-			},
-			{
-				userId:"",
-				meId:2,
-				userName:"白百合",
-				userImg:"../../static/images/头像2.jpg",
-				type:"text",
-				context:"哈哈哈",
-				time:(new Date().getTime())
-			},
-			{
-			userId:1,
-			meId:"",
-			userName:"纵横天下",
-			userImg:"../../static/images/头像3.jpg",
-			type:"text",
-			context:"吾问无为谓哇哇哇哇",
-			time:(new Date().getTime())
-			}
-			]
-		}
-	},
-	onLoad() {
-		//获取系统信息
-		uni.getSystemInfo({
-			success: (res) => {
-				let height=res.windowHeight-uni.upx2px(100);
-				this.sHeight=height;
-			}
-		})
-	},
-	
-	methods: {
-		submit(text){
-			// 创建一组数据
-			let obj = {
-				userId:"",
-				meId: 2,
-				userName: "ailis",
-				userImg:"../../static/image/头像2.jpg",
-				type:"text",
-				context:text,
-				time:(new Date().getTime())
-			};
-			this.userContextItem.push(obj);
-		}
-		}
-}
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
+		},
+      sHeight: 500,
+      readerId:null,//对方的id
+      userContextItem: [
+        {
+          data:{
+            context: "吾问无为谓jhhhh哈哈哈哈哈哈哈哈哈哈哈hh哇哇哇哇",
+          },
+          user:{
+            avatar: "https://dss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=1089874897,1268118658&fm=26&gp=0.jpg",
+            birthday: 1579276800000,
+            education: "",
+            email: "zhongshan@163.com",
+            level: "书童",
+            nickname: "Fjun",
+            occupation: "",
+            phoneIsHid: null,
+            phoneNum: "13300000001",
+            professional: "无",
+            readerId: 2,
+            readerName: "严晓波",
+            sex: null,
+            shipperCode: null,
+            signature: "脚下的路如果不是你自己的选择..那旅程的终点在哪..也没人知道...",
+          },
+          time: new Date().getTime(),
+          type: "text",
+        }
+      ],
+      chatList:[],
+      content:""
+    };
+  },
+  computed:{
+    ...mapState(["token", "userinfo"])
+  },
+  onLoad({readerId}) {
+    this.readerId = +readerId;
+    //获取系统信息
+    /*uni.getSystemInfo({
+      success: (res) => {
+        let height = res.windowHeight - uni.upx2px(100);
+        this.sHeight = height;
+      },
+    });*/
+    app.myRequest({
+      url:"readerChat/getChat",
+      type:"GET",
+      data:{
+        readerId:this.readerId
+      }
+    }).then(res=>{
+      if(res.length){
+        this.chatList.push(...res)
+        this.$nextTick(()=>{
+          uni.pageScrollTo({
+            scrollTop: 99999999999,
+            duration: 0
+          })})
+        app.myRequest({
+          url:"readerChat/read",
+          type:"GET",
+          data:{
+            readerId:this.readerId
+          }
+        })
+      }
+    })
+  },
+
+  methods: {
+    submit() {
+      app.myRequest({
+        url:"readerChat/send",
+        type:"POST",
+        data:{
+          toReaderId:this.readerId,
+          content:this.content
+        }
+      }).then(res=>{
+        if(res.toReaderId){
+          this.chatList.push(res)
+          app.myRequest({
+            url:"readerChat/read",
+            type:"GET",
+            data:{
+              readerId:this.readerId
+            }
+          })
+        }
+      })
+      this.content = "";
+    },
+  },
+};
+
+
 </script>
 
-<style>
-	.bgConston{
-		width: 100%;
-		height: 100%;
-		background-color: #F8F8F8;
-		margin: 0;
-		padding: 0;
-	}
-	/* 聊天 */
-	.userSession{
-		width: 100%;
-		height: auto;
-		border-top: 1upx solid #EDEDED;
-		overflow: auto;
-	}
-	.userH{
-		width: 80%;
-		height: auto;
-		display: flex;
-		flex: 1;
-		flex-wrap: wrap;
-		padding: 20upx;
-	}
-	.userMe{
-		width: 95%;
-		height: auto;
-		display: flex;
-		flex: 1;
-		flex-wrap: wrap;
-		padding: 20upx;
-		justify-content: flex-start;
-		flex-direction: row-reverse;
-		text-align: right;
-	}
-	.userImg{
-		width: 70upx;
-		height: 70upx;
-		display: flex;
-		justify-content: center;
-		align-items: center;
-		margin-right: 15upx;
-		margin-left: 15upx;
-	}
-	.userImg>image{
-		width: 65upx;
-		height: 65upx;
-		border-radius: 100%;
-	}
-	.userType{
-		display: flex;
-		justify-content: center;
-		flex-direction: column;
-		padding: 10upx;
-	}
-	.userN{
-		height: 50upx;
-		display: flex;
-		justify-content: space-around;
-		margin-left:-40upx;
-		font-size: 30upx;
-	}
-	.userN>text{
-		height: 50upx;
-		min-height: 100upx;
-		color: #666;
-	}
-	.textType{
-		max-width: 400upx;
-		background-color: #FFFFFF;
-		border-radius: 10upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		padding: 10upx;
-	}
-	.textType>text{
-		font-size: 28upx;
-		color: #666;
-	}
-	.imgType{
-		max-width: 300upx;
-		max-height: 420upx;
-		display: flex;
-		align-items: center;
-		justify-content: center;
-		background-color: #FFFFFF;
-		border-radius: 20upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-	}
-	.imgType>image{
-		width: 250upx;
-		height: 350upx;
-		padding: 20upx;
-	}
-	.videoType{
-		width: 300upx;
-		height: 400upx;
-		display: flex;
-		background-color: #FFFFFF;
-		border-radius: 20upx;
-		box-shadow: 3upx 3upx 3upx 3upx #E3E3E3;
-		align-items: center;
-		justify-content: center;
-		padding: 10upx;
-	}
-	.videoType>video{
-		width: 270upx;
-		height: 370upx;
-	}
-	.userInput{
-		height: 100upx;
-		position: fixed;
-		bottom: 0;
-		left: 0;
-		right: 0;
-		padding: 0 10upx;
-		display: flex;
-		justify-content: space-around;
-		align-items: center;
-		box-shadow: 0 0 5upx 0 #E3E3E3;
-	}
-	.userInput>input{
-		height: 50upx;
-		background: #F4F5F6;
-		border-radius: 15upx;
-		padding: 10upx 10upx;
-		flex: 1;
-		margin-right: 20upx;
-		font-size: 28upx;
-		
-	}
-	.userInput>view{
-		width: 120upx;
-		font-size: 24upx;
-		color: #FFFFFF;
-		height: 60upx;
-		background-color: #18C7F2;
-		border-radius: 20upx;
-		text-align: center;
-		line-height: 60upx;
-	}
+<style lang="scss" scoped>
+.chat{
+  display: flex;
+  flex-wrap: wrap;
+  padding: 20rpx;
+
+  &_item{
+    //display: flex;
+
+    .content{
+      width: fit-content;
+      background-color: #fff;
+      border-radius: 10rpx;
+      padding: 20rpx;
+      margin-left: 60rpx;
+      margin-right: 60rpx;
+    }
+  }
+
+  &_time{
+    text-align: center;
+    font-size: 20rpx;
+  }
+
+  &_item_my{
+    margin-left: auto;
+
+    .header{
+      display: flex;
+      flex-direction: row-reverse;
+    }
+
+    .content{
+      float: right;
+      margin-left: 60rpx;
+      margin-right: 60rpx;
+    }
+
+    .reserva{
+      margin-left: 60rpx;
+      margin-right: 60rpx;
+    }
+  }
+}
+
+.chatInput{
+  position: fixed;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  bottom: 0;
+  width: 100%;
+  padding: 20rpx 40rpx;
+  background-color: #F4F5F6;
+}
+
+.reserva{
+  margin: 0 auto;
+  padding: 20rpx 30rpx;
+  margin-left: 60rpx;
+  margin-right: 60rpx;
+  background-color: #fff;
+  border-radius: 10rpx;
+  box-shadow: 0 2px 4px rgba(0, 0, 0, .12), 0 0 6px rgba(0, 0, 0, .04);
+
+  &_header{
+    display: flex;
+    justify-content: space-between;
+    &_time{
+      display: flex;
+      justify-content: flex-end;
+      color: #909399;
+    }
+
+    &_title{
+      font-size: 32rpx;
+      font-weight: 900;
+    }
+  }
+
+  &_content{
+    display: flex;
+    margin-top: 10rpx;
+    text-align: left;
+
+    &_image{
+      height: 160rpx;
+      width: 120rpx;
+      margin-right: 20rpx;
+    }
+
+    &_info{
+      flex: 1;
+      padding: 10rpx;
+      background-color: #f2f2f2;
+      color: #909399;
+    }
+  }
+}
 </style>
diff --git a/pages_read_circle/pages/readCircle/readCicleMore.vue b/pages_read_circle/pages/readCircle/readCicleMore.vue
index 11e74caa5322e151a050076b091423e3864ad85b..706dbb4bc858e0c5085ea8d2d76409fee1936f4a 100644
--- a/pages_read_circle/pages/readCircle/readCicleMore.vue
+++ b/pages_read_circle/pages/readCircle/readCicleMore.vue
@@ -1,213 +1,283 @@
 <template>
-	<view>
-	<view class="page-body" :style="'height:' + height + 'px'">
-		<scroll-view class="nav-left" scroll-y :style="'height:' + height + 'px'" :scroll-top="scrollLeftTop" scroll-with-animation>
-			<view class="nav-left-item" @click="categoryClickMain(index)" :key="index" :class="index == categoryActive ? 'active' : ''" v-for="(item, index) in classifyData">
-				{{ item.name }}
-			</view>
-		</scroll-view>
-		<scroll-view class="nav-right" scroll-y :scroll-top="scrollTop" @scroll="scroll" :style="'height:' + height + 'px'" scroll-with-animation>
-			<view v-for="(foods, index) in classifyData" :key="index" class="box">
-				<view>{{ foods.name }}</view>
-				<view :id="i == 0 ? 'first' : ''" class="nav-right-item" v-for="(item, i) in foods.foods" :key="i" @click="cart(item.name)">
-					<navigator url="readCircleXQ">
-					<image src="../../static/images/after.jpg" />
-					</navigator>
-					<view>{{ item.name }}</view>
-				</view>
-			</view>
-		</scroll-view>
-	</view>
-	<!-- 新建圈子 -->
-	<navigator url="readCircleNew">
-	<button class="btn" style="background-color: #6C40F3;"><image class="btnima" src="../../static/images/add_icon.png" style="width: 50rpx;height: 50rpx;"></image></button>
-	</navigator>
-	</view>
+  <view>
+    <view class="page-body" :style="'height:' + height + 'px'">
+      <scroll-view
+        class="nav-left"
+        scroll-y
+        :style="'height:' + height + 'px'"
+        :scroll-top="scrollLeftTop"
+        scroll-with-animation
+      >
+        <view
+          class="nav-left-item"
+          @click="categoryClickMain(index)"
+          :key="index"
+          :class="index == categoryActive ? 'active' : ''"
+          v-for="(item, index) in classifyData"
+        >
+          {{ item.name }}
+        </view>
+      </scroll-view>
+      <scroll-view
+        class="nav-right"
+        scroll-y
+        :scroll-top="scrollTop"
+        @scroll="scroll"
+        :style="'height:' + height + 'px'"
+        scroll-with-animation
+      >
+        <view v-for="(foods, index) in classifyData" :key="index" class="box">
+          <view>{{ foods.name }}</view>
+          <view
+            :id="i == 0 ? 'first' : ''"
+            class="nav-right-item"
+            v-for="(item, i) in foods.foods"
+            :key="i"
+            @click="cart(item.name)"
+          >
+            <navigator :url="`readCircleNR?circleId=${item.circleId}`">
+              <image :src="$s.getImageUrl(item.images)" />
+            </navigator>
+            <view>{{ item.name }}</view>
+          </view>
+        </view>
+      </scroll-view>
+    </view>
+    <!-- 新建圈子 -->
+    <navigator url="readCircleNew">
+      <button class="btn" style="background-color: #6c40f3">
+        <image
+          class="btnima"
+          src="/static/images/add_icon.png"
+          style="width: 50rpx; height: 50rpx"
+        ></image>
+      </button>
+    </navigator>
+  </view>
 </template>
 
 <script>
-import classifyData from '../../../data.js';
+const app = getApp()
 export default {
-	data() {
-		return {
-			name: 'wkiwi',
-			height: 0,
-			categoryActive: 0,
-			scrollTop: 0,
-			scrollLeftTop: 0,
-			// scrollHeight: 0,
-			classifyData: classifyData,
-			arr: [0, 584, 1168, 1752, 2336, 2805, 3274, 3858, 4442, 4911, 5380, 5734, 6203, 6672, 7017], //初始值，后边计算会根据手机适配覆盖
-			leftItemHeight: 51, //49行会计算出新值进行覆盖
-			navLeftHeight: 0, //左边scroll-view 内层nav的总高度
-			diff: 0, //左边scroll-view 内层nav的总高度与视口之差
-			tabBarHeight: 0 //如果此页面为Tab页面，自己改变高度值,,一般tab高度为51
-		};
-	},
-	created() {
-		//如果你的分类数据为后台异步获取请	将下方代码放置你的数据回调中
-		// this.$nextTick(()=>{
-		// 	this.getHeightList();
-		// })
-	},
-	onLoad: function() {
-		this.height = uni.getSystemInfoSync().windowHeight - this.tabBarHeight;
-	},
-	onReady() {
-		this.getHeightList();
-	},
-	methods: {
-		getHeightList() {
-			let _this = this;
-			let selectorQuery = uni.createSelectorQuery();
-			selectorQuery.selectAll('.nav-left-item').boundingClientRect(function(rects) {
-				_this.leftItemHeight = rects[0].height;
-				_this.navLeftHeight = _this.leftItemHeight * classifyData.length;
-				_this.diff = _this.navLeftHeight - _this.height;
-			});
-			selectorQuery
-				.selectAll('.box')
-				.boundingClientRect(function(rects) {
-					let arr = [0];
-					let top = 0;
-					rects.forEach(function(rect) {
-						// 					rect.id      // 节点的ID
-						// 					rect.dataset // 节点的dataset
-						// 					rect.left    // 节点的左边界坐标
-						// 					rect.right   // 节点的右边界坐标
-						// 					rect.top     // 节点的上边界坐标
-						// 					rect.bottom  // 节点的下边界坐标
-						// 					rect.width   // 节点的宽度
-						// 					rect.height  // 节点的高度
-						top += rect.height;
-						arr.push(top);
-					});
-					console.log(arr);
-					_this.arr = arr;
-				})
-				.exec();
-		},
-		scroll(e) {
-			let _this = this;
-			if (this.timeoutId) {
-				clearTimeout(this.timeoutId);
-			}
-			this.timeoutId = setTimeout(function() {
-				//节流
-				_this.scrollHeight = e.detail.scrollTop + 1 + _this.height / 2;
-				//+1不要删除，解决最后一项某种情况下翻到底部，左边按钮并不会切换至最后一个
-				//若想使切换参考线为屏幕顶部请删除 _this.height/2
-				for (let i = 0; i < _this.arr.length; i++) {
-					let height1 = _this.arr[i];
-					let height2 = _this.arr[i + 1];
-					if (!height2 || (_this.scrollHeight >= height1 && _this.scrollHeight < height2)) {
-						_this.categoryActive = i;
-						_this.diff > 0 && (_this.scrollLeftTop = Math.round((_this.categoryActive * _this.diff) / (classifyData.length - 1)));
-						return false;
-					}
-				}
-				_this.categoryActive = 0;
-				_this.timeoutId = undefined;
-			}, 10);
-		},
-		categoryClickMain(index) {
-			this.categoryActive = index;
-			this.scrollTop == this.arr[index] ? (this.scrollTop = this.scrollTop + 1) : (this.scrollTop = this.arr[index]); //防止两次相等造成点击不触发滚动时间
-		},
-		cart: function(text) {
-			uni.showToast({
-				title: text,
-				icon: 'none'
-			});
-		}
-	},
-	components: {}
+  data() {
+    return {
+      name: "wkiwi",
+      height: 0,
+      categoryActive: 0,
+      scrollTop: 0,
+      scrollLeftTop: 0,
+      // scrollHeight: 0,
+      classifyData: [{
+        "name": "我的",
+        "foods": []
+      },{
+        "name": "全部",
+        "foods": []
+      }],
+      arr: [
+        0,
+        584,
+        1168,
+        1752,
+        2336,
+        2805,
+        3274,
+        3858,
+        4442,
+        4911,
+        5380,
+        5734,
+        6203,
+        6672,
+        7017,
+      ], //初始值，后边计算会根据手机适配覆盖
+      leftItemHeight: 51, //49行会计算出新值进行覆盖
+      navLeftHeight: 0, //左边scroll-view 内层nav的总高度
+      diff: 0, //左边scroll-view 内层nav的总高度与视口之差
+      tabBarHeight: 0, //如果此页面为Tab页面，自己改变高度值,,一般tab高度为51
+    };
+  },
+  created() {
+    //如果你的分类数据为后台异步获取请	将下方代码放置你的数据回调中
+    // this.$nextTick(()=>{
+    // 	this.getHeightList();
+    // })
+    app.myRequest({
+      url: "circle/getAll",
+      type: 'GET'
+    }).then(res=>{
+      this.classifyData[1].foods = res;
+    }).finally(res=>{
+      this.getHeightList();
+    })
+    app.myRequest({
+      url: "circle/getReaderCircleList",
+      type: 'GET'
+    }).then(res=>{
+      this.classifyData[0].foods = res;
+    }).finally(res=>{
+      this.getHeightList();
+    })
+  },
+  onLoad: function () {
+    this.height = uni.getSystemInfoSync().windowHeight - this.tabBarHeight;
+  },
+  onReady() {
+
+  },
+  methods: {
+    getHeightList() {
+      let _this = this;
+      let selectorQuery = uni.createSelectorQuery();
+      selectorQuery
+        .selectAll(".nav-left-item")
+        .boundingClientRect(function (rects) {
+          _this.leftItemHeight = rects[0].height;
+          _this.navLeftHeight = _this.leftItemHeight * _this.classifyData.length;
+          _this.diff = _this.navLeftHeight - _this.height;
+        });
+      selectorQuery
+        .selectAll(".box")
+        .boundingClientRect(function (rects) {
+          let arr = [0];
+          let top = 0;
+          rects.forEach(function (rect) {
+            top += rect.height;
+            arr.push(top);
+          });
+          _this.arr = arr;
+        })
+        .exec();
+    },
+    scroll(e) {
+      let _this = this;
+      if (this.timeoutId) {
+        clearTimeout(this.timeoutId);
+      }
+      this.timeoutId = setTimeout(function () {
+        //节流
+        _this.scrollHeight = e.detail.scrollTop + 1 + _this.height / 2;
+        //+1不要删除，解决最后一项某种情况下翻到底部，左边按钮并不会切换至最后一个
+        //若想使切换参考线为屏幕顶部请删除 _this.height/2
+        for (let i = 0; i < _this.arr.length; i++) {
+          let height1 = _this.arr[i];
+          let height2 = _this.arr[i + 1];
+          if (
+            !height2 ||
+            (_this.scrollHeight >= height1 && _this.scrollHeight < height2)
+          ) {
+            _this.categoryActive = i;
+            _this.diff > 0 &&
+              (_this.scrollLeftTop = Math.round(
+                (_this.categoryActive * _this.diff) / (classifyData.length - 1)
+              ));
+            return false;
+          }
+        }
+        _this.categoryActive = 0;
+        _this.timeoutId = undefined;
+      }, 10);
+    },
+    categoryClickMain(index) {
+      this.categoryActive = index;
+      this.scrollTop == this.arr[index]
+        ? (this.scrollTop = this.scrollTop + 1)
+        : (this.scrollTop = this.arr[index]); //防止两次相等造成点击不触发滚动时间
+    },
+    cart: function (text) {
+      /*uni.showToast({
+        title: text,
+        icon: "none",
+      });*/
+    },
+  },
+  components: {},
 };
 </script>
 
 <style>
 .page-body {
-	display: flex;
-	background: #fff;
-	overflow: hidden;
+  display: flex;
+  background: #fff;
+  overflow: hidden;
 }
 
 .nav {
-	display: flex;
-	width: 100%;
+  display: flex;
+  width: 100%;
 }
 
 .nav-left {
-	width: 25%;
-	background: #fafafa;
+  width: 25%;
+  background: #fafafa;
 }
 
 .nav-left-item {
-	height: 100upx;
-	border-right: solid 1px #f1f1f1;
-	border-bottom: solid 1px #f1f1f1;
-	font-size: 30upx;
-	display: flex;
-	align-items: center;
-	justify-content: center;
+  height: 100upx;
+  border-right: solid 1px #f1f1f1;
+  border-bottom: solid 1px #f1f1f1;
+  font-size: 30upx;
+  display: flex;
+  align-items: center;
+  justify-content: center;
 }
 .nav-left-item:last-child {
-	border-bottom: none;
+  border-bottom: none;
 }
 .nav-right {
-	width: 75%;
+  width: 75%;
 }
 .box {
-	display: block;
-	overflow: hidden;
-	border-bottom: 20upx solid #f3f3f3;
-	/* min-height: 100vh; */
-	/*若您的子分类过少想使得每个子分类占满屏请放开上边注视 */
+  display: block;
+  overflow: hidden;
+  border-bottom: 20upx solid #f3f3f3;
+  /* min-height: 100vh; */
+  /*若您的子分类过少想使得每个子分类占满屏请放开上边注视 */
 }
 .box:last-child {
-	border: none;
-	min-height: 100vh;
+  border: none;
+  min-height: 100vh;
 }
 
 .nav-right-item {
-	width: 28%;
-	height: 220upx;
-	float: left;
-	text-align: center;
-	padding: 11upx;
-	font-size: 28upx;
-	background: #fff;
+  width: 28%;
+  height: 220upx;
+  float: left;
+  text-align: center;
+  padding: 11upx;
+  font-size: 28upx;
+  background: #fff;
 }
 
 .nav-right-item image {
-	width: 150upx;
-	height: 150upx;
-	border-radius: 10rpx;
+  width: 150upx;
+  height: 150upx;
+  border-radius: 10rpx;
 }
 
 .active {
-	color: #18c7f2;
-	background: #fff;
-	border-right: 0;
+  color: #18c7f2;
+  background: #fff;
+  border-right: 0;
 }
 ::-webkit-scrollbar {
-	/*取消小程序的默认导航条样式*/
-	width: 0;
-	height: 0;
-	color: transparent;
+  /*取消小程序的默认导航条样式*/
+  width: 0;
+  height: 0;
+  color: transparent;
+}
+/* 新建 */
+.btn {
+  background-color: #5251f5;
+  position: fixed;
+  bottom: 10rpx;
+  margin-left: 640rpx;
+  width: 100rpx;
+  height: 100rpx;
+  border-radius: 100%;
+}
+.btnima {
+  margin-left: -4rpx;
+  margin-top: 25rpx;
 }
- /* 新建 */
-  .btn{
-  	background-color: #5251F5;
-  	position:fixed;
-  	bottom: 10rpx;
-	margin-left: 640rpx;
-  	width:100rpx;
-	height: 100rpx;
-  	border-radius: 100%;
-  }
- .btnima{
-	 margin-left: -4rpx;
-	 margin-top: 25rpx;
- } 
 </style>
diff --git a/pages_read_circle/pages/readCircle/readCircle.vue b/pages_read_circle/pages/readCircle/readCircle.vue
index 2411a6f6ca011eff82b8577f7469d32f0ba7e078..a63025b13caff36a7589f1bb65d0ede47f13de1d 100644
--- a/pages_read_circle/pages/readCircle/readCircle.vue
+++ b/pages_read_circle/pages/readCircle/readCircle.vue
@@ -1,31 +1,30 @@
 <template>
 	<view>
+		<!-- 标题 -->
+		<u-navbar zhead="65rpx" height="44" title="阅读圈子" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<!-- 头部圈子 -->
 		<view class="top">
-			<view class="topone">
-				<navigator url="/pages_read_circle/pages/readCircle/readCircleNR">
-					<view class="circle"><image class="circletp" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx; border-radius: 10rpx;"></image></view>
-				</navigator>
-				<view class="tpname">三味书屋w</view>
-			</view>
-			<view class="topone">
-				<navigator url="/pages_read_circle/pages/readCircle/readCircleNR">
-					<view class="circle"><image class="circletp" src="../../static/images/书3.jpg" style="width: 120rpx;height: 120rpx; border-radius: 10rpx;"></image></view>
+			<view class="topone" v-for="(circle,index) in circleList.slice(0,4)" :key="index">
+				<navigator :url="`/pages_read_circle/pages/readCircle/readCircleNR?circleId=${circle.circleId}`">
+					<view class="circle">
+						<image class="circletp" :src="$s.getImageUrl(circle.images)" style="width: 120rpx; height: 120rpx; border-radius: 10rpx"></image>
+					</view>
 				</navigator>
-				<view class="tpname">三屋w</view>
-			</view>
-			<view class="topone">
-				<view class="circle"><image class="circletp" src="../../static/images/书2.jpg" style="width: 120rpx;height: 120rpx; border-radius: 10rpx;"></image></view>
-				<view class="tpname">三屋w</view>
-			</view>
-			<view class="topone">
-				<view class="circle"><image class="circletp" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx; border-radius: 10rpx;"></image></view>
-				<view class="tpname">三屋wh</view>
+				<view class="tpname">{{circle.name}}</view>
 			</view>
+
 			<view class="topone">
 				<navigator url="readCicleMore">
-				<view class="circle"><image class="circletp" src="../../static/images/gengduo.png" style="width: 120rpx;height: 120rpx; border-radius: 10rpx;"></image></view>
-				<view class="tpname">更多圈子</view>
+					<view class="circle">
+						<image class="circletp" src="/static/images/gengduo.png" style="width: 120rpx; height: 120rpx; border-radius: 10rpx"></image>
+					</view>
+					<view class="tpname">更多圈子</view>
 				</navigator>
 			</view>
 		</view>
@@ -36,42 +35,42 @@
 				<view class="showone">
 					<view class="person">
 						<view class="tou">
-							<image src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
+							<image src="/static/images/QQ.png" style="width: 90rpx; height: 90rpx; border-radius: 50%"></image>
 						</view>
 						<view class="Ttitle">
 							<view class="Ntitle">
-								<view class="name">爱丽丝</view>
+								<view class="name">测试1</view>
 								<view class="dj">
-								<view class="vip">LV.11</view>	
+									<view class="vip">LV.11</view>
 								</view>
 							</view>
-							<view class="time">2020-08-09 14:10</view>	
+							<view class="time">2020-08-09 14:10</view>
 						</view>
-						</view>
-					<navigator url="/pages_read_circle/pages/readCircle/readExperience">
-					<view class="zy">
-						<text>
-							《预见未来》哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈灌灌灌帆帆帆帆烦烦烦哈哈哈哈哈哈哈哈哈哈后哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好好...
-						</text>
 					</view>
-					<view class="tab">
-						<view class="imgs">
-							<image class="img" src="../../static/images/书1.jpg" style="width: 220rpx; height: 240rpx;"></image>
-							<image class="img" src="../../static/images/书3.jpg" style="width: 220rpx; height: 240rpx;"></image>
-							<image class="img" src="../../static/images/书2.jpg" style="width: 220rpx; height: 240rpx;"></image>
+					<navigator url="/pages_read_circle/pages/readCircle/readExperience">
+						<view class="zy">
+							<text>
+								平时多记记，到用时才能看看，记录你的进步，分享你的成果
+							</text>
+						</view>
+						<view class="tab">
+							<view class="imgs">
+								<image class="img" src="http://183.63.187.41/ImageService/BookImage.aspx?Text200a=&Text010a=978-7-121-28214-0&Text200f=&Text210c=" style="width: 220rpx; height: 240rpx"></image>
+								<image class="img" src="http://183.63.187.41/ImageService/BookImage.aspx?Text200a=&Text010a=9789868902886&Text200f=&Text210c=" style="width: 220rpx; height: 240rpx"></image>
+								<image class="img" src="http://183.63.187.41/ImageService/BookImage.aspx?Text200a=&Text010a=978-7-111-54868-3&Text200f=&Text210c=" style="width: 220rpx; height: 240rpx"></image>
+							</view>
 						</view>
-					</view>
 					</navigator>
 				</view>
 
 				<view class="showtwo">
 					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
+						<image class="wave" src="/static/images/zan.png"></image>
+						<text id="t">9</text>
 					</view>
 					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png" style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
+						<image class="wave" src="/static/images/pinglun.png" style="width: 38rpx; height: 36rpx"></image>
+						<text id="t">6</text>
 					</view>
 				</view>
 			</view>
@@ -80,63 +79,39 @@
 				<view class="showone">
 					<view class="person">
 						<view class="tou">
-							<image src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
+							<image src="/static/images/after.jpg" style="width: 90rpx; height: 90rpx; border-radius: 50%"></image>
 						</view>
 						<view class="Ttitle">
 							<view class="Ntitle">
-								<view class="name">爱丽丝爱吃鱼</view>
+								<view class="name">爱丽丝</view>
 								<view class="dj">
-								<view class="vip">LV.11</view>	
+									<view class="vip">LV.10</view>
 								</view>
 							</view>
-							<view class="time">2020-08-09 14:10</view>	
-						</view>
+							<view class="time">2020-08-09 14:10</view>
 						</view>
-					<view class="zy"><text>《来》今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text></view>
+					</view>
+					<view class="zy">
+					<text>
+						一个人的努力是加法，一个团队的努力是乘法
+					</text>
+					</view>
 					<view class="book">
-						<view class="bookone"><image class="booktp" src="../../static/images/书2.jpg" style="width: 130rpx; height: 180rpx;"></image></view>
+						<view class="bookone">
+							<image class="booktp" src="http://183.63.187.41/ImageService/BookImage.aspx?Text200a=&Text010a=978-7-115-43373-2&Text200f=&Text210c=" style="width: 130rpx; height: 180rpx"></image>
+						</view>
 						<view class="bookn"><text class="bookname">最强帝国副瑞士</text></view>
 						<view class="zzn"><text class="zzname">雷迪</text></view>
 					</view>
 				</view>
 				<view class="showtwo">
 					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
+						<image class="wave" src="/static/images/zan.png"></image>
+						<text id="t">3</text>
 					</view>
 					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png" style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
-					</view>
-				</view>
-			</view>
-			<view class="show">
-				<view class="showone">
-					<view class="person">
-						<view class="tou">
-							<image src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="Ttitle">
-							<view class="Ntitle">
-								<view class="name">爱丽丝爱吃鱼</view>
-								<view class="dj">
-								<view class="vip">LV.11</view>	
-								</view>
-							</view>
-							<view class="time">2020-08-09 14:10</view>	
-						</view>
-						</view>
-					<view class="zy"><text>今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text></view>
-				</view>
-
-				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png" style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
+						<image class="wave" src="/static/images/pinglun.png" style="width: 38rpx; height: 36rpx"></image>
+						<text id="t">76</text>
 					</view>
 				</view>
 			</view>
@@ -145,179 +120,325 @@
 </template>
 
 <script>
-export default {
-	data() {
-		return {};
-	},
-	methods: {}
-};
+	const app = getApp()
+	export default {
+		data() {
+			return {
+				background: {
+					background: "#6C40F3",
+				},
+				circleList: [],
+				id: 0, //id=0查询全部作品
+				page: 0,
+				size: 20,
+				sort: "issueTime,desc", // 按照发布时间排序
+				info: [],
+				imgList: [],
+				url:"",
+				placeholder:"评论...",
+				comment:"",
+			};
+		},
+		methods: {
+			//获取内容
+			async getInfo() {
+				var that = this;
+				var params = {
+					url: "circleReviewContent/query",
+					type: 'GET',
+					data: {
+						issueType: that.issueType,
+						id: that.id,
+						page: that.page,
+						size: that.size,
+						sort: that.sort,
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log("后台传来的：", res)
+				that.info = res.contentMap
+			},
+
+			// 点赞
+			like(index, id) {
+				if (this.info[index].praseStatus == 1) {
+					this.info[index].praseStatus = 0;
+					this.info[index].praiseNum = this.info[index].praiseNum - 1;
+					//点赞计入服务器
+					this.url = "praise/notLike";
+					this.likeImport(id);
+				} else {
+					this.info[index].praseStatus = 1;
+					this.info[index].praiseNum = this.info[index].praiseNum + 1;
+					this.url = "praise/like";
+					this.likeImport(id);
+				}
+
+			},
+			//点击完成发送评论	
+			async confirm(index, id) {
+				console.log("评论index:", index)
+				console.log("作品id:", id)
+				console.log("内容：", this.comment)
+				let that = this
+				that.placeholder = "评论..."
+				uni.request({
+					url: getApp().globalData.URL + 'comment/addComment', //仅为示例，并非真实接口地址。
+					data: {
+						id: id,
+						content: that.comment,
+					},
+					method: "POST",
+					header: {
+						'Authorization': that.token
+					},
+					success: (res) => {
+						console.log("评论成功：", res);
+					},
+					fail: (res) => {
+						console.log("评论失败：", res);
+					}
+				});
+			},
+
+			//喜欢
+			async likeImport(id) {
+				var that = this;
+				var params = {
+					url: that.url,
+					type: 'GET',
+					data: {
+						composeId: id
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log("后台传来的：", res)
+			},
+
+			//图片点击事件
+			imgYu(event) {
+				console.log(event);
+				var src = event.currentTarget.dataset.src; //获取data-src
+				this.imgList = [event.currentTarget.dataset.list]; //获取data-list
+				//图片预览
+				uni.previewImage({
+					current: src, // 当前显示图片的http链接
+					urls: this.imgList // 需要预览的图片http链接列表
+				})
+			},
+
+			//去详情页
+			toDetil(id) {
+				uni.navigateTo({
+					url: "../readCircle/readExperience?id=" + id
+				})
+			},
+
+			//去他的主页
+			toPersonalHome(e) {
+				uni.navigateTo({
+					url: "/pages_read_circle/pages/personal/personal_home?id=" + e
+				})
+			},
+		},
+
+		created() {
+			app.myRequest({
+				url: "circle/getAll",
+				type: 'GET'
+			}).then(res => {
+				this.circleList = res;
+			}).catch(err => {
+				console.log("err", err);
+			})
+		}
+	};
 </script>
 
 <style>
-/* 头部 */
-.top {
-	height: 220rpx;
-	width: 100%;
-	display: inline-flex;
-	box-shadow: #f1f1f1 0rpx 18rpx 0rpx 0rpx;
-}
-.circle {
-	margin-top: 30rpx;
-	margin-left: 25rpx;
-}
-.tpname {
-	font-size: 28rpx;
-	margin-top: 10rpx;
-	margin-left: 25rpx;
-	text-align: center;
-}
-/* 中间 */
-.under {
-	line-height: 150rpx;
-	/* 设置行高*/
-}
-
-.show {
-	height: auto;
-	margin-top: 40rpx;
-	color: #f1f1f1;
-}
-
-.showone {
-	color: #999999;
-	height: auto;
-	margin-top: 10rpx;
-	border-radius: 50rpx;
-}
-
-.person {
-	line-height: 20rpx;
-	display: flex;
-	height: 100rpx;
-}
-.tou{
-	margin-top: 0rpx;
-	margin-left: 20rpx;
-}
-.Ttitle{
-	height: 50rpx;
-}
-.Ntitle{
-	display: flex;
+	/* 头部 */
+	.top {
+		height: 220rpx;
+		width: 100%;
+		display: inline-flex;
+		box-shadow: #f1f1f1 0rpx 18rpx 0rpx 0rpx;
+	}
+
+	.circle {
+		margin-top: 30rpx;
+		margin-left: 25rpx;
+	}
+
+	.tpname {
+		font-size: 28rpx;
+		margin-top: 10rpx;
+		margin-left: 25rpx;
+		text-align: center;
+	}
+
+	/* 中间 */
+	.under {
+		line-height: 150rpx;
+		/* 设置行高*/
+	}
+
+	.show {
+		height: auto;
+		margin-top: 40rpx;
+		color: #f1f1f1;
+	}
+
+	.showone {
+		color: #999999;
+		height: auto;
+		margin-top: 10rpx;
+		border-radius: 50rpx;
+	}
+
+	.person {
+		line-height: 20rpx;
+		display: flex;
+		height: 100rpx;
+	}
+
+	.tou {
+		margin-top: 0rpx;
+		margin-left: 20rpx;
+	}
+
+	.Ttitle {
+		height: 50rpx;
+	}
+
+	.Ntitle {
+		display: flex;
+	}
+
+	.name {
+		height: 30rpx;
+		color: #00aaff;
+		margin-top: 20rpx;
+		font-size: 30rpx;
+		margin-left: 20rpx;
+	}
+
+	.dj {
+		color: #f0ad4e;
+		font-size: 25rpx;
+		border-radius: 10rpx;
+		border: 1rpx solid #f0ad4e;
+		height: 35rpx;
+		margin-top: 12rpx;
+		width: 80rpx;
+		margin-left: 10rpx;
+	}
+
+	.vip {
+		margin-top: 6rpx;
+		text-align: center;
+	}
+
+	.bn {
+		height: 100%;
+		margin-top: 0rpx;
+	}
+
+	.time {
+		font-size: 20rpx;
+		margin-top: 10rpx;
+		margin-left: 18rpx;
+		/* background-color: #4CD964; */
+	}
+
+	.zy {
+		margin-top: 10rpx;
+		line-height: 40rpx;
+		margin-left: 25rpx;
+		margin-right: 20rpx;
+		font-size: 28rpx;
+		font-weight: 300rpx;
+		color: #555555;
+	}
+
+	.tab {
+		height: 250rpx;
+		margin: 10rpx 10rpx;
+	}
+
+	.book {
+		height: 240rpx;
+		margin: 20rpx 30rpx;
+		/* background-color: #007AFF; */
+		box-shadow: #f1f1f1 0rpx 0rpx 10rpx 5rpx;
+		border-radius: 8rpx;
+	}
+
+	.booktp {
+		margin-top: 30rpx;
+		margin-left: 30rpx;
+	}
+
+	.bookn {
+		margin-top: -260rpx;
+		margin-left: 200rpx;
+		font-size: 40rpx;
+		color: #333333;
+	}
+
+	.zzn {
+		font-size: 32rpx;
+		color: #333333;
+		margin-top: -100rpx;
+		margin-left: 200rpx;
+	}
+
+	.imgs {
+		display: flex;
+		width: 95%;
+		margin-left: 20rpx;
+		margin-top: 10rpx;
+	}
+
+	.img {
+		size: 100%;
+		margin: 10rpx 12rpx;
+	}
+
+	.showtwo {
+		display: flex;
+		background-color: #ffffff;
+		border-top: none;
+		height: 80rpx;
+		align-items: center;
+		box-shadow: #f1f1f1 0rpx 8rpx 0rpx 8rpx;
+	}
+
+	.wave {
+		z-index: 3;
+		right: 0;
+		bottom: 0;
+		opacity: 0.725;
+		height: 40rpx;
+		width: 40rpx;
+		padding-top: 10rpx;
+		margin-top: 50rpx;
+		/* animation: wave 10s linear infinite; */
+	}
+
+	.dz {
+		margin-left: 450rpx;
+		display: flex;
+	}
+
+	.pl {
+		margin-left: 80rpx;
+		display: flex;
+	}
+
+	#t {
+		font-size: 25rpx;
+		color: #bbbbbb;
+		margin-left: 5rpx;
+		margin-top: 10rpx;
 	}
-.name {
-	height: 30rpx;
-	color: #00aaff;
-	margin-top: 20rpx;
-	font-size: 30rpx;
-	margin-left: 20rpx;
-}
-.dj{
-	color: #f0ad4e;
-	font-size: 25rpx;
-	border-radius: 10rpx;
-	border: 1rpx solid #f0ad4e;
-	height: 35rpx;
-	margin-top: 12rpx;
-	width: 80rpx;
-	margin-left: 10rpx;
-}
-.vip {
-	margin-top: 6rpx;
-	text-align: center;
-}
-.bn {
-	height: 100%;
-	margin-top: 0rpx;
-}
-.time {
-	font-size: 20rpx;
-	margin-top: 10rpx;
-	margin-left: 18rpx;
-	/* background-color: #4CD964; */
-}
-
-.zy {
-	margin-top: 10rpx;
-	line-height: 40rpx;
-	margin-left: 25rpx;
-	margin-right: 20rpx;
-	font-size: 28rpx;
-	font-weight: 300rpx;
-	color: #555555;
-}
-.tab {
-	height: 250rpx;
-	margin: 10rpx 10rpx;
-}
-.book {
-	height: 240rpx;
-	margin: 20rpx 30rpx;
-	/* background-color: #007AFF; */
-	box-shadow: #f1f1f1 0rpx 0rpx 10rpx 5rpx;
-	border-radius: 8rpx;
-}
-.booktp {
-	margin-top: 30rpx;
-	margin-left: 30rpx;
-}
-.bookn {
-	margin-top: -260rpx;
-	margin-left: 200rpx;
-	font-size: 40rpx;
-	color: #333333;
-}
-.zzn {
-	font-size: 32rpx;
-	color: #333333;
-	margin-top: -100rpx;
-	margin-left: 200rpx;
-}
-.imgs {
-	display: flex;
-	width: 95%;
-	margin-left: 20rpx;
-	margin-top: 10rpx;
-}
-.img {
-	size: 100%;
-	margin: 10rpx 12rpx;
-}
-
-.showtwo {
-	display: flex;
-	background-color: #ffffff;
-	border-top: none;
-	height: 80rpx;
-	align-items: center;
-	box-shadow: #f1f1f1 0rpx 8rpx 0rpx 8rpx;
-}
-
-.wave {
-	z-index: 3;
-	right: 0;
-	bottom: 0;
-	opacity: 0.725;
-	height: 40rpx;
-	width: 40rpx;
-	padding-top: 10rpx;
-	margin-top: 50rpx;
-	/* animation: wave 10s linear infinite; */
-}
-
-.dz {
-	margin-left: 450rpx;
-	display: flex;
-}
-
-.pl {
-	margin-left: 80rpx;
-	display: flex;
-}
-#t {
-	font-size: 25rpx;
-	color: #bbbbbb;
-	margin-left: 5rpx;
-	margin-top: 10rpx;
-}
 </style>
diff --git a/pages_read_circle/pages/readCircle/readCircleNR.vue b/pages_read_circle/pages/readCircle/readCircleNR.vue
index 50a0dec2fe39bf4e23c40ddad80b85d2315ded19..20645424914feac25187cd6c50c1bfe4fd7c9bbc 100644
--- a/pages_read_circle/pages/readCircle/readCircleNR.vue
+++ b/pages_read_circle/pages/readCircle/readCircleNR.vue
@@ -1,189 +1,255 @@
 <template>
-	<view>
-	<view class="top">
-		<view class="topone">
-			<navigator url="readCircleXQ">
-			<image src="../../static/images/after.jpg" style="width: 120rpx; height: 120rpx;border-radius: 10rpx;"></image>
-			</navigator>
-			<view class="wz">
-				<view class="biaoti">
-					三味书屋
-				</view>
-				<view class="xbiaoti">
-					<span>成员 2000</span>
-					<span>圈文2.9w</span>
-				</view>
-			</view>
-		</view>
-		<button class="bt" @click="cl">退出</button>
-	</view>	
-	<view class="mid">
-				<view class="container">
-					<scroll-view 
-					class="scroll-container" 
-					scroll-x 
-					scroll-with-animation 
-					v-if="brands.length > 1" 
-					:scroll-into-view="'s' + currentIndex">
-						<view :class="['scroll-item', { active: index == currentId }]" 
-						:id="'s' + index" 
-						v-for="(item, index) in brands"
-						:key="index" 
-						@tap="handleScroll(index)">
-						{{ item }}
-							<view class="bottom-border" v-if="index == currentId">
-								<!-- 底部蓝色短border -->
-							</view>
-						</view>
-					</scroll-view>
-				</view>
-				
-				<!--圈文-->
-				<view v-if="currentId===1">
-					<Orders></Orders>
-				</view>
-				<!-- 公告-->
-				<view v-else>
-					<Logistic></Logistic>
-				</view>	
-			</view>
-	<!-- 发布 -->
-	<navigator url="/pages_read_circle/pages/index/publish">
-	<button class="btn" style="background-color: #6C40F3;"><image class="btnima" src="../../static/images/add_icon.png" style="width: 50rpx;height: 50rpx;"></image></button>
-	</navigator>
-	</view>
+  <view>
+	  <!-- 标题 -->
+	  <u-navbar zhead="65rpx" height="44" title="圈子详情" title-color="white" title-size="40" :background="background"
+	   back-icon-color="white" back-icon-size="50">
+	  	<view class="navbar-right" slot="right">
+	  		<view class="right_list" @click="bindInBatch">
+	  		</view>
+	  	</view>
+	  </u-navbar>
+    <view class="top">
+      <view class="topone">
+        <navigator url="readCircleXQ">
+          <image
+            :src="$s.getImageUrl(circle.images)"
+            style="width: 120rpx; height: 120rpx; border-radius: 10rpx"
+          ></image>
+        </navigator>
+        <view class="wz">
+          <view class="biaoti"> {{circle.name}} </view>
+          <view class="xbiaoti">
+            <span>成员 {{circle.number}}</span>
+            <span>圈文2.9w</span>
+          </view>
+        </view>
+      </view>
+      <button class="bt" @click="cl">{{isReader?'退出':'加入'}}</button>
+    </view>
+    <view class="mid">
+      <view class="container">
+        <scroll-view
+          class="scroll-container"
+          scroll-x
+          scroll-with-animation
+          v-if="brands.length > 1"
+          :scroll-into-view="'s' + currentIndex"
+        >
+          <view
+            :class="['scroll-item', { active: index == currentId }]"
+            :id="'s' + index"
+            v-for="(item, index) in brands"
+            :key="index"
+            @tap="handleScroll(index)"
+          >
+            {{ item }}
+            <view class="bottom-border" v-if="index == currentId">
+              <!-- 底部蓝色短border -->
+            </view>
+          </view>
+        </scroll-view>
+      </view>
+
+      <!--圈文-->
+      <view v-if="currentId === 1">
+        <Orders></Orders>
+      </view>
+      <!-- 公告-->
+      <view v-else>
+        <Logistic></Logistic>
+      </view>
+    </view>
+    <!-- 发布 -->
+    <navigator url="/pages_read_circle/pages/index/publish">
+      <button class="btn" style="background-color: #6c40f3">
+        <image
+          class="btnima"
+          src="/static/images/add_icon.png"
+          style="width: 50rpx; height: 50rpx"
+        ></image>
+      </button>
+    </navigator>
+  </view>
 </template>
 
 <script>
-	import Logistic from '../readCirclepage/CircleNR_Life.vue'
-	import Orders from '../readCirclepage/CircleNR_Right.vue'
-	export default {
-		data() {
-			return {
-				currentId:'',/* 控制被选中 */
-				brands:[
-					'圈文',
-					'公告',
-				]
-			};
-		},
-
-		onLoad: function() {},
-		components: {
-			// Fail,
-			Orders,
-			// Trade,
-			Logistic,
-		},
-		onNavigationBarButtonTap(e) {
-		    console.log("success")        
+import Logistic from "../readCirclepage/CircleNR_Life.vue";
+import Orders from "../readCirclepage/CircleNR_Right.vue";
+const app = getApp();
+export default {
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
 		},
-		methods: {
-			handleScroll(index) {
-				this.currentId = index;
-				console.log(this.currentId)
-			},
-			cl(){
-				uni.showModal({
-					title:'提示',
-					content:'是否退出该圈子',
-					success:function (res) {
-						if(res.confirm){
-							console.log('确认');
-						}
-						else if (res.cancel){
-							console.log('取消');
-						}
-					}
-				});
-			}
-		},
-	}
+      currentId: "" /* 控制被选中 */,
+      brands: ["圈文", "公告"],
+      circleId: 0,//圈子id
+      circle:{},//圈子基本信息
+      isReader:false,//当前读者是否已经关注
+    };
+  },
 
+  onLoad(query) {
+    console.log(query.circleId);
+    app.myRequest({
+      url: "circle/getCircleById",
+      type: 'POST',
+      data:{circleId:query.circleId}
+    }).then(res=>{
+      if(res.code===200){
+        this.circle = res.data.circle
+        this.isReader = res.data.isReader
+      }
+    }).catch(err=>{
+      console.log("err",err);
+    })
+  },
+  components: {
+    // Fail,
+    Orders,
+    // Trade,
+    Logistic,
+  },
+  onNavigationBarButtonTap(e) {
+    console.log("success");
+  },
+  methods: {
+    handleScroll(index) {
+      this.currentId = index;
+      console.log(this.currentId);
+    },
+    cl() {
+      let circleId = this.circle.circleId
+      const that = this;
+      if(this.isReader){
+        uni.showModal({
+          title: "提示",
+          content: "是否退出该圈子",
+          success: function (res) {
+            if (res.confirm) {
+              app.myRequest({
+                url: "circleReader/exitCircle",
+                type: 'GET',
+                data:{circleId}
+              }).then(res=>{
+                if(res.code===200){
+                  that.isReader = false;
+                  that.$u.toast("退出成功")
+                }else {
+                  throw new Error("退出失败")
+                }
+              }).catch(err=>{
+                that.$u.toast("退出失败")
+              })
+            } else if (res.cancel) {
+              console.log("取消");
+            }
+          },
+        });
+      }else {
+        app.myRequest({
+          url: "circleReader/joinCircle",
+          type: 'GET',
+          data:{circleId}
+        }).then(res=>{
+          if(res.code===200){
+            this.isReader = true;
+            this.$u.toast("加入成功")
+          }else {
+            throw new Error("加入失败")
+          }
+        }).catch(err=>{
+          this.$u.toast("加入失败")
+        })
+      }
+    },
+  },
+};
 </script>
 
 <style lang="scss" scoped>
-	/* 顶部内容 */
-.top{
+/* 顶部内容 */
+.top {
 }
-.topone{
-	margin-left: 30rpx;
-	margin-top: 40rpx;
-	display: flex;
+.topone {
+  margin-left: 30rpx;
+  margin-top: 40rpx;
+  display: flex;
 }
-.wz{
-	margin-top: 15rpx;
+.wz {
+  margin-top: 15rpx;
 }
-.biaoti{
-	margin-left: 20rpx;
-	font-size: 32rpx;
+.biaoti {
+  margin-left: 20rpx;
+  font-size: 32rpx;
 }
-.xbiaoti span{
-	color: #333333;
-	margin-left: 20rpx;
-	font-size: 25rpx;
+.xbiaoti span {
+  color: #333333;
+  margin-left: 20rpx;
+  font-size: 25rpx;
 }
-.bt{
-	width: 120rpx;
-	border-radius: 45rpx;
-	color: #ffffff;
-	font-size: 22rpx;
-	/* margin-left: 200rpx; */
-	margin-right: 30rpx;
-	margin-top: -90rpx;
-	background-color: #00BFFF;
+.bt {
+  width: 120rpx;
+  border-radius: 45rpx;
+  color: #ffffff;
+  font-size: 22rpx;
+  /* margin-left: 200rpx; */
+  margin-right: 30rpx;
+  margin-top: -90rpx;
+  background-color: #00bfff;
 }
-.mid{
-	// background-color: ;
-	margin-top: 50rpx;
+.mid {
+  // background-color: ;
+  margin-top: 50rpx;
 }
 // tab切换
 .scroll-container {
-    // box-sizing: border-box;
-    padding-left: 30upx;
-    white-space: nowrap;
-    height: 90upx;
-    background: #fff;
-	border-top: 0upx solid #EEEEEE;
-    border-bottom: 5upx solid #EEEEEE;
-    .scroll-item {
-      text-align: center;
+  // box-sizing: border-box;
+  padding-left: 30upx;
+  white-space: nowrap;
+  height: 90upx;
+  background: #fff;
+  border-top: 0upx solid #eeeeee;
+  border-bottom: 5upx solid #eeeeee;
+  .scroll-item {
+    text-align: center;
+    display: inline-block;
+    padding: 0 145upx;
+    line-height: 70upx;
+    font-size: 32upx;
+    font-weight: 400;
+    color: #1e1e1e;
+
+    &.active {
       display: inline-block;
-      padding: 0 145upx;
-      line-height: 70upx;
+      font-weight: bold;
+      color: #00bfff;
       font-size: 32upx;
-      font-weight: 400;
-      color: #1e1e1e;
-
-      &.active {
-        display: inline-block;
-        font-weight: bold;
-        color: #00BFFF;
-        font-size: 32upx;
-      }
-    }
-
-    .bottom-border {
-      margin: 0 auto;
-      width: 55upx;
-      height: 5upx;
-	  background: #00BFFF;
-      border-radius: 5upx;
-	  border: 1upx;
     }
   }
-  // 发布
-  .btn{
-  	background-color: #5251F5;
-  	position:fixed;
-  	bottom: 10rpx;
-	margin-left: 640rpx;
-  	width:100rpx;
-	height: 100rpx;
-  	border-radius: 100%;
+
+  .bottom-border {
+    margin: 0 auto;
+    width: 55upx;
+    height: 5upx;
+    background: #00bfff;
+    border-radius: 5upx;
+    border: 1upx;
   }
- .btnima{
-	 margin-left: -4rpx;
-	 margin-top: 25rpx;
- } 
+}
+// 发布
+.btn {
+  background-color: #5251f5;
+  position: fixed;
+  bottom: 10rpx;
+  margin-left: 640rpx;
+  width: 100rpx;
+  height: 100rpx;
+  border-radius: 100%;
+}
+.btnima {
+  margin-left: -4rpx;
+  margin-top: 25rpx;
+}
 </style>
diff --git a/pages_read_circle/pages/readCircle/readCircleNew.vue b/pages_read_circle/pages/readCircle/readCircleNew.vue
index d9b1d763f0ca59be27fa15f745388eeead9efb45..911c4a6ba7b0d8449fce6b3515d55f75b9356133 100644
--- a/pages_read_circle/pages/readCircle/readCircleNew.vue
+++ b/pages_read_circle/pages/readCircle/readCircleNew.vue
@@ -1,176 +1,222 @@
 <template>
-	<view class="all">
-			<form>
-				<!-- 头部三个 -->
-				<view class="top">
-				<view class="topone">
-					<view class="title">书圈名</view>
-					<view class="shuru">
-						<input placeholder="请输入书圈名" name="input"></input>
-					</view>
+	<view>
+		<!-- 标题 -->
+		<u-navbar zhead="65rpx" height="44" title="新建圈子" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
 				</view>
-				<!-- <view class="topone">
-					<view class="title">公告</view>
-					<view class="shuru">
-						<input placeholder="请输入公告内容" name="input"></input>
-					</view>
-				</view> -->
-				<!-- 公告 -->
-				<view class="toptwo">
-					<view class="jjtitle">公告</view>
-					<view class="jjNR">
-						<textarea class="jjk" placeholder="请输入公告内容" maxlength="200"></textarea>
-					</view>
-				</view>
-				<!-- 简介 -->
-				<view class="toptwo">
-					<view class="jjtitle">简介</view>
-					<view class="jjNR">
-						<textarea class="jjk" placeholder="请输入简介内容" maxlength="200"></textarea>
-					</view>
-				</view>
-				<!-- 书圈头像-->
-				<view class="topthree">
-					<view class="tptitle">头像</view>
-					<view class="img">
-						<image class="wa" src="../../static/images/tj.jpg" :loading="loading" :disabled="disabled" @click="upload"></image>
-					</view>
-				</view>
-				<button class="tj" form-type="submit">提交</button>
 			</view>
-			</form>
-	</view>
+		</u-navbar>
+  <view class="all">
+    <form>
+      <!-- 头部三个 -->
+      <view class="top">
+        <view class="topone">
+          <view class="title">书圈名</view>
+          <view class="shuru">
+            <input v-model="formData.name" placeholder="请输入书圈名" name="input"/>
+          </view>
+        </view>
+        <!-- <view class="topone">
+          <view class="title">公告</view>
+          <view class="shuru">
+            <input placeholder="请输入公告内容" name="input"></input>
+          </view>
+        </view> -->
+        <!-- 公告 -->
+<!--        <view class="toptwo">
+          <view class="jjtitle">公告</view>
+          <view class="jjNR">
+            <textarea class="jjk" placeholder="请输入公告内容" maxlength="200"></textarea>
+          </view>
+        </view>-->
+        <!-- 简介 -->
+        <view class="toptwo">
+          <view class="jjtitle">简介</view>
+          <view class="jjNR">
+            <textarea v-model="formData.summary" class="jjk" placeholder="请输入简介内容" maxlength="200"></textarea>
+          </view>
+        </view>
+        <!-- 书圈头像-->
+        <view class="topthree">
+          <view class="tptitle">头像</view>
+          <view class="img">
+            <u-image class="wa" :src="imagePath" @tap="chooseAvatar" mode="aspectFill"></u-image>
+          </view>
+        </view>
+        <button class="tj" @tap="submitForm">提交</button>
+      </view>
+    </form>
+  </view>
+  </view>
 </template>
 
 <script>
-	var _self;
-	export default {
-	 data:{
-	  percent:0,
-	  loading:false,
-	  disabled:false
-	 },
-	 methods : {
-	  upload : function(){
-	   _self = this;
-	   uni.chooseImage({
-	    count: 1,
-	    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
-	    sourceType: ['album'], //从相册选择
-	    success: function (res) {
-	     const tempFilePaths = res.tempFilePaths;
-	     const uploadTask = uni.uploadFile({
-	      url : "https://jxsbbx.gzmu.edu.cn/schoolcloud/",
-	      filePath: tempFilePaths[0],
-	      name: 'file',
-		  // fileType: 'image',
-	      formData: {
-	       'user': 'test'
-	      },
-	      success: function (uploadFileRes) {
-	       console.log(uploadFileRes.data);
-	      }
-	     });
-	 
-	     uploadTask.onProgressUpdate(function (res) {
-	      _self.percent = res.progress;
-	      console.log('上传进度' + res.progress);
-	      console.log('已经上传的数据长度' + res.totalBytesSent);
-	      console.log('预期需要上传的数据总长度' + res.totalBytesExpectedToSend);
-	     });
-	    },
-	    error : function(e){
-	     console.log(e);
-	    }
-	   });
-	  }
-	 },
-	    onLoad:function(){
-	  
-	    }
-	}
+import login from "../../../pages/login/login";
+
+const app = getApp()
+export default {
+  data(){
+    return{
+		background: {
+			background: "#6C40F3",
+		},
+      formData:{
+        images:"",
+        name:"",
+        summary:""
+      },
+      imagePath:"",
+      percent:0,
+      loading:false,
+      disabled:false,
+      fileList: []
+    }
+  },
+  methods : {
+    chooseAvatar() {
+      this.$u.route({
+        // 关于此路径，请见下方"注意事项"
+        url: '/uview-ui/components/u-avatar-cropper/u-avatar-cropper',
+        params: {
+          destWidth: 300,
+          rectWidth: 300,
+          fileType: 'jpg',
+        }
+      })
+    },
+    submitForm(){
+      app.myRequest({
+        url:"circle/addCircle",
+        type:"POST",
+        data:this.formData
+      }).then(res=>{
+        this.$u.toast(res.message)
+        console.log(res.code);
+        if(res.code == 200){
+          uni.navigateTo({
+            url:"/pages_read_circle/pages/readCircle/readCircle"
+          })
+        }
+      }).catch(err=>{
+        this.$u.toast("创建失败")
+      })
+    }
+  },
+  created(){
+    // 监听从裁剪页发布的事件，获得裁剪结果
+    uni.$on('uAvatarCropper', path => {
+      const that = this;
+      that.imagePath = path;
+      uni.showLoading({title:"正在上传",mask:true})
+      // 可以在此上传到服务端
+      uni.uploadFile({
+        url: that.$s.config.URL.uploadServer,
+        filePath: path,
+        name: 'multipartFile',
+        complete: (res) => {
+          uni.hideLoading()
+          if(res.data){
+            let data = JSON.parse(res.data)
+            if(data.errno===0 && data.data.length){
+              that.formData.images = data.data[0]
+              that.$u.toast("上传成功")
+              return;
+            }
+          }
+          that.$u.toast("上传失败")
+        }
+      });
+    })
+  },
+  onLoad:function(){
+
+  }
+}
 </script>
 
 <style>
-	/* 所有 */
+/* 所有 */
 .all{
-	width: 100%;
-	height: 800rpx;
-	background-color: #F1F1F1;
+  width: 100%;
+  height: 800rpx;
+  background-color: #F1F1F1;
 }
 .top{
-	/* margin-top: 20rpx; */
+  /* margin-top: 20rpx; */
 }
 /* 书圈名 */
 .topone{
-	/* margin-top: 20rpx; */
-	/* background-color: #00BFFF; */
-	display: flex;
+  /* margin-top: 20rpx; */
+  /* background-color: #00BFFF; */
+  display: flex;
 }
 .title{
-	margin-top: 50rpx;
-	margin-left: 30rpx;
-	width: 18%;
-	/* background-color: #0000FF; */
+  margin-top: 50rpx;
+  margin-left: 30rpx;
+  width: 18%;
+  /* background-color: #0000FF; */
 }
 .shuru{
-	margin-left: 5rpx;
-	margin-top: 50rpx;
-	width: 550rpx;
-	height: 60rpx;
-	border-radius: 10rpx;
-	background-color: #FFFFFF;
-	border:1rpx solid #C0C0C0;
+  margin-left: 5rpx;
+  margin-top: 50rpx;
+  width: 550rpx;
+  height: 60rpx;
+  border-radius: 10rpx;
+  background-color: #FFFFFF;
+  border:1rpx solid #C0C0C0;
 }
 .shuru input{
-	margin: 10rpx 15rpx;
-	font-size: 26rpx;
+  margin: 10rpx 15rpx;
+  font-size: 26rpx;
 }
 /* 简介 */
 .toptwo{
-	display: flex;
+  display: flex;
 }
 .jjtitle{
-	margin-top: 60rpx;
-	margin-left: 30rpx;
-	width: 18%;
+  margin-top: 60rpx;
+  margin-left: 30rpx;
+  width: 18%;
 }
 .jjNR{
-	margin-left: 5rpx;
-	margin-top: 50rpx;
-	border-radius: 10rpx;
-	background-color: #FFFFFF;
-	border:1rpx solid #C0C0C0;
+  margin-left: 5rpx;
+  margin-top: 50rpx;
+  border-radius: 10rpx;
+  background-color: #FFFFFF;
+  border:1rpx solid #C0C0C0;
 }
 .jjk{
-	margin: 10rpx 15rpx;
-	font-size: 26rpx;
-	width: 520rpx;
-	height: 160rpx;
+  margin: 10rpx 15rpx;
+  font-size: 26rpx;
+  width: 520rpx;
+  height: 160rpx;
 }
 /* 头像*/
 .topthree{
-	display: flex;
+  display: flex;
 }
 .tptitle{
-	margin-top: 60rpx;
-	margin-left: 30rpx;
-	width: 18%;
+  margin-top: 60rpx;
+  margin-left: 30rpx;
+  width: 18%;
 }
 .wa{
-	width: 135rpx;
-	height: 135rpx;
-	margin: 50rpx 5rpx ;
-	border: 3rpx dashed #C0C0C0;
-	}
+  display: flex;
+  width: 135rpx !important;
+  height: 135rpx !important;
+  margin: 50rpx 5rpx ;
+  border: 3rpx dashed #C0C0C0;
+}
 .tj{
-	/* margin-bottom: 0rpx; */
-	/* marker-end: 0rpx; */
-	color: #FFFFFF;
-	background-color: #5251F5;
-	position:fixed;
-	bottom: 0;
-	width:100%;
-	border-radius: 0rpx;
+  /* margin-bottom: 0rpx; */
+  /* marker-end: 0rpx; */
+  color: #FFFFFF;
+  background-color: #5251F5;
+  position:fixed;
+  bottom: 0;
+  width:100%;
+  border-radius: 0rpx;
 }
 </style>
diff --git a/pages_read_circle/pages/readCircle/readCircleXQ.vue b/pages_read_circle/pages/readCircle/readCircleXQ.vue
index 4efce00f6166afc3a1301d0e9f164f59e7f0c271..f8af66cb04adee5271b0cbf1f631bf60d7f81713 100644
--- a/pages_read_circle/pages/readCircle/readCircleXQ.vue
+++ b/pages_read_circle/pages/readCircle/readCircleXQ.vue
@@ -1,5 +1,13 @@
 <template>
 	<view>
+		<!-- 标题 -->
+		<u-navbar zhead="65rpx" height="44" title="圈子详情" title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
 		<view class="container">
 			<scroll-view 
 			class="scroll-container" 
@@ -40,6 +48,9 @@
 	export default {
 		data() {
 			return {
+				background: {
+					background: "#6C40F3",
+				},
 				currentId:'',/* 控制被选中 */
 				brands:[
 					'信息',
diff --git a/pages_read_circle/pages/readCircle/readExperience.vue b/pages_read_circle/pages/readCircle/readExperience.vue
index eb3978bc3cfa5056b7e07496a671e7c910d87ef7..0c18795f666bfe10e84b0241fa131f6013ab6a71 100644
--- a/pages_read_circle/pages/readCircle/readExperience.vue
+++ b/pages_read_circle/pages/readCircle/readExperience.vue
@@ -1,45 +1,40 @@
 <template>
-		<view class="under">
-			<view class="show">
-				<view class="showone">
-					<view class="li">
-						<image class="toux" src="../../static/images/头像2.jpg" style="width: 80rpx; height: 80rpx;"></image>
-						<view class="name">爱书的猫</view>
-						<view class="vip">LV.11</view>
-						<view class="time">2017-05-05 15:32</view>
-					</view>
-					<view class="zy">
-						<text>
-							在外祖父卡什林家。外祖父家住在尼日尼——诺弗哥罗德城。外祖父年轻时，是一个纤夫，后来开染坊，成了小业主。阿廖沙来到外祖父家时，外祖父家业已经开始衰落，由于家业不景气，外祖父变得也愈加专横暴躁。阿廖沙的两个舅舅米哈伊尔和雅科夫为了分家和侵吞阿廖沙母亲的嫁妆而不断地争吵、斗殴。
-							后来，外祖父迁居到卡那特街，招了两个房客。一个是进步的知识分子，绰号叫“好事情”，他是阿廖沙所遇到的第一个优秀人物，他给阿廖沙留下了难以磨灭的印象。另一个是抢劫教堂后伪装成车夫的彼得，他的残忍和奴隶习气引起了阿廖沙的反感。
-							阿廖沙在家中感受不到温暖，在学校也受歧视和刁难。因此，在阿廖沙的心灵中，“爱”的情感渐渐被对一切的恨所代替。由于和后父不合，阿廖沙又回到外祖父家中，这时外祖父已经全面破产!他们的生活也越来越困苦。为了糊口阿廖沙放学后同邻居的孩子们合伙拣破烂卖。同时，也感受到了友谊和同情。但这也招致学校的非难。他以优异的成绩读完了三年级，就永远地离开了学校课堂。
-							这时候阿廖沙母亲逝世，他埋葬了母亲以后，不久便到“人间”去谋生。
-						</text>
-					</view>
-					<view class="tab">
-						<view class="imgs">
-							<image class="img" src="../../static/images/书1.jpg" style="width: 220rpx; height: 240rpx;"></image>
-							<image class="img" src="../../static/images/书3.jpg" style="width: 220rpx; height: 240rpx;"></image>
-							<image class="img" src="../../static/images/书2.jpg" style="width: 220rpx; height: 240rpx;"></image>
-						</view>
+	<view>
+		<!-- 标题 -->
+		<u-navbar zhead="65rpx" height="44" title=" " title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
+			</view>
+		</u-navbar>
+	<view class="under">
+		<view class="show">
+			<view class="showone">
+				<view class="li" @click="toPersonalHome(info.other.rank.reader.readerId)">
+					<image class="toux" :src="info.other.rank.reader.avatar" style="width: 80rpx; height: 80rpx"></image>
+					<view class="name">{{info.other.rank.reader.readerName}}</view>
+					<view class="vip">LV.{{info.other.rank.max}}</view>
+					<view class="time">{{info.issueTime}}</view>
+				</view>
+				<view class="zy">
+					<text>
+						{{info.other.content}}
+					</text>
+				</view>
+				<view class="pictrue" v-if="info.issueImags != 0">
+					<view class="imgs" v-for="iamg in info.issueImags" >
+						<image @click="imgYu" :data-img="iamg" :data-list="iamg" class="img" :src="iamg" style="width: 236rpx; height: 236rpx;"></image>
 					</view>
 				</view>
-				
-				<!-- 点赞评论 tab切换-->
-				<view class="showtwo">
+			</view>
+			<!-- 点赞评论 tab切换-->
+			<view class="showtwo">
 				<view class="container">
-					<scroll-view 
-					class="scroll-container" 
-					scroll-x 
-					scroll-with-animation 
-					v-if="brands.length > 1" 
-					:scroll-into-view="'s' + currentIndex">
-						<view :class="['scroll-item', { active: index == currentId }]" 
-						:id="'s' + index" 
-						v-for="(item, index) in brands"
-						:key="index" 
-						@tap="handleScroll(index)">
-						{{ item }}
+					<scroll-view class="scroll-container" scroll-x scroll-with-animation v-if="brands.length > 1" :scroll-into-view="'s' + currentIndex">
+						<view :class="['scroll-item', { active: index == currentId }]" :id="'s' + index" v-for="(item, index) in brands"
+						 :key="index" @tap="handleScroll(index)">
+							{{ item }}
 							<view class="bottom-border" v-if="index == currentId">
 								<!-- 底部蓝色短border -->
 							</view>
@@ -47,200 +42,272 @@
 					</scroll-view>
 				</view>
 				
-				<!--评论-->
-				<view v-if="currentId===1">
-					<Orders></Orders>
+				<!--点赞-->
+				<view v-if="currentId === 1">
+					<Orders ref="Orders" :praiseList="praiseList"></Orders>
 				</view>
-				<!-- 点赞 -->
+				<!-- 评论 -->
 				<view v-else>
-					<Logistic></Logistic>
-				</view>	
+					<Logistic ref="Logistic" :commentList="commentList"></Logistic>
+				</view>
 			</view>
 		</view>
 	</view>
+	</view>
 </template>
 
 <script>
-	import Logistic from '../readCirclepage/readExperPL.vue'
-	import Orders from '../readCirclepage/readExperDZ.vue'
+	let app = getApp();
+	import Logistic from "../readCirclepage/readExperPL.vue";
+	import Orders from "../readCirclepage/readExperDZ.vue";
 	export default {
 		data() {
 			return {
-				currentId:'',/* 控制被选中 */
-				brands:[
-					'评论',
-					'点赞',
-				]
+				background: {
+					background: "#6C40F3",
+				},
+				currentId: "" /* 控制被选中 */ ,
+				brands: ["评论", "点赞"],
+				issueType: 1,//发布的类型 1心得
+				page: 0,
+				size: 10,
+				sort:"id,desc" ,// 按照发布时间排序
+				info:{},
+				imgList:[],
+				commentList:[],
+				praiseList:[],
 			};
 		},
 
-		onLoad: function() {},
+		onLoad: function(e) {
+			let id = parseInt(e.id);
+			this.getInfo(id);
+			this.$refs.Logistic.getCommentList(this.commentList,this.info.commentNum);
+		},
 		components: {
-			// Fail,
 			Orders,
-			// Trade,
 			Logistic,
 		},
 		onNavigationBarButtonTap(e) {
-		    console.log("success")        
+			console.log("success");
 		},
 		methods: {
+			//获取内容
+			async getInfo(id) {
+				var that = this;
+				var params = {
+					url: "circleReviewContent/query",
+					type: 'GET',
+					data: {
+						issueType: that.issueType,
+						id: id,
+						page: that.page,
+						size: that.size,
+						sort: that.sort,
+					}
+				}
+				const res = await app.myRequest(params);
+				console.log("后台传来的：",res);
+				that.info = res.contentMap[0];
+				console.log("赋值后：",that.info);
+				that.commentList = res.commentList
+				that.praiseList = res.praiseList
+			},
+			
+			//图片点击事件
+			imgYu(event) {
+				console.log(event);
+				var src = event.currentTarget.dataset.src; //获取data-src
+				this.imgList = [event.currentTarget.dataset.list]; //获取data-list
+				console.log("图片路径list",this.imgList)
+				//图片预览
+				let that = this;
+				uni.previewImage({
+					current: src, // 当前显示图片的http链接
+					urls: that.imgList // 需要预览的图片http链接列表
+				})
+			},
+			
+			//去他的主页
+			toPersonalHome(friendId) {
+				uni.navigateTo({
+					url: "/pages/friend/friendXQ?friendId=" + friendId,
+				})
+			},
+			
 			handleScroll(index) {
 				this.currentId = index;
-				console.log(this.currentId)
+				console.log(this.currentId);
+				// if(index==0){
+				// 	this.$refs.Logistic.getCommentList(this.commentList,this.info.commentNum);
+				// }else{
+				// 	this.$refs.Orders.getPraiseList(this.praiseList,this.info.praiseNum);
+				// }
 			},
 		},
-	}
-
+	};
 </script>
 
 <style lang="scss" scoped>
-.under {
-	// line-height: 150rpx;
-	/* 设置行高*/
-	height: 2000rpx;
-}
-
-.show {
-	/* margin-top: 40rpx; */
-}
-
-.showone {
-	// line-height: 150rpx;
-	color: #999999;
-	height: auto;
-	margin-top: 30rpx;
-	/* background-color: #18C7F2; */
-	border-bottom: 15rpx solid #f1f1f1;
-}
-
-.person {
-	line-height: 20rpx;
-	display: flex;
-}
-.imagetwo {
-	margin-top: 0rpx;
-	margin-left: 20rpx;
-}
-
-.zzname {
-	font-size: 30rpx;
-	margin: 20rpx;
-	top: 90rpx;
-	color: #00bfff;
-}
-
-.bn {
-	height: 100%;
-	margin-top: 20rpx;
-}
-.tw {
-	margin-top: -130rpx;
-	margin-left: 500p;
-}
-
-.zztime {
-	font-size: 20rpx;
-	margin-top: 190rpx;
-	margin-left: -110rpx;
-}
-.delate {
-	margin-left: 400rpx;
-	margin-top: 20rpx;
-	background-color: #00bfff;
-	width: 28rpx;
-	height: 30rpx;
-}
-.zy {
-	margin-top: 10rpx;
-	line-height: 40rpx;
-	margin-left: 25rpx;
-	margin-right: 20rpx;
-	font-size: 28rpx;
-	font-weight: 300rpx;
-	color: #555555;
-}
-.tab {
-	height: 250rpx;
-	margin: 10rpx 10rpx;
-}
-.imgs {
-	display: flex;
-	width: 95%;
-	margin-left: 20rpx;
-	margin-top: 10rpx;
-}
-.img {
-	size: 100%;
-	margin: 10rpx 12rpx;
-}
-// tab切换
-.scroll-container {
-    // box-sizing: border-box;
-    padding-left: 30upx;
-    white-space: nowrap;
-    height: 90upx;
-    background: #fff;
-	// border-top: 15upx solid #EEEEEE;
-    border-bottom: 15upx solid #EEEEEE;
-    .scroll-item {
-      text-align: center;
-      display: inline-block;
-      padding: 0 145upx;
-      line-height: 70upx;
-      font-size: 32upx;
-      font-weight: 400;
-      color: #1e1e1e;
-
-      &.active {
-        display: inline-block;
-        font-weight: bold;
-        color: #00BFFF;
-        font-size: 32upx;
-      }
-    }
-
-    .bottom-border {
-      margin: 0 auto;
-      width: 55upx;
-      height: 5upx;
-	  background: #00BFFF;
-      border-radius: 5upx;
-	  border: 1upx;
-    }
-  }
-
-// 头部
-.toux {
-	border-radius: 50%;
-	margin: 20rpx 20rpx;
-}
-
-.li {
-	display: flex;
-}
-.name {
-	color: #00aaff;
-	margin-top: 35rpx;
-	font-size: 30rpx;
-	// background-color: #007AFF;
-}
-.vip {
-	color: #f0ad4e;
-	font-size: 25rpx;
-	border-radius: 10rpx;
-	border: 1rpx solid #f0ad4e;
-	height: 35rpx;
-	margin-top: 38rpx;
-	background-color: #ffffff;
-	text-align: center;
-	width: 80rpx;
-	margin-left: 10rpx;
-}
-.time {
-	color: #8f8f94;
-	font-size: 25rpx;
-	margin-left: 200rpx;
-	margin-top: 37rpx;
-}
+	.under {
+		// line-height: 150rpx;
+		/* 设置行高*/
+		height: 2000rpx;
+	}
+
+	.show {
+		/* margin-top: 40rpx; */
+	}
+
+	.showone {
+		// line-height: 150rpx;
+		color: #999999;
+		height: auto;
+		margin-top: 30rpx;
+		/* background-color: #18C7F2; */
+		border-bottom: 15rpx solid #f1f1f1;
+	}
+
+	.person {
+		line-height: 20rpx;
+		display: flex;
+	}
+
+	.imagetwo {
+		margin-top: 0rpx;
+		margin-left: 20rpx;
+	}
+
+	.zzname {
+		font-size: 30rpx;
+		margin: 20rpx;
+		top: 90rpx;
+		color: #00bfff;
+	}
+
+	.bn {
+		height: 100%;
+		margin-top: 20rpx;
+	}
+
+	.tw {
+		margin-top: -130rpx;
+		margin-left: 500p;
+	}
+
+	.zztime {
+		font-size: 20rpx;
+		margin-top: 190rpx;
+		margin-left: -110rpx;
+	}
+
+	.delate {
+		margin-left: 400rpx;
+		margin-top: 20rpx;
+		background-color: #00bfff;
+		width: 28rpx;
+		height: 30rpx;
+	}
+
+	.zy {
+		margin: 10rpx 20rpx;
+		line-height: 40rpx;
+		font-size: 28rpx;
+		font-weight: 300rpx;
+		color: #555555;
+		padding-bottom: 15rpx;
+	}
+
+	.tab {
+		display: flex;
+		height: 270rpx;
+	}
+	
+	.pictrue {
+		display: flex;
+		height: 270rpx;
+		margin: 0rpx 15rpx;
+	}
+
+	.imgs {
+		display: flex;
+	}
+	
+	.img {
+		margin: 16rpx 5rpx;
+	}
+
+	// tab切换
+	.scroll-container {
+		// box-sizing: border-box;
+		padding-left: 30upx;
+		white-space: nowrap;
+		height: 90upx;
+		background: #fff;
+		// border-top: 15upx solid #EEEEEE;
+		border-bottom: 15upx solid #eeeeee;
+
+		.scroll-item {
+			text-align: center;
+			display: inline-block;
+			padding: 0 145upx;
+			line-height: 70upx;
+			font-size: 32upx;
+			font-weight: 400;
+			color: #1e1e1e;
+
+			&.active {
+				display: inline-block;
+				font-weight: bold;
+				color: #00bfff;
+				font-size: 32upx;
+			}
+		}
+
+		.bottom-border {
+			margin: 0 auto;
+			width: 55upx;
+			height: 5upx;
+			background: #00bfff;
+			border-radius: 5upx;
+			border: 1upx;
+		}
+	}
+
+	// 头部
+	.toux {
+		border-radius: 50%;
+		margin: 20rpx 20rpx;
+	}
+
+	.li {
+		display: flex;
+	}
+
+	.name {
+		color: #00aaff;
+		margin-top: 35rpx;
+		font-size: 30rpx;
+		// background-color: #007AFF;
+	}
+
+	.vip {
+		color: #f0ad4e;
+		font-size: 25rpx;
+		border-radius: 10rpx;
+		border: 1rpx solid #f0ad4e;
+		height: 35rpx;
+		margin-top: 38rpx;
+		background-color: #ffffff;
+		text-align: center;
+		width: 80rpx;
+		margin-left: 10rpx;
+	}
+
+	.time {
+		color: #8f8f94;
+		font-size: 25rpx;
+		margin-left: 200rpx;
+		margin-top: 37rpx;
+	}
 </style>
diff --git a/pages_read_circle/pages/readCirclepage/CircleNR_Life.vue b/pages_read_circle/pages/readCirclepage/CircleNR_Life.vue
index 16d78dae01c6542bff6262c1ff1cd1876e71e4ce..4211d7e8ac23e439cf950b64a474df948bf6e81c 100644
--- a/pages_read_circle/pages/readCirclepage/CircleNR_Life.vue
+++ b/pages_read_circle/pages/readCirclepage/CircleNR_Life.vue
@@ -1,283 +1,339 @@
 <template name="Logistic">
-	<view>
-		<view class="underL">
-			<!-- 第一条心得 -->
-			<view class="show">
-				<view class="showone">
-					<view class="person">
-						<view class="tou">
-							<image src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="Ttitle">
-							<view class="Ntitle">
-								<view class="name">爱丽丝</view>
-								<view class="dj">
-								<view class="vip">LV.11</view>	
-								</view>
-							</view>
-							<view class="time">2020-08-09 14:10</view>	
-						</view>
-						</view>
-					<navigator url="/pages_read_circle/pages/readCircle/readExperience">
-					<view class="zy">
-						<text>
-							《预见未来》哈哈哈哈哈哈哈哈哈hhhhhhhhh哈哈哈哈哈哈哈哈哈哈哈灌灌灌帆帆帆帆烦烦烦哈哈哈哈哈哈哈哈哈哈后哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好好...
-						</text>
-					</view>
-					<view class="tab">
-						<view class="imgs">
-							<image class="img" src="../../static/images/书1.jpg" style="width: 220rpx; height: 240rpx;"></image>
-							<image class="img" src="../../static/images/书3.jpg" style="width: 220rpx; height: 240rpx;"></image>
-							<image class="img" src="../../static/images/书2.jpg" style="width: 220rpx; height: 240rpx;"></image>
-						</view>
-					</view>
-					</navigator>
-				</view>
-				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png" style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
-					</view>
-				</view>
-			</view>
-			<!-- 第二条心得 -->
-			<view class="show">
-				<view class="showone">
-					<view class="person">
-						<view class="tou">
-							<image src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="Ttitle">
-							<view class="Ntitle">
-								<view class="name">爱丽丝爱吃鱼</view>
-								<view class="dj">
-								<view class="vip">LV.11</view>	
-								</view>
-							</view>
-							<view class="time">2020-08-09 14:10</view>	
-						</view>
-						</view>
-					<view class="zy"><text>《来》今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text></view>
-					<view class="book">
-						<view class="bookone"><image class="booktp" src="../../static/images/书2.jpg" style="width: 130rpx; height: 180rpx;"></image></view>
-						<view class="bookn"><text class="bookname">最强帝国副瑞士</text></view>
-						<view class="zzn"><text class="zzname">雷迪</text></view>
-					</view>
-				</view>
-				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png" style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
-					</view>
-				</view>
-			</view>
-			<view class="show">
-				<view class="showone">
-					<view class="person">
-						<view class="tou">
-							<image src="../../static/images/头像2.jpg" style="width: 90rpx;height: 90rpx;border-radius: 50%;"></image>
-						</view>
-						<view class="Ttitle">
-							<view class="Ntitle">
-								<view class="name">爱丽丝爱吃鱼</view>
-								<view class="dj">
-								<view class="vip">LV.11</view>	
-								</view>
-							</view>
-							<view class="time">2020-08-09 14:10</view>	
-						</view>
-						</view>
-					<view class="zy"><text>今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text></view>
-				</view>
-		
-				<view class="showtwo">
-					<view class="dz">
-						<image class="wave" src="../../static/images/zan.png"></image>
-						<text id="t">9999</text>
-					</view>
-					<view class="pl">
-						<image class="wave" src="../../static/images/pinglun.png" style="width: 38rpx;height: 36rpx;"></image>
-						<text id="t">1.3w</text>
-					</view>
-				</view>
-			</view>
-		</view>
-	</view>
+  <view>
+	  <!-- 标题 -->
+	  <u-navbar zhead="65rpx" height="44" title=" " title-color="white" title-size="40" :background="background"
+	   back-icon-color="white" back-icon-size="50">
+	  	<view class="navbar-right" slot="right">
+	  		<view class="right_list" @click="bindInBatch">
+	  		</view>
+	  	</view>
+	  </u-navbar>
+    <view class="underL">
+      <!-- 第一条心得 -->
+      <view class="show">
+        <view class="showone">
+          <view class="person">
+            <view class="tou">
+              <image
+                src="/static/images/头像2.jpg"
+                style="width: 90rpx; height: 90rpx; border-radius: 50%"
+              ></image>
+            </view>
+            <view class="Ttitle">
+              <view class="Ntitle">
+                <view class="name">爱丽丝</view>
+                <view class="dj">
+                  <view class="vip">LV.11</view>
+                </view>
+              </view>
+              <view class="time">2020-08-09 14:10</view>
+            </view>
+          </view>
+          <navigator url="/pages_read_circle/pages/readCircle/readExperience">
+            <view class="zy">
+              <text>
+                《预见未来》哈哈哈哈哈哈哈哈哈hhhhhhhhh哈哈哈哈哈哈哈哈哈哈哈灌灌灌帆帆帆帆烦烦烦哈哈哈哈哈哈哈哈哈哈后哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好好...
+              </text>
+            </view>
+            <view class="tab">
+              <view class="imgs">
+                <image
+                  class="img"
+                  src="/static/images/书1.jpg"
+                  style="width: 220rpx; height: 240rpx"
+                ></image>
+                <image
+                  class="img"
+                  src="/static/images/书3.jpg"
+                  style="width: 220rpx; height: 240rpx"
+                ></image>
+                <image
+                  class="img"
+                  src="/static/images/书2.jpg"
+                  style="width: 220rpx; height: 240rpx"
+                ></image>
+              </view>
+            </view>
+          </navigator>
+        </view>
+        <view class="showtwo">
+          <view class="dz">
+            <image class="wave" src="/static/images/zan.png"></image>
+            <text id="t">9999</text>
+          </view>
+          <view class="pl">
+            <image
+              class="wave"
+              src="/static/images/pinglun.png"
+              style="width: 38rpx; height: 36rpx"
+            ></image>
+            <text id="t">1.3w</text>
+          </view>
+        </view>
+      </view>
+      <!-- 第二条心得 -->
+      <view class="show">
+        <view class="showone">
+          <view class="person">
+            <view class="tou">
+              <image
+                src="/static/images/头像2.jpg"
+                style="width: 90rpx; height: 90rpx; border-radius: 50%"
+              ></image>
+            </view>
+            <view class="Ttitle">
+              <view class="Ntitle">
+                <view class="name">爱丽丝爱吃鱼</view>
+                <view class="dj">
+                  <view class="vip">LV.11</view>
+                </view>
+              </view>
+              <view class="time">2020-08-09 14:10</view>
+            </view>
+          </view>
+          <view class="zy"
+            ><text
+              >《来》今
+              哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text
+            ></view
+          >
+          <view class="book">
+            <view class="bookone"
+              ><image
+                class="booktp"
+                src="/static/images/书2.jpg"
+                style="width: 130rpx; height: 180rpx"
+              ></image
+            ></view>
+            <view class="bookn"
+              ><text class="bookname">最强帝国副瑞士</text></view
+            >
+            <view class="zzn"><text class="zzname">雷迪</text></view>
+          </view>
+        </view>
+        <view class="showtwo">
+          <view class="dz">
+            <image class="wave" src="/static/images/zan.png"></image>
+            <text id="t">9999</text>
+          </view>
+          <view class="pl">
+            <image
+              class="wave"
+              src="/static/images/pinglun.png"
+              style="width: 38rpx; height: 36rpx"
+            ></image>
+            <text id="t">1.3w</text>
+          </view>
+        </view>
+      </view>
+      <view class="show">
+        <view class="showone">
+          <view class="person">
+            <view class="tou">
+              <image
+                src="/static/images/头像2.jpg"
+                style="width: 90rpx; height: 90rpx; border-radius: 50%"
+              ></image>
+            </view>
+            <view class="Ttitle">
+              <view class="Ntitle">
+                <view class="name">爱丽丝爱吃鱼</view>
+                <view class="dj">
+                  <view class="vip">LV.11</view>
+                </view>
+              </view>
+              <view class="time">2020-08-09 14:10</view>
+            </view>
+          </view>
+          <view class="zy"
+            ><text>今 哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈</text></view
+          >
+        </view>
+
+        <view class="showtwo">
+          <view class="dz">
+            <image class="wave" src="/static/images/zan.png"></image>
+            <text id="t">9999</text>
+          </view>
+          <view class="pl">
+            <image
+              class="wave"
+              src="/static/images/pinglun.png"
+              style="width: 38rpx; height: 36rpx"
+            ></image>
+            <text id="t">1.3w</text>
+          </view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
+export default {
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
 		},
-		methods: {
-			
-		}
-	}
+	};
+  },
+  methods: {},
+};
 </script>
 
 <style>
 /* 中间 */
 .underL {
-	line-height: 150rpx;
-	/* 设置行高*/
+  line-height: 150rpx;
+  /* 设置行高*/
 }
 
 .show {
-	height: auto;
-	margin-top: 40rpx;
-	color: #f1f1f1;
-	/* background-color: #000000; */
+  height: auto;
+  margin-top: 40rpx;
+  color: #f1f1f1;
+  /* background-color: #000000; */
 }
 
 .showone {
-	/* color: #999999; */
-	height: auto;
-	margin-top: 10rpx;
-	border-radius: 50rpx;
-	/* background-color: #0066CC; */
+  /* color: #999999; */
+  height: auto;
+  margin-top: 10rpx;
+  border-radius: 50rpx;
+  /* background-color: #0066CC; */
 }
 
 .person {
-	line-height: 20rpx;
-	display: flex;
-	height: 100rpx;
+  line-height: 20rpx;
+  display: flex;
+  height: 100rpx;
+}
+.tou {
+  margin-top: 0rpx;
+  margin-left: 20rpx;
 }
-.tou{
-	margin-top: 0rpx;
-	margin-left: 20rpx;
+.Ttitle {
+  height: 50rpx;
 }
-.Ttitle{
-	height: 50rpx;
+.Ntitle {
+  display: flex;
 }
-.Ntitle{
-	display: flex;
-	}
 .name {
-	height: 30rpx;
-	color: #00aaff;
-	margin-top: 20rpx;
-	font-size: 30rpx;
-	margin-left: 20rpx;
+  height: 30rpx;
+  color: #00aaff;
+  margin-top: 20rpx;
+  font-size: 30rpx;
+  margin-left: 20rpx;
 }
-.dj{
-	color: #f0ad4e;
-	font-size: 25rpx;
-	border-radius: 10rpx;
-	border: 1rpx solid #f0ad4e;
-	height: 35rpx;
-	margin-top: 12rpx;
-	width: 80rpx;
-	margin-left: 10rpx;
+.dj {
+  color: #f0ad4e;
+  font-size: 25rpx;
+  border-radius: 10rpx;
+  border: 1rpx solid #f0ad4e;
+  height: 35rpx;
+  margin-top: 12rpx;
+  width: 80rpx;
+  margin-left: 10rpx;
 }
 .vip {
-	margin-top: 6rpx;
-	text-align: center;
+  margin-top: 6rpx;
+  text-align: center;
 }
 .bn {
-	height: 100%;
-	margin-top: 0rpx;
+  height: 100%;
+  margin-top: 0rpx;
 }
 .time {
-	font-size: 20rpx;
-	margin-top: 10rpx;
-	margin-left: 18rpx;
-	color: #C0C0C0;
-	/* background-color: #4CD964; */
+  font-size: 20rpx;
+  margin-top: 10rpx;
+  margin-left: 18rpx;
+  color: #c0c0c0;
+  /* background-color: #4CD964; */
 }
 
 .zy {
-	margin-top: 10rpx;
-	line-height: 40rpx;
-	margin-left: 25rpx;
-	margin-right: 20rpx;
-	font-size: 28rpx;
-	font-weight: 300rpx;
-	color: #555555;
+  margin-top: 10rpx;
+  line-height: 40rpx;
+  margin-left: 25rpx;
+  margin-right: 20rpx;
+  font-size: 28rpx;
+  font-weight: 300rpx;
+  color: #555555;
 }
 .tab {
-	height: 250rpx;
-	/* background-color: #000000; */
-	margin: 10rpx 10rpx;
+  height: 250rpx;
+  /* background-color: #000000; */
+  margin: 10rpx 10rpx;
 }
 .book {
-	height: 240rpx;
-	margin: 20rpx 30rpx;
-	/* background-color: #007AFF; */
-	box-shadow: #f1f1f1 0rpx 0rpx 10rpx 5rpx;
-	border-radius: 8rpx;
+  height: 240rpx;
+  margin: 20rpx 30rpx;
+  /* background-color: #007AFF; */
+  box-shadow: #f1f1f1 0rpx 0rpx 10rpx 5rpx;
+  border-radius: 8rpx;
 }
 .booktp {
-	margin-top: 30rpx;
-	margin-left: 30rpx;
+  margin-top: 30rpx;
+  margin-left: 30rpx;
 }
 .bookn {
-	margin-top: -260rpx;
-	margin-left: 200rpx;
-	font-size: 40rpx;
-	color: #333333;
+  margin-top: -260rpx;
+  margin-left: 200rpx;
+  font-size: 40rpx;
+  color: #333333;
 }
 .zzn {
-	font-size: 32rpx;
-	color: #333333;
-	margin-top: -100rpx;
-	margin-left: 200rpx;
+  font-size: 32rpx;
+  color: #333333;
+  margin-top: -100rpx;
+  margin-left: 200rpx;
 }
 .imgs {
-	display: flex;
-	width: 95%;
-	margin-left: 20rpx;
-	margin-top: 10rpx;
+  display: flex;
+  width: 95%;
+  margin-left: 20rpx;
+  margin-top: 10rpx;
 }
 .img {
-	size: 100%;
-	margin: 10rpx 12rpx;
+  size: 100%;
+  margin: 10rpx 12rpx;
 }
 
 .showtwo {
-	display: flex;
-	background-color: #ffffff;
-	border-top: none;
-	height: 80rpx;
-	align-items: center;
-	box-shadow: #f1f1f1 0rpx 8rpx 0rpx 8rpx;
+  display: flex;
+  background-color: #ffffff;
+  border-top: none;
+  height: 80rpx;
+  align-items: center;
+  box-shadow: #f1f1f1 0rpx 8rpx 0rpx 8rpx;
 }
 
 .wave {
-	z-index: 3;
-	right: 0;
-	bottom: 0;
-	opacity: 0.725;
-	height: 40rpx;
-	width: 40rpx;
-	padding-top: 10rpx;
-	margin-top: 50rpx;
-	/* animation: wave 10s linear infinite; */
+  z-index: 3;
+  right: 0;
+  bottom: 0;
+  opacity: 0.725;
+  height: 40rpx;
+  width: 40rpx;
+  padding-top: 10rpx;
+  margin-top: 50rpx;
+  /* animation: wave 10s linear infinite; */
 }
 
 .dz {
-	margin-left: 450rpx;
-	display: flex;
+  margin-left: 450rpx;
+  display: flex;
 }
 
 .pl {
-	margin-left: 80rpx;
-	display: flex;
+  margin-left: 80rpx;
+  display: flex;
 }
 #t {
-	font-size: 25rpx;
-	color: #bbbbbb;
-	margin-left: 5rpx;
-	margin-top: 10rpx;
+  font-size: 25rpx;
+  color: #bbbbbb;
+  margin-left: 5rpx;
+  margin-top: 10rpx;
 }
 </style>
diff --git a/pages_read_circle/pages/readCirclepage/CircleNR_Right.vue b/pages_read_circle/pages/readCirclepage/CircleNR_Right.vue
index 3f97938e907ecb0a9bb1533d2ef334a52e3fdaa5..815a53e3a88888520e1bb4d008ebb227660de4b8 100644
--- a/pages_read_circle/pages/readCirclepage/CircleNR_Right.vue
+++ b/pages_read_circle/pages/readCirclepage/CircleNR_Right.vue
@@ -1,73 +1,87 @@
 <template name="Orders">
-	<view>
-		<view class="underR">
-			<!--圈主信息-->
-			<view class="underRone">
-				<image src="../../static/images/头像2.jpg" style="width: 90rpx; height: 90rpx;border-radius: 100%;"></image>
-				<view class="qz">
-					<view class="qzname">
-						<text>爱丽丝</text>
-					</view>
-					<view class="qztp">
-					<image src="../../static/images/quanzhu.png" style="width: 60rpx;height: 60rpx;"></image>	
-					</view>
-					<view class="riqi">
-						<text>2020-12-21</text>
-					</view>
-				</view>
-			</view>
-			<!-- 公告内容 -->
-			<view class="ggNR">
-				<text>
-					今哈哈哈哈哈哈哈哈今天上课觉得很经常技术的几句话大学哈哈哈哈呵呵好的环境斤斤计较看到看看今哈哈哈哈哈哈哈哈今天上课觉得很经常技术的几句话大学经济哈哈哈哈呵呵好的环境斤斤计较看到看看好好的简介哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好好的简介哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈
-				</text>
-			</view>
-		</view>
-	</view>
+  <view>
+	  <!-- 标题 -->
+	  <u-navbar zhead="65rpx" height="44" title="圈文" title-color="white" title-size="40" :background="background"
+	   back-icon-color="white" back-icon-size="50">
+	  	<view class="navbar-right" slot="right">
+	  		<view class="right_list" @click="bindInBatch">
+	  		</view>
+	  	</view>
+	  </u-navbar>
+    <view class="underR">
+      <!--圈主信息-->
+      <view class="underRone">
+        <image
+          src="/static/images/头像2.jpg"
+          style="width: 90rpx; height: 90rpx; border-radius: 100%"
+        ></image>
+        <view class="qz">
+          <view class="qzname">
+            <text>爱丽丝</text>
+          </view>
+          <view class="qztp">
+            <image
+              src="/static/images/quanzhu.png"
+              style="width: 60rpx; height: 60rpx"
+            ></image>
+          </view>
+          <view class="riqi">
+            <text>2020-12-21</text>
+          </view>
+        </view>
+      </view>
+      <!-- 公告内容 -->
+      <view class="ggNR">
+        <text>
+          今哈哈哈哈哈哈哈哈今天上课觉得很经常技术的几句话大学哈哈哈哈呵呵好的环境斤斤计较看到看看今哈哈哈哈哈哈哈哈今天上课觉得很经常技术的几句话大学经济哈哈哈哈呵呵好的环境斤斤计较看到看看好好的简介哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好好的简介哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈
+        </text>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
+export default {
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
 		},
-		methods: {
-			
-		}
-	}
+	};
+  },
+  methods: {},
+};
 </script>
 
 <style>
 /* 底部右边 */
-.underRone{
-	margin-left: 30rpx;
-	margin-top: 40rpx;
-	display: flex;
+.underRone {
+  margin-left: 30rpx;
+  margin-top: 40rpx;
+  display: flex;
 }
-.qzname text{
-	margin-top: 30rpx;
-	margin-left: 20rpx;
-	color: #18C7F2;
-	font-size: 28rpx;
-	/* background-color: yellow; */
+.qzname text {
+  margin-top: 30rpx;
+  margin-left: 20rpx;
+  color: #18c7f2;
+  font-size: 28rpx;
+  /* background-color: yellow; */
 }
-.qztp{
-	height: 50rpx;
-	margin-top: -50rpx;
-	margin-left: 110rpx;
+.qztp {
+  height: 50rpx;
+  margin-top: -50rpx;
+  margin-left: 110rpx;
 }
-.riqi{
-	color: #333333;
-	margin-top: 10rpx;
-	margin-left: 20rpx;
-	font-size: 20rpx;
-	color: #999999;
+.riqi {
+  color: #333333;
+  margin-top: 10rpx;
+  margin-left: 20rpx;
+  font-size: 20rpx;
+  color: #999999;
 }
 /* 公告 */
-.ggNR{
-	margin: 15rpx 20rpx;
-	font-size: 28rpx;
+.ggNR {
+  margin: 15rpx 20rpx;
+  font-size: 28rpx;
 }
 </style>
diff --git a/pages_read_circle/pages/readCirclepage/CircleXQLife.vue b/pages_read_circle/pages/readCirclepage/CircleXQLife.vue
index 570512126c9369cbf41591ade9b67cacc6fc1f89..0cd372997feda172cd8f6c0dc639f76123222df0 100644
--- a/pages_read_circle/pages/readCirclepage/CircleXQLife.vue
+++ b/pages_read_circle/pages/readCirclepage/CircleXQLife.vue
@@ -1,65 +1,77 @@
 <template name="Trade">
-	<view>
-		<!-- 中间内容 -->
-		<view class="Lmid">
-			<!-- 圈子名和头像 -->
-			<view class="midone">
-				<view class="circle"><image class="circletp" src="../../static/images/书2.jpg" style="width: 150rpx;height: 150rpx; border-radius: 10rpx;"></image></view>
-				<view class="tpname">三屋w</view>
-			</view>
-			<!-- 简介 -->
-			<view class="jj">
-				<view class="jjName">简介</view>
-				<view class="jjNR">
-					<text>
-						今哈哈哈哈哈哈哈哈今天上课觉得很经常技术的几句话大学哈哈哈哈呵呵好的环境斤斤计较看到看看今哈哈哈哈哈哈哈哈今天上课觉得很经常技术的几句话大学经济哈哈哈哈呵呵好的环境斤斤计较看到看看好好的简介哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好好的简介哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈
-					</text>
-				</view>
-			</view>
-		</view>
-		
-		
-	</view>
+  <view>
+	  <!-- 标题 -->
+	  <u-navbar zhead="65rpx" height="44" title="圈子信息" title-color="white" title-size="40" :background="background"
+	   back-icon-color="white" back-icon-size="50">
+	  	<view class="navbar-right" slot="right">
+	  		<view class="right_list" @click="bindInBatch">
+	  		</view>
+	  	</view>
+	  </u-navbar>
+    <!-- 中间内容 -->
+    <view class="Lmid">
+      <!-- 圈子名和头像 -->
+      <view class="midone">
+        <view class="circle"
+          ><image
+            class="circletp"
+            src="/static/images/书2.jpg"
+            style="width: 150rpx; height: 150rpx; border-radius: 10rpx"
+          ></image
+        ></view>
+        <view class="tpname">三屋w</view>
+      </view>
+      <!-- 简介 -->
+      <view class="jj">
+        <view class="jjName">简介</view>
+        <view class="jjNR">
+          <text>
+            今哈哈哈哈哈哈哈哈今天上课觉得很经常技术的几句话大学哈哈哈哈呵呵好的环境斤斤计较看到看看今哈哈哈哈哈哈哈哈今天上课觉得很经常技术的几句话大学经济哈哈哈哈呵呵好的环境斤斤计较看到看看好好的简介哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈好好的简介哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈哈
+          </text>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
+export default {
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
 		},
-		methods: {
-			
-		}
-	}
+	};
+  },
+  methods: {},
+};
 </script>
 
 <style>
 //信息中间内容
 .midone {
-	height: 300rpx;
-	border-bottom: 1rpx solid #dfdfdf;
+  height: 300rpx;
+  border-bottom: 1rpx solid #dfdfdf;
 }
 .circle {
-	margin-top: 100rpx;
-	margin-left: 25rpx;
-	text-align: center;
+  margin-top: 100rpx;
+  margin-left: 25rpx;
+  text-align: center;
 }
 .tpname {
-	font-size: 28rpx;
-	margin-top: 10rpx;
-	margin-left: 25rpx;
-	text-align: center;
+  font-size: 28rpx;
+  margin-top: 10rpx;
+  margin-left: 25rpx;
+  text-align: center;
 }
 // 简介
 .jjName {
-	margin-top: 20rpx;
-	margin-left: 30rpx;
+  margin-top: 20rpx;
+  margin-left: 30rpx;
 }
 .jjNR {
-	margin: 15rpx 20rpx;
-	color: #666666;
-	font-size: 28rpx;
+  margin: 15rpx 20rpx;
+  color: #666666;
+  font-size: 28rpx;
 }
 </style>
diff --git a/pages_read_circle/pages/readCirclepage/CircleXQRight.vue b/pages_read_circle/pages/readCirclepage/CircleXQRight.vue
index 73ddc89e552c8e785b1e3f3a0df31dd0be7fa4a3..65f459bed46bd03b99cbf66d0fba9e3e876b61fa 100644
--- a/pages_read_circle/pages/readCirclepage/CircleXQRight.vue
+++ b/pages_read_circle/pages/readCirclepage/CircleXQRight.vue
@@ -1,132 +1,175 @@
 <template name="Orders">
-	<view>
-		
-		<!-- 管理层 -->
-			<view class="GLC">
-				<view class="GLCname"><text>管理层(1)</text></view>
-				<view class="GLCima">
-					<view class="GLCone">
-						<view class="GLY">
-							<image class="circletp" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx; border-radius: 100%;"></image>
-						<view class="qz">
-							<image src="../../static/images/quanzhu.png" style="width: 70rpx;height: 70rpx;"></image>
-						</view>
-						<view class="name">黄蓉</view>
-						</view>
-					</view>
-					
-					
-				</view>
-			</view>
-			<!-- 其他成员 -->
-			<view class="CY">
-				<view class="CYname"><text>其他成员(200)</text></view>
-				<view class="cyuan">
-					<navigator url="../privateSpace/privateSpace">
-						<view class="tr">
-							<image class="ima" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx;border-radius: 50%;"></image>
-							<view class="mz">肖石榴</view>
-						</view>
-					</navigator>
-						<view class="tr">
-							<image class="ima" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx;border-radius: 50%;"></image>
-							<view class="mz">肖石榴</view>
-						</view>
-						<view class="tr">
-							<image class="ima" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx;border-radius: 50%;"></image>
-							<view class="mz">肖石榴</view>
-						</view>
-						<view class="tr">
-							<image class="ima" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx;border-radius: 50%;"></image>
-							<view class="mz">肖石榴</view>
-						</view>
-						<view class="tr">
-							<image class="ima" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx;border-radius: 50%;"></image>
-							<view class="mz">肖石榴</view>
-						</view>
-						<view class="tr">
-							<image class="ima" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx;border-radius: 50%;"></image>
-							<view class="mz">肖石榴</view>
-						</view>
-						<view class="tr">
-							<image class="ima" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx;border-radius: 50%;"></image>
-							<view class="mz">肖石榴</view>
-						</view>
-						<view class="tr">
-							<image class="ima" src="../../static/images/after.jpg" style="width: 120rpx;height: 120rpx;border-radius: 50%;"></image>
-							<view class="mz">肖石榴</view>
-						</view>
-				</view>
-			</view>
-		
-	</view>
+  <view>
+	  <!-- 标题 -->
+	  <u-navbar zhead="65rpx" height="44" title="圈子成员" title-color="white" title-size="40" :background="background"
+	   back-icon-color="white" back-icon-size="50">
+	  	<view class="navbar-right" slot="right">
+	  		<view class="right_list" @click="bindInBatch">
+	  		</view>
+	  	</view>
+	  </u-navbar>
+    <!-- 管理层 -->
+    <view class="GLC">
+      <view class="GLCname"><text>管理层(1)</text></view>
+      <view class="GLCima">
+        <view class="GLCone">
+          <view class="GLY">
+            <image
+              class="circletp"
+              src="/static/images/after.jpg"
+              style="width: 120rpx; height: 120rpx; border-radius: 100%"
+            ></image>
+            <view class="qz">
+              <image
+                src="/static/images/quanzhu.png"
+                style="width: 70rpx; height: 70rpx"
+              ></image>
+            </view>
+            <view class="name">黄蓉</view>
+          </view>
+        </view>
+      </view>
+    </view>
+    <!-- 其他成员 -->
+    <view class="CY">
+      <view class="CYname"><text>其他成员(200)</text></view>
+      <view class="cyuan">
+        <navigator url="../privateSpace/privateSpace">
+          <view class="tr">
+            <image
+              class="ima"
+              src="/static/images/after.jpg"
+              style="width: 120rpx; height: 120rpx; border-radius: 50%"
+            ></image>
+            <view class="mz">肖石榴</view>
+          </view>
+        </navigator>
+        <view class="tr">
+          <image
+            class="ima"
+            src="/static/images/after.jpg"
+            style="width: 120rpx; height: 120rpx; border-radius: 50%"
+          ></image>
+          <view class="mz">肖石榴</view>
+        </view>
+        <view class="tr">
+          <image
+            class="ima"
+            src="/static/images/after.jpg"
+            style="width: 120rpx; height: 120rpx; border-radius: 50%"
+          ></image>
+          <view class="mz">肖石榴</view>
+        </view>
+        <view class="tr">
+          <image
+            class="ima"
+            src="/static/images/after.jpg"
+            style="width: 120rpx; height: 120rpx; border-radius: 50%"
+          ></image>
+          <view class="mz">肖石榴</view>
+        </view>
+        <view class="tr">
+          <image
+            class="ima"
+            src="/static/images/after.jpg"
+            style="width: 120rpx; height: 120rpx; border-radius: 50%"
+          ></image>
+          <view class="mz">肖石榴</view>
+        </view>
+        <view class="tr">
+          <image
+            class="ima"
+            src="/static/images/after.jpg"
+            style="width: 120rpx; height: 120rpx; border-radius: 50%"
+          ></image>
+          <view class="mz">肖石榴</view>
+        </view>
+        <view class="tr">
+          <image
+            class="ima"
+            src="/static/images/after.jpg"
+            style="width: 120rpx; height: 120rpx; border-radius: 50%"
+          ></image>
+          <view class="mz">肖石榴</view>
+        </view>
+        <view class="tr">
+          <image
+            class="ima"
+            src="/static/images/after.jpg"
+            style="width: 120rpx; height: 120rpx; border-radius: 50%"
+          ></image>
+          <view class="mz">肖石榴</view>
+        </view>
+      </view>
+    </view>
+  </view>
 </template>
 
 <script>
-	export default {
-		data() {
-			return {
-				
-			}
+export default {
+  data() {
+    return {
+		background: {
+			background: "#6C40F3",
 		},
-		methods: {
-			
-		}
-	}
+	};
+  },
+  methods: {},
+};
 </script>
 
-<style>
+<style lang="scss">
 // 成员
-.GLCname{
-	margin-top: 20rpx;
-	margin-left: 20rpx;
+.GLCname {
+  margin-top: 20rpx;
+  margin-left: 20rpx;
 }
 .GLCima {
-	height: 220rpx;
-	width: 100%;
-	display: inline-flex;
-	box-shadow: #F4F5F6 0rpx 18rpx 0rpx 0rpx;
+  height: 220rpx;
+  width: 100%;
+  display: inline-flex;
+  box-shadow: #f4f5f6 0rpx 18rpx 0rpx 0rpx;
 }
 .GLY {
-	margin-left: 25rpx;
-	height: 165rpx;
-	display: flex;
-	margin-top: 55rpx;
+  margin-left: 25rpx;
+  height: 165rpx;
+  display: flex;
+  margin-top: 55rpx;
 }
-.qz{
-	margin-top: 20rpx;
-	margin-left: 5rpx;
+.qz {
+  margin-top: 20rpx;
+  margin-left: 5rpx;
 }
 .name {
-	font-size: 35rpx;
-	margin-top: 35rpx;
-	align-items: center;
-	margin-left: 0rpx;
+  font-size: 35rpx;
+  margin-top: 35rpx;
+  align-items: center;
+  margin-left: 0rpx;
 }
 
-.CYname{
-	margin-top: 40rpx;
-	margin-left: 20rpx;
+.CYname {
+  margin-top: 40rpx;
+  margin-left: 20rpx;
 }
-.cyuan{
-	margin-top: 20rpx;
+.cyuan {
+  margin-top: 20rpx;
 }
 .tr {
-	height: 165rpx;
-	// background-color: red;
-	display: flex;
-	border-bottom: 1rpx solid #F1F1F1;
-	// align-items: center;
-	// text-align: center;
+  height: 165rpx;
+  // background-color: red;
+  display: flex;
+  border-bottom: 1rpx solid #f1f1f1;
+  // align-items: center;
+  // text-align: center;
 }
 .ima {
-	margin-top: 20rpx;
-	margin-left: 20rpx;
+  margin-top: 20rpx;
+  margin-left: 20rpx;
 }
 .mz {
-	font-size: 35rpx;
-	margin-top: 55rpx;
-	align-items: center;
-	margin-left: 30rpx;
+  font-size: 35rpx;
+  margin-top: 55rpx;
+  align-items: center;
+  margin-left: 30rpx;
 }
 </style>
diff --git a/pages_read_circle/pages/readCirclepage/readExperDZ.vue b/pages_read_circle/pages/readCirclepage/readExperDZ.vue
index 0d09769c183d48462a468860a77985641f031c39..4eb288d3e6e78ce59bf1c1ca53eba6f740169ca4 100644
--- a/pages_read_circle/pages/readCirclepage/readExperDZ.vue
+++ b/pages_read_circle/pages/readCirclepage/readExperDZ.vue
@@ -1,93 +1,106 @@
 <template name="Orders">
 	<view>
-		<view class="lis">
-			<view class="tit2">全部(3)</view>
-			<view class="li">
-				<image class="toux" src="../../static/images/头像2.jpg" style="width: 80rpx; height: 80rpx;"></image>
-				<view class="Ntitle">
-					<view class="name">爱书的小猫咪</view>
-					<view class="vip">LV.11</view>
-				</view>
-				<view class="dzan"><image src="../../static/images/dianzan.png" style="width: 40rpx; height: 40rpx;"></image></view>
-			</view>
-			<view class="li">
-				<image class="toux" src="../../static/images/头像2.jpg" style="width: 80rpx; height: 80rpx;"></image>
-				<view class="Ntitle">
-					<view class="name">爱书的猫</view>
-					<view class="vip">LV.11</view>
+		<!-- 标题 -->
+		<u-navbar zhead="65rpx" height="44" title=" " title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
 				</view>
-				<view class="dzan"><image src="../../static/images/dianzan.png" style="width: 40rpx; height: 40rpx;"></image></view>
 			</view>
-			<view class="li">
-				<image class="toux" src="../../static/images/头像2.jpg" style="width: 80rpx; height: 80rpx;"></image>
-				<view class="Ntitle">
-					<view class="name">爱书的大只小蜜蜂</view>
-					<view class="vip">LV.11</view>
+		</u-navbar>
+		<view class="lis">
+			<view class="tit2">全部({{praiseNum}})</view>
+			<view v-for="list in praiseList">
+				<view class="li">
+					<image class="toux" :src="list.rank.reader.avatar" style="width: 80rpx; height: 80rpx"></image>
+					<view class="Ntitle">
+						<view class="name">{{list.rank.reader.readerName}}</view>
+						<view class="vip">LV.{{list.rank.max}}</view>
+					</view>
+					<view class="dzan">
+						<image src="/static/images/dianzan.png" style="width: 40rpx; height: 40rpx"></image>
+					</view>
 				</view>
-				<view class="dzan"><image src="../../static/images/dianzan.png" style="width: 40rpx; height: 40rpx;"></image></view>
 			</view>
-			
 		</view>
 	</view>
 </template>
 
 <script>
 	export default {
+		props:["praiseList"],
 		data() {
 			return {
-				
-			}
+				background: {
+					background: "#6C40F3",
+				},
+				// praiseList: [],
+				praiseNum:1
+			};
 		},
 		methods: {
-			
-		}
-	}
+			getPraiseList(list,praiseNum) {
+				console.log("点赞列表！",praiseNum)
+				// this.praiseList = list
+				// this.praiseNum = praiseNum
+				// console.log("this.praiseList",this.praiseList)
+				// console.log("this.praiseNum ",this.praiseNum)
+			},
+		},
+	};
 </script>
 
 <style lang="scss" scoped>
-/* 点赞*/
-.lis {
-	height: 750rpx;
-	// border-bottom: 1rpx solid #c0c0c0;
-}
-.tit2 {
-	margin: 20rpx 50rpx;
-	color: #f0ad4e;
-}
-.toux {
-	border-radius: 50%;
-	margin: 20rpx 20rpx;
-}
-.Ntitle{
-	width: 550rpx;
-	// background-color: yellow;
-	display: flex;
-}
-.li {
-	display: flex;
-}
-.name {
-	color: #00aaff;
-	margin-top: 35rpx;
-	font-size: 30rpx;
-	// background-color: #007AFF;
-}
-.vip {
-	color: #f0ad4e;
-	font-size: 25rpx;
-	border-radius: 10rpx;
-	border: 1rpx solid #f0ad4e;
-	height: 35rpx;
-	margin-top: 38rpx;
-	background-color: #ffffff;
-	text-align: center;
-	width: 80rpx;
-	margin-left: 10rpx;
-}
-.dzan{
-	// background-color: #808080 ;
-	font-size: 25rpx;
-	margin-left: 0rpx;
-	margin-top: 37rpx;
-}
+	/* 点赞*/
+	.lis {
+		height: 750rpx;
+		// border-bottom: 1rpx solid #c0c0c0;
+	}
+
+	.tit2 {
+		margin: 20rpx 50rpx;
+		color: #f0ad4e;
+	}
+
+	.toux {
+		border-radius: 50%;
+		margin: 20rpx 20rpx;
+	}
+
+	.Ntitle {
+		width: 550rpx;
+		// background-color: yellow;
+		display: flex;
+	}
+
+	.li {
+		display: flex;
+	}
+
+	.name {
+		color: #00aaff;
+		margin-top: 35rpx;
+		font-size: 30rpx;
+		// background-color: #007AFF;
+	}
+
+	.vip {
+		color: #f0ad4e;
+		font-size: 25rpx;
+		border-radius: 10rpx;
+		border: 1rpx solid #f0ad4e;
+		height: 35rpx;
+		margin-top: 38rpx;
+		background-color: #ffffff;
+		text-align: center;
+		width: 80rpx;
+		margin-left: 10rpx;
+	}
+
+	.dzan {
+		// background-color: #808080 ;
+		font-size: 25rpx;
+		margin-left: 0rpx;
+		margin-top: 37rpx;
+	}
 </style>
diff --git a/pages_read_circle/pages/readCirclepage/readExperPL.vue b/pages_read_circle/pages/readCirclepage/readExperPL.vue
index ba450a5e851e3e8237b63fd863d8da08547d3b80..da371ec8fb4e1ac021ee2d4d5ddaba22a0808298 100644
--- a/pages_read_circle/pages/readCirclepage/readExperPL.vue
+++ b/pages_read_circle/pages/readCirclepage/readExperPL.vue
@@ -1,33 +1,25 @@
 <template name="Logistic">
 	<view>
-		<view class="lis">
-			<view class="tit2">全部(50)</view>
-			<view class="PLall">
-			<view class="li">
-				<image class="toux" src="../../static/images/头像2.jpg" style="width: 80rpx; height: 80rpx;"></image>
-				<view class="name">爱书的猫</view>
-				<view class="vip">LV.11</view>
-				<view class="time">2017-05-05 15:32</view>
-			</view>
-			<view class="text1">光大证券首席金融业分析师王一峰认为，自7月份开始，货币市场短期与中长期资金利率运行出现明显分化迹象。</view>
-			</view>
-			<view class="PLall">
-			<view class="li">
-				<image class="toux" src="../../static/images/头像2.jpg" style="width: 80rpx; height: 80rpx;"></image>
-				<view class="name">爱书的猫</view>
-				<view class="vip">LV.11</view>
-				<view class="time">2017-05-05 15:32</view>
-			</view>
-			<view class="text1">光大证券首席金融业分析师王一峰认为，自7月份开始，货币市场短期与中长期资金利率运行出现明显分化迹象。</view>
+		<!-- 标题 -->
+		<u-navbar zhead="65rpx" height="44" title=" " title-color="white" title-size="40" :background="background"
+		 back-icon-color="white" back-icon-size="50">
+			<view class="navbar-right" slot="right">
+				<view class="right_list" @click="bindInBatch">
+				</view>
 			</view>
-			<view class="PLall">
-			<view class="li">
-				<image class="toux" src="../../static/images/头像2.jpg" style="width: 80rpx; height: 80rpx;"></image>
-				<view class="name">爱书的猫</view>
-				<view class="vip">LV.11</view>
-				<view class="time">2017-05-05 15:32</view>
-			</view>
-			<view class="text1">光大证券首席金融业分析师王一峰认为，自7月份开始，货币市场短期与中长期资金利率运行出现明显分化迹象。</view>
+		</u-navbar>
+		<view class="lis">
+			<view class="tit2">全部({{commentNum}})</view>
+			<view v-for="list in commentList">
+				<view class="PLall">
+					<view class="li">
+						<image class="toux" :src="list.rank.reader.avatar" style="width: 80rpx; height: 80rpx"></image>
+						<view class="name">{{list.rank.reader.readerName}}</view>
+						<view class="vip">LV.{{list.rank.max}}</view>
+						<view class="time" v-text="formatDate(list.composeTime)"></view>
+					</view>
+					<view class="text1">{{list.content}}</view>
+				</view>
 			</view>
 		</view>
 	</view>
@@ -35,77 +27,165 @@
 
 <script>
 	export default {
+		props: ["commentList"],
 		data() {
 			return {
-				
-			}
+				background: {
+					background: "#6C40F3",
+				},
+				//commentList: [],
+				commentNum: 2
+			};
 		},
+
 		methods: {
-			
-		}
-	}
+			getCommentList(list, commentNum) {
+				// console.log("评论列表！",commentNum)
+				// this.commentList = list
+				// this.commentNum = commentNum
+			},
+			//日期转换方法
+			// formatDate(value) {
+			// 	let date = new Date(value);
+			// 	let y = date.getFullYear();
+			// 	let MM = date.getMonth() + 1;
+			// 	MM = MM < 10 ? ('0' + MM) : MM;
+			// 	let d = date.getDate();
+			// 	d = d < 10 ? ('0' + d) : d;
+			// 	let h = date.getHours();
+			// 	h = h < 10 ? ('0' + h) : h;
+			// 	let m = date.getMinutes();
+			// 	m = m < 10 ? ('0'+ m) : m;
+			// 	let s = date.getSeconds();
+			// 	s = s < 10 ? ('0' + s) : s;
+			// 	//return y + '-' + MM + '-' + d+' '+h+':'+m ;
+			// 	return  MM + '月' + d+'日';
+			// },
+			// formatDate(ti) {
+			// 	var t = (new Date()).getTime() - ti;
+			// 	var f = [
+			// 		[31536000, '年'],
+			// 		[2592000, '个月'],
+			// 		[604800, '星期'],
+			// 		[86400, '天'],
+			// 		[3600, '小时'],
+			// 		[60, '分钟'],
+			// 		[1, '秒'],
+			// 	];
+			// 	var qh = t > 0 ? '前' : '后';
+			// 	t = Math.abs(t);
+			// 	for (var i in f) {
+			// 		var da = f[i];
+			// 		var k = da[0] * 1000;
+			// 		var v = da[1];
+			// 		var c = Math.floor(t / k);
+			// 		if (0 != c) {
+			// 			return Math.abs(c) + v + qh;
+			// 		}
+			// 	}
+			// },
+			formatDate(date) {
+			        var tt = new Date(parseInt(date));
+					var yy = new Date(new Date());
+			        var days = parseInt((new Date().getTime() - date) / 86400000);
+			        var today = new Date().getDate();
+			        var year = tt.getFullYear();
+					var xzYear = yy.getFullYear();
+			        var mouth = tt.getMonth() + 1;
+			        var day = tt.getDate();
+			        var time = tt.getHours() < 10 ? "0" + tt.getHours() : tt.getHours();
+			        var min = tt.getMinutes() < 10 ? "0" + tt.getMinutes() : tt.getMinutes();
+			        var result, offset;
+			　　　　　　　offset = Math.abs(today - day);
+			　　　　if (days < 3&&offset<3) {
+			　　　　　　　if (offset === 0) {
+			                result = "今天" + time + ":" + min;
+			            } else if (offset === 1) {
+			                result = "昨天" + time + ":" + min;
+			            } else if (offset === 2) {
+			                result = "前天" + time + ":" + min;
+			            }
+			        } else if (year == xzYear) {
+			                result =  + mouth + "月" + day+"日";
+			        }else {
+			            result = year + "年" + mouth + "月" + day + "日 ";
+			        }
+			        return result;
+			    },
+		},
+	};
 </script>
 
 <style lang="scss" scoped>
-.lis {
-	height: 750rpx;
-	// border-bottom: 1rpx solid #c0c0c0;
-}
-.tit2 {
-	margin: 20rpx 50rpx;
-	color: #f0ad4e;
-}
-.PLall{
-	height: auto;
-	// background-color: yellow;
-}
-.toux {
-	border-radius: 50%;
-	margin: 20rpx 20rpx;
-}
-.Ntitle{
-	width: 550rpx;
-	// background-color: yellow;
-	display: flex;
-}
-.li {
-	display: flex;
-}
-.name {
-	color: #00aaff;
-	margin-top: 35rpx;
-	font-size: 30rpx;
-	// background-color: #007AFF;
-}
-.vip {
-	color: #f0ad4e;
-	font-size: 25rpx;
-	border-radius: 10rpx;
-	border: 1rpx solid #f0ad4e;
-	height: 35rpx;
-	margin-top: 38rpx;
-	background-color: #ffffff;
-	text-align: center;
-	width: 80rpx;
-	margin-left: 10rpx;
-}
-.time {
-	color: #8f8f94;
-	font-size: 25rpx;
-	margin-left: 200rpx;
-	margin-top: 37rpx;
-}
-.text1 {
-	height: auto;
-	margin: 10rpx 20rpx;
-	font-size: 25rpx;
-	margin-left: 100rpx;
-	color: #808080;
-}
-.dzan{
-	// background-color: #808080 ;
-	font-size: 25rpx;
-	margin-left: 0rpx;
-	margin-top: 37rpx;
-}
+	.lis {
+		height: 750rpx;
+		// border-bottom: 1rpx solid #c0c0c0;
+	}
+
+	.tit2 {
+		margin: 20rpx 50rpx;
+		color: #f0ad4e;
+	}
+
+	.PLall {
+		height: auto;
+		// background-color: yellow;
+	}
+
+	.toux {
+		border-radius: 50%;
+		margin: 20rpx 20rpx;
+	}
+
+	.Ntitle {
+		width: 550rpx;
+		// background-color: yellow;
+		display: flex;
+	}
+
+	.li {
+		display: flex;
+	}
+
+	.name {
+		color: #00aaff;
+		margin-top: 35rpx;
+		font-size: 30rpx;
+		// background-color: #007AFF;
+	}
+
+	.vip {
+		color: #f0ad4e;
+		font-size: 25rpx;
+		border-radius: 10rpx;
+		border: 1rpx solid #f0ad4e;
+		height: 35rpx;
+		margin-top: 38rpx;
+		background-color: #ffffff;
+		text-align: center;
+		width: 80rpx;
+		margin-left: 10rpx;
+	}
+
+	.time {
+		color: #8f8f94;
+		font-size: 25rpx;
+		margin-left: 200rpx;
+		margin-top: 37rpx;
+	}
+
+	.text1 {
+		height: auto;
+		margin: 10rpx 20rpx;
+		font-size: 25rpx;
+		margin-left: 100rpx;
+		color: #808080;
+	}
+
+	.dzan {
+		// background-color: #808080 ;
+		font-size: 25rpx;
+		margin-left: 0rpx;
+		margin-top: 37rpx;
+	}
 </style>
diff --git a/static/images/C.jpg b/static/images/C.jpg
deleted file mode 100644
index ce0bfb78f560b708759b7a6afa97eb34d65c368b..0000000000000000000000000000000000000000
Binary files a/static/images/C.jpg and /dev/null differ
diff --git a/static/images/back.png b/static/images/back.png
index 3bbf84d7c80451900eebd40a1ade13197c4b1ba8..b70bc7accc0d8c4bc8c360480d54a6a96b85dc6b 100644
Binary files a/static/images/back.png and b/static/images/back.png differ
diff --git a/static/images/baogao.png b/static/images/baogao.png
new file mode 100644
index 0000000000000000000000000000000000000000..8d4cf8ac794db62cbfcc23019e6459c1b8cce019
Binary files /dev/null and b/static/images/baogao.png differ
diff --git a/static/images/booklogo.png b/static/images/booklogo.png
new file mode 100644
index 0000000000000000000000000000000000000000..6f062b95142ba0ab28ff48b04108ead75642e47d
Binary files /dev/null and b/static/images/booklogo.png differ
diff --git a/static/images/friend_more.png b/static/images/friend_more.png
new file mode 100644
index 0000000000000000000000000000000000000000..f2db2dae8ae096b8131090df9b366b7a8e662fd4
Binary files /dev/null and b/static/images/friend_more.png differ
diff --git a/static/images/login_end.png b/static/images/login_end.png
new file mode 100644
index 0000000000000000000000000000000000000000..49330664191230392be36471541c77aea54a350d
Binary files /dev/null and b/static/images/login_end.png differ
diff --git a/static/images/qr_code.png b/static/images/qr_code.png
deleted file mode 100644
index 7cfff7e102bbc8b7e957e353954f3646a833accb..0000000000000000000000000000000000000000
Binary files a/static/images/qr_code.png and /dev/null differ
diff --git a/static/images/register.vue b/static/images/register.vue
index 6ea0ac9a9b846e97e8235967a7abe61dbe61e653..27ef0da1e28471e1b9316e80a670abb34288182c 100644
--- a/static/images/register.vue
+++ b/static/images/register.vue
@@ -1,27 +1,27 @@
 <template>
 	<view>
-		<image class="im" src="../../static/images/logo.png" style="width: 200rpx; height: 200rpx;"></image>
+		<image class="im" src="/static/images/logo.png" style="width: 200rpx; height: 200rpx;"></image>
 		<view class="name">
 			<view class="rt">
-			<image src="../../static/images/person.png" style="width: 50rpx;height: 50rpx; "></image>
+			<image src="/static/images/person.png" style="width: 50rpx;height: 50rpx; "></image>
 			</view>
 			<input class="inp" placeholder="请输入电话号码" placeholder-style="color:#BBBBBB"  type="number"></input>
 		</view>
 		<view class="name">
 			<view class="rt">
-			<image src="../../static/images/password.png" style="width: 50rpx;height: 50rpx; "></image>
+			<image src="/static/images/password.png" style="width: 50rpx;height: 50rpx; "></image>
 			</view>
 			<input class="inp" placeholder="请输入密码" placeholder-style="color:#BBBBBB"  type="number"></input>
 		</view>
 		<view class="name">
 			<view class="rt">
-			<image src="../../static/images/confirm_password.png" style="width: 50rpx;height: 50rpx; "></image>
+			<image src="/static/images/confirm_password.png" style="width: 50rpx;height: 50rpx; "></image>
 			</view>
 			<input class="inp" placeholder="确认密码" placeholder-style="color:#BBBBBB"  type="number"></input>
 		</view>
 		<view class="name">
 			<view class="rt">
-			<image src="../../static/images/verification_code.png" style="width: 50rpx;height: 50rpx; "></image>
+			<image src="/static/images/verification_code.png" style="width: 50rpx;height: 50rpx; "></image>
 			</view>
 			<view class="yanz">
 			<input class="inp" placeholder="输入验证码" placeholder-style="color:#BBBBBB"  type="number"></input>
@@ -39,11 +39,11 @@
 	export default {
 		data() {
 			return {
-				
+
 			}
 		},
 		methods: {
-			
+
 		}
 	}
 </script>
diff --git a/static/images/scanCode.png b/static/images/scanCode.png
new file mode 100644
index 0000000000000000000000000000000000000000..090f624b6a71cab0dbaec0b89619b9562549aa5b
Binary files /dev/null and b/static/images/scanCode.png differ
diff --git a/static/images/temporary.jpg b/static/images/temporary.jpg
new file mode 100644
index 0000000000000000000000000000000000000000..1214efcd368a293d714e3bca129b9074937c97af
Binary files /dev/null and b/static/images/temporary.jpg differ
diff --git a/static/images/tuguan.gif b/static/images/tuguan.gif
deleted file mode 100644
index ded7277d5a973df1f71c8cb527486cbb03593796..0000000000000000000000000000000000000000
Binary files a/static/images/tuguan.gif and /dev/null differ
diff --git a/static/images/tupu.png b/static/images/tupu.png
new file mode 100644
index 0000000000000000000000000000000000000000..ec3f3eb392a15be6c50087768a05f2ee5eb0b7fe
Binary files /dev/null and b/static/images/tupu.png differ
diff --git a/static/style/qiun.css b/static/style/qiun.css
new file mode 100644
index 0000000000000000000000000000000000000000..9dde57302c10500d1d34b6539bddec21a30f08cf
--- /dev/null
+++ b/static/style/qiun.css
@@ -0,0 +1,114 @@
+page {
+	background: #F4F5F6;
+	width: 750upx;
+	overflow-x: hidden;
+}
+
+.qiun-padding {
+	padding: 2%;
+	width: 96%;
+}
+
+.qiun-wrap {
+	display: flex;
+	flex-wrap: wrap;
+}
+
+.qiun-rows {
+	display: flex;
+	flex-direction: row !important;
+}
+
+.qiun-columns {
+	display: flex;
+	flex-direction: column !important;
+}
+
+.qiun-common-mt {
+	margin-top: 10upx;
+}
+
+.qiun-common-border-bottom {
+	border-bottom: 1px solid #E9E9E9;
+}
+
+.qiun-bg-white {
+	background: #FFFFFF;
+}
+
+.qiun-title-bar {
+	width: 96%;
+	padding: 10upx 2%;
+	flex-wrap: nowrap;
+}
+
+.qiun-title-dot-light {
+	border-left: 10upx solid #0ea391;
+	padding-left: 10upx;
+	font-size: 32upx;
+	color: #000000
+}
+
+.qiun-textarea {
+	height: 400upx;
+	font-size: 34upx;
+	box-sizing: border-box;
+	line-height: 50upx;
+	width: 100%;
+	background-color: #FFFFFF;
+}
+
+.qiun-text-tips {
+	font-size: 28upx;
+	color: #dc2626;
+	line-height: 40upx;
+	padding: 6upx;
+}
+
+.qiun-button {
+	background: #2fc25b;
+	color: #FFFFFF;
+	margin: 20upx;
+}
+
+/* 通用样式 */
+.qiun-charts {
+	width: 750upx;
+	height: 500upx;
+	background-color: #FFFFFF;
+}
+
+.charts {
+	width: 750upx;
+	height: 500upx;
+	background-color: #FFFFFF;
+}
+
+/* 横屏样式 */
+.qiun-charts-rotate {
+	width: 700upx;
+	height: 1100upx;
+	background-color: #FFFFFF;
+	padding: 25upx;
+}
+
+.charts-rotate {
+	width: 700upx;
+	height: 1100upx;
+	background-color: #FFFFFF;
+}
+
+/* 圆弧进度样式 */
+.qiun-charts3 {
+	width: 750upx;
+	height: 250upx;
+	background-color: #FFFFFF;
+	position: relative;
+}
+
+.charts3 {
+	position: absolute;
+	width: 250upx;
+	height: 250upx;
+	background-color: #FFFFFF;
+}
diff --git a/store/index.js b/store/index.js
index 0d6ba790ae99f8d375f66b36b81ef7ef18909f26..5c203ae583aea14f94615a659f6c32e5e107c0bb 100644
--- a/store/index.js
+++ b/store/index.js
@@ -4,12 +4,16 @@ Vue.use(Vuex)
 
 const store = new Vuex.Store({
     state: {
+		/**
+		 * 是否需要强制登录
+		 */
+		login: false,
 		//token
-        token:"",
+        token: "",
 		//用户信息
-        userinfo:{},
+        userinfo: {},
 		//用户配置信息
-        config:{},
+        config: {},
 		//需要全局共享的逻辑状态
 		data: {},
     },
@@ -17,8 +21,20 @@ const store = new Vuex.Store({
     },
     mutations: {
 		setUserInfo(state, userinfo){
+			state.login = true;
 			state.userinfo = userinfo
 			uni.setStorageSync("userinfo",userinfo)
+		},
+		setToken(state, token){
+			state.token = token;
+		},
+		//退出登录
+		logout(state) {
+		    state.login = false; 
+			state.token = '';
+			state.userinfo = {};
+		    state.config = {};
+		    state.data = {};
 		}
     },
     actions: {}
diff --git a/tools/index.js b/tools/index.js
index 3ec3caf590438ffa0a8af26135714b13d8152dd4..80d3d927bb19fab54041cc08f37e3c44b7a1ec32 100644
--- a/tools/index.js
+++ b/tools/index.js
@@ -1,4 +1,62 @@
+import config from "../config"
+//对js各大原型对象的工具方法
 import "./prototypeTools/ArrayTools"
 import "./prototypeTools/DateTools"
 import "./prototypeTools/ObjectTools"
 import "./prototypeTools/StringTools"
+export default {
+    install(Vue){
+        if(!Vue.prototype.$s){
+            Vue.prototype.$s = {}
+        }
+        /**
+         * 根据传入的字符串获取一个可用的图片访问地址
+         * @param url
+         * @return string|null
+         */
+        Vue.prototype.$s.config = config
+        Vue.prototype.$s.getImageUrl = function (...url){
+            for (let i = 0; i < url.length; i++) {
+                if(url[i]){
+                    url = url[0];break
+                }
+            }
+            //TODO 这个可以定义一个加载失败的默认图片
+            if(!url) return null
+            if(/(^https?:)|(^\.)/.test(url)){
+                return url
+            }else {
+                return config.URL.imgServer+url;
+            }
+        }
+		//日期转换方法
+		Vue.prototype.$s.formatDate = function (date) {
+			var tt = new Date(parseInt(date));
+			var yy = new Date(new Date());
+			var days = parseInt((new Date().getTime() - date) / 86400000);
+			var today = new Date().getDate();
+			var year = tt.getFullYear();
+			var xzYear = yy.getFullYear();
+			var mouth = tt.getMonth() + 1;
+			var day = tt.getDate();
+			var time = tt.getHours() < 10 ? "0" + tt.getHours() : tt.getHours();
+			var min = tt.getMinutes() < 10 ? "0" + tt.getMinutes() : tt.getMinutes();
+			var result, offset;
+			offset = Math.abs(today - day);
+			if (days < 3 && offset < 3) {
+				if (offset === 0) {
+					result = "今天 " + time + ":" + min;
+				} else if (offset === 1) {
+					result = "昨天 " + time + ":" + min;
+				} else if (offset === 2) {
+					result = "前天 " + time + ":" + min;
+				}
+			} else if (year == xzYear) {
+				result = +mouth + "月" + day + "日";
+			} else {
+				result = year + "年" + mouth + "月" + day + "日 ";
+			}
+			return result;
+		}
+    }
+}
diff --git a/uview-ui/components/u-navbar/u-navbar.vue b/uview-ui/components/u-navbar/u-navbar.vue
index 1aeee62989165a02415efe500ec3dc3d247dad51..0226030bded7ec9f2c3b4575b03a4e119acca8e4 100644
--- a/uview-ui/components/u-navbar/u-navbar.vue
+++ b/uview-ui/components/u-navbar/u-navbar.vue
@@ -1,9 +1,9 @@
 <template>
-	<view class="">
+	<view>
 		<view class="u-navbar" :style="[navbarStyle]" :class="{ 'u-navbar-fixed': isFixed, 'u-border-bottom': borderBottom }">
-			<view class="u-status-bar" :style="{ height: statusBarHeight + 'px' }"></view>
+			<view class="u-status-bar" :style="{ height: statusBarHeightLeng + 'px' }"></view>
 			<!-- #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ -->
-			<view :style="'height: '+zhead "></view>
+			<view :style="[navbarHeadWigth]"></view>
 			<!-- #endif -->
 			<view class="u-navbar-inner" :style="[navbarInnerStyle]">
 				<view class="u-back-wrap" v-if="isBack" @tap="goBack">
@@ -23,7 +23,7 @@
 					</view>
 				</view>
 				<view class="u-slot-content">
-					<slot></slot>
+					<slot name="content"></slot>
 				</view>
 				<view class="u-slot-right">
 					<slot name="right"></slot>
@@ -31,7 +31,16 @@
 			</view>
 		</view>
 		<!-- 解决fixed定位后导航栏塌陷的问题 -->
-		<view class="u-navbar-placeholder" v-if="isFixed && !immersive" :style="{ width: '100%', height: Number(navbarHeight) + statusBarHeight + 'px' }"></view>
+		<!-- #ifdef APP-PLUS -->
+		<!-- <view class="u-navbar-placeholder" v-if="isFixed && !immersive" :style="{ width: '100%', height: Number(navbarHeight) + statusBarHeight + 'px' }"></view> -->
+		<view v-if="isFixed && !immersive" :style="{ width: '100%', height: statusBarHeightLeng + 'px' }"></view>
+		<view class="u-navbar-inner" v-if="isFixed && !immersive" :style="{ width: '100%', height: Number(navbarHeight) *2 + 'rpx' }"></view>
+		<!-- #endif -->
+		<!-- #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ -->
+		<view v-if="isFixed && !immersive" :style="{ width: '100%', height: statusBarHeight + 'px' }"></view>
+		<view v-if="isFixed && !immersive" :style="{ width: '100%', height: headWigth.height + 'px' }"></view>
+		<view class="u-navbar-inner" v-if="isFixed && !immersive" :style="{ width: '100%', height: Number(navbarHeight) *2 + 'rpx' }"></view>
+		<!-- #endif -->
 	</view>
 </template>
 
@@ -43,6 +52,10 @@
 	// // #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
 	// menuButtonInfo = uni.getMenuButtonBoundingClientRect();
 	// // #endif
+	let headWigth = '';
+	// #ifdef MP-WEIXIN || MP-BAIDU || MP-TOUTIAO || MP-QQ
+	headWigth = uni.getMenuButtonBoundingClientRect();
+	// #endif
 	/**
 	 * navbar 自定义导航栏
 	 * @description 此组件一般用于在特殊情况下，需要自定义导航栏的时候用到，一般建议使用uniapp自带的导航栏。
@@ -168,16 +181,30 @@
 		},
 		data() {
 			return {
+				
+				headWigth: headWigth,
 				menuButtonInfo: menuButtonInfo,
 				statusBarHeight: systemInfo.statusBarHeight
 			};
 		},
 		computed: {
+			//自定义小程序顶部高度
+			navbarHeadWigth(){
+				let style = {};
+				style.height = this.headWigth.height + 'px';
+				//console.log("style",style)
+				return style;
+			},
+			statusBarHeightLeng(){
+				// 获取系统状态栏的高度
+				let statusBarHeightLen = uni.getSystemInfoSync().statusBarHeight;
+				return statusBarHeightLen;
+			},
 			// 导航栏内部盒子的样式
 			navbarInnerStyle() {
 				let style = {};
 				// 导航栏宽度，如果在小程序下，导航栏宽度为胶囊的左边到屏幕左边的距离
-				style.height = this.navbarHeight + 'px';
+				style.style = this.navbarHeight + 'px';
 				// // 如果是各家小程序，导航栏内部的宽度需要减少右边胶囊的宽度
 				// #ifdef MP
 				let rightButtonWidth = systemInfo.windowWidth - menuButtonInfo.left;