初始化代码提交

App.vue

@@ -0,0 +1,17 @@
+<script>
+	export default {
+		onLaunch: function() {
+			console.log('App Launch')
+		},
+		onShow: function() {
+			console.log('App Show')
+		},
+		onHide: function() {
+			console.log('App Hide')
+		}
+	}
+</script>
+
+<style>
+	/*每个页面公共css */
+</style>

components/city.js

@@ -0,0 +1,1063 @@
+/**
+ * Created by dianwoda on 2019/3/28.
+ * // 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
+    // { cityName: '', pinYin: '', py: '', code: '', airName: ''},
+ */
+export default {
+  hotCity: [
+    { cityName: '北京', pinYin: 'beijing', py: 'bj', code: 'PEK'},
+    { cityName: '上海', pinYin: 'shanghai', py: 'sh', code: 'SHA'},
+    { cityName: '天津', pinYin: 'tianjin', py: 'tj', code: 'TSN'},
+    { cityName: '青岛', pinYin: 'qingdao', py: 'qd', code: 'TAO'},
+    { cityName: '南京', pinYin: 'nanjing', py: 'nj', code: 'NKG'},
+    { cityName: '杭州', pinYin: 'hangzhou', py: 'hz', code: 'HGH'},
+    { cityName: '厦门', pinYin: 'xiamen', py: 'xm', code: 'XMN'},
+    { cityName: '成都', pinYin: 'chengdu', py: 'cd', code: 'CTU'},
+    { cityName: '深圳', pinYin: 'shenzhen', py: 'sz', code: 'SZX'},
+    { cityName: '广州', pinYin: 'guangzhou', py: 'gz', code: 'CAN'},
+    { cityName: '沈阳', pinYin: 'shenyang', py: 'sy', code: 'SHE'},
+    { cityName: '武汉', pinYin: 'wuhan', py: 'wh', code: 'WUH'}
+  ],
+  cities: [{
+      
+    "cityName": "阿尔山",
+    "pinyin": "aershan",
+    "py": "aes",
+    "code": "YIE"
+}, {
+    "cityName": "阿克苏",
+    "pinyin": "akesu",
+    "py": "aks",
+    "code": "AKU"
+}, {
+    "cityName": "阿勒泰",
+    "pinyin": "aletai",
+    "py": "alt",
+    "code": "AAT"
+}, {
+    "cityName": "阿里",
+    "pinyin": "ali",
+    "py": "al",
+    "code": "NGQ"
+}, {
+    "cityName": "安庆",
+    "pinyin": "anqing",
+    "py": "aq",
+    "code": "AQG"
+}, {
+    "cityName": "鞍山",
+    "pinyin": "anshan",
+    "py": "as",
+    "code": "AOG"
+}, {
+    "cityName": "安顺",
+    "pinyin": "anshun",
+    "py": "as",
+    "code": "AVA"
+}, {
+    "cityName": "巴彦淖尔",
+    "pinyin": "bayanzuoer",
+    "py": "byze",
+    "code": "RLK"
+}, {
+    "cityName": "百色",
+    "pinyin": "baise",
+    "py": "bs",
+    "code": "AEB"
+}, {
+    "cityName": "保山",
+    "pinyin": "baoshan",
+    "py": "bs",
+    "code": "BSD"
+}, {
+    "cityName": "包头",
+    "pinyin": "baotou",
+    "py": "bt",
+    "code": "BAV"
+}, {
+    "cityName": "北海",
+    "pinyin": "beihai",
+    "py": "bh",
+    "code": "BHY"
+}, {
+    "cityName": "北京",
+    "pinyin": "beijing",
+    "py": "bj",
+    "code": "PEK"
+}, {
+    "cityName": "北京南苑",
+    "pinyin": "beijingnanyuan",
+    "py": "bjny",
+    "code": "NAY"
+}, {
+    "cityName": "毕节",
+    "pinyin": "bijie",
+    "py": "bj",
+    "code": "BFJ"
+}, {
+    "cityName": "池州",
+    "pinyin": "chizhou",
+    "py": "cz",
+    "code": "JUH"
+}, {
+    "cityName": "沧源",
+    "pinyin": "cangyuan",
+    "py": "cy",
+    "code": "CWJ"
+}, {
+    "cityName": "长白山",
+    "pinyin": "changbaishan",
+    "py": "cbs",
+    "code": "NBS"
+}, {
+    "cityName": "长春",
+    "pinyin": "changchun",
+    "py": "cc",
+    "code": "CGQ"
+}, {
+    "cityName": "常德",
+    "pinyin": "changde",
+    "py": "cd",
+    "code": "CGD"
+}, {
+    "cityName": "长沙",
+    "pinyin": "changsha",
+    "py": "cs",
+    "code": "CSX"
+}, {
+    "cityName": "常州",
+    "pinyin": "changzhou",
+    "py": "cz",
+    "code": "CZX"
+}, {
+    "cityName": "朝阳",
+    "pinyin": "chaoyang",
+    "py": "cy",
+    "code": "CHG"
+}, {
+    "cityName": "成都",
+    "pinyin": "chengdu",
+    "py": "cd",
+    "code": "CTU"
+}, {
+    "cityName": "赤峰",
+    "pinyin": "chifeng",
+    "py": "cf",
+    "code": "CIF"
+}, {
+    "cityName": "重庆",
+    "pinyin": "chongqing",
+    "py": "cq",
+    "code": "CKG"
+}, {
+    "cityName": "大理",
+    "pinyin": "dali",
+    "py": "dl",
+    "code": "DLU"
+}, {
+    "cityName": "大连",
+    "pinyin": "dalian",
+    "py": "dl",
+    "code": "DLC"
+}, {
+    "cityName": "大同",
+    "pinyin": "datong",
+    "py": "dt",
+    "code": "DAT"
+}, {
+    "cityName": "达州",
+    "pinyin": "dazhou",
+    "py": "dz",
+    "code": "DAX"
+}, {
+    "cityName": "丹东",
+    "pinyin": "dandong",
+    "py": "dd",
+    "code": "DDG"
+}, {
+    "cityName": "丹阳",
+    "pinyin": "danyang",
+    "py": "dy",
+    "code": "DYN"
+}, {
+    "cityName": "稻城",
+    "pinyin": "daocheng",
+    "py": "dc",
+    "code": "DCY"
+}, {
+    "cityName": "德令哈",
+    "pinyin": "delingha",
+    "py": "dlh",
+    "code": "HXD"
+}, {
+    "cityName": "东营",
+    "pinyin": "dongying",
+    "py": "dy",
+    "code": "DOY"
+}, {
+    "cityName": "敦煌",
+    "pinyin": "dunhuang",
+    "py": "dh",
+    "code": "DNH"
+}, {
+    "cityName": "鄂尔多斯",
+    "pinyin": "eerduosi",
+    "py": "eeds",
+    "code": "DSN"
+}, {
+    "cityName": "恩施",
+    "pinyin": "enshi",
+    "py": "es",
+    "code": "ENH"
+}, {
+    "cityName": "二连浩特",
+    "pinyin": "erlianhaote",
+    "py": "elht",
+    "code": "ERL"
+}, {
+    "cityName": "佛山",
+    "pinyin": "foshan",
+    "py": "fs",
+    "code": "FUO"
+}, {
+    "cityName": "阜阳",
+    "pinyin": "fuyang",
+    "py": "fy",
+    "code": "FUG"
+}, {
+    "cityName": "福州",
+    "pinyin": "fuzhou",
+    "py": "fz",
+    "code": "FOC"
+}, {
+    "cityName": "赣州",
+    "pinyin": "ganzhou",
+    "py": "gz",
+    "code": "KOW"
+}, {
+    "cityName": "格尔木",
+    "pinyin": "geermu",
+    "py": "gem",
+    "code": "GOQ"
+}, {
+    "cityName": "固原",
+    "pinyin": "guyuan",
+    "py": "gy",
+    "code": "GYU"
+}, {
+    "cityName": "广元",
+    "pinyin": "guangyuan",
+    "py": "gy",
+    "code": "GYS"
+}, {
+    "cityName": "广州",
+    "pinyin": "guangzhou",
+    "py": "gz",
+    "code": "CAN"
+}, {
+    "cityName": "桂林",
+    "pinyin": "guilin",
+    "py": "gl",
+    "code": "KWL"
+}, {
+    "cityName": "贵阳",
+    "pinyin": "guiyang",
+    "py": "gy",
+    "code": "KWE"
+}, {
+    "cityName": "果洛",
+    "pinyin": "guoluo",
+    "py": "gl",
+    "code": "GMQ"
+}, {
+    "cityName": "哈尔滨",
+    "pinyin": "haerbin",
+    "py": "heb",
+    "code": "HRB"
+}, {
+    "cityName": "哈密",
+    "pinyin": "hami",
+    "py": "hm",
+    "code": "HMI"
+}, {
+    "cityName": "海口",
+    "pinyin": "haikou",
+    "py": "hk",
+    "code": "HAK"
+}, {
+    "cityName": "海拉尔",
+    "pinyin": "hailaer",
+    "py": "hle",
+    "code": "HLD"
+}, {
+    "cityName": "邯郸",
+    "pinyin": "handan",
+    "py": "hd",
+    "code": "HDG"
+}, {
+    "cityName": "汉中",
+    "pinyin": "hanzhong",
+    "py": "hz",
+    "code": "HZG"
+}, {
+    "cityName": "杭州",
+    "pinyin": "hangzhou",
+    "py": "hz",
+    "code": "HGH"
+}, {
+    "cityName": "合肥",
+    "pinyin": "hefei",
+    "py": "hf",
+    "code": "HFE"
+}, {
+    "cityName": "和田",
+    "pinyin": "hetian",
+    "py": "ht",
+    "code": "HTN"
+}, {
+    "cityName": "黑河",
+    "pinyin": "heihe",
+    "py": "hh",
+    "code": "HEK"
+}, {
+    "cityName": "衡阳",
+    "pinyin": "hengyang",
+    "py": "hy",
+    "code": "HNY"
+}, {
+    "cityName": "呼和浩特",
+    "pinyin": "huhehaote",
+    "py": "hhht",
+    "code": "HET"
+}, {
+    "cityName": "花土沟",
+    "pinyin": "huatugou",
+    "py": "htg",
+    "code": "HTT"
+}, {
+    "cityName": "淮安",
+    "pinyin": "huaan",
+    "py": "ha",
+    "code": "HIA"
+}, {
+    "cityName": "黄山",
+    "pinyin": "huangshan",
+    "py": "hs",
+    "code": "TXN"
+}, {
+    "cityName": "惠州",
+    "pinyin": "huizhou",
+    "py": "hz",
+    "code": "HUZ"
+}, {
+    "cityName": "济南",
+    "pinyin": "jinan",
+    "py": "jn",
+    "code": "TNA"
+}, {
+    "cityName": "济宁",
+    "pinyin": "jining",
+    "py": "jn",
+    "code": "JNG"
+}, {
+    "cityName": "鸡西",
+    "pinyin": "jixi",
+    "py": "jx",
+    "code": "JXA"
+}, {
+    "cityName": "加格达奇",
+    "pinyin": "jiagedaqi",
+    "py": "jgdq",
+    "code": "JGD"
+}, {
+    "cityName": "佳木斯",
+    "pinyin": "jiamusi",
+    "py": "jms",
+    "code": "JMU"
+}, {
+    "cityName": "嘉兴",
+    "pinyin": "jiaxing",
+    "py": "jx",
+    "code": "JXS"
+}, {
+    "cityName": "嘉峪关",
+    "pinyin": "jiayuguan",
+    "py": "jyg",
+    "code": "JGN"
+}, {
+    "cityName": "揭阳",
+    "pinyin": "jieyang",
+    "py": "jy",
+    "code": "SWA"
+}, {
+    "cityName": "金昌",
+    "pinyin": "jinchang",
+    "py": "jc",
+    "code": "JIC"
+}, {
+    "cityName": "锦州",
+    "pinyin": "jinzhou",
+    "py": "jz",
+    "code": "JNZ"
+}, {
+    "cityName": "景德镇",
+    "pinyin": "jingdezhen",
+    "py": "jdz",
+    "code": "JDZ"
+}, {
+    "cityName": "井冈山",
+    "pinyin": "jinggangshan",
+    "py": "jgs",
+    "code": "JGS"
+}, {
+    "cityName": "九江",
+    "pinyin": "jiujiang",
+    "py": "jj",
+    "code": "JIU"
+}, {
+    "cityName": "九寨沟",
+    "pinyin": "jiuzhaigou",
+    "py": "jzg",
+    "code": "JZH"
+}, {
+    "cityName": "喀什",
+    "pinyin": "kashen",
+    "py": "ks",
+    "code": "KHG"
+}, {
+    "cityName": "凯里",
+    "pinyin": "kaili",
+    "py": "kl",
+    "code": "KJH"
+}, {
+    "cityName": "康定",
+    "pinyin": "kangding",
+    "py": "kd",
+    "code": "KGT"
+}, {
+    "cityName": "克拉玛依",
+    "pinyin": "kelamayi",
+    "py": "klmy",
+    "code": "KRY"
+}, {
+    "cityName": "库车",
+    "pinyin": "kuche",
+    "py": "kc",
+    "code": "KCA"
+}, {
+    "cityName": "库尔勒",
+    "pinyin": "kuerle",
+    "py": "kel",
+    "code": "KRL"
+}, {
+    "cityName": "昆明",
+    "pinyin": "kunming",
+    "py": "km",
+    "code": "KMG"
+}, {
+    "cityName": "昆山",
+    "pinyin": "kunshan",
+    "py": "ks",
+    "code": "KVN"
+}, {
+    "cityName": "连城",
+    "pinyin": "liancheng",
+    "py": "lc",
+    "code": "LCX"
+}, {
+    "cityName": "临汾",
+    "pinyin": "linfen",
+    "py": "lf",
+    "code": "LFQ"
+}, {
+    "cityName": "泸沽湖",
+    "pinyin": "luguhu",
+    "py": "lgh",
+    "code": "NLH"
+}, {
+    "cityName": "拉萨",
+    "pinyin": "lasa",
+    "py": "ls",
+    "code": "LXA"
+}, {
+    "cityName": "澜沧",
+    "pinyin": "lancang",
+    "py": "lc",
+    "code": "JMJ"
+}, {
+    "cityName": "兰州",
+    "pinyin": "lanzhou",
+    "py": "lanzhou",
+    "code": "LHW"
+}, {
+    "cityName": "丽江",
+    "pinyin": "lijiang",
+    "py": "lijiang",
+    "code": "LJG"
+}, {
+    "cityName": "黎平",
+    "pinyin": "liping",
+    "py": "liping",
+    "code": "HZH"
+}, {
+    "cityName": "连云港",
+    "pinyin": "lianyungang",
+    "py": "lyg",
+    "code": "LYG"
+}, {
+    "cityName": "临沧",
+    "pinyin": "lincang",
+    "py": "lc",
+    "code": "LNJ"
+}, {
+    "cityName": "临沂",
+    "pinyin": "linyi",
+    "py": "ly",
+    "code": "LYI"
+}, {
+    "cityName": "林芝",
+    "pinyin": "linzhi",
+    "py": "lz",
+    "code": "LZY"
+}, {
+    "cityName": "六盘水",
+    "pinyin": "liupanshui",
+    "py": "lps",
+    "code": "LPF"
+}, {
+    "cityName": "柳州",
+    "pinyin": "liuzhou",
+    "py": "lz",
+    "code": "LZH"
+}, {
+    "cityName": "陇南",
+    "pinyin": "longnan",
+    "py": "ln",
+    "code": "LNL"
+}, {
+    "cityName": "泸州",
+    "pinyin": "luzhou",
+    "py": "lz",
+    "code": "LZO"
+}, {
+    "cityName": "洛阳",
+    "pinyin": "luoyang",
+    "py": "ly",
+    "code": "LYA"
+}, {
+    "cityName": "吕梁",
+    "pinyin": "lvliang",
+    "py": "ll",
+    "code": "LLV"
+}, {
+    "cityName": "茅台",
+    "pinyin": "maotai",
+    "py": "mt",
+    "code": "WMT"
+}, {
+    "cityName": "满洲里",
+    "pinyin": "manzhouli",
+    "py": "mzl",
+    "code": "NZH"
+}, {
+    "cityName": "芒市",
+    "pinyin": "mangshi",
+    "py": "ms",
+    "code": "LUM"
+}, {
+    "cityName": "绵阳",
+    "pinyin": "mianyang",
+    "py": "my",
+    "code": "MIG"
+}, {
+    "cityName": "漠河",
+    "pinyin": "mohe",
+    "py": "mh",
+    "code": "OHE"
+}, {
+    "cityName": "牡丹江",
+    "pinyin": "mudanjiang",
+    "py": "mdj",
+    "code": "MDG"
+}, {
+    "cityName": "南昌",
+    "pinyin": "nanchang",
+    "py": "nc",
+    "code": "KHN"
+}, {
+    "cityName": "南充",
+    "pinyin": "nanchong",
+    "py": "nc",
+    "code": "NAO"
+}, {
+    "cityName": "南京",
+    "pinyin": "nanjing",
+    "py": "nj",
+    "code": "NKG"
+}, {
+    "cityName": "南宁",
+    "pinyin": "nanning",
+    "py": "nn",
+    "code": "NNG"
+}, {
+    "cityName": "南通",
+    "pinyin": "nantong",
+    "py": "nt",
+    "code": "NTG"
+}, {
+    "cityName": "南阳",
+    "pinyin": "nanyang",
+    "py": "ny",
+    "code": "NNY"
+}, {
+    "cityName": "宁波",
+    "pinyin": "ningbo",
+    "py": "nb",
+    "code": "NGB"
+}, {
+    "cityName": "攀枝花",
+    "pinyin": "panzhihua",
+    "py": "pzh",
+    "code": "PZI"
+}, {
+    "cityName": "祁连县",
+    "pinyin": "qilianxian",
+    "py": "qlx",
+    "code": "HBQ"
+}, {
+    "cityName": "齐齐哈尔",
+    "pinyin": "qiqihaer",
+    "py": "qqhe",
+    "code": "NDG"
+}, {
+    "cityName": "黔江",
+    "pinyin": "qianjiang",
+    "py": "qj",
+    "code": "JIQ"
+}, {
+    "cityName": "秦皇岛",
+    "pinyin": "qinhuadao ",
+    "py": "qhd ",
+    "code": "BPE"
+}, {
+    "cityName": "青岛",
+    "pinyin": "qingdao",
+    "py": "qd",
+    "code": "TAO"
+}, {
+    "cityName": "庆阳",
+    "pinyin": "qy",
+    "py": "QingYang",
+    "code": "IQN"
+}, {
+    "cityName": "琼海",
+    "pinyin": "qionghai",
+    "py": "qh",
+    "code": "BAR"
+}, {
+    "cityName": "衢州",
+    "pinyin": "quzhou",
+    "py": "qz",
+    "code": "JUZ"
+}, {
+    "cityName": "泉州",
+    "pinyin": "quanzhou",
+    "py": "qz",
+    "code": "JJN"
+}, {
+    "cityName": "日喀则",
+    "pinyin": "rikaze",
+    "py": "rkz",
+    "code": "RKZ"
+}, {
+    "cityName": "日照",
+    "pinyin": "rizhao",
+    "py": "rz",
+    "code": "RIZ"
+}, {
+    "cityName": "三明",
+    "pinyin": "sanming",
+    "py": "sm",
+    "code": "SQJ"
+}, {
+    "cityName": "松原",
+    "pinyin": "songyuan",
+    "py": "sy",
+    "code": "YSQ"
+}, {
+    "cityName": "上海",
+    "pinyin": "shanghai",
+    "py": "sh",
+    "code": "SHA"
+}, {
+    "cityName": "上海浦东",
+    "pinyin": "shanghaipudong",
+    "py": "shpd",
+    "code": "PVG"
+}, {
+    "cityName": "上饶",
+    "pinyin": "shangrao",
+    "py": "sr",
+    "code": "SQD"
+}, {
+    "cityName": "邵阳",
+    "pinyin": "shaoyang",
+    "py": "sy",
+    "code": "WGN"
+}, {
+    "cityName": "神农架",
+    "pinyin": "shennongjia",
+    "py": "snj",
+    "code": "HPG"
+}, {
+    "cityName": "沈阳",
+    "pinyin": "shenyang",
+    "py": "sy",
+    "code": "SHE"
+}, {
+    "cityName": "深圳",
+    "pinyin": "shenzhen",
+    "py": "ss",
+    "code": "SZX"
+}, {
+    "cityName": "石河子",
+    "pinyin": "shihezi",
+    "py": "shz",
+    "code": "SHF"
+}, {
+    "cityName": "石家庄",
+    "pinyin": "shijiazhuang",
+    "py": "sjz",
+    "code": "SJW"
+}, {
+    "cityName": "十堰",
+    "pinyin": "shiyan",
+    "py": "sy",
+    "code": "WDS"
+}, {
+    "cityName": "苏州",
+    "pinyin": "suzhou",
+    "py": "sz",
+    "code": "SZV"
+}, {
+    "cityName": "太原",
+    "pinyin": "taiyuan",
+    "py": "ty",
+    "code": "TYN"
+}, {
+    "cityName": "台州",
+    "pinyin": "taizhou",
+    "py": "tz",
+    "code": "HYN"
+}, {
+    "cityName": "唐山",
+    "pinyin": "tangshan",
+    "py": "ts",
+    "code": "TVS"
+}, {
+    "cityName": "腾冲",
+    "pinyin": "tengchong",
+    "py": "tc",
+    "code": "TCZ"
+}, {
+    "cityName": "天津",
+    "pinyin": "tianjin",
+    "py": "tj",
+    "code": "TSN"
+}, {
+    "cityName": "通化",
+    "pinyin": "tonghua",
+    "py": "th",
+    "code": "TNH"
+}, {
+    "cityName": "通辽",
+    "pinyin": "tongliao",
+    "py": "tl",
+    "code": "TGO"
+}, {
+    "cityName": "铜仁",
+    "pinyin": "tongren",
+    "py": "tr",
+    "code": "TEN"
+}, {
+    "cityName": "桐乡",
+    "pinyin": "tongxiang",
+    "py": "tx",
+    "code": "TVX"
+}, {
+    "cityName": "吐鲁番",
+    "pinyin": "tulufan",
+    "py": "tlf",
+    "code": "TLQ"
+}, {
+    "cityName": "乌兰察布",
+    "pinyin": "wulanchabu",
+    "py": "wlcb",
+    "code": "UCB"
+}, {
+    "cityName": "五台山",
+    "pinyin": "wutaishan",
+    "py": "wts",
+    "code": "WUT"
+}, {
+    "cityName": "万州",
+    "pinyin": "wanzhou",
+    "py": "wz",
+    "code": "WXN"
+}, {
+    "cityName": "威海",
+    "pinyin": "weihai",
+    "py": "wh",
+    "code": "WEH"
+}, {
+    "cityName": "文山",
+    "pinyin": "wenshan",
+    "py": "ws",
+    "code": "WNH"
+}, {
+    "cityName": "温州",
+    "pinyin": "wenzhou",
+    "py": "wz",
+    "code": "WNZ"
+}, {
+    "cityName": "乌海",
+    "pinyin": "wuhai",
+    "py": "wh",
+    "code": "WUA"
+}, {
+    "cityName": "武汉",
+    "pinyin": "whhan",
+    "py": "wh",
+    "code": "WUH"
+}, {
+    "cityName": "乌兰浩特",
+    "pinyin": "wulanhaote",
+    "py": "wlht",
+    "code": "HLH"
+}, {
+    "cityName": "乌鲁木齐",
+    "pinyin": "wulumuqi",
+    "py": "wlmq",
+    "code": "URC"
+}, {
+    "cityName": "无锡",
+    "pinyin": "wuxi",
+    "py": "wx",
+    "code": "WUX"
+}, {
+    "cityName": "武夷山",
+    "pinyin": "wuyishan",
+    "py": "wys",
+    "code": "WUS"
+}, {
+    "cityName": "梧州",
+    "pinyin": "wuzhou",
+    "py": "wz",
+    "code": "WUZ"
+}, {
+    "cityName": "西安",
+    "pinyin": "xian",
+    "py": "xa",
+    "code": "SIA"
+}, {
+    "cityName": "西昌",
+    "pinyin": "xichang",
+    "py": "xc",
+    "code": "XIC"
+}, {
+    "cityName": "锡林浩特",
+    "pinyin": "xilinhaote",
+    "py": "xlht",
+    "code": "XIL"
+}, {
+    "cityName": "西宁",
+    "pinyin": "xining",
+    "py": "xn",
+    "code": "XNN"
+}, {
+    "cityName": "西双版纳",
+    "pinyin": "xushuangbanna",
+    "py": "xsbn",
+    "code": "JHG"
+}, {
+    "cityName": "厦门",
+    "pinyin": "xiamen",
+    "py": "xm",
+    "code": "XMN"
+}, {
+    "cityName": "香格里拉",
+    "pinyin": "xianggelila",
+    "py": "xgll",
+    "code": "DIG"
+}, {
+    "cityName": "襄阳",
+    "pinyin": "xiangyang",
+    "py": "xy",
+    "code": "XFN"
+}, {
+    "cityName": "信阳市",
+    "pinyin": "xinyang",
+    "py": "xy",
+    "code": "XAI"
+}, {
+    "cityName": "兴义",
+    "pinyin": "xingyi",
+    "py": "xy",
+    "code": "ACX"
+}, {
+    "cityName": "徐州",
+    "pinyin": "xuzhou",
+    "py": "xz",
+    "code": "XUZ"
+}, {
+    "cityName": "延安",
+    "pinyin": "yanan",
+    "py": "ya",
+    "code": "ENY"
+}, {
+    "cityName": "盐城",
+    "pinyin": "yancheng",
+    "py": "yc",
+    "code": "YNZ"
+}, {
+    "cityName": "延吉",
+    "pinyin": "yanji",
+    "py": "yj",
+    "code": "YNJ"
+}, {
+    "cityName": "烟台",
+    "pinyin": "yantai",
+    "py": "yt",
+    "code": "YNT"
+}, {
+    "cityName": "扬州",
+    "pinyin": "yangzhou",
+    "py": "yz",
+    "code": "YTY"
+}, {
+    "cityName": "宜宾",
+    "pinyin": "yibin",
+    "py": "yb",
+    "code": "YBP"
+}, {
+    "cityName": "宜昌",
+    "pinyin": "yichang",
+    "py": "yc",
+    "code": "YIH"
+}, {
+    "cityName": "伊春",
+    "pinyin": "yichun",
+    "py": "yc",
+    "code": "LDS"
+}, {
+    "cityName": "伊宁",
+    "pinyin": "yining",
+    "py": "yn",
+    "code": "YIN"
+}, {
+    "cityName": "义乌",
+    "pinyin": "yiwu",
+    "py": "yw",
+    "code": "YIW"
+}, {
+    "cityName": "银川",
+    "pinyin": "yinchuan",
+    "py": "yc",
+    "code": "INC"
+}, {
+    "cityName": "营口",
+    "pinyin": "yingkou",
+    "py": "yk",
+    "code": "YKH"
+}, {
+    "cityName": "永州",
+    "pinyin": "yongzhou",
+    "py": "yz",
+    "code": "LLF"
+}, {
+    "cityName": "榆林",
+    "pinyin": "yulin",
+    "py": "yl",
+    "code": "UYN"
+}, {
+    "cityName": "玉树",
+    "pinyin": "yushu",
+    "py": "ys",
+    "code": "YUS"
+}, {
+    "cityName": "运城",
+    "pinyin": "yuncheng",
+    "py": "yc",
+    "code": "YCU"
+}, {
+    "cityName": "湛江",
+    "pinyin": "zhanjiang",
+    "py": "zj",
+    "code": "ZHA"
+}, {
+    "cityName": "张家界",
+    "pinyin": "zhangjiajie",
+    "py": "zjj",
+    "code": "DYG"
+}, {
+    "cityName": "张家口",
+    "pinyin": "zhangjiakou",
+    "py": "zjk",
+    "code": "ZQZ"
+}, {
+    "cityName": "张掖",
+    "pinyin": "zhangye",
+    "py": "zy",
+    "code": "YZY"
+}, {
+    "cityName": "昭通",
+    "pinyin": "zhaotong",
+    "py": "zt",
+    "code": "ZAT"
+}, {
+    "cityName": "镇江",
+    "pinyin": "zhenjiang",
+    "py": "zj",
+    "code": "ZUJ"
+}, {
+    "cityName": "郑州",
+    "pinyin": "zhengzhou",
+    "py": "zz",
+    "code": "CGO"
+}, {
+    "cityName": "中卫",
+    "pinyin": "zhongwei",
+    "py": "zw",
+    "code": "ZHY"
+}, {
+    "cityName": "舟山",
+    "pinyin": "zhoushan",
+    "py": "zs",
+    "code": "HSN"
+}, {
+    "cityName": "珠海",
+    "pinyin": "zhuhai",
+    "py": "zh",
+    "code": "ZUH"
+}, {
+    "cityName": "遵义",
+    "pinyin": "zunyi",
+    "py": "zy",
+    "code": "ZYI"
+}, {
+    "cityName": "大庆",
+    "pinyin": "daqing",
+    "py": "dq",
+    "code": "DQA"
+}, {
+    "cityName": "普洱",
+    "pinyin": "puer",
+    "py": "pe",
+    "code": "SYM"
+}, {
+    "cityName": "三亚",
+    "pinyin": "sanya",
+    "py": "sy",
+    "code": "SYX"
+}],
+};

components/lb-picker/README.md

@@ -0,0 +1,266 @@
+# uni-app picker 选择器
+
+插件市场里面的 picker 选择器不满足自己的需求，所以自己写了一个简单的 picker 选择器，可扩展、可自定义，一般满足日常需要。  
+Github：[https://github.com/liub1934/uni-lb-picker](https://github.com/liub1934/uni-lb-picker)  
+插件市场：[https://ext.dcloud.net.cn/plugin?id=1111](https://ext.dcloud.net.cn/plugin?id=1111)
+
+## 兼容性
+
+H5 + 各平台小程序（百度除外）  
+安卓及 IOS 未测试（应该也能运行）
+已知问题：支付宝小程序单选可能会出现不对齐的现象
+
+## 功能
+
+1、单选  
+2、多级联动，非多级联动，理论支持任意级数  
+3、省市区选择，基于多级联动  
+4、自定义选择器头部确定取消按钮颜色及插槽支持  
+5、选择器可视区自定义滚动个数  
+6、自定义数据字段，满足不同人的需求  
+7、自定义选择器样式
+
+## 引入插件
+
+单独引入，在需要使用的页面上 import 引入即可
+
+```html
+<template>
+  <view>
+    <lb-picker></lb-picker>
+  </view>
+</template>
+
+<script>
+  import LbPicker from '@/components/lb-picker'
+  export default {
+    components: {
+      LbPicker
+    }
+  }
+</script>
+```
+
+全局引入，`main.js`中 import 引入并注册即可全局使用
+
+```jsvascript
+import LbPicker from '@/components/lb-picker'
+Vue.component("lb-picker", LbPicker)
+```
+
+npm 安装引入：
+
+```shell
+npm install uni-lb-picker
+```
+
+```jsvascript
+import LbPicker from 'uni-lb-picker'
+```
+
+## 调用显示选择器
+
+通过`ref`形式手动调用`show`方法显示，隐藏同理调用`hide`
+
+```text
+<lb-picker ref="picker"></lb-picker>
+
+this.$refs.picker.show() // 显示
+this.$refs.picker.hide() // 隐藏
+```
+
+## 绑定值及设置默认值
+
+支持 vue 中`v-model`写法绑定值，无需自己维护选中值的索引。
+
+```javascript
+<lb-picker v-model="value1"></lb-picker>
+<lb-picker v-model="value2"></lb-picker>
+
+data () {
+  return {
+    value1: '' // 单选
+    value2: [] // 多列联动选择
+  }
+}
+```
+
+## 多个选择器
+
+通过设置不同的`ref`，然后调用即可
+
+```javascript
+<lb-picker ref="picker1"></lb-picker>
+<lb-picker ref="picker2"></lb-picker>
+
+this.$refs.picker1.show() // picker1显示
+this.$refs.picker2.show() // picker2显示
+```
+
+## 省市区选择
+
+省市区选择是基于多列联动选择，数据来源：[https://github.com/modood/Administrative-divisions-of-China](https://github.com/modood/Administrative-divisions-of-China)，  
+省市区文件位于`/pages/demos/area-data-min.js`，自行引入即可，可参考`demo3省市区选择`，  
+也可使用自己已有的省市区数据，如果数据字段不一样，也可以自定义，参考下方自定义数据字段。
+
+## 自定义数据字段
+
+为了满足不同人的需求，插件支持自定义数据字段名称， 插件默认的数据字段如下形式：
+
+```javascript
+;[
+  {
+    label: '选择1',
+    value: 1,
+    children: []
+  },
+  {
+    label: '选择1',
+    value: 1,
+    children: []
+  }
+]
+```
+
+如果你的数据字段和上面不一样，如下形式：
+
+```javascript
+;[
+  {
+    text: '选择1',
+    id: 1,
+    child: []
+  },
+  {
+    text: '选择1',
+    id: 1,
+    child: []
+  }
+]
+```
+
+通过设置参数中的`props`即可，如下所示：
+
+```javascript
+<lb-picker :props="myProps"></lb-picker>
+
+data () {
+  return {
+    myProps: {
+      label: 'text',
+      value: 'id',
+      children: 'child'
+    }
+  }
+}
+```
+
+## 插槽使用
+
+选择器支持一些可自定义化的插槽，如选择器的取消和确定文字按钮，如果需要对其自定义处理的话，比如加个 icon 图标之类的，可使用插槽，使用方法如下：
+
+```html
+<lb-picker>
+  <view slot="cancle-text">我是自定义取消</view>
+  <view slot="confirm-text">我是自定义确定</view>
+</lb-picker>
+```
+
+其他插槽见下。
+
+## 参数及事件
+
+### Props
+
+| 参数                    | 说明                                                    | 类型                | 可选值                                                           | 默认值                                            |
+| :---------------------- | :------------------------------------------------------ | :------------------ | :--------------------------------------------------------------- | :------------------------------------------------ |
+| value/v-model           | 绑定值，联动选择为 Array 类型                           | String/Number/Array | -                                                                | -                                                 |
+| mode                    | 选择器类型，支持单列，多列联动                          | String              | selector 单选/multiSelector 多级联动/unlinkedSelector 多级非联动 | selector                                          |
+| list                    | 选择器数据                                              | Array               | -                                                                | -                                                 |
+| level                   | 多列联动层级，仅 mode 为 multiSelector 有效             | Number              | -                                                                | 2                                                 |
+| props                   | 自定义数据字段                                          | Object              | -                                                                | {label:'label',value:'value',children:'children'} |
+| cancle-text             | 取消文字                                                | String              | -                                                                | 取消                                              |
+| cancle-color            | 取消文字颜色                                            | String              | -                                                                | #999999                                           |
+| confirm-text            | 确定文字                                                | String              | -                                                                | 确定                                              |
+| confirm-color           | 确定文字颜色                                            | String              | -                                                                | #007aff                                           |
+| column-num              | 可视滚动区域内滚动个数，最好设置奇数值                  | Number              | -                                                                | 5                                                 |
+| radius                  | 选择器顶部圆角，支持 rpx，如 radius="10rpx"             | String              | -                                                                | -                                                 |
+| ~~column-style~~        | 选择器默认样式(已弃用，见下方自定义样式说明)            | Object              | -                                                                | -                                                 |
+| ~~active-column-style~~ | 选择器选中样式(已弃用，见下方自定义样式说明)            | Object              | -                                                                | -                                                 |
+| loading                 | 选择器是否显示加载中，可使用 loading 插槽自定义加载效果 | Boolean             | -                                                                | -                                                 |
+| mask-color              | 遮罩层颜色                                              | String              | -                                                                | rgba(0, 0, 0, 0.4)                                |
+| close-on-click-mask     | 点击遮罩层是否关闭选择器                                | Boolean             | true/false                                                       | true                                              |
+
+### 方法
+
+| 方法名 | 说明       | 参数 |
+| :----- | :--------- | :--- |
+| show   | 打开选择器 | -    |
+| hide   | 关闭选择器 | -    |
+
+### Events
+
+| 事件名称 | 说明                                     | 回调参数                                                                                                                                                                                                                                                             |
+| :------- | :--------------------------------------- | :------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
+| show     | 选择器打开时触发                         | -                                                                                                                                                                                                                                                                    |
+| hide     | 选择器隐藏时触发                         | -                                                                                                                                                                                                                                                                    |
+| change   | 选择器滚动时触发，此时不会改变绑定的值   | `{ index, item, value }` `index`触发滚动后新的索引，单选时是具体的索引值，多列联动选择时为数组。`item`触发滚动后新的的完整内容，包裹`label`、`value`等，单选时为对象，多列选择时为数组对象。`value`触发滚动后新的 value 值，单列选择时为具体值，多列联动选择时为数组 |
+| confirm  | 点击选择器确定时触发，此时会改变绑定的值 | 同上`change`事件说明                                                                                                                                                                                                                                                 |
+| cancle   | 点击选择器取消时触发                     | 同上`change`事件说明                                                                                                                                                                                                                                                 |
+
+### 插槽
+
+| 插槽名        | 说明                |
+| :------------ | :------------------ |
+| cancle-text   | 选择器取消文字插槽  |
+| action-center | 选择器顶部中间插槽  |
+| confirm-text  | 选择器确定文字插槽  |
+| loading       | 选择器 loading 插槽 |
+
+## 其他
+
+其他功能参考示例 Demo 代码。
+
+### 选择器自定义样式
+
+原先的`column-style`和`active-column-style`已弃用，如需修改默认样式及选中样式参考`demo9`
+
+```css
+<style lang="scss" scoped>
+/deep/ .lb-picker {
+  .lb-picker-column-label {
+    color: #f0ad4e;
+  }
+  .lb-picker-column-active {
+    .lb-picker-column-label {
+      color: #007aff;
+      font-weight: 700;
+    }
+  }
+}
+</style>
+```
+
+### 获取选中值的文字
+
+`@confirm`事件中可以拿到：
+
+单选：
+
+```javascript
+handleConfirm (e) {
+  console.log(e.item.label) // 选项1
+}
+```
+
+联动选择：
+
+```javascript
+handleConfirm (e) {
+  console.log(e.item.map(item => item.label).join('-')) // 选项1-选项11
+}
+```
+
+## Tips
+
+微信小程序端，滚动时在 iOS 自带振动反馈，可在系统设置 -> 声音与触感 -> 系统触感反馈中关闭

components/lb-picker/index.vue

@@ -0,0 +1,215 @@
+<template>
+  <view class="lb-picker">
+    <view class="lb-picker-mask"
+      v-show="visible"
+      :style="{ 'background-color': maskColor }"
+      @tap="handleMaskTap">
+    </view>
+    <view :class="['lb-picker-container', visible ? 'lb-picker-toggle' : '']"
+      :style="{borderRadius: `${radius} ${radius} 0 0`}">
+      <view class="lb-picker-header"
+        :style="{height: pickerHeaderHeight, 'line-height': pickerHeaderHeight}">
+        <view class="lb-picker-action lb-picker-left">
+          <view class="lb-picker-action-cancle"
+            @tap="handleCancle">
+            <slot v-if="$slots['cancle-text']"
+              name="cancle-text">
+            </slot>
+            <view v-else
+              class="action-cancle-text"
+              :style="{color: cancleColor}">
+              {{ cancleText }}
+            </view>
+          </view>
+        </view>
+
+        <view class="lb-picker-action lb-picker-center"
+          v-if="$slots['action-center']">
+          <slot name="action-center"></slot>
+        </view>
+
+        <view class="lb-picker-action lb-picker-right">
+          <view class="lb-picker-action-confirm"
+            @tap="handleConfirm">
+            <slot v-if="$slots['confirm-text']"
+              name="confirm-text">
+            </slot>
+            <view v-else
+              class="action-confirm-text"
+              :style="{color: confirmColor}">
+              {{ confirmText }}
+            </view>
+          </view>
+        </view>
+      </view>
+      <view class="lb-picker-content"
+        :style="{height: pickerContentHeight}">
+
+        <!-- loading -->
+        <view v-if="loading"
+          class="lb-picker-loading">
+          <slot name="loading">
+            <view class="lb-picker-loading-img"></view>
+          </slot>
+        </view>
+
+        <!-- 单选 -->
+        <selector-picker v-if="mode === 'selector' && !loading"
+          :value="value"
+          :list="list"
+          :props="pickerProps"
+          :height="pickerContentHeight"
+          @change="handleChange">
+        </selector-picker>
+
+        <!-- 多列联动 -->
+        <multi-selector-picker v-if="mode === 'multiSelector' && !loading"
+          :value="value"
+          :list="list"
+          :level="level"
+          :visible="visible"
+          :props="pickerProps"
+          :height="pickerContentHeight"
+          @change="handleChange">
+        </multi-selector-picker>
+
+        <!-- 非联动选择 -->
+        <unlinked-selector-picker v-if="mode === 'unlinkedSelector' && !loading"
+          :value="value"
+          :list="list"
+          :visible="visible"
+          :props="pickerProps"
+          :height="pickerContentHeight"
+          @change="handleChange">
+        </unlinked-selector-picker>
+      </view>
+    </view>
+  </view>
+</template>
+
+<script>
+const defaultProps = {
+	label: 'label',
+	value: 'value',
+	children: 'children'
+}
+import { getIndicatorHeight } from './utils'
+import SelectorPicker from './pickers/selector-picker'
+import MultiSelectorPicker from './pickers/multi-selector-picker'
+import UnlinkedSelectorPicker from './pickers/unlinked-selector-picker'
+const indicatorHeight = getIndicatorHeight()
+export default {
+	components: {
+		SelectorPicker,
+		MultiSelectorPicker,
+		UnlinkedSelectorPicker
+	},
+	props: {
+		value: [String, Number, Array],
+		list: Array,
+		mode: {
+			type: String,
+			default: 'selector'
+		},
+		level: {
+			type: Number,
+			default: 2
+		},
+		props: {
+			type: Object
+		},
+		cancleText: {
+			type: String,
+			default: '取消'
+		},
+		cancleColor: String,
+		confirmText: {
+			type: String,
+			default: '确定'
+		},
+		confirmColor: String,
+		canHide: {
+			type: Boolean,
+			default: true
+		},
+		radius: String,
+		columnNum: {
+			type: Number,
+			default: 5
+		},
+		loading: Boolean,
+		closeOnClickMask: {
+			type: Boolean,
+			default: true
+		},
+		maskColor: {
+			type: String,
+			default: 'rgba(0, 0, 0, 0.4)'
+		}
+	},
+	data(){
+		return {
+			visible: false,
+			myValue: this.value,
+			picker: {},
+			pickerProps: Object.assign({}, defaultProps, this.props),
+			pickerHeaderHeight: indicatorHeight + 'px',
+			pickerContentHeight: indicatorHeight * (this.columnNum) + 'px'
+		}
+	},
+	methods: {
+		show () {
+			this.visible = true
+		},
+		hide () {
+			this.visible = false
+		},
+		handleCancle () {
+			this.$emit('cancle', this.picker)
+			if (this.canHide) {
+				this.hide()
+			}
+		},
+		handleConfirm () {
+			const picker = JSON.parse(JSON.stringify(this.picker))
+			this.myValue = picker.value
+			this.$emit('confirm', this.picker)
+			if (this.canHide) {
+				this.hide()
+			}
+		},
+		handleChange ({ value, item, index, init }) {
+			this.picker.value = value
+			this.picker.item = item
+			this.picker.index = index
+			if (!init) {
+				this.$emit('change', this.picker)
+			}
+		},
+		handleMaskTap () {
+			if (this.closeOnClickMask) {
+				this.visible = false
+			}
+		}
+	},
+	watch: {
+		value (newVal) {
+			this.myValue = newVal
+		},
+		myValue (newVal) {
+			this.$emit('input', newVal)
+		},
+		visible (newVisible) {
+			if (newVisible) {
+				this.$emit('show')
+			} else {
+				this.$emit('hide')
+			}
+		}
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+@import "./style/picker.scss";
+</style>

components/lb-picker/package.json

@@ -0,0 +1,22 @@
+{
+  "name": "uni-lb-picker",
+  "version": "1.0.4",
+  "description": "uniapp picker选择器，可自定义，扩展性高，支持单选及理论任意级数多级联动选择。",
+  "main": "index.js",
+  "scripts": {
+    "test": "echo \"Error: no test specified\" && exit 1"
+  },
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/liub1934/uni-lb-picker.git"
+  },
+  "keywords": [
+    "uniapp-picker"
+  ],
+  "author": "https://ext.dcloud.net.cn/plugin?id=1111",
+  "license": "MIT",
+  "bugs": {
+    "url": "https://github.com/liub1934/uni-lb-picker/issues"
+  },
+  "homepage": "https://github.com/liub1934/uni-lb-picker#readme"
+}

components/lb-picker/pickers/multi-selector-picker.vue

@@ -0,0 +1,115 @@
+<template>
+  <view class="multi-selector picker-item"
+    :style="{height: height}">
+    <picker-view :value="pickerValue"
+      :indicator-style="indicatorStyle"
+      :style="{height: height}"
+      @change="handleChange">
+      <picker-view-column v-for="(column, index) in pickerColumns"
+        :key="index">
+        <view v-for="(item, i) in column"
+          :class="['lb-picker-column', item[props.value] === selectValue[index] ? 'lb-picker-column-active' : '']"
+          :key="i"
+          :style="{height: columnHeight, 'line-height': columnHeight}">
+          <view class="lb-picker-column-label">
+            {{ item[props.label] }}
+          </view>
+        </view>
+      </picker-view-column>
+    </picker-view>
+  </view>
+</template>
+
+<script>
+import { getIndicatorHeight } from '../utils.js'
+const indicatorHeight = getIndicatorHeight()
+export default {
+	props: {
+		value: Array,
+		list: Array,
+		props: Object,
+		level: Number,
+		keep: {
+			type: Boolean,
+			default: true
+		},
+		visible: Boolean,
+		height: String
+	},
+	data() {
+		return {
+			pickerValue: [],
+			pickerColumns: [],
+			selectValue: [],
+			selectItem: [],
+			columnHeight: indicatorHeight + 'px',
+			indicatorStyle: `height: ${indicatorHeight}px`
+		}
+	},
+	created () {
+		this.init()
+	},
+	methods: {
+		init () {
+			this.setPickerItems(this.list)
+			this.$emit('change', {
+				value: this.selectValue,
+				item: this.selectItem,
+				index: this.pickerValue,
+				init: true
+			})
+		},
+		handleChange (item) {
+			const pickerValue = item.detail.value
+			const columnIndex = pickerValue.findIndex((item, i) => item !== this.pickerValue[i] )
+			const valueIndex = pickerValue[columnIndex]
+			this.setPickerChange(pickerValue, valueIndex, columnIndex)
+		},
+		setPickerChange (pickerValue, valueIndex, columnIndex) {
+			for (let i = 0; i < pickerValue.length; i++) {
+				if (i > columnIndex) {
+					pickerValue[i] = 0
+					const column = this.pickerColumns[i-1][valueIndex] || this.pickerColumns[i-1][0]
+					this.$set(this.pickerColumns, i, column[this.props.children] || [])
+          valueIndex = 0
+				}
+				this.selectItem[i] = this.pickerColumns[i][pickerValue[i]]
+				this.selectValue[i] = this.selectItem[i][this.props.value]
+			}
+			this.pickerValue = pickerValue
+			this.$emit('change', {
+				value: this.selectValue,
+				item: this.selectItem,
+				index: this.pickerValue
+			})
+		},
+		setPickerItems (list = [], index = 0) {
+			const defaultValue = this.value || []
+			if (index < this.level && list.length) {
+				const value = defaultValue[index] || ''
+				let i = list.findIndex(item => item[this.props.value] === value)
+				i = i > -1 ? i : 0
+				this.$set(this.pickerValue, index, i)
+				this.$set(this.pickerColumns, index, list)
+				this.$set(this.selectValue, index, list[i][this.props.value])
+				this.$set(this.selectItem, index, list[i])
+				this.setPickerItems(list[i][this.props.children] || [], index + 1)
+			}
+		}
+	},
+	watch: {
+		visible (newVisible) {
+			if (newVisible && !this.keep) {
+				this.init()	
+			}
+		},
+		list () {
+			this.init()
+		}	
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+@import "../style/picker-item.scss";
+</style>

components/lb-picker/pickers/selector-picker.vue

@@ -0,0 +1,79 @@
+<template>
+  <view class="selector-picker picker-item"
+    :style="{height: height}">
+    <picker-view :value="pickerValue"
+      :indicator-style="indicatorStyle"
+      :style="{height: height}"
+      @change="handleChange">
+      <picker-view-column>
+        <view v-for="(item, i) in list"
+          :class="['lb-picker-column', item[props.value] === selectValue ? 'lb-picker-column-active' : '']"
+          :key="i"
+          :style="{height: columnHeight, lineHeight: columnHeight}">
+          <view class="lb-picker-column-label">
+            {{ item[props.label] }}
+          </view>
+        </view>
+      </picker-view-column>
+    </picker-view>
+  </view>
+</template>
+
+<script>
+import { getIndicatorHeight } from '../utils.js'
+const indicatorHeight = getIndicatorHeight()
+export default {
+	props: {
+		value: [String, Number],
+		list: Array,
+		props: Object,
+		visible: Boolean,
+		height: String
+	},
+	data(){
+		return {
+			pickerValue: [],
+			selectValue: '',
+			columnHeight: indicatorHeight + 'px',
+      indicatorStyle: `height: ${indicatorHeight}px`
+		}
+	},
+	created () {
+		this.init()
+	},
+	methods: {
+		init () {
+			if (this.list && this.list.length) {
+				let index = this.list.findIndex(item => item[this.props.value] === this.value)
+				index = index > -1 ? index : 0
+				this.pickerValue = [index]
+				this.selectValue = this.list[index][this.props.value]
+				this.$emit('change', {
+					value: this.selectValue,
+					item: this.list[index],
+					index: index
+				})
+			}
+		},
+		handleChange (item) {
+			const index = item.detail.value[0] || 0
+			this.selectValue = this.list[index][this.props.value]
+			this.pickerValue = item.detail.value
+			this.$emit('change', {
+				value: this.selectValue,
+				item: this.list[index],
+				index: index
+			})
+		}
+	},
+	watch: {
+		list () {
+			this.init()
+		}	
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+@import "../style/picker-item.scss";
+</style>

components/lb-picker/pickers/unlinked-selector-picker.vue

@@ -0,0 +1,94 @@
+<template>
+  <view class="selector-picker picker-item"
+    :style="{height: height}">
+    <picker-view :value="pickerValue"
+      :indicator-style="indicatorStyle"
+      :style="{height: height}"
+      @change="handleChange">
+      <picker-view-column v-for="(column, index) in pickerColumns"
+        :key="index">
+        <view v-for="(item, i) in column"
+          :class="['lb-picker-column', item[props.value] === selectValue[index] ? 'lb-picker-column-active' : '']"
+          :key="i"
+          :style="{height: columnHeight, 'line-height': columnHeight}">
+          <view class="lb-picker-column-label">
+            {{ item[props.label] }}
+          </view>
+        </view>
+      </picker-view-column>
+    </picker-view>
+  </view>
+</template>
+
+<script>
+import { getIndicatorHeight } from '../utils.js'
+const indicatorHeight = getIndicatorHeight()
+export default {
+	props: {
+		value: Array,
+		list: Array,
+		props: Object,
+		visible: Boolean,
+		height: String,
+		indicatorHeight: Number
+	},
+	data(){
+		return {
+			pickerValue: [],
+			pickerColumns: [],
+			selectValue: [],
+			selectItem: [],
+			columnHeight: indicatorHeight + 'px',
+      indicatorStyle: `height: ${indicatorHeight}px`
+		}
+	},
+	created () {
+		this.init()
+	},
+	methods: {
+		init () {
+			if (this.list && this.list.length) {
+				this.pickerColumns = this.list
+				this.setPickerValue()
+				this.$emit('change', {
+					value: this.selectValue,
+					item: this.selectItem,
+					index: this.pickerValue
+				})
+			}
+		},
+		setPickerValue (value) {
+			this.list.forEach((item, i) => {
+				let index = item.findIndex(item => item[this.props.value] === this.value[i])
+				index = index > -1 ? index : 0
+				this.$set(this.pickerValue, i, index)
+				this.$set(this.selectValue, i, this.list[i][index][this.props.value])
+				this.$set(this.selectItem, i, this.list[i][index])
+			})
+		},
+
+		handleChange (item) {
+			const pickerValue = item.detail.value
+			const columnIndex = pickerValue.findIndex((item, i) => item !== this.pickerValue[i] )
+			const valueIndex = pickerValue[columnIndex]
+			this.pickerValue = pickerValue
+			this.$set(this.selectValue, columnIndex, this.list[columnIndex][valueIndex][this.props.value])
+			this.$set(this.selectItem, columnIndex, this.list[columnIndex][valueIndex])
+			this.$emit('change', {
+				value: this.selectValue,
+				item: this.selectItem,
+				index: this.pickerValue
+			})
+		}
+	},
+	watch: {
+		list () {
+			this.init()
+		}	
+	}
+}
+</script>
+
+<style lang="scss" scoped>
+@import "../style/picker-item.scss";
+</style>

components/lb-picker/style/picker-item.scss

@@ -0,0 +1,16 @@
+.picker-item {
+
+	.lb-picker-column {
+		padding: 0;
+		font-size: 36rpx;
+		text-align: center;
+		box-sizing: border-box;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		overflow: hidden;
+
+		.lb-picker-column-label {
+			transition: all 0.3s;
+		}
+	}
+}

components/lb-picker/utils.js

@@ -0,0 +1,7 @@
+export function isArray (val) {
+  return Object.prototype.toString.call(val) === '[object Array]'
+}
+
+export function getIndicatorHeight () {
+  return Math.round(uni.getSystemInfoSync().screenWidth / (750 / 100))
+}

components/linzq-citySelect/linzq-citySelect.vue

@@ -0,0 +1,477 @@
+<template>
+	<div class="wrapper" :style="'top:'+statusBarHeight+'px'">
+		<div class="header">
+			<view class="back_div">
+				<image class="back_img" @click="back_city()" src="../../static/back_img.png" mode=""></image>
+			</view>
+			<input class="input" @input="onInput" placeholder="中文/拼音/首字母" v-model="searchValue" />
+		</div>
+		<scroll-view class="calendar-list" scroll-y="true" :scroll-into-view="scrollIntoId">
+			<view v-if="disdingwei" id="hot">
+				<!-- 定位模块 -->
+				<view class="dingwei">
+					<view class="dingwei_Tips" >
+						当前定位
+					</view>
+					<view class="dingwei_city">
+						<view class="dingwei_city_one" @tap="selectCity">
+							{{position}}
+						</view>
+						<view class="dingweis_div" @click="getWarpweft">
+							<image class="dingweis" src="../../static/dingweis.png" mode=""></image>
+							<text>{{po_tips}}</text>
+						</view>
+					</view>
+				</view>
+				<!-- 热门城市 -->
+			<view class="dingwei">
+				<view class="dingwei_Tips">
+					热门城市
+				</view>
+				<view class="dingwei_city dingwei_city_zuijin">
+					<view class="dingwei_city_one toright" v-for="(item,index) in hotCity" :key="index" v-if="index<3" @click="back_city(item)">
+						{{item.cityName}}
+					</view> 
+				</view>
+			</view>
+				<!-- 最近模块 -->
+				<view class="dingwei" v-if="Visit.length>=0">
+					<view class="dingwei_Tips">
+						最近访问
+					</view>
+					<view class="dingwei_city dingwei_city_zuijin">
+						<view class="dingwei_city_one toright" v-for="(item,index) in Visit" v-if="index<3" @click="back_city(item)" :key="index">
+							{{item.cityName}}
+						</view> 
+					</view>
+				</view>
+			</view>
+
+			<!-- 城市列表 -->
+			<view v-if="searchValue == ''" v-for="(item, index) in list" :id="getId(index)" :key="index">
+				<view class="letter-header">{{ getId(index) }}</view>
+				<view class="city-div" v-for="(city, i) in item" :key="i" @click="back_city(city)">
+					<text class="city">{{ city.cityName }}</text>
+				</view>
+			</view>
+			<!-- 搜索结果 -->
+			<view class="city-div" v-for="(item, index) in searchList" @click="back_city(item)">
+				<text class="city">{{ item.cityName }}</text>
+			</view>
+		</scroll-view>
+
+		<!-- 右侧字母 -->
+		<view class="letters" v-if="searchValue == ''">
+			<view class="letters-item" @click="scrollTo('hot')">最近</view>
+			<view class="letters-item" v-for="item in letter" :key="item" @click="scrollTo(item)">{{ item }}</view>
+		</view>
+
+		<!-- 选中之后字母 -->
+		<view class="mask" v-if="showMask">
+			<view class="mask-r">{{selectLetter}}</view>
+		</view>
+	</div>
+</template>
+
+<script>
+	import Citys from '../city.js';
+	import QQMapWX from "../../components/qqmap-wx-jssdk1.2/qqmap-wx-jssdk.min.js"
+	export default {
+		components: {},
+		props: {},
+
+		computed: {
+			hotCity() {
+				return Citys.hotCity;
+			},
+
+			citys() {
+				return Citys.cities;
+			}
+		},
+
+		data() {
+			return {
+				statusBarHeight: this.statusBarHeight,
+				ImgUrl: this.ImgUrl,
+				letter: [],
+				selectLetter: '',
+				searchValue: '',
+				scrollIntoId: '',
+				list: [],
+				tId: null,
+				searchList: [],
+				showMask: false,
+				disdingwei: true,
+				Visit: [], //最近访问
+				position: '青岛',
+				longitude: '', //经度
+				latitude: '', //纬度
+				seconds: 3,
+				po_tips: '重新定位',
+			}
+		},
+
+		created() {
+			//获取存储的最近访问
+			var that = this
+			uni.getStorage({
+				key: 'Visit_key',
+				success: function(res) {
+					that.Visit = res.data
+				}
+			});
+			//获取定位 经度纬度
+			that.getWarpweft()
+			//获取city.js 的程序字母
+			var mu = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'j', 'k', 'l', 'm', 'n', 'p', 'q', 'r', 's', 't', 'w', 'x', 'y',
+				'z'
+			];
+			var tmp = [];
+			for (var i = 0; i < mu.length; i++) {
+				var item = mu[i];
+				for (var j = 0; j < this.citys.length; j++) {
+					var py = this.citys[j].py;
+					if (py.substring(0, 1) == item) {
+						if (tmp.indexOf(item) == -1) {
+							this.list[i] = [this.citys[j]];
+							tmp.push(item);
+							this.letter.push(item.toUpperCase());
+						} else {
+							this.list[i].push(this.citys[j]);
+						}
+					}
+				}
+			}
+		},
+		methods: {
+			// 选择当前定位的
+			selectCity(){
+				this.$emit('selectCity',this.position)
+			},
+			getId(index) {
+				return this.letter[index];
+			},
+
+			scrollTo(letter) {
+				this.showMask = true
+				this.selectLetter = letter == 'hot' ? '最' : letter
+				setTimeout(() => {
+					this.showMask = false
+				}, 300);
+				this.scrollIntoId = letter;
+			},
+			query(source, text) {
+				let res = [];
+				var self = this;
+				res = source.filter(item => {
+					const arr = [];
+					let isHave = false;
+					Object.keys(item).forEach(prop => {
+						const itemStr = item[prop];
+						self.isString(itemStr) &&
+							itemStr.split(',').forEach(val => {
+								arr.push(val);
+							});
+					});
+					arr.some(val => {
+						isHave = new RegExp('^' + text).test(val);
+						return isHave;
+					});
+					return isHave;
+				});
+				console.log(JSON.stringify(res));
+				return res;
+			},
+
+			isString(obj) {
+				return typeof obj === 'string';
+			},
+
+			onInput(e) {
+				const value = e.target.value;
+				console.log(value);
+				if (value !== '' && this.citys && this.citys.length > 0) {
+					const queryData = this.query(this.citys, String(value).trim());
+					this.searchList = queryData;
+					this.disdingwei = false
+				} else {
+					this.searchList = [];
+					this.disdingwei = true
+				}
+			},
+
+			back_city(item) {
+				if (item) {
+					this.$emit('back_city', item);
+					//unshift 把数据插入到首位，与push相反
+					this.Visit.unshift(item)
+					this.searchValue = "";
+					this.disdingwei = true
+					var arr = this.Visit
+					//数组去重
+					function distinct(arr) {
+						let newArr = []
+						for (let i = 0; i < arr.length; i++) {
+							if (newArr.indexOf(arr[i]) < 0) {
+								newArr.push(arr[i])
+							}
+						}
+						return newArr
+					}
+					this.Visit = distinct(arr)
+					console.log(this.Visit, "---最近访问")
+					uni.setStorage({
+						key: 'Visit_key',
+						data: this.Visit
+					});
+				} else {
+					this.$emit('back_city', 'no');
+				}
+
+			},
+			// 获取当前定位
+			getWarpweft() {
+				let qqmapsdk = new QQMapWX({
+					key: 'KQDBZ-ZXORJ-U6SFF-FN2AA-UJOSS-7LF5I' // 必填
+				});
+				var that = this
+				that.po_tips = '定位中...'
+				let countdown = setInterval(() => {
+					that.seconds--;
+					uni.getLocation({
+						type: 'wgs84',
+						success: function(res) {
+							that.longitude = res.longitude
+							that.latitude = res.latitude
+							qqmapsdk.reverseGeocoder({
+								location: {
+									latitude: res.latitude,
+									longitude: res.longitude
+								},
+								success:(data)=> {
+									console.log(data)
+									that.position=data.result.address_component.city.slice(0,2)
+								}
+							})
+						}
+					});
+					if (that.seconds <= 0) {
+						that.seconds = 3
+						that.po_tips = '重新定位'
+						clearInterval(countdown);
+					}
+				}, 1000);
+			}
+		}
+	};
+</script>
+
+<style scoped>
+	.wrapper {
+		position: fixed;
+		z-index: 999999;
+		background: #ffffff;
+		height: 100%;
+		width: 100%;
+		top: 0px;
+		left: 0px;
+	}
+
+	.mask {
+		position: absolute;
+		bottom: 0upx;
+		top: 83upx;
+		left: 0upx;
+		right: 0upx;
+		width: 750upx;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		background: rgba(0, 0, 0, 0);
+	}
+
+	.mask-r {
+		height: 120upx;
+		width: 120upx;
+		border-radius: 60upx;
+		display: flex;
+		background: rgba(0, 0, 0, 0.5);
+		justify-content: center;
+		align-items: center;
+		font-size: 40upx;
+		color: #FFFFFF
+	}
+
+	.content {
+		height: 100%;
+		width: 100%;
+		background-color: #ffffff;
+	}
+
+	.header {
+		height: 85upx;
+		display: flex;
+		justify-content: flex-start;
+		align-items: center;
+	}
+
+
+	.back_div {
+		width: 65upx;
+		height: 100%;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.back_img {
+		width: 35upx;
+		height: 35upx;
+	}
+
+	.input {
+		font-size: 28upx;
+		width: 620upx;
+		height: 55upx;
+		border-radius: 40upx;
+		background-color: #F5F5F5;
+		padding-left: 20upx;
+		padding-right: 20upx;
+		box-sizing: border-box;
+	}
+
+	.title {
+		font-size: 30upx;
+		color: white;
+	}
+
+	.show {
+		left: 0;
+		width: 100%;
+		transition: left 0.3s ease;
+	}
+
+	.hide {
+		left: 100%;
+		width: 100%;
+		transition: left 0.3s ease;
+	}
+
+
+	.title {
+		font-size: 30upx;
+		color: white;
+	}
+
+	.calendar-list {
+		position: absolute;
+		top: 83upx;
+		bottom: 0upx;
+		width: 100%;
+		background-color: #FFFFFF;
+	}
+
+	.letters {
+		position: absolute;
+		right: 30upx;
+		bottom: 0px;
+		width: 50upx;
+		top: 260upx;
+		color: #2f9bfe;
+		text-align: center;
+		font-size: 24upx;
+	}
+
+	.letters-item {
+		margin-bottom: 5upx;
+	}
+
+	.letter-header {
+		height: 45upx;
+		font-size: 22upx;
+		color: #333333;
+		padding-left: 24upx;
+		box-sizing: border-box;
+		display: flex;
+		align-items: center;
+		background-color: #ebedef;
+
+	}
+
+	.city-div {
+		width: 660upx;
+		height: 85upx;
+		margin-left: 24upx;
+		border-bottom-width: 0.5upx;
+		border-bottom-color: #ebedef;
+		border-bottom-style: solid;
+		display: flex;
+		align-items: center;
+		margin-right: 35upx;
+	}
+
+	.city {
+		font-size: 28upx;
+		color: #000000;
+		padding-left: 30upx;
+	}
+
+	.dingwei {
+		width: 100%;
+		padding-top: 25upx;
+		box-sizing: border-box;
+		margin-bottom: 26upx;
+	}
+
+	.dingwei_Tips {
+		margin-left: 24upx;
+		margin-bottom: 24upx;
+		font-size: 24upx;
+		color: #A5A5A5;
+	}
+
+	.dingwei_city {
+		width: 100%;
+		height: 60upx;
+		padding-left: 55upx;
+		padding-right: 70upx;
+		box-sizing: border-box;
+		display: flex;
+		justify-content: space-between;
+	}
+
+	.dingwei_city_one {
+		width: 185upx;
+		height: 60upx;
+		background-color: #F5F5F5;
+		border-radius: 10upx;
+		font-size: 32upx;
+		color: #333333;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+
+	.dingweis_div {
+		display: flex;
+		align-content: flex-end;
+		align-items: center;
+		font-size: 24upx;
+		color: #FD5745;
+	}
+
+	.dingweis {
+		width: 32upx;
+		height: 32upx;
+	}
+
+	.dingwei_city_zuijin {
+		display: flex;
+		justify-content: flex-start;
+	}
+
+	.toright {
+		margin-right: 25upx;
+	}
+</style>

components/popup-layer/popup-layer.vue

@@ -0,0 +1,140 @@
+<template>
+	<view>
+		<view v-show="ifshow" @tap="ableClose" @touchmove.stop.prevent class="popup-layer" >
+			
+		</view>
+		<view ref="popRef"  class="popup-content"   @tap.stop="stopEvent" :style="_location">
+			<slot></slot>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name: 'popup-layer',
+		model: {
+			prop: "showPop",
+			event: "change"
+		},
+		props: {
+			showPop:{
+				type:Boolean,
+				default:false,
+			},
+			direction: {
+				type: String,
+				default: 'top', // 方向  top，bottom，left，right 
+			},
+			autoClose: {
+				type: Boolean,
+				default: true,
+			}
+		},
+		data() {
+			return {
+				ifshow: false, // 是否展示,
+				translateValue: -100, // 位移距离
+				site:-100,
+				timer: null,
+				iftoggle: false,
+
+			};
+		},
+		computed: {
+			_translate() {
+				const transformObj = {
+					'top': `transform:translateY(${-this.translateValue}%)`,
+					'bottom': `transform:translateY(${this.translateValue}%)`,
+					'left': `transform:translateX(${-this.translateValue}%)`,
+					'right': `transform:translateX(${this.translateValue}%)`
+				};
+				return transformObj[this.direction]
+			},
+			_location() {
+				const positionValue = {
+					'top': `bottom:${this.site}%;width:100%;`,
+					'bottom': `top:${this.site}%;width:100%;`,
+					'left': `right:0px;top:0;height:100%;`,
+					'right': `left:0px;top:0;height:100%;`,
+				};
+				return positionValue[this.direction]+ this._translate;
+			}
+		},
+		mounted(){
+			if(this.showPop){
+				// console.log(222);
+				this.show();
+			}
+		},
+		watch:{
+			showPop(value){
+				console.log(value)
+				if(value){
+					this.show();
+				}else{
+					this.close();
+				}
+			}	
+		},
+		methods: {
+			stopMove(event){
+				return;
+			},
+			show(events) {
+				this.ifshow = true;
+				this.site=0;
+				let _open = setTimeout(() => {
+					this.translateValue = 0;
+					_open = null;
+				}, 100)
+				let _toggle = setTimeout(() => {
+					this.iftoggle = true;
+					_toggle = null;
+				}, 300);
+			},
+			close() {
+				if (this.timer !== null || !this.iftoggle) {
+					return;
+				}
+				this.translateValue = -100;
+				this.timer = setTimeout(() => {
+					this.ifshow = false;
+					this.timer = null;
+					this.iftoggle = false;
+					this.$emit('closeCallBack', null);
+					this.$emit('change',false)
+				}, 300);
+			},
+			ableClose() {
+				if (this.autoClose) {
+					this.close();
+				}
+			},
+			stopEvent(event) {},
+			doSome(){
+			}
+
+		}
+	}
+</script>
+
+<style lang="scss">
+	.popup-layer {
+		position: fixed;
+		z-index: 999999;
+		// background: rgba(0, 0, 0, .3);
+		height: 100%;
+		width: 100%;
+		top: 0px;
+		left: 0px;
+		overflow: hidden;
+	}
+
+	.popup-content {
+		position: fixed;
+		z-index: 1000000;
+		background: #FFFFFF;
+		transition: transform .2s ease;
+		overflow: hidden; 
+	}
+</style>

components/qqmap-wx-jssdk1.2/qqmap-wx-jssdk.js

@@ -0,0 +1,1123 @@
+/**
+ * 微信小程序JavaScriptSDK
+ * 
+ * @version 1.2
+ * @date 2019-03-06
+ * @author v_ylyue@tencent.com
+ */
+
+var ERROR_CONF = {
+    KEY_ERR: 311,
+    KEY_ERR_MSG: 'key格式错误',
+    PARAM_ERR: 310,
+    PARAM_ERR_MSG: '请求参数信息有误',
+    SYSTEM_ERR: 600,
+    SYSTEM_ERR_MSG: '系统错误',
+    WX_ERR_CODE: 1000,
+    WX_OK_CODE: 200
+};
+var BASE_URL = 'https://apis.map.qq.com/ws/';
+var URL_SEARCH = BASE_URL + 'place/v1/search';
+var URL_SUGGESTION = BASE_URL + 'place/v1/suggestion';
+var URL_GET_GEOCODER = BASE_URL + 'geocoder/v1/';
+var URL_CITY_LIST = BASE_URL + 'district/v1/list';
+var URL_AREA_LIST = BASE_URL + 'district/v1/getchildren';
+var URL_DISTANCE = BASE_URL + 'distance/v1/';
+var URL_DIRECTION = BASE_URL + 'direction/v1/';
+var MODE = {
+  driving: 'driving',
+  transit: 'transit'
+};
+var EARTH_RADIUS = 6378136.49;
+var Utils = {
+  /**
+  * md5加密方法
+  * 版权所有©2011 Sebastian Tschan，https：//blueimp.net
+  */
+  safeAdd(x, y) {
+    var lsw = (x & 0xffff) + (y & 0xffff);
+    var msw = (x >> 16) + (y >> 16) + (lsw >> 16);
+    return (msw << 16) | (lsw & 0xffff);
+  },
+  bitRotateLeft(num, cnt) {
+    return (num << cnt) | (num >>> (32 - cnt));
+  },
+  md5cmn(q, a, b, x, s, t) {
+    return this.safeAdd(this.bitRotateLeft(this.safeAdd(this.safeAdd(a, q), this.safeAdd(x, t)), s), b);
+  },
+  md5ff(a, b, c, d, x, s, t) {
+    return this.md5cmn((b & c) | (~b & d), a, b, x, s, t);
+  },
+  md5gg(a, b, c, d, x, s, t) {
+    return this.md5cmn((b & d) | (c & ~d), a, b, x, s, t);
+  },
+  md5hh(a, b, c, d, x, s, t) {
+    return this.md5cmn(b ^ c ^ d, a, b, x, s, t);
+  },
+  md5ii(a, b, c, d, x, s, t) {
+    return this.md5cmn(c ^ (b | ~d), a, b, x, s, t);
+  },
+  binlMD5(x, len) {
+    /* append padding */
+    x[len >> 5] |= 0x80 << (len % 32);
+    x[((len + 64) >>> 9 << 4) + 14] = len;
+
+    var i;
+    var olda;
+    var oldb;
+    var oldc;
+    var oldd;
+    var a = 1732584193;
+    var b = -271733879;
+    var c = -1732584194;
+    var d = 271733878;
+
+    for (i = 0; i < x.length; i += 16) {
+      olda = a;
+      oldb = b;
+      oldc = c;
+      oldd = d;
+
+      a = this.md5ff(a, b, c, d, x[i], 7, -680876936);
+      d = this.md5ff(d, a, b, c, x[i + 1], 12, -389564586);
+      c = this.md5ff(c, d, a, b, x[i + 2], 17, 606105819);
+      b = this.md5ff(b, c, d, a, x[i + 3], 22, -1044525330);
+      a = this.md5ff(a, b, c, d, x[i + 4], 7, -176418897);
+      d = this.md5ff(d, a, b, c, x[i + 5], 12, 1200080426);
+      c = this.md5ff(c, d, a, b, x[i + 6], 17, -1473231341);
+      b = this.md5ff(b, c, d, a, x[i + 7], 22, -45705983);
+      a = this.md5ff(a, b, c, d, x[i + 8], 7, 1770035416);
+      d = this.md5ff(d, a, b, c, x[i + 9], 12, -1958414417);
+      c = this.md5ff(c, d, a, b, x[i + 10], 17, -42063);
+      b = this.md5ff(b, c, d, a, x[i + 11], 22, -1990404162);
+      a = this.md5ff(a, b, c, d, x[i + 12], 7, 1804603682);
+      d = this.md5ff(d, a, b, c, x[i + 13], 12, -40341101);
+      c = this.md5ff(c, d, a, b, x[i + 14], 17, -1502002290);
+      b = this.md5ff(b, c, d, a, x[i + 15], 22, 1236535329);
+
+      a = this.md5gg(a, b, c, d, x[i + 1], 5, -165796510);
+      d = this.md5gg(d, a, b, c, x[i + 6], 9, -1069501632);
+      c = this.md5gg(c, d, a, b, x[i + 11], 14, 643717713);
+      b = this.md5gg(b, c, d, a, x[i], 20, -373897302);
+      a = this.md5gg(a, b, c, d, x[i + 5], 5, -701558691);
+      d = this.md5gg(d, a, b, c, x[i + 10], 9, 38016083);
+      c = this.md5gg(c, d, a, b, x[i + 15], 14, -660478335);
+      b = this.md5gg(b, c, d, a, x[i + 4], 20, -405537848);
+      a = this.md5gg(a, b, c, d, x[i + 9], 5, 568446438);
+      d = this.md5gg(d, a, b, c, x[i + 14], 9, -1019803690);
+      c = this.md5gg(c, d, a, b, x[i + 3], 14, -187363961);
+      b = this.md5gg(b, c, d, a, x[i + 8], 20, 1163531501);
+      a = this.md5gg(a, b, c, d, x[i + 13], 5, -1444681467);
+      d = this.md5gg(d, a, b, c, x[i + 2], 9, -51403784);
+      c = this.md5gg(c, d, a, b, x[i + 7], 14, 1735328473);
+      b = this.md5gg(b, c, d, a, x[i + 12], 20, -1926607734);
+
+      a = this.md5hh(a, b, c, d, x[i + 5], 4, -378558);
+      d = this.md5hh(d, a, b, c, x[i + 8], 11, -2022574463);
+      c = this.md5hh(c, d, a, b, x[i + 11], 16, 1839030562);
+      b = this.md5hh(b, c, d, a, x[i + 14], 23, -35309556);
+      a = this.md5hh(a, b, c, d, x[i + 1], 4, -1530992060);
+      d = this.md5hh(d, a, b, c, x[i + 4], 11, 1272893353);
+      c = this.md5hh(c, d, a, b, x[i + 7], 16, -155497632);
+      b = this.md5hh(b, c, d, a, x[i + 10], 23, -1094730640);
+      a = this.md5hh(a, b, c, d, x[i + 13], 4, 681279174);
+      d = this.md5hh(d, a, b, c, x[i], 11, -358537222);
+      c = this.md5hh(c, d, a, b, x[i + 3], 16, -722521979);
+      b = this.md5hh(b, c, d, a, x[i + 6], 23, 76029189);
+      a = this.md5hh(a, b, c, d, x[i + 9], 4, -640364487);
+      d = this.md5hh(d, a, b, c, x[i + 12], 11, -421815835);
+      c = this.md5hh(c, d, a, b, x[i + 15], 16, 530742520);
+      b = this.md5hh(b, c, d, a, x[i + 2], 23, -995338651);
+
+      a = this.md5ii(a, b, c, d, x[i], 6, -198630844);
+      d = this.md5ii(d, a, b, c, x[i + 7], 10, 1126891415);
+      c = this.md5ii(c, d, a, b, x[i + 14], 15, -1416354905);
+      b = this.md5ii(b, c, d, a, x[i + 5], 21, -57434055);
+      a = this.md5ii(a, b, c, d, x[i + 12], 6, 1700485571);
+      d = this.md5ii(d, a, b, c, x[i + 3], 10, -1894986606);
+      c = this.md5ii(c, d, a, b, x[i + 10], 15, -1051523);
+      b = this.md5ii(b, c, d, a, x[i + 1], 21, -2054922799);
+      a = this.md5ii(a, b, c, d, x[i + 8], 6, 1873313359);
+      d = this.md5ii(d, a, b, c, x[i + 15], 10, -30611744);
+      c = this.md5ii(c, d, a, b, x[i + 6], 15, -1560198380);
+      b = this.md5ii(b, c, d, a, x[i + 13], 21, 1309151649);
+      a = this.md5ii(a, b, c, d, x[i + 4], 6, -145523070);
+      d = this.md5ii(d, a, b, c, x[i + 11], 10, -1120210379);
+      c = this.md5ii(c, d, a, b, x[i + 2], 15, 718787259);
+      b = this.md5ii(b, c, d, a, x[i + 9], 21, -343485551);
+
+      a = this.safeAdd(a, olda);
+      b = this.safeAdd(b, oldb);
+      c = this.safeAdd(c, oldc);
+      d = this.safeAdd(d, oldd);
+    }
+    return [a, b, c, d];
+  },
+  binl2rstr(input) {
+    var i;
+    var output = '';
+    var length32 = input.length * 32;
+    for (i = 0; i < length32; i += 8) {
+      output += String.fromCharCode((input[i >> 5] >>> (i % 32)) & 0xff);
+    }
+    return output;
+  },
+  rstr2binl(input) {
+    var i;
+    var output = [];
+    output[(input.length >> 2) - 1] = undefined;
+    for (i = 0; i < output.length; i += 1) {
+      output[i] = 0;
+    }
+    var length8 = input.length * 8;
+    for (i = 0; i < length8; i += 8) {
+      output[i >> 5] |= (input.charCodeAt(i / 8) & 0xff) << (i % 32);
+    }
+    return output;
+  },
+  rstrMD5(s) {
+    return this.binl2rstr(this.binlMD5(this.rstr2binl(s), s.length * 8));
+  },
+  rstrHMACMD5(key, data) {
+    var i;
+    var bkey = this.rstr2binl(key);
+    var ipad = [];
+    var opad = [];
+    var hash;
+    ipad[15] = opad[15] = undefined;
+    if (bkey.length > 16) {
+      bkey = this.binlMD5(bkey, key.length * 8);
+    }
+    for (i = 0; i < 16; i += 1) {
+      ipad[i] = bkey[i] ^ 0x36363636;
+      opad[i] = bkey[i] ^ 0x5c5c5c5c;
+    }
+    hash = this.binlMD5(ipad.concat(this.rstr2binl(data)), 512 + data.length * 8);
+    return this.binl2rstr(this.binlMD5(opad.concat(hash), 512 + 128));
+  },
+  rstr2hex(input) {
+    var hexTab = '0123456789abcdef';
+    var output = '';
+    var x;
+    var i;
+    for (i = 0; i < input.length; i += 1) {
+      x = input.charCodeAt(i);
+      output += hexTab.charAt((x >>> 4) & 0x0f) + hexTab.charAt(x & 0x0f);
+    }
+    return output;
+  },
+  str2rstrUTF8(input) {
+    return unescape(encodeURIComponent(input));
+  },
+  rawMD5(s) {
+    return this.rstrMD5(this.str2rstrUTF8(s));
+  },
+  hexMD5(s) {
+    return this.rstr2hex(this.rawMD5(s));
+  },
+  rawHMACMD5(k, d) {
+    return this.rstrHMACMD5(this.str2rstrUTF8(k), str2rstrUTF8(d));
+  },
+  hexHMACMD5(k, d) {
+    return this.rstr2hex(this.rawHMACMD5(k, d));
+  },
+
+  md5(string, key, raw) {
+    if (!key) {
+      if (!raw) {
+        return this.hexMD5(string);
+      }
+      return this.rawMD5(string);
+    }
+    if (!raw) {
+      return this.hexHMACMD5(key, string);
+    }
+    return this.rawHMACMD5(key, string);
+  },
+  /**
+   * 得到md5加密后的sig参数
+   * @param {Object} requestParam 接口参数
+   * @param {String} sk签名字符串
+   * @param {String} featrue 方法名
+   * @return 返回加密后的sig参数
+   */
+  getSig(requestParam, sk, feature, mode) {
+    var sig = null;
+    var requestArr = [];
+    Object.keys(requestParam).sort().forEach(function(key){
+      requestArr.push(key + '=' + requestParam[key]);
+    });
+    if (feature == 'search') {
+      sig = '/ws/place/v1/search?' + requestArr.join('&') + sk;
+    }
+    if (feature == 'suggest') {
+      sig = '/ws/place/v1/suggestion?' + requestArr.join('&') + sk;
+    }
+    if (feature == 'reverseGeocoder') {
+      sig = '/ws/geocoder/v1/?' + requestArr.join('&') + sk;
+    }
+    if (feature == 'geocoder') {
+      sig = '/ws/geocoder/v1/?' + requestArr.join('&') + sk;
+    }
+    if (feature == 'getCityList') {
+      sig = '/ws/district/v1/list?' + requestArr.join('&') + sk;
+    }
+    if (feature == 'getDistrictByCityId') {
+      sig = '/ws/district/v1/getchildren?' + requestArr.join('&') + sk;
+    }
+    if (feature == 'calculateDistance') {
+      sig = '/ws/distance/v1/?' + requestArr.join('&') + sk;
+    }
+    if (feature == 'direction') {
+      sig = '/ws/direction/v1/' + mode + '?' + requestArr.join('&') + sk;
+    }
+    sig = this.md5(sig);
+    return sig;
+  },
+    /**
+     * 得到终点query字符串
+     * @param {Array|String} 检索数据
+     */
+    location2query(data) {
+        if (typeof data == 'string') {
+            return data;
+        }
+        var query = '';
+        for (var i = 0; i < data.length; i++) {
+            var d = data[i];
+            if (!!query) {
+                query += ';';
+            }
+            if (d.location) {
+                query = query + d.location.lat + ',' + d.location.lng;
+            }
+            if (d.latitude && d.longitude) {
+                query = query + d.latitude + ',' + d.longitude;
+            }
+        }
+        return query;
+    },
+
+    /**
+     * 计算角度
+     */
+    rad(d) {
+      return d * Math.PI / 180.0;
+    },  
+    /**
+     * 处理终点location数组
+     * @return 返回终点数组
+     */
+    getEndLocation(location){
+      var to = location.split(';');
+      var endLocation = [];
+      for (var i = 0; i < to.length; i++) {
+        endLocation.push({
+          lat: parseFloat(to[i].split(',')[0]),
+          lng: parseFloat(to[i].split(',')[1])
+        })
+      }
+      return endLocation;
+    },
+
+    /**
+     * 计算两点间直线距离
+     * @param a 表示纬度差
+     * @param b 表示经度差
+     * @return 返回的是距离，单位m
+     */
+    getDistance(latFrom, lngFrom, latTo, lngTo) {
+      var radLatFrom = this.rad(latFrom);
+      var radLatTo = this.rad(latTo);
+      var a = radLatFrom - radLatTo;
+      var b = this.rad(lngFrom) - this.rad(lngTo);
+      var distance = 2 * Math.asin(Math.sqrt(Math.pow(Math.sin(a / 2), 2) + Math.cos(radLatFrom) * Math.cos(radLatTo) * Math.pow(Math.sin(b / 2), 2)));
+      distance = distance * EARTH_RADIUS;
+      distance = Math.round(distance * 10000) / 10000;
+      return parseFloat(distance.toFixed(0));
+    },
+    /**
+     * 使用微信接口进行定位
+     */
+    getWXLocation(success, fail, complete) {
+        wx.getLocation({
+            type: 'gcj02',
+            success: success,
+            fail: fail,
+            complete: complete
+        });
+    },
+
+    /**
+     * 获取location参数
+     */
+    getLocationParam(location) {
+        if (typeof location == 'string') {
+            var locationArr = location.split(',');
+            if (locationArr.length === 2) {
+                location = {
+                    latitude: location.split(',')[0],
+                    longitude: location.split(',')[1]
+                };
+            } else {
+                location = {};
+            }
+        }
+        return location;
+    },
+
+    /**
+     * 回调函数默认处理
+     */
+    polyfillParam(param) {
+        param.success = param.success || function () { };
+        param.fail = param.fail || function () { };
+        param.complete = param.complete || function () { };
+    },
+
+    /**
+     * 验证param对应的key值是否为空
+     * 
+     * @param {Object} param 接口参数
+     * @param {String} key 对应参数的key
+     */
+    checkParamKeyEmpty(param, key) {
+        if (!param[key]) {
+            var errconf = this.buildErrorConfig(ERROR_CONF.PARAM_ERR, ERROR_CONF.PARAM_ERR_MSG + key +'参数格式有误');
+            param.fail(errconf);
+            param.complete(errconf);
+            return true;
+        }
+        return false;
+    },
+
+    /**
+     * 验证参数中是否存在检索词keyword
+     * 
+     * @param {Object} param 接口参数
+     */
+    checkKeyword(param){
+        return !this.checkParamKeyEmpty(param, 'keyword');
+    },
+
+    /**
+     * 验证location值
+     * 
+     * @param {Object} param 接口参数
+     */
+    checkLocation(param) {
+        var location = this.getLocationParam(param.location);
+        if (!location || !location.latitude || !location.longitude) {
+            var errconf = this.buildErrorConfig(ERROR_CONF.PARAM_ERR, ERROR_CONF.PARAM_ERR_MSG + ' location参数格式有误');
+            param.fail(errconf);
+            param.complete(errconf);
+            return false;
+        }
+        return true;
+    },
+
+    /**
+     * 构造错误数据结构
+     * @param {Number} errCode 错误码
+     * @param {Number} errMsg 错误描述
+     */
+    buildErrorConfig(errCode, errMsg) {
+        return {
+            status: errCode,
+            message: errMsg
+        };
+    },
+
+    /**
+     * 
+     * 数据处理函数
+     * 根据传入参数不同处理不同数据
+     * @param {String} feature 功能名称
+     * search 地点搜索
+     * suggest关键词提示
+     * reverseGeocoder逆地址解析
+     * geocoder地址解析
+     * getCityList获取城市列表：父集
+     * getDistrictByCityId获取区县列表：子集
+     * calculateDistance距离计算
+     * @param {Object} param 接口参数
+     * @param {Object} data 数据
+     */
+    handleData(param,data,feature){
+      if (feature == 'search') {
+        var searchResult = data.data;
+        var searchSimplify = [];
+        for (var i = 0; i < searchResult.length; i++) {
+          searchSimplify.push({
+            id: searchResult[i].id || null,
+            title: searchResult[i].title || null,
+            latitude: searchResult[i].location && searchResult[i].location.lat || null,
+            longitude: searchResult[i].location && searchResult[i].location.lng || null,
+            address: searchResult[i].address || null,
+            category: searchResult[i].category || null,
+            tel: searchResult[i].tel || null,
+            adcode: searchResult[i].ad_info && searchResult[i].ad_info.adcode || null,
+            city: searchResult[i].ad_info && searchResult[i].ad_info.city || null,
+            district: searchResult[i].ad_info && searchResult[i].ad_info.district || null,
+            province: searchResult[i].ad_info && searchResult[i].ad_info.province || null
+          })
+        }
+        param.success(data, {
+          searchResult: searchResult,
+          searchSimplify: searchSimplify
+        })
+      } else if (feature == 'suggest') {
+        var suggestResult = data.data;
+        var suggestSimplify = [];
+        for (var i = 0; i < suggestResult.length; i++) {
+          suggestSimplify.push({
+            adcode: suggestResult[i].adcode || null,
+            address: suggestResult[i].address || null,
+            category: suggestResult[i].category || null,
+            city: suggestResult[i].city || null,
+            district: suggestResult[i].district || null,
+            id: suggestResult[i].id || null,
+            latitude: suggestResult[i].location && suggestResult[i].location.lat || null,
+            longitude: suggestResult[i].location && suggestResult[i].location.lng || null,
+            province: suggestResult[i].province || null,
+            title: suggestResult[i].title || null,
+            type: suggestResult[i].type || null
+          })
+        }
+        param.success(data, {
+          suggestResult: suggestResult,
+          suggestSimplify: suggestSimplify
+          })
+      } else if (feature == 'reverseGeocoder') {
+        var reverseGeocoderResult = data.result;
+        var reverseGeocoderSimplify = {
+          address: reverseGeocoderResult.address || null,
+          latitude: reverseGeocoderResult.location && reverseGeocoderResult.location.lat || null,
+          longitude: reverseGeocoderResult.location && reverseGeocoderResult.location.lng || null,
+          adcode: reverseGeocoderResult.ad_info && reverseGeocoderResult.ad_info.adcode || null,
+          city: reverseGeocoderResult.address_component && reverseGeocoderResult.address_component.city || null,
+          district: reverseGeocoderResult.address_component && reverseGeocoderResult.address_component.district || null,
+          nation: reverseGeocoderResult.address_component && reverseGeocoderResult.address_component.nation || null,
+          province: reverseGeocoderResult.address_component && reverseGeocoderResult.address_component.province || null,
+          street: reverseGeocoderResult.address_component && reverseGeocoderResult.address_component.street || null,
+          street_number: reverseGeocoderResult.address_component && reverseGeocoderResult.address_component.street_number || null,
+          recommend: reverseGeocoderResult.formatted_addresses && reverseGeocoderResult.formatted_addresses.recommend || null,
+          rough: reverseGeocoderResult.formatted_addresses && reverseGeocoderResult.formatted_addresses.rough || null
+        };
+        if (reverseGeocoderResult.pois) {//判断是否返回周边poi
+          var pois = reverseGeocoderResult.pois;
+          var poisSimplify = [];
+          for (var i = 0;i < pois.length;i++) {
+            poisSimplify.push({
+              id: pois[i].id || null,
+              title: pois[i].title || null,
+              latitude: pois[i].location && pois[i].location.lat || null,
+              longitude: pois[i].location && pois[i].location.lng || null,
+              address: pois[i].address || null,
+              category: pois[i].category || null,
+              adcode: pois[i].ad_info && pois[i].ad_info.adcode || null,
+              city: pois[i].ad_info && pois[i].ad_info.city || null,
+              district: pois[i].ad_info && pois[i].ad_info.district || null,
+              province: pois[i].ad_info && pois[i].ad_info.province || null
+            })
+          }
+          param.success(data,{
+            reverseGeocoderResult: reverseGeocoderResult,
+            reverseGeocoderSimplify: reverseGeocoderSimplify,
+            pois: pois,
+            poisSimplify: poisSimplify
+          })
+        } else {
+          param.success(data, {
+            reverseGeocoderResult: reverseGeocoderResult,
+            reverseGeocoderSimplify: reverseGeocoderSimplify
+          })
+        }
+      } else if (feature == 'geocoder') {
+        var geocoderResult = data.result;
+        var geocoderSimplify = {
+          title: geocoderResult.title || null,
+          latitude: geocoderResult.location && geocoderResult.location.lat || null,
+          longitude: geocoderResult.location && geocoderResult.location.lng || null,
+          adcode: geocoderResult.ad_info && geocoderResult.ad_info.adcode || null,
+          province: geocoderResult.address_components && geocoderResult.address_components.province || null,
+          city: geocoderResult.address_components && geocoderResult.address_components.city || null,
+          district: geocoderResult.address_components && geocoderResult.address_components.district || null,
+          street: geocoderResult.address_components && geocoderResult.address_components.street || null,
+          street_number: geocoderResult.address_components && geocoderResult.address_components.street_number || null,
+          level: geocoderResult.level || null
+        };
+        param.success(data,{
+          geocoderResult: geocoderResult,
+          geocoderSimplify: geocoderSimplify
+        });
+      } else if (feature == 'getCityList') {
+        var provinceResult = data.result[0];
+        var cityResult = data.result[1];
+        var districtResult = data.result[2];
+        param.success(data,{
+          provinceResult: provinceResult,
+          cityResult: cityResult,
+          districtResult: districtResult
+        });
+      } else if (feature == 'getDistrictByCityId') {
+        var districtByCity = data.result[0];
+        param.success(data, districtByCity);
+      } else if (feature == 'calculateDistance') {
+        var calculateDistanceResult = data.result.elements;  
+        var distance = [];
+        for (var i = 0; i < calculateDistanceResult.length; i++){
+          distance.push(calculateDistanceResult[i].distance);
+        }   
+        param.success(data, {
+          calculateDistanceResult: calculateDistanceResult,
+          distance: distance
+          });
+      } else if (feature == 'direction') {
+        var direction = data.result.routes;
+        param.success(data,direction);
+      } else {
+        param.success(data);
+      }
+    },
+
+    /**
+     * 构造微信请求参数，公共属性处理
+     * 
+     * @param {Object} param 接口参数
+     * @param {Object} param 配置项
+     * @param {String} feature 方法名
+     */
+    buildWxRequestConfig(param, options, feature) {
+        var that = this;
+        options.header = { "content-type": "application/json" };
+        options.method = 'GET';
+        options.success = function (res) {
+            var data = res.data;
+            if (data.status === 0) {
+              that.handleData(param, data, feature);
+            } else {
+                param.fail(data);
+            }
+        };
+        options.fail = function (res) {
+            res.statusCode = ERROR_CONF.WX_ERR_CODE;
+            param.fail(that.buildErrorConfig(ERROR_CONF.WX_ERR_CODE, res.errMsg));
+        };
+        options.complete = function (res) {
+            var statusCode = +res.statusCode;
+            switch(statusCode) {
+                case ERROR_CONF.WX_ERR_CODE: {
+                    param.complete(that.buildErrorConfig(ERROR_CONF.WX_ERR_CODE, res.errMsg));
+                    break;
+                }
+                case ERROR_CONF.WX_OK_CODE: {
+                    var data = res.data;
+                    if (data.status === 0) {
+                        param.complete(data);
+                    } else {
+                        param.complete(that.buildErrorConfig(data.status, data.message));
+                    }
+                    break;
+                }
+                default:{
+                    param.complete(that.buildErrorConfig(ERROR_CONF.SYSTEM_ERR, ERROR_CONF.SYSTEM_ERR_MSG));
+                }
+
+            }
+        };
+        return options;
+    },
+
+    /**
+     * 处理用户参数是否传入坐标进行不同的处理
+     */
+    locationProcess(param, locationsuccess, locationfail, locationcomplete) {
+        var that = this;
+        locationfail = locationfail || function (res) {
+            res.statusCode = ERROR_CONF.WX_ERR_CODE;
+            param.fail(that.buildErrorConfig(ERROR_CONF.WX_ERR_CODE, res.errMsg));
+        };
+        locationcomplete = locationcomplete || function (res) {
+            if (res.statusCode == ERROR_CONF.WX_ERR_CODE) {
+                param.complete(that.buildErrorConfig(ERROR_CONF.WX_ERR_CODE, res.errMsg));
+            }
+        };
+        if (!param.location) {
+            that.getWXLocation(locationsuccess, locationfail, locationcomplete);
+        } else if (that.checkLocation(param)) {
+            var location = Utils.getLocationParam(param.location);
+            locationsuccess(location);
+        }
+    }
+};
+
+
+class QQMapWX {
+
+    /**
+     * 构造函数
+     * 
+     * @param {Object} options 接口参数,key 为必选参数
+     */
+    constructor(options) {
+        if (!options.key) {
+            throw Error('key值不能为空');
+        }
+        this.key = options.key;
+    };
+
+    /**
+     * POI周边检索
+     *
+     * @param {Object} options 接口参数对象
+     * 
+     * 参数对象结构可以参考
+     * @see http://lbs.qq.com/webservice_v1/guide-search.html
+     */
+    search(options) {
+        var that = this;
+        options = options || {};
+
+        Utils.polyfillParam(options);
+
+        if (!Utils.checkKeyword(options)) {
+            return;
+        }
+
+        var requestParam = {
+            keyword: options.keyword,
+            orderby: options.orderby || '_distance',
+            page_size: options.page_size || 10,
+            page_index: options.page_index || 1,
+            output: 'json',
+            key: that.key
+        };
+
+        if (options.address_format) {
+            requestParam.address_format = options.address_format;
+        }
+
+        if (options.filter) {
+            requestParam.filter = options.filter;
+        }
+
+        var distance = options.distance || "1000";
+        var auto_extend = options.auto_extend || 1;
+        var region = null;
+        var rectangle = null;
+
+        //判断城市限定参数
+        if (options.region) {
+          region = options.region;
+        }
+
+        //矩形限定坐标(暂时只支持字符串格式)
+        if (options.rectangle) {
+          rectangle = options.rectangle;
+        }
+
+        var locationsuccess = function (result) {        
+          if (region && !rectangle) {
+            //城市限定参数拼接
+            requestParam.boundary = "region(" + region + "," + auto_extend + "," + result.latitude + "," + result.longitude + ")";
+            if (options.sig) {
+              requestParam.sig = Utils.getSig(requestParam, options.sig, 'search');
+            }
+          } else if (rectangle && !region) {
+            //矩形搜索
+            requestParam.boundary = "rectangle(" + rectangle + ")";
+            if (options.sig) {
+              requestParam.sig = Utils.getSig(requestParam, options.sig, 'search');
+            }
+            } else {
+              requestParam.boundary = "nearby(" + result.latitude + "," + result.longitude + "," + distance + "," + auto_extend + ")";
+            if (options.sig) {
+              requestParam.sig = Utils.getSig(requestParam, options.sig, 'search');
+            }
+            }            
+            wx.request(Utils.buildWxRequestConfig(options, {
+                url: URL_SEARCH,
+                data: requestParam
+            }, 'search'));
+        };
+        Utils.locationProcess(options, locationsuccess);
+    };
+
+    /**
+     * sug模糊检索
+     *
+     * @param {Object} options 接口参数对象
+     * 
+     * 参数对象结构可以参考
+     * http://lbs.qq.com/webservice_v1/guide-suggestion.html
+     */
+    getSuggestion(options) {
+        var that = this;
+        options = options || {};
+        Utils.polyfillParam(options);
+
+        if (!Utils.checkKeyword(options)) {
+            return;
+        }
+
+        var requestParam = {
+            keyword: options.keyword,
+            region: options.region || '全国',
+            region_fix: options.region_fix || 0,
+            policy: options.policy || 0,
+            page_size: options.page_size || 10,//控制显示条数
+            page_index: options.page_index || 1,//控制页数
+            get_subpois : options.get_subpois || 0,//返回子地点
+            output: 'json',
+            key: that.key
+        };
+        //长地址
+        if (options.address_format) {
+          requestParam.address_format = options.address_format;
+        }
+        //过滤
+        if (options.filter) {
+          requestParam.filter = options.filter;
+        }
+        //排序
+        if (options.location) {
+          var locationsuccess = function (result) {
+            requestParam.location = result.latitude + ',' + result.longitude;
+            if (options.sig) {
+              requestParam.sig = Utils.getSig(requestParam, options.sig, 'suggest');
+            }
+            wx.request(Utils.buildWxRequestConfig(options, {
+              url: URL_SUGGESTION,
+              data: requestParam
+            }, "suggest"));      
+          };
+          Utils.locationProcess(options, locationsuccess);
+        } else {
+          if (options.sig) {
+            requestParam.sig = Utils.getSig(requestParam, options.sig, 'suggest');
+          }
+          wx.request(Utils.buildWxRequestConfig(options, {
+            url: URL_SUGGESTION,
+            data: requestParam
+          }, "suggest"));      
+        }        
+    };
+
+    /**
+     * 逆地址解析
+     *
+     * @param {Object} options 接口参数对象
+     * 
+     * 请求参数结构可以参考
+     * http://lbs.qq.com/webservice_v1/guide-gcoder.html
+     */
+    reverseGeocoder(options) {
+        var that = this;
+        options = options || {};
+        Utils.polyfillParam(options);
+        var requestParam = {
+            coord_type: options.coord_type || 5,
+            get_poi: options.get_poi || 0,
+            output: 'json',
+            key: that.key
+        };
+        if (options.poi_options) {
+            requestParam.poi_options = options.poi_options
+        }
+
+        var locationsuccess = function (result) {
+            requestParam.location = result.latitude + ',' + result.longitude;
+          if (options.sig) {
+            requestParam.sig = Utils.getSig(requestParam, options.sig, 'reverseGeocoder');
+          }
+            wx.request(Utils.buildWxRequestConfig(options, {
+                url: URL_GET_GEOCODER,
+                data: requestParam
+            }, 'reverseGeocoder'));
+        };
+        Utils.locationProcess(options, locationsuccess);
+    };
+
+    /**
+     * 地址解析
+     *
+     * @param {Object} options 接口参数对象
+     * 
+     * 请求参数结构可以参考
+     * http://lbs.qq.com/webservice_v1/guide-geocoder.html
+     */
+    geocoder(options) {
+        var that = this;
+        options = options || {};
+        Utils.polyfillParam(options);
+
+        if (Utils.checkParamKeyEmpty(options, 'address')) {
+            return;
+        }
+
+        var requestParam = {
+            address: options.address,
+            output: 'json',
+            key: that.key
+        };
+
+        //城市限定
+        if (options.region) {
+          requestParam.region = options.region;
+        }
+
+        if (options.sig) {
+          requestParam.sig = Utils.getSig(requestParam, options.sig, 'geocoder');
+        }
+
+        wx.request(Utils.buildWxRequestConfig(options, {
+            url: URL_GET_GEOCODER,
+            data: requestParam
+        },'geocoder'));
+    };
+
+
+    /**
+     * 获取城市列表
+     *
+     * @param {Object} options 接口参数对象
+     * 
+     * 请求参数结构可以参考
+     * http://lbs.qq.com/webservice_v1/guide-region.html
+     */
+    getCityList(options) {
+        var that = this;
+        options = options || {};
+        Utils.polyfillParam(options);
+        var requestParam = {
+            output: 'json',
+            key: that.key
+        };
+
+        if (options.sig) {
+          requestParam.sig = Utils.getSig(requestParam, options.sig, 'getCityList');
+        }
+
+        wx.request(Utils.buildWxRequestConfig(options, {
+            url: URL_CITY_LIST,
+            data: requestParam
+        },'getCityList'));
+    };
+
+    /**
+     * 获取对应城市ID的区县列表
+     *
+     * @param {Object} options 接口参数对象
+     * 
+     * 请求参数结构可以参考
+     * http://lbs.qq.com/webservice_v1/guide-region.html
+     */
+    getDistrictByCityId(options) {
+        var that = this;
+        options = options || {};
+        Utils.polyfillParam(options);
+
+        if (Utils.checkParamKeyEmpty(options, 'id')) {
+            return;
+        }
+
+        var requestParam = {
+            id: options.id || '',
+            output: 'json',
+            key: that.key
+        };
+
+        if (options.sig) {
+          requestParam.sig = Utils.getSig(requestParam, options.sig, 'getDistrictByCityId');
+        }
+
+        wx.request(Utils.buildWxRequestConfig(options, {
+            url: URL_AREA_LIST,
+            data: requestParam
+        },'getDistrictByCityId'));
+    };
+
+    /**
+     * 用于单起点到多终点的路线距离(非直线距离)计算：
+     * 支持两种距离计算方式：步行和驾车。
+     * 起点到终点最大限制直线距离10公里。
+     *
+     * 新增直线距离计算。
+     * 
+     * @param {Object} options 接口参数对象
+     * 
+     * 请求参数结构可以参考
+     * http://lbs.qq.com/webservice_v1/guide-distance.html
+     */
+    calculateDistance(options) {
+        var that = this;
+        options = options || {};
+        Utils.polyfillParam(options);
+
+        if (Utils.checkParamKeyEmpty(options, 'to')) {
+            return;
+        }
+
+        var requestParam = {
+            mode: options.mode || 'walking',
+            to: Utils.location2query(options.to),
+            output: 'json',
+            key: that.key
+        };
+
+        if (options.from) {
+          options.location = options.from;
+        }
+
+        //计算直线距离
+        if(requestParam.mode == 'straight'){        
+          var locationsuccess = function (result) {
+            var locationTo = Utils.getEndLocation(requestParam.to);//处理终点坐标
+            var data = {
+              message:"query ok",
+              result:{
+                elements:[]
+              },
+              status:0
+            };
+            for (var i = 0; i < locationTo.length; i++) {
+              data.result.elements.push({//将坐标存入
+                distance: Utils.getDistance(result.latitude, result.longitude, locationTo[i].lat, locationTo[i].lng),
+                duration:0,
+                from:{
+                  lat: result.latitude,
+                  lng:result.longitude
+                },
+                to:{
+                  lat: locationTo[i].lat,
+                  lng: locationTo[i].lng
+                }
+              });            
+            }
+            var calculateResult = data.result.elements;
+            var distanceResult = [];
+            for (var i = 0; i < calculateResult.length; i++) {
+              distanceResult.push(calculateResult[i].distance);
+            }  
+            return options.success(data,{
+              calculateResult: calculateResult,
+              distanceResult: distanceResult
+            });
+          };
+          
+          Utils.locationProcess(options, locationsuccess);
+        } else {
+          var locationsuccess = function (result) {
+            requestParam.from = result.latitude + ',' + result.longitude;
+            if (options.sig) {
+              requestParam.sig = Utils.getSig(requestParam, options.sig, 'calculateDistance');
+            }
+            wx.request(Utils.buildWxRequestConfig(options, {
+              url: URL_DISTANCE,
+              data: requestParam
+            },'calculateDistance'));
+          };
+
+          Utils.locationProcess(options, locationsuccess);
+        }      
+    };
+
+  /**
+   * 路线规划：
+   * 
+   * @param {Object} options 接口参数对象
+   * 
+   * 请求参数结构可以参考
+   * https://lbs.qq.com/webservice_v1/guide-road.html
+   */
+  direction(options) {
+    var that = this;
+    options = options || {};
+    Utils.polyfillParam(options);
+
+    if (Utils.checkParamKeyEmpty(options, 'to')) {
+      return;
+    }
+
+    var requestParam = {
+      output: 'json',
+      key: that.key
+    };
+
+    //to格式处理
+    if (typeof options.to == 'string') {
+      requestParam.to = options.to;
+    } else {
+      requestParam.to = options.to.latitude + ',' + options.to.longitude;
+    }
+    //初始化局部请求域名
+    var SET_URL_DIRECTION = null;
+    //设置默认mode属性
+    options.mode = options.mode || MODE.driving;
+
+    //设置请求域名
+    SET_URL_DIRECTION = URL_DIRECTION + options.mode;
+
+    if (options.from) {
+      options.location = options.from;
+    }
+
+    if (options.mode == MODE.driving) {
+      if (options.from_poi) {
+        requestParam.from_poi = options.from_poi;
+      }
+      if (options.heading) {
+        requestParam.heading = options.heading;
+      }
+      if (options.speed) {
+        requestParam.speed = options.speed;
+      }
+      if (options.accuracy) {
+        requestParam.accuracy = options.accuracy;
+      }
+      if (options.road_type) {
+        requestParam.road_type = options.road_type;
+      }
+      if (options.to_poi) {
+        requestParam.to_poi = options.to_poi;
+      }
+      if (options.from_track) {
+        requestParam.from_track = options.from_track;
+      }
+      if (options.waypoints) {
+        requestParam.waypoints = options.waypoints;
+      }
+      if (options.policy) {
+        requestParam.policy = options.policy;
+      }
+      if (options.plate_number) {
+        requestParam.plate_number = options.plate_number;
+      }
+    }
+
+    if (options.mode == MODE.transit) {
+      if (options.departure_time) {
+        requestParam.departure_time = options.departure_time;
+      }
+      if (options.policy) {
+        requestParam.policy = options.policy;
+      }
+    } 
+
+    var locationsuccess = function (result) {
+      requestParam.from = result.latitude + ',' + result.longitude;
+      if (options.sig) {
+        requestParam.sig = Utils.getSig(requestParam, options.sig, 'direction',options.mode);
+      }
+      wx.request(Utils.buildWxRequestConfig(options, {
+        url: SET_URL_DIRECTION,
+        data: requestParam
+      }, 'direction'));
+    };
+
+    Utils.locationProcess(options, locationsuccess);
+  }
+};
+
+module.exports = QQMapWX;

components/uni-icons/icons.js

@@ -0,0 +1,96 @@
+export default {
+	'contact': '\ue100',
+	'person': '\ue101',
+	'personadd': '\ue102',
+	'contact-filled': '\ue130',
+	'person-filled': '\ue131',
+	'personadd-filled': '\ue132',
+	'phone': '\ue200',
+	'email': '\ue201',
+	'chatbubble': '\ue202',
+	'chatboxes': '\ue203',
+	'phone-filled': '\ue230',
+	'email-filled': '\ue231',
+	'chatbubble-filled': '\ue232',
+	'chatboxes-filled': '\ue233',
+	'weibo': '\ue260',
+	'weixin': '\ue261',
+	'pengyouquan': '\ue262',
+	'chat': '\ue263',
+	'qq': '\ue264',
+	'videocam': '\ue300',
+	'camera': '\ue301',
+	'mic': '\ue302',
+	'location': '\ue303',
+	'mic-filled': '\ue332',
+	'speech': '\ue332',
+	'location-filled': '\ue333',
+	'micoff': '\ue360',
+	'image': '\ue363',
+	'map': '\ue364',
+	'compose': '\ue400',
+	'trash': '\ue401',
+	'upload': '\ue402',
+	'download': '\ue403',
+	'close': '\ue404',
+	'redo': '\ue405',
+	'undo': '\ue406',
+	'refresh': '\ue407',
+	'star': '\ue408',
+	'plus': '\ue409',
+	'minus': '\ue410',
+	'circle': '\ue411',
+	'checkbox': '\ue411',
+	'close-filled': '\ue434',
+	'clear': '\ue434',
+	'refresh-filled': '\ue437',
+	'star-filled': '\ue438',
+	'plus-filled': '\ue439',
+	'minus-filled': '\ue440',
+	'circle-filled': '\ue441',
+	'checkbox-filled': '\ue442',
+	'closeempty': '\ue460',
+	'refreshempty': '\ue461',
+	'reload': '\ue462',
+	'starhalf': '\ue463',
+	'spinner': '\ue464',
+	'spinner-cycle': '\ue465',
+	'search': '\ue466',
+	'plusempty': '\ue468',
+	'forward': '\ue470',
+	'back': '\ue471',
+	'left-nav': '\ue471',
+	'checkmarkempty': '\ue472',
+	'home': '\ue500',
+	'navigate': '\ue501',
+	'gear': '\ue502',
+	'paperplane': '\ue503',
+	'info': '\ue504',
+	'help': '\ue505',
+	'locked': '\ue506',
+	'more': '\ue507',
+	'flag': '\ue508',
+	'home-filled': '\ue530',
+	'gear-filled': '\ue532',
+	'info-filled': '\ue534',
+	'help-filled': '\ue535',
+	'more-filled': '\ue537',
+	'settings': '\ue560',
+	'list': '\ue562',
+	'bars': '\ue563',
+	'loop': '\ue565',
+	'paperclip': '\ue567',
+	'eye': '\ue568',
+	'arrowup': '\ue580',
+	'arrowdown': '\ue581',
+	'arrowleft': '\ue582',
+	'arrowright': '\ue583',
+	'arrowthinup': '\ue584',
+	'arrowthindown': '\ue585',
+	'arrowthinleft': '\ue586',
+	'arrowthinright': '\ue587',
+	'pulldown': '\ue588',
+	'closefill': '\ue589',
+	'sound': '\ue590',
+	'scan': '\ue612'
+}

components/uni-popup/uni-popup.vue

@@ -0,0 +1,263 @@
+<template>
+	<view v-if="showPopup" class="uni-popup" @touchmove.stop.prevent="clear">
+		<uni-transition :mode-class="['fade']" :styles="maskClass" :duration="duration" :show="showTrans" @click="onTap" />
+		<uni-transition :mode-class="ani" :styles="transClass" :duration="duration" :show="showTrans" @click="onTap">
+			<view class="uni-popup__wrapper-box" @click.stop="clear">
+				<slot />
+			</view>
+		</uni-transition>
+	</view>
+</template>
+
+<script>
+	import uniTransition from '../uni-transition/uni-transition.vue'
+
+	/**
+	 * PopUp 弹出层
+	 * @description 弹出层组件，为了解决遮罩弹层的问题
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=329
+	 * @property {String} type = [top|center|bottom] 弹出方式
+	 * 	@value top 顶部弹出
+	 * 	@value center 中间弹出
+	 * 	@value bottom 底部弹出
+	 * @property {Boolean} animation = [ture|false] 是否开启动画
+	 * @property {Boolean} maskClick = [ture|false] 蒙版点击是否关闭弹窗
+	 * @event {Function} change 打开关闭弹窗触发，e={show: false}
+	 */
+
+	export default {
+		name: 'UniPopup',
+		components: {
+			uniTransition
+		},
+		props: {
+			// 开启动画
+			animation: {
+				type: Boolean,
+				default: true
+			},
+			// 弹出层类型，可选值，top: 顶部弹出层；bottom：底部弹出层；center：全屏弹出层
+			type: {
+				type: String,
+				default: 'center'
+			},
+			// maskClick
+			maskClick: {
+				type: Boolean,
+				default: true
+			}
+		},
+		data() {
+			return {
+				duration: 300,
+				ani: [],
+				showPopup: false,
+				showTrans: false,
+				maskClass: {
+					'position': 'fixed',
+					'bottom': 0,
+					'top': 0,
+					'left': 0,
+					'right': 0,
+					'backgroundColor': 'rgba(0, 0, 0, 0.4)'
+				},
+				transClass: {
+					'position': 'fixed',
+					'left': 0,
+					'right': 0,
+				}
+			}
+		},
+		watch: {
+			type: {
+				handler: function(newVal) {
+					switch (this.type) {
+						case 'top':
+							this.ani = ['slide-top']
+							this.transClass = {
+								'position': 'fixed',
+								'left': 0,
+								'right': 0,
+							}
+							break
+						case 'bottom':
+							this.ani = ['slide-bottom']
+							this.transClass = {
+								'position': 'fixed',
+								'left': 0,
+								'right': 0,
+								'bottom': 0
+							}
+							break
+						case 'center':
+							this.ani = ['zoom-out', 'fade']
+							this.transClass = {
+								'position': 'fixed',
+								/* #ifndef APP-NVUE */
+								'display': 'flex',
+								'flexDirection': 'column',
+								/* #endif */
+								'bottom': 0,
+								'left': 0,
+								'right': 0,
+								'top': 0,
+								'justifyContent': 'center',
+								'alignItems': 'center'
+							}
+
+							break
+					}
+				},
+				immediate: true
+			}
+		},
+		created() {
+			if (this.animation) {
+				this.duration = 300
+			} else {
+				this.duration = 0
+			}
+		},
+		methods: {
+			clear(e) {
+				// TODO nvue 取消冒泡
+				e.stopPropagation()
+			},
+			open() {
+				this.showPopup = true
+				this.$nextTick(() => {
+					clearTimeout(this.timer)
+					this.timer = setTimeout(() => {
+						this.showTrans = true
+					}, 50);
+				})
+				this.$emit('change', {
+					show: true
+				})
+			},
+			close(type) {
+				this.showTrans = false
+				this.$nextTick(() => {
+					clearTimeout(this.timer)
+					this.timer = setTimeout(() => {
+						this.$emit('change', {
+							show: false
+						})
+						this.showPopup = false
+					}, 300)
+				})
+			},
+			onTap() {
+				if (!this.maskClick) return
+				this.close()
+			}
+		}
+	}
+</script>
+<style lang="scss" scoped>
+	.uni-popup {
+		position: fixed;
+		/* #ifdef H5 */
+		top: var(--window-top);
+		/* #endif */
+		/* #ifndef H5 */
+		top: 0;
+		/* #endif */
+		bottom: 0;
+		left: 0;
+		right: 0;
+		/* #ifndef APP-NVUE */
+		z-index: 99;
+		/* #endif */
+	}
+
+	.uni-popup__mask {
+		position: absolute;
+		top: 0;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		background-color: $uni-bg-color-mask;
+		opacity: 0;
+	}
+
+	.mask-ani {
+		transition-property: opacity;
+		transition-duration: 0.2s;
+	}
+
+	.uni-top-mask {
+		opacity: 1;
+	}
+
+	.uni-bottom-mask {
+		opacity: 1;
+	}
+
+	.uni-center-mask {
+		opacity: 1;
+	}
+
+	.uni-popup__wrapper {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: absolute;
+	}
+
+	.top {
+		top: 0;
+		left: 0;
+		right: 0;
+		transform: translateY(-500px);
+	}
+
+	.bottom {
+		bottom: 0;
+		left: 0;
+		right: 0;
+		transform: translateY(500px);
+	}
+
+	.center {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		flex-direction: column;
+		/* #endif */
+		bottom: 0;
+		left: 0;
+		right: 0;
+		top: 0;
+		justify-content: center;
+		align-items: center;
+		transform: scale(1.2);
+		opacity: 0;
+	}
+
+	.uni-popup__wrapper-box {
+		/* #ifndef APP-NVUE */
+		display: block;
+		/* #endif */
+		position: relative;
+	}
+
+	.content-ani {
+		// transition: transform 0.3s;
+		transition-property: transform, opacity;
+		transition-duration: 0.2s;
+	}
+
+
+	.uni-top-content {
+		transform: translateY(0);
+	}
+
+	.uni-bottom-content {
+		transform: translateY(0);
+	}
+
+	.uni-center-content {
+		transform: scale(1);
+		opacity: 1;
+	}
+</style>

components/uni-rate/uni-rate.vue

@@ -0,0 +1,141 @@
+<template>
+	<view class="uni-rate">
+		<view :key="index" :style="{ marginLeft: margin + 'px' }" @click="_onClick(index)" class="uni-rate__icon" v-for="(star, index) in stars">
+			<uni-icons :color="color" :size="size" :type="isFill ? 'star-filled' : 'star'" />
+			<!-- #ifdef APP-NVUE -->
+			<view :style="{ width: star.activeWitch.replace('%','')*size/100+'px'}" class="uni-rate__icon-on">
+				<uni-icons style="text-align: left;" :color="activeColor" :size="size" type="star-filled" />
+			</view>
+			<!-- #endif -->
+			<!-- #ifndef APP-NVUE -->
+			<view :style="{ width: star.activeWitch,top:-size/2+'px' }" class="uni-rate__icon-on">
+				<uni-icons :color="activeColor" :size="size" type="star-filled" />
+			</view>
+			<!-- #endif -->
+		</view>
+	</view>
+</template>
+
+<script>
+	import uniIcons from "../uni-icons/uni-icons.vue";
+	export default {
+		name: "UniRate",
+		components: {
+			uniIcons
+		},
+		props: {
+			isFill: {
+				// 星星的类型，是否镂空
+				type: [Boolean, String],
+				default: true
+			},
+			color: {
+				// 星星的颜色
+				type: String,
+				default: "#ececec"
+			},
+			activeColor: {
+				// 星星选中状态颜色
+				type: String,
+				default: "#ffca3e"
+			},
+			size: {
+				// 星星的大小
+				type: [Number, String],
+				default: 24
+			},
+			value: {
+				// 当前评分
+				type: [Number, String],
+				default: 0
+			},
+			max: {
+				// 最大评分
+				type: [Number, String],
+				default: 5
+			},
+			margin: {
+				// 星星的间距
+				type: [Number, String],
+				default: 0
+			},
+			disabled: {
+				// 是否可点击
+				type: [Boolean, String],
+				default: false
+			}
+		},
+		data() {
+			return {
+				valueSync: ""
+			};
+		},
+		computed: {
+			stars() {
+				const value = this.valueSync ? this.valueSync : 0;
+				const starList = [];
+				const floorValue = Math.floor(value);
+				const ceilValue = Math.ceil(value);
+				// console.log("ceilValue: " + ceilValue);
+				// console.log("floorValue: " + floorValue);
+				for (let i = 0; i < this.max; i++) {
+					if (floorValue > i) {
+						starList.push({
+							activeWitch: "100%"
+						});
+					} else if (ceilValue - 1 === i) {
+						starList.push({
+							activeWitch: (value - floorValue) * 100 + "%"
+						});
+					} else {
+						starList.push({
+							activeWitch: "0"
+						});
+					}
+				}
+				console.log("starList[4]: " + starList[4].activeWitch);
+				return starList;
+			}
+		},
+		created() {
+			this.valueSync = Number(this.value);
+		},
+		methods: {
+			_onClick(index) {
+				if (this.disabled) {
+					return;
+				}
+				this.valueSync = index + 1;
+				this.$emit("change", {
+					value: this.valueSync
+				});
+			}
+		}
+	};
+</script>
+
+<style lang="scss" scoped>
+	.uni-rate {
+		/* #ifndef APP-NVUE */
+		display: flex;
+		/* #endif */
+		line-height: 0;
+		font-size: 0;
+		flex-direction: row;
+	}
+
+	.uni-rate__icon {
+		position: relative;
+		line-height: 0;
+		font-size: 0;
+	}
+
+	.uni-rate__icon-on {
+		overflow: hidden;
+		position: absolute;
+		top: 0;
+		left: 0;
+		line-height: 1;
+		text-align: left;
+	}
+</style>

components/uni-transition/uni-transition.vue

@@ -0,0 +1,279 @@
+<template>
+	<view v-if="isShow" ref="ani" class="uni-transition" :class="[ani.in]" :style="'transform:' +transform+';'+stylesObject"
+	 @click="change">
+		 <slot></slot>
+	</view>
+</template>
+
+<script>
+	// #ifdef APP-NVUE
+	const animation = uni.requireNativePlugin('animation');
+	// #endif
+	/**
+	 * Transition 过渡动画
+	 * @description 简单过渡动画组件
+	 * @tutorial https://ext.dcloud.net.cn/plugin?id=985
+	 * @property {Boolean} show = [false|true] 控制组件显示或隐藏
+     * @property {Array} modeClass = [fade|slide-top|slide-right|slide-bottom|slide-left|zoom-in|zoom-out] 过渡动画类型
+     *  @value fade 渐隐渐出过渡
+     *  @value slide-top 由上至下过渡
+     *  @value slide-right 由右至左过渡
+     *  @value slide-bottom 由下至上过渡
+     *  @value slide-left 由左至右过渡
+     *  @value zoom-in 由小到大过渡
+     *  @value zoom-out 由大到小过渡
+	 * @property {Number} duration 过渡动画持续时间
+	 * @property {Object} styles 组件样式，同 css 样式，注意带’-‘连接符的属性需要使用小驼峰写法如：`backgroundColor:red`
+	 */
+	export default {
+		name: 'uniTransition',
+		props: {
+			show: {
+				type: Boolean,
+				default: false
+			},
+			modeClass: {
+				type: Array,
+				default () {
+					return []
+				}
+			},
+			duration: {
+				type: Number,
+				default: 300
+			},
+			styles: {
+				type: Object,
+				default () {
+					return {}
+				}
+			}
+		},
+		data() {
+			return {
+				isShow: false,
+				transform: '',
+				ani: { in: '',
+					active: ''
+				}
+			};
+		},
+		watch: {
+			show: {
+				handler(newVal) {
+					if (newVal) {
+						this.open()
+					} else {
+						this.close()
+					}
+				},
+				immediate: true
+			}
+		},
+		computed: {
+			stylesObject() {
+				let styles = {
+					...this.styles,
+					'transition-duration': this.duration / 1000 + 's'
+				}
+				let transfrom = ''
+				for (let i in styles) {
+					let line = this.toLine(i)
+					transfrom += line + ':' + styles[i] + ';'
+				}
+				return transfrom
+			}
+		},
+		created() {
+			// this.timer = null
+			// this.nextTick = (time = 50) => new Promise(resolve => {
+			// 	clearTimeout(this.timer)
+			// 	this.timer = setTimeout(resolve, time)
+			// 	return this.timer
+			// });
+		},
+		methods: {
+			change() {
+				this.$emit('click', {
+					detail: this.isShow
+				})
+			},
+			open() {
+				clearTimeout(this.timer)
+				this.isShow = true
+				this.transform = ''
+				this.ani.in = ''
+				for (let i in this.getTranfrom(false)) {
+					if (i === 'opacity') {
+						this.ani.in = 'fade-in'
+					} else {
+						this.transform += `${this.getTranfrom(false)[i]} `
+					}
+				}
+				this.$nextTick(() => {
+					setTimeout(() => {
+						this._animation(true)
+					}, 50)
+				})
+
+			},
+			close(type) {
+				clearTimeout(this.timer)
+				this._animation(false)
+			},
+			_animation(type) {
+				let styles = this.getTranfrom(type)
+				// #ifdef APP-NVUE
+				if(!this.$refs['ani']) return
+				animation.transition(this.$refs['ani'].ref, {
+					styles,
+					duration: this.duration, //ms
+					timingFunction: 'ease',
+					needLayout: false,
+					delay: 0 //ms
+				}, () => {
+					if (!type) {
+						this.isShow = false
+					}
+					this.$emit('change', {
+						detail: this.isShow
+					})
+				})
+				// #endif
+				// #ifndef APP-NVUE
+				this.transform = ''
+				for (let i in styles) {
+					if (i === 'opacity') {
+						this.ani.in = `fade-${type?'out':'in'}`
+					} else {
+						this.transform += `${styles[i]} `
+					}
+				}
+				this.timer = setTimeout(() => {
+					if (!type) {
+						this.isShow = false
+					}
+					this.$emit('change', {
+						detail: this.isShow
+					})
+
+				}, this.duration)
+				// #endif
+
+			},
+			getTranfrom(type) {
+				let styles = {
+					transform: ''
+				}
+				this.modeClass.forEach((mode) => {
+					switch (mode) {
+						case 'fade':
+							styles.opacity = type ? 1 : 0
+							break;
+						case 'slide-top':
+							styles.transform += `translateY(${type?'0':'-100%'}) `
+							break;
+						case 'slide-right':
+							styles.transform += `translateX(${type?'0':'100%'}) `
+							break;
+						case 'slide-bottom':
+							styles.transform += `translateY(${type?'0':'100%'}) `
+							break;
+						case 'slide-left':
+							styles.transform += `translateX(${type?'0':'-100%'}) `
+							break;
+						case 'zoom-in':
+							styles.transform += `scale(${type?1:0.8}) `
+							break;
+						case 'zoom-out':
+							styles.transform += `scale(${type?1:1.2}) `
+							break;
+					}
+				})
+				return styles
+			},
+			_modeClassArr(type) {
+				let mode = this.modeClass
+				if (typeof(mode) !== "string") {
+					let modestr = ''
+					mode.forEach((item) => {
+						modestr += (item + '-' + type + ',')
+					})
+					return modestr.substr(0, modestr.length - 1)
+				} else {
+					return mode + '-' + type
+				}
+			},
+			// getEl(el) {
+			// 	console.log(el || el.ref || null);
+			// 	return el || el.ref || null
+			// },
+			toLine(name) {
+				return name.replace(/([A-Z])/g, "-$1").toLowerCase();
+			}
+		}
+	}
+</script>
+
+<style>
+	.uni-transition {
+		transition-timing-function: ease;
+		transition-duration: 0.3s;
+		transition-property: transform, opacity;
+	}
+
+	.fade-in {
+		opacity: 0;
+	}
+
+	.fade-active {
+		opacity: 1;
+	}
+
+	.slide-top-in {
+		/* transition-property: transform, opacity; */
+		transform: translateY(-100%);
+	}
+
+	.slide-top-active {
+		transform: translateY(0);
+		/* opacity: 1; */
+	}
+
+	.slide-right-in {
+		transform: translateX(100%);
+	}
+
+	.slide-right-active {
+		transform: translateX(0);
+	}
+
+	.slide-bottom-in {
+		transform: translateY(100%);
+	}
+
+	.slide-bottom-active {
+		transform: translateY(0);
+	}
+
+	.slide-left-in {
+		transform: translateX(-100%);
+	}
+
+	.slide-left-active {
+		transform: translateX(0);
+		opacity: 1;
+	}
+
+	.zoom-in-in {
+		transform: scale(0.8);
+	}
+
+	.zoom-out-active {
+		transform: scale(1);
+	}
+
+	.zoom-out-in {
+		transform: scale(1.2);
+	}
+</style>

main.js

@@ -0,0 +1,12 @@
+import Vue from 'vue'
+import App from './App'
+import http from './utils/request.js'
+
+Vue.config.productionTip = false
+Vue.prototype.http=http
+App.mpType = 'app'
+
+const app = new Vue({
+    ...App
+})
+app.$mount()

manifest.json

@@ -0,0 +1,79 @@
+{
+    "name" : "demo1",
+    "appid" : "",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    /* 5+App特有相关 */
+    "app-plus" : {
+        "usingComponents" : true,
+        "nvueCompiler" : "uni-app",
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        /* 模块配置 */
+        "modules" : {},
+        /* 应用发布信息 */
+        "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.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<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_SETTINGS\"/>"
+                ]
+            },
+            /* ios打包配置 */
+            "ios" : {},
+            /* SDK配置 */
+            "sdkConfigs" : {}
+        }
+    },
+    /* 快应用特有相关 */
+    "quickapp" : {},
+    /* 小程序特有相关 */
+    "mp-weixin" : {
+        "appid" : "wx68bb6c19ba719554",
+        "setting" : {
+            "urlCheck" : false
+        },
+        "usingComponents" : true,
+        "permission" : {
+            "scope.userLocation" : {
+                "desc" : "你的位置信息将用于小程序位置接口的效果展示"
+            }
+        }
+    },
+    "mp-alipay" : {
+        "usingComponents" : true
+    },
+    "mp-baidu" : {
+        "usingComponents" : true
+    },
+    "mp-toutiao" : {
+        "usingComponents" : true
+    }
+}

pages.json

@@ -0,0 +1,398 @@
+{
+	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
+		// 
+		{
+			"path": "pages/authentication/city",
+			"style": {
+				"navigationBarTitleText": "认证房屋",
+				// "app-plus":{"titleNView":false},
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 首页
+		{
+			"path": "pages/index/index",
+			"style": {
+				"navigationStyle": "custom"
+				// "app-plus":{"titleNView":false}
+
+			}
+		},
+		//定位城市
+		{
+			"path": "pages/authentication/authentication",
+			"style": {
+
+				"navigationBarTitleText": "认证房屋",
+				// "app-plus":{"titleNView":false},
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 在线投诉
+		{
+			"path": "pages/complain/index",
+			"style": {
+				"navigationBarTitleText": "在线投诉",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 投诉成功完成
+		{
+			"path": "pages/complain/compalinSuccess",
+			"style": {
+				"navigationBarTitleText": "我要报修",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 投诉评价
+		{
+			"path": "pages/complain/evaluateCompalin",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		// 我要投诉
+		{
+			"path": "pages/complain/wantCompalin",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		// 报修评价完成
+		{
+			"path": "pages/onlineRpair/evalueSuccess",
+			"style": {
+				"navigationBarTitleText": "报修评价",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 我的评价
+		{
+			"path": "pages/onlineRpair/repairsEvaluate",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		// 我要保修
+		{
+			"path": "pages/onlineRpair/wantRepair",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		// 在线保修
+		{
+			"path": "pages/onlineRpair/index",
+			"style": {
+				"navigationBarTitleText": "在线保修",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 一键开门
+		{
+			"path": "pages/openDoor/openDoor",
+			"style": {
+				"navigationBarTitleText": "一键开门",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 解锁记录
+		{
+			"path": "pages/openDoor/openDoorList",
+			"style": {
+				"navigationBarTitleText": "解锁记录",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 开门码
+		{
+			"path": "pages/visitor/doorCode",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		// 历史记录
+		{
+			"path": "pages/visitor/historyList",
+			"style": {
+				"navigationBarTitleText": "历史记录",
+				"navigationBarTextStyle": "black"
+			}
+		},
+
+		// 认证房屋审核成功
+		{
+			"path": "pages/authentication/checkSuccess",
+			"style": {
+
+				"navigationBarTitleText": "审核成功",
+				"navigationBarTextStyle": "black"
+			}
+		},
+
+		// 认证房屋审核中
+		{
+			"path": "pages/authentication/checkIng",
+			"style": {
+
+				"navigationBarTitleText": "审核中",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		//家人关怀
+		{
+			"path": "pages/family/family",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+
+			}
+		},
+		// 注册页面
+		{
+			"path": "pages/register/register",
+			"style": {
+				"navigationStyle": "custom",
+				"navigationBarTitleText": "WeChat",
+				"app-plus": {
+					"titleNView": false
+				},
+				"navigationBarTextStyle": "black"
+			}
+		},
+		//邻里圈
+		{
+			"path": "pages/circle/circles",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+
+			}
+		},
+		//发布邻里圈
+		{
+			"path": "pages/circle/publish",
+			"style": {
+				"navigationBarTitleText": "发布邻里圈",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		//我的
+		{
+			"path": "pages/mine/mine",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+
+			}
+		},
+		//个人资料
+		{
+			"path": "pages/mine/myInfo",
+			"style": {
+				"navigationBarTitleText": "个人资料",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		//我的汽车
+		{
+			"path": "pages/mine/myCar",
+			"style": {
+				"navigationBarTitleText": "我的汽车",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		//绑定新车辆
+		{
+			"path": "pages/mine/addCar",
+			"style": {
+				"navigationBarTitleText": "绑定新的车辆",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		//我的房屋
+		{
+			"path": "pages/mine/myHouse",
+			"style": {
+				"navigationBarTitleText": "我的房屋",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		//人脸模板
+		{
+			"path": "pages/mine/face",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		//我的家人
+		{
+			"path": "pages/mine/family",
+			"style": {
+				"navigationBarTitleText": "我的家人",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		//添加家人信息
+		{
+			"path": "pages/mine/addFamily",
+			"style": {
+				"navigationBarTitleText": "我的家人",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		//我的消息
+		{
+			"path": "pages/mine/message",
+			"style": {
+				"navigationBarTitleText": "我的消息",
+				"navigationBarTextStyle": "black"
+			}
+		},
+
+
+		// 选择小区
+		{
+			"path": "pages/authentication/selectHouse",
+			"style": {
+				"navigationStyle": "custom",
+				"navigationBarTitleText": "WeChat",
+				"app-plus": {
+					"titleNView": false
+				},
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 授权登录
+		{
+			"path": "pages/login/authorization",
+			"style": {
+				"navigationStyle": "custom",
+				"navigationBarTitleText": "WeChat",
+				"app-plus": {
+					"titleNView": false
+				},
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 登录页面
+		{
+			"path": "pages/login/login",
+			"style": {
+				"navigationStyle": "custom",
+				"navigationBarTitleText": "WeChat",
+				"app-plus": {
+					"titleNView": false
+				},
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 物业公告
+		{
+			"path": "pages/index/more",
+			"style": {
+				"navigationBarTitleText": "物业公告",
+				"navigationBarTextStyle": "black"
+			}
+		},
+		// 物业公告详情
+		{
+			"path": "pages/index/detail",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		},
+		// 访客密码
+		{
+			"path": "pages/index/visitorPass",
+			"style": {
+				"navigationStyle": "custom",
+				"app-plus": {
+					"titleNView": false
+				}
+			}
+		}
+
+
+	],
+
+	"tabBar": {
+		"color": "#8a8a8a",
+		"selectedColor": "#298AFD",
+		"borderStyle": "black",
+		"backgroundColor": "#ffffff",
+		"list": [{
+				"pagePath": "pages/index/index",
+				"text": "首页",
+				"iconPath": "static/tab_home_nor@2x.png",
+				"selectedIconPath": "static/tab_home_set@2x.png"
+
+			},
+			{
+				"pagePath": "pages/family/family",
+				"text": "家人关怀",
+				"iconPath": "static/tab_care_nor@2x.png",
+				"selectedIconPath": "static/tab_care_set@2x.png"
+			},
+			{
+				"pagePath": "pages/circle/circles",
+				"text": "邻里圈",
+				"iconPath": "static/tab_circle_nor@2x.png",
+				"selectedIconPath": "static/tab_circle_set@2x.png"
+			},
+			{
+				"pagePath": "pages/mine/mine",
+				"text": "我的",
+				"iconPath": "static/tab_my_nor@2x.png",
+				"selectedIconPath": "static/tab_my_set@2x.png"
+			}
+		]
+	},
+	"navigateToMiniProgramAppIdList": ["wx68bb6c19ba719554"],
+	"permission": {
+		"scope.userLocation": {
+			"desc": "你的位置信息将用于小程序位置接口的效果展示" // 高速公路行驶持续后台定位
+		}
+	},
+	"globalStyle": {
+		"navigationBarTextStyle": "black",
+		"navigationBarTitleText": "uni-app",
+		"navigationBarBackgroundColor": "#F8F8F8",
+		"backgroundColor": "#F8F8F8"
+	},
+	"condition": { //模式配置，仅开发期间生效
+		"current": 0, //当前激活的模式(list 的索引项)
+		"list": [{
+			"name": "", //模式名称
+			"path": "", //启动页面，必选
+			"query": "" //启动参数，在页面的onLoad函数里面得到
+		}]
+	}
+}

pages/authentication/authentication.vue

@@ -0,0 +1,173 @@
+<!-- 认证房屋 -->
+<template>
+	<view>
+		<view class="topSearch">
+				{{city}}
+				<view>
+					
+				</view>
+				<image src="../../static/attestation_icon_search@2x.png" style="width: 26rpx;height: 26rpx;"></image>
+				<view>
+					
+				</view>
+		</view>
+		<!-- 热门搜索 -->
+		<view class="hotSearch">
+		
+			<view class="hotSearch-title">热门搜索</view>
+			<view class="hotSearch-info">
+				<view style="width: 676rpx;display: flex;flex-wrap: wrap;margin: 0 auto;">
+					<view class="item" v-for="(item,index) in hotData" :key="index">{{item.name}}</view>
+				</view>
+			</view>
+		</view>
+		<!-- 历史搜索 -->
+		<view class="historySearch">
+			<view class="hotSearch-title">历史搜索</view>
+			<view class="historySearch-info">
+				<view style="width: 676rpx;display: flex;flex-wrap: wrap;margin: 0 auto;">
+					<view class="item" v-for="(item,index) in historyData" :key="index">{{item.name}}</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import QQMapWX from "../../components/qqmap-wx-jssdk1.2/qqmap-wx-jssdk.min.js"
+	export default {
+		data() {
+			return {
+				city:'',
+				hotData: [{
+					name: '北京'
+				}, {
+					name: '北京'
+				}, {
+					name: '北京'
+				}, {
+					name: '北京'
+				}, {
+					name: '北京'
+				}, {
+					name: '北京'
+				}, {
+					name: '北京'
+				}, {
+					name: '北京'
+				}, {
+					name: '北京'
+				}, {
+					name: '北京'
+				}, {
+					name: '北京'
+				}, {
+					name: '北京'
+				}, ],
+				historyData: [{
+					name: '云南'
+				}, {
+					name: '云南'
+				}, {
+					name: '云南'
+				}, {
+					name: '云南'
+				}, ]
+			}
+
+		},
+		created() {
+			this.getLocation()
+		},
+		methods: {
+			//获取位置
+			getLocation() {
+				let qqmapsdk = new QQMapWX({
+					key: 'KQDBZ-ZXORJ-U6SFF-FN2AA-UJOSS-7LF5I' // 必填
+				});
+				uni.getLocation({
+					type: 'wgs84',
+					success: (res)=> {
+						console.log(res)
+						qqmapsdk.reverseGeocoder({
+							location: {
+								latitude: res.latitude,
+								longitude: res.longitude
+							},
+							success:(data)=> {
+								console.log(data)
+								this.city=data.result.address_component.city.slice(0,2)
+							}
+						})
+
+					}
+				});
+			}
+		}
+	}
+</script>
+
+<style>
+	.topSearch {
+		width: 676rpx;
+		height: 72rpx;
+		border: 2rpx solid rgba(244, 244, 244, 1);
+		margin: 0 auto;
+		border-radius: 8rpx;
+		margin-top: 40rpx;
+	}
+
+	.hotSearch {
+		width: 100%;
+		height: 448rpx;
+		margin-top: 42rpx;
+	}
+
+	.historySearch {
+		width: 100%;
+		height: 406rpx;
+		margin-top: 60rpx;
+	}
+
+	.hotSearch-title {
+		width: 120rpx;
+		height: 42rpx;
+		font-size: 30rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(51, 51, 51, 1);
+		margin-left: 38rpx;
+	}
+
+	.hotSearch-info {
+		width: 100%;
+		height: 386rpx;
+		margin-top: 20rpx;
+		background: rgba(252, 252, 252, 1);
+	}
+
+	.historySearch-info {
+		width: 100%;
+		margin-top: 20rpx;
+		background: rgba(252, 252, 252, 1);
+	}
+
+	.item {
+		width: 24%;
+		text-align: center;
+		height: 132rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		line-height: 132rpx;
+		color: rgba(153, 153, 153, 1);
+
+		border-right: 2rpx solid rgba(244, 244, 244, 1);
+		;
+		box-sizing: border-box;
+	}
+
+	.item:nth-child(4n) {
+		border-right: none;
+	}
+</style>

pages/authentication/checkIng.vue

@@ -0,0 +1,41 @@
+<!-- 认证房屋审核中 -->
+<template>
+	<view>
+		 <view class="img">
+			<image src="../../static/null_image_checking@2x.png" style="width: 100%;height: 100%;"></image>
+		 </view>
+		 <view class="title">
+			 审核中，请稍后~
+		 </view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				
+			}
+		}
+	}
+</script>
+
+<style>
+	.img{
+		width: 520rpx;
+		height: 520rpx;
+		margin: 0  auto;
+		margin-top: 262rpx;
+	}
+	.title{
+		width: 270rpx;
+		height: 50rpx;
+		font-size:36rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		line-height:50rpx;
+		color:rgba(36,36,36,1);
+		margin:0 auto;
+		margin-top: 46rpx;
+	}
+</style>

pages/authentication/checkSuccess.vue

@@ -0,0 +1,44 @@
+<!-- 认证房屋审核成功 -->
+<template>
+	<view>
+		 <view class="img">
+			<image src="../../static/null_image_success@2x.png" style="width: 100%;height: 100%;"></image>
+		 </view>
+		 <view class="title">
+			 恭喜您，审核成功~
+		 </view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				
+			}
+		}
+	}
+</script>
+
+<style>
+	.img{
+		width: 520rpx;
+		height: 520rpx;
+		margin: 0  auto;
+		margin-top: 262rpx;
+	}
+	.title{
+		width: 360rpx;
+		height: 50rpx;
+		font-size:36rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		line-height:50rpx;
+		color:rgba(36,36,36,1);
+		margin:0 auto;
+		margin-top: 46rpx;
+		text-align: center;
+	}
+</style>
+
+

pages/authentication/city.vue

@@ -0,0 +1,45 @@
+<template>
+	<view class="">
+		<city-select @back_city="back_city" @selectCity="selectCity"></city-select>
+	</view>
+</template>
+<script>
+	import citySelect from '../../components/linzq-citySelect/linzq-citySelect.vue'
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		mounted(){
+			this.getData()
+		},
+		methods: {
+			getData(){
+			this.http.httpRequest('/admin/staff/shop_list','get',{lat:0,lng:0}).then((res)=>{
+				console.log(res)
+			})
+			},
+			//选择城市
+			back_city(data) {
+				console.log(data)
+				uni.navigateTo({
+					url: "./selectHouse"
+				})
+			},
+			// 选择当前定位城市
+			selectCity(data) {
+				console.log(data)
+				uni.navigateTo({
+					url: "./selectHouse"
+				})
+			}
+		},
+		components: {
+			citySelect
+		},
+	}
+</script>
+
+<style>
+</style>

pages/authentication/selectHouse.vue

@@ -0,0 +1,286 @@
+<!-- 选择小区 -->
+<template>
+	<view class="pageBg">
+		<!-- <image src="../../static/select_bgimage@2x.png" style="width: 100%;height: 100vh;"></image> -->
+		<view class="backIcon" :style="{marginTop:phoneHeight+'rpx'}" @tap="back">
+			<image src="../../static/icon_back@2x.png" style="width: 100%;height: 100%;"></image>
+		</view>
+		<view class="infoBox">
+			<view class="topTitle">
+				选择小区住处
+			</view>
+			<view class="dec">获取详细的小区住处，登记您的信息</view>
+			<view class="item" @tap="pickerHouse">
+				<view style="width: 26rpx;height: 26rpx;margin:29rpx 8rpx 32rpx 20rpx;">
+					<image src="../../static/select_icon_village@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<input class="uni-input item-input" style="width:290rpx;height:40rpx;margin-top: 26rpx;"  v-model="form.houseName"
+				 disabled="true" placeholder="请选择小区名称" />
+				<view class="selectIcon" >
+					<image src="../../static/select_combo@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			<view class="item" style="margin-top:50rpx;" @tap="pickerLou">
+				<view style="width: 26rpx;height: 26rpx;margin:32rpx 8rpx 32rpx 20rpx;">
+					<image src="../../static/select_icon_storey@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<input class="uni-input item-input" style="width:290rpx;height:40rpx;margin-top: 26rpx;"  v-model="form.lou"
+				 disabled="true" placeholder="请选择楼层" />
+				<view class="selectIcon" >
+						<image src="../../static/select_combo@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			<view class="item" style="margin-top:50rpx;"  @tap="pickerHood">
+				<view style="width: 26rpx;height: 26rpx;margin:32rpx 8rpx 32rpx 20rpx;">
+					<image src="../../static/select_icon_unit@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<input class="uni-input item-input" style="width:290rpx;height:40rpx;margin-top: 26rpx;" v-model="form.hoodNum"
+				 disabled="true" placeholder="请选择单元号" />
+				<view class="selectIcon" >
+						<image src="../../static/select_combo@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			<view class="bottom"></view>
+		</view>
+		<!-- 发表按钮 -->
+		<button class="btn" @tap="submit" :class="{active:form.houseName&&form.lou&&form.hoodNum}">发表</button>
+		<!-- 选择小区名称组件 -->
+		<lb-picker ref="houseName" :list="houseData" @confirm="confirm"></lb-picker>
+		<!-- 选择楼层组件 -->
+		<lb-picker ref="Lou" :list="louData" @confirm="confirmLou">></lb-picker>
+		<!-- 选择单元号组件 -->
+		<lb-picker ref="hoodNum" :list="hoodData" @confirm="confirmHoodNum"></lb-picker>
+	</view>
+</template>
+
+<script>
+	import LbPicker from '@/components/lb-picker'
+	export default {
+		data() {
+			return {
+				phoneHeight: 0, //手机状态栏的高度
+				name: '',
+				lou: '',
+				hoodNum: '',
+				form: {
+					houseName: '', //小区名称
+					lou: '', //楼层
+					hoodNum: '' //单元号
+				},
+				//小区名称数据
+				houseData: [{
+						label: '花园小区',
+						value: 0,
+						children: []
+					},
+					{
+						label: '番茄小区',
+						value: 1,
+						children: []
+					},
+					{
+						label: '蓬莱院',
+						value: 2,
+						children: []
+					},
+				],
+				//楼层数据
+				louData: [{
+						label: '一楼',
+						value: 0,
+						children: []
+					},
+					{
+						label: '二楼',
+						value: 1,
+						children: []
+					},
+					{
+						label: '三楼',
+						value: 2,
+						children: []
+					},
+				],
+				//单元号数据
+				hoodData: [{
+						label: '101',
+						value: 0,
+						children: []
+					},
+					{
+						label: '201',
+						value: 1,
+						children: []
+					},
+					{
+						label: '301',
+						value: 2,
+						children: []
+					},
+				]
+			}
+		},
+		created() {
+			// 获取状态栏的高度
+			this.phoneHeight = uni.getSystemInfoSync().statusBarHeight
+		},
+		methods: {
+			//返回
+			back(){
+				uni.navigateBack({
+					delta:1
+				})
+			},
+			//选择小区事件
+			pickerHouse() {
+				this.$refs.houseName.show()
+			},
+			// 选择楼层事件
+			pickerLou() {
+				this.$refs.Lou.show()
+			},
+			// 选择单元号事件
+			pickerHood() {
+				this.$refs.hoodNum.show()
+			},
+			//小区选择确定
+			confirm(data) {
+				this.form.houseName = data.item.label
+				this.name = data.item.value
+			},
+			//楼层选择确定
+			confirmLou(data) {
+				this.form.lou = data.item.label
+				this.lou = data.item.value
+			},
+			//单元号选择确定
+			confirmHoodNum(data) {
+				this.form.hoodNum = data.item.label
+				this.hoodNum = data.item.value
+			},
+			// 发表
+			submit() {
+				// 判断信息是否选择完整
+				  if(this.form.houseName&& this.form.lou&&this.form.hoodNum){
+				  }
+			}
+		},
+		components: {
+			LbPicker
+		}
+	}
+</script>
+
+<style>
+    .backIcon{
+		width: 48rpx;
+		height: 48rpx;
+		position: absolute;
+		left: 24rpx;
+		top: 30rpx;
+	}
+	.btn {
+		width: 590rpx;
+		height: 90rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		line-height: 90rpx;
+		color: rgba(255, 255, 255, 1);
+		background: rgba(163, 197, 237, 1);
+		opacity: 1;
+		position: absolute;
+		top: 1160rpx;
+		left: 80rpx;
+	}
+
+	.selectIcon {
+		width: 17rpx;
+		height: 12rpx;
+		position: absolute;
+		bottom: 60rpx;
+		right: 30rpx;
+	}
+
+	.bottom {
+		width: 642rpx;
+		height: 42rpx;
+		background: linear-gradient(84deg, rgba(64, 151, 255, 1) 0%, rgba(141, 193, 255, 1) 100%);
+		opacity: 1;
+		border-radius: 0rpx 0rpx 24rpx 24rpx;
+		position: absolute;
+		bottom: 0;
+	}
+
+	.pageBg {
+		width: 100%;
+		height: 100vh;
+		background: url(../../static/select_bgimage@2x.png);
+		background-size: 100% 100%;
+	}
+
+	.infoBox {
+		position: relative;
+		width: 642rpx;
+		height: 890rpx;
+		background: rgba(255, 255, 255, 1);
+		box-shadow: 0px 0px 20px rgba(156, 202, 255, 0.36);
+		opacity: 1;
+		border-radius: 20px;
+		/* margin: 0 auto; */
+		/* margin-top: 190rpx; */
+		overflow: hidden;
+		 position: absolute;
+		 top: 190rpx;
+		 left: 54rpx;
+	}
+
+	.topTitle {
+		width: 348rpx;
+		height: 80rpx;
+		font-size: 56rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		line-height: 54rpx;
+		color: rgba(41, 138, 253, 1);
+		opacity: 1;
+		margin: 0 auto;
+		margin-top: 120rpx;
+	}
+
+	.dec {
+		width: 532rpx;
+		height: 44rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		line-height: 54rpx;
+		color: rgba(153, 153, 153, 1);
+		margin: 0 auto;
+		margin-top: 16rpx;
+		opacity: 1;
+	}
+
+	.item {
+		position: relative;
+		display: flex;
+		width: 590rpx;
+		height: 90rpx;
+		border: 2rpx solid rgba(247, 247, 247, 1);
+		opacity: 1;
+		border-radius: 12rpx;
+		margin: 0 auto;
+		margin-top: 70rpx;
+	}
+
+	.item-input {
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		line-height: 54rpx;
+		color: rgba(204, 204, 204, 1);
+	}
+	.active {
+		background: rgba(41, 138, 253, 1);
+	}
+</style>

pages/circle/circles.vue

@@ -0,0 +1,382 @@
+<!-- 邻里圈 -->
+<template>
+	<view>
+		<view style="width: 100%;height: 600rpx;position: relative;">
+			<image src="../../static/care_family.png" style="width: 100%;height:100%;"></image>
+			<view style="height:44rpx;font-size:32rpx;font-family:PingFang SC;font-weight:bold;color:rgba(255,255,255,1);position: absolute;bottom: 20rpx;right: 194rpx;">星河</view>
+			<view style="width: 132rpx;height: 132rpx;position: absolute;right: 34rpx;bottom: -30rpx;border-radius:14rpx;">
+				<image src="../../static/complain_icon_complain@2x.png" style="width: 100%;height: 100%;"></image>
+			</view>
+		</view>
+		<view class="content">
+			<view class="navTitle" :style="{marginTop:phoneHeight + 'px'}" style="padding-top: 20rpx;">邻里圈</view>
+			<image src="../../static/camera.png" style="width: 39rpx;height: 31rpx;margin-top: 30rpx;margin-left: 688rpx;" @tap="publish()"></image>
+		</view>
+		<!-- 邻里圈内容 -->
+		<view class="main">
+			<view v-for="(item,index) in data" :key="index" class="mainInfo">
+			<view class="item" >
+				<!-- 头像 -->
+				<view class="left">
+					<image :src="item.photo" style="width: 86rpx;height:86rpx;"></image>
+				</view>
+				<!-- 发布内容 -->
+				<view class="right">
+					<view class="name">{{item.name}}</view>
+					<view class="text">
+						{{item.content}}
+					</view>
+					<!-- 图片内容 -->
+					<view class="img" v-if="item.imgArr.length==1">
+						<image :src="img" style="width: 246rpx;height: 420rpx;" v-for="(img,index) in item.imgArr" :key="index"></image>
+					</view>
+					<view class="img" v-else style="display: flex;flex-wrap: wrap;">
+						<image :src="img" style="width:180rpx;height:180rpx;margin-right: 10rpx;margin-bottom: 10rpx;" v-for="(img,index) in item.imgArr" :key="index"></image>
+					</view>
+					<view style="width: 100%;height: 42rpx;display: flex;justify-content: space-between;margin-bottom:20rpx ;margin-top: 30rpx;position: relative;">
+						<!-- 点赞评论弹窗 -->
+						<view class="dailog" v-show="visible && index==talkIndex">
+							<view class="leftIcon" @tap="clickZan">
+								<image src="../../static/circle_icon_heart_nor@2x.png" style="width: 42rpx;height: 37rpx;margin-top: 10rpx;margin-left: 62rpx;"></image>
+								<view class="leftIcon-text" v-show="item.status==1">
+									赞
+								</view>
+								<view class="leftIcon-text" v-show="item.status==0">
+									取消
+								</view>
+							</view>
+							<view class="rightIcon" @tap="talk">
+								<image src="../../static/circle_icon_comment@2x.png" style="width: 42rpx;height: 37rpx;margin-top: 10rpx;margin-left: 62rpx;"></image>
+								<view class="leftIcon-text">
+									评论
+								</view>
+							</view>
+						</view>
+						<view class="leftDate">
+							{{item.date}}
+						</view>
+						<view class="meau" @tap="openDailog(index)">
+							<image src="../../static/circle_icon_more@2x.png" style="width: 100%;height: 100%;"></image>
+						</view>
+					</view>
+					<!-- 点赞 回复列表 -->
+					<view class="list">
+						<view class="zanList" >
+							<view style="display: flex;margin-left: 28rpx;margin-top: 28rpx;margin-bottom: 28rpx;padding-right:2rpx;">
+								<image src="../../static/circle_icon_heart_set@2x.png" style="width: 48rpx;height: 37rpx;margin-top: 5rpx;"></image>
+								<view style="margin-left:8rpx ;">{{item.zanList}}</view>
+							</view>
+						</view>
+						<!-- 回复内容 -->
+						<view class="replayContent">
+							<view style="margin-left: 16rpx;margin-top: 10rpx;" v-for="(list,index) in item.talkList" :key="index">
+								<view class="talk" v-if="list.status==1">
+									<text>{{list.name}} :<text>{{list.info}}</text></text>
+								</view>
+								<view class="replay" v-else>
+									<text class="textInfo">{{list.replayName}}</text><text>回复</text>
+									<text class="textInfo">{{list.name}}:</text><text class="textInfo">{{list.info}}</text>
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			</view>
+		</view>
+		<!-- 评论 -->
+		<!-- :style="{bottom:height==''?0:height + 'rpx' } " -->
+		<view class="talkAbout" v-show="isTalk">
+			<!--  -->
+			<view class="leftContent">
+				<input type="text" style="width: 100%;height: 100%;padding-left: 16rpx;" placeholder="评论" :focus="isFouce" @blur="bindBlur">
+			</view>
+			<view @tap="send" class="sendBtn">发送</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				talkIndex:0,
+				phoneHeight: 0, //手机状态栏的高度
+				visible: false, //判断弹窗显隐
+				isShow: true, //判断点赞还是取消点赞
+				isTalk: false,//
+				isFouce: false,//判断是否聚焦
+				height: '',
+				//页面数据
+				data: [
+					{
+					photo: '../../static/guarantee_icon_guarantee@2x.png',
+					name: '明灯三千',
+					content: '你是我温柔的归宿，你是我嘴角扬起来',
+					imgArr: ["../../static/history_bgimage@2x.png"],
+					show:false,
+					date:'49分钟前',
+					status:1,
+					zanList:"明灯三千，sugar，小飞侠，大尾巴",
+					talkList:[{status:1,name:'星河',info:'小飞侠来啦~'},{status:2,replayName:'星河入梦来',name:'星河',info:'谢谢我的宝贝儿~'}]
+				}, 
+				{
+					photo: '../../static/guarantee_icon_guarantee@2x.png',
+					name: '明灯',
+					content: '你是我温柔的归宿，你是我嘴角扬起来',
+					imgArr: ["../../static/history_bgimage@2x.png","../../static/history_bgimage@2x.png","../../static/history_bgimage@2x.png","../../static/history_bgimage@2x.png"],
+					show:false,
+					date:'49分钟前',
+					status:1,
+					zanList:"明灯三千，sugar，小飞侠，大尾巴",
+					talkList:[{status:1,name:'星河',info:'小飞侠来啦~'},{status:2,replayName:'星河入梦来',name:'星河',info:'谢谢我的宝贝儿~'}]
+				}, 
+				]
+			}
+		},
+		created() {
+			// 获取状态栏的高度
+			this.phoneHeight = uni.getSystemInfoSync().statusBarHeight
+		},
+		methods: {
+			// 失去焦点
+			bindBlur() {
+				this.isTalk = false
+				this.isFouce = false
+			},
+			// 获取焦点
+			bindFouce(e) {
+				console.log(e)
+				this.height = e.detail.height
+
+			},
+			// 发送评论
+			send() {
+				this.isTalk = false
+				this.isFouce = false
+			},
+			// 评论
+			talk() {
+				this.visible=false
+				this.isTalk=true
+				this.data[this.talkIndex].show=!this.data[this.talkIndex].show
+				this.isFouce = true
+
+			},
+			// 打开点赞弹窗
+			openDailog(index) {
+				this.talkIndex=index
+				this.visible=true
+				// this.data[index].show=!this.data[index].show
+			},
+			//点赞
+			clickZan() {
+				this.visible = false
+			},
+			// 发布
+			publish() {
+				uni.navigateTo({
+					url: "publish"
+				})
+			}
+
+		}
+	}
+</script>
+
+<style>
+	.sendBtn {
+		width: 150rpx;
+		font-size: 28rpx;
+		height: 60rpx;
+		border-radius: 30rpx;
+		text-align: center;
+		background: rgba(87, 224, 135, 1);
+		line-height: 60rpx;
+		margin-left: 15rpx;
+		margin-top: 35rpx;
+		color: #FFFFFF;
+	}
+
+	.talkAbout {
+		width: 100%;
+		height: 120rpx;
+		display: flex;
+		position: fixed;
+		bottom: 20rpx;
+		background: rgba(247, 247, 247, 1);
+		border-top: 1rpx solid #C0C0C0;
+		margin-left: 10rpx;
+	}
+
+	.leftContent {
+		width: 550rpx;
+		height: 100rpx;
+		background: #FFFFFF;
+		margin-top: 15rpx;
+		margin-left: 15rpx;
+	}
+
+	.leftIcon-text {
+		max-width: 58px;
+		height: 40px;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(255, 255, 255, 1);
+		margin-top: 10rpx;
+		margin-left: 8rpx;
+
+	}
+	.mainInfo{
+		width: 100%;
+		border-bottom: 2rpx solid rgba(247, 247, 247, 1);
+	}
+
+	.rightIcon {
+		width: 49%;
+		height: 56rpx;
+		display: flex;
+		margin-top: 24rpx;
+	}
+
+	.dailog {
+		width: 406rpx;
+		height: 100rpx;
+		background: rgba(47, 47, 47, 1);
+		opacity: 1;
+		border-radius: 10rpx;
+		position: absolute;
+		right: 88rpx;
+		bottom: -25rpx;
+		display: flex;
+	}
+
+	.leftIcon {
+		width: 49%;
+		height: 56rpx;
+		display: flex;
+		margin-top: 24rpx;
+		border-right: 2px solid rgba(112, 112, 112, 1);
+	}
+
+	.textInfo {
+		height: 44rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(41, 138, 253, 1);
+	}
+
+	.talk {
+		width: 100%;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(41, 138, 253, 1);
+	}
+
+	.replayContent {
+		width: 100%;
+		padding-bottom: 20rpx;
+	}
+
+	.zanList {
+		width: 100%;
+		background: rgba(247, 247, 247, 1);
+		opacity: 1;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(41, 138, 253, 1);
+		overflow: hidden;
+		border-bottom: 2rpx solid rgba(221, 221, 221, 1);
+	}
+
+	.list {
+		width: 100%;
+		background: rgba(247, 247, 247, 1);
+		opacity: 1;
+		margin-bottom: 15rpx;
+	}
+
+	.meau {
+		width: 66rpx;
+		height: 42rpx;
+	}
+
+	.leftDate {
+		width: 104rpx;
+		height: 34rpx;
+		font-size: 24rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(153, 153, 153, 1);
+		margin-top: 4rpx;
+	}
+
+	.img {
+		width: 100%;
+		padding-top: 20rpx;
+	}
+
+	.text {
+		width: 100%;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(51, 51, 51, 1);
+		margin-top: 10rpx;
+	}
+
+	.name {
+		width: 100%;
+		height: 44rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+	}
+
+	.left {
+		width: 86rpx;
+		border-radius: 10rpx;
+	}
+
+	.right {
+		width: 100%;
+		margin-left: 16rpx;
+	}
+
+	.main {
+		width: 100%;
+		
+		position: absolute;
+		top: 722rpx;
+	}
+
+	.item {
+		width: 666rpx;
+		margin: 0 auto;
+		display: flex;
+		padding-top:20rpx ;
+
+	}
+
+	.content {
+		width: 100%;
+		position: absolute;
+		top: 0;
+		/* position: relative; */
+	}
+
+	.navTitle {
+		width: 104rpx;
+		height: 48rpx;
+		font-size: 34rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(255, 255, 255, 1);
+		margin: 0 auto;
+	}
+</style>

pages/circle/publish.vue

@@ -0,0 +1,111 @@
+
+<!-- 发布邻里圈 -->
+<template>
+	<view class="">
+		<view class="content">
+			<view class="text">
+				<textarea style="width: 100%;" :auto-height="true" placeholder="这一刻的想法" v-model="textarea"></textarea>
+			</view>
+			<view class="imgBox">
+				<view class="upImg">
+					<image :src="item" v-for="(item,index) in imgData" :key="index" style="width:208rpx;height: 208rpx;margin-right: 10rpx;margin-bottom: 10rpx;" v-show="imgData.length>0"></image>
+					<image src="../../static/circle_image@2x.png" style="width:208rpx;height: 208rpx;margin-bottom: 10rpx;" @tap="chooseImg"></image>
+				</view>
+				<!-- <view style="width: 208rpx;height: 208rpx;" @tap="chooseImg">
+					<image src="../../static/circle_image@2x.png" style="width: 100%;height: 100%;"></image>
+				</view> -->
+			</view>
+		</view>
+		<view class="btn" :class="{active:textarea}" @tap="push">发表</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				imgData:[],//图片数据
+				textarea:'',//文本数据
+			}
+		},
+		methods:{
+			// 发表
+			push(){
+				if(this.name){
+					
+				}else{
+					return
+				}
+			},
+			// 添加照片
+			chooseImg(){
+				// 判断当前选择图片是否大于九张
+				if(this.imgData.length>9){
+					uni.showToast({
+						"icon":'none',
+						title:'最多只能上传九张图片'
+					})
+					return
+				}
+				uni.chooseImage({
+				    count: 9, //默认9
+				    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+				    sourceType: ['album'], //从相册选择
+				    success: (res)=>{
+						 res.tempFiles.forEach((item)=>{
+							 this.imgData.push(item.path)
+							 
+						 })
+					}
+				});
+			}
+				
+		}
+	}
+</script>
+
+<style>
+	.upImg{
+		display: flex;
+		flex-wrap: wrap;
+	}
+	.imgBox{
+		width: 100%;
+		margin-top: 30rpx;
+		/* display: flex;
+		flex-wrap: wrap; */
+	}
+	.content{
+		width: 702rpx;
+		margin: 0 auto;
+		margin-top:34rpx ;
+	}
+	.text{
+		width: 100%;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(51,51,51,1);
+	}
+	.btn{
+		width:702rpx;
+		height:90rpx;
+		background:rgba(247,247,247,1);
+		opacity:1;
+		border-radius:18rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		color:rgba(204,204,204,1);
+		text-align: center;
+		line-height: 90rpx;
+		position:fixed;
+		bottom: 56rpx;
+		left: 26rpx;
+		
+	}
+	.active{
+		color:rgba(255,255,255,1);
+		background:rgba(41,138,253,1);
+	}
+</style>

pages/complain/compalinSuccess.vue

@@ -0,0 +1,41 @@
+<!-- 投诉成功 -->
+<template>
+	<view class="">
+		<view  class="imgBox">
+			<image src="../../static/null_image_success@2x.png" style="width: 100%;height: 100%;"></image>
+		</view>
+		<view class="text">
+			恭喜您~ 报修成功~
+		</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				
+			}
+		}
+	}
+</script>
+
+<style>
+	.imgBox{
+		width: 520rpx;
+		height: 520rpx;
+		margin: 0 auto;
+		margin-top: 262rpx;
+		
+	}
+	.text{
+		width:310rpx;
+		height:50rpx;
+		font-size:36rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(36,36,36,1);
+		margin-top: 47rpx;
+		margin: 0 auto;
+	}
+</style>

pages/complain/evaluateCompalin.vue

@@ -0,0 +1,223 @@
+<!-- 投诉评价 -->
+<template>
+	<view class="pageBg">
+		<view class="content">
+			<view class="topBack" :style="{marginTop:phoneHeight + 'px'}">
+				<image src="../../static/icon_back@2x(1).png" style="width:48rpx ;height: 48rpx;margin-left: 36rpx;margin-top: 18rpx;"
+				 @tap="back"></image>
+			</view>
+			<view class="topImg">
+				<image src="../../static/complain_icon_complain@2x.png" style="width: 100%;height: 100%;"></image>
+			</view>
+			<view class="topTitle">
+				投诉评价
+			</view>
+			<view class="main">
+				<image src="../../static/appraise_bgimage@2x.png" style="width: 100%;height: 100%;"></image>
+				<image src="../../static/appraise_icon_appraise@2x.png" class="mainImg"></image>
+				<view class="fa">发表评价</view>
+				<view class="star">
+					
+					<uni-rate :value="starNum" style="margin-top: 10rpx;margin-left: 80rpx;" @change="changeRate()"></uni-rate>
+				</view>
+				<image src="../../static/guarantee_icon_content@2x.png" class="contentImg"></image>
+				<view class="contentTitle">
+					评价内容
+				</view>
+				<view class="textContent">
+					<textarea placeholder="请填写评价" style="width: 100%;height: 100%;" v-model="textRea"></textarea>
+				</view>
+				<!-- 图片盒字 -->
+				<view style="width:646rpx;height: 114rpx;position: absolute;left: 24rpx;bottom: 40rpx;display: flex;">
+					<view style="height: 114rpx;margin-right: 10rpx;display: flex;justify-content: space-between;" v-show="imgData" >
+						<image style="width: 114rpx;height: 114rpx;margin-right: 10rpx;" :src="item.path" v-for="(item,index) in imgData" :key="index"></image>
+					</view>
+					<image src="../../static/circle_image@2x.png" style="width: 114rpx;height: 114rpx;" @tap="uploadImg(item)"></image>
+				</view>
+			</view>
+		</view>
+		<view class="submit" :class="{active:starNum && textRea}" @tap="submit">提交</view>
+	</view>
+</template>
+
+<script>
+	import uniRate from '@/components/uni-rate/uni-rate.vue'
+	export default {
+		data() {
+			return {
+				textRea:'',//评价内容
+				starNum:0,//星星数量
+				phoneHeight: 0, //手机状态栏的高度
+				isShow: false,
+				imgData: []
+			}
+		},
+		 components: {uniRate},
+		created() {
+			// 获取状态栏的高度
+			this.phoneHeight = uni.getSystemInfoSync().statusBarHeight
+		},
+		methods: {
+			// 选择评分
+		changeRate(e){
+			this.starNum=e.value
+		},
+			// 图片上传
+			uploadImg(item) {
+				let that = this
+				uni.chooseImage({
+					count: 3, //默认9
+					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['album'], //从相册选择
+					success:(res)=> {
+						console.log(res);
+						this.imgData = res.tempFiles
+					},
+					
+				});
+			},
+			// 提交
+			submit(){
+				console.log(this.textRea,this.imgData,this.starNum)
+			},
+			// 返回上一层
+			back(){
+				uni.navigateBack({
+					delta:1
+				})
+			}
+		},
+		
+	}
+</script>
+
+<style scoped>
+	.submit {
+		width: 702rpx;
+		height: 90rpx;
+		background: rgba(244, 244, 244, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(204, 204, 204, 1);
+		position: absolute;
+		bottom:56rpx;
+		left: 26rpx;
+		text-align: center;
+		line-height: 90rpx;
+	}
+
+	.textContent {
+		width: 646rpx;
+		height: 168rpx;
+		background: rgba(246, 250, 255, 1);
+		border: 2rpx solid rgba(197, 224, 255, 1);
+		opacity: 1;
+		border-radius: 6rpx;
+		position: absolute;
+		left: 24rpx;
+		bottom: 180rpx;
+	}
+
+	.contentImg {
+		width: 33rpx;
+		height: 40rpx;
+		position: absolute;
+		bottom: 460rpx;
+		left: 330rpx;
+	}
+
+	.contentTitle {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+		position: absolute;
+		bottom: 388rpx;
+		left: 290rpx;
+	}
+
+	.star {
+		width: 386rpx;
+		height: 49rpx;
+		display: flex;
+		justify-content: space-between;
+		position: absolute;
+		left: 156rpx;
+		top: 194rpx;
+
+	}
+
+	.starImg {
+		width: 51rpx;
+		height: 49rpx;
+	}
+
+	.fa {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+		position: absolute;
+		top: 114rpx;
+		left: 288rpx;
+	}
+
+	.mainImg {
+		width: 40rpx;
+		height: 46rpx;
+		position: absolute;
+		top: 40rpx;
+		left: 326rpx;
+	}
+
+	.main {
+		width: 692rpx;
+		height: 844rpx;
+		margin: 0 auto;
+		margin-top: 24rpx;
+		position: relative;
+	}
+
+	.topTitle {
+		width: 128rpx;
+		height: 44rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(255, 255, 255, 1);
+		margin: 0 auto;
+		margin-top: 26rpx;
+	}
+
+	.topImg {
+		width: 122rpx;
+		height: 122rpx;
+		margin: 0 auto;
+		margin-top: 4rpx;
+	}
+
+	.pageBg {
+		width: 100%;
+		height: 100vh;
+		background: linear-gradient(180deg, rgba(205, 227, 255, 1) 0%, rgba(133, 188, 255, 1) 100%);
+		opacity: 1;
+	}
+
+	.content {
+		width: 100%;
+		position: absolute;
+		top: 0;
+	}
+	.active{
+		color:rgba(255,255,255,1);
+		background:rgba(41,138,253,1);
+		opacity:1;
+	}
+</style>

pages/complain/index.vue

@@ -0,0 +1,230 @@
+<template>
+	<view style="margin-top: 40rpx;">
+		<view class="item">
+			<view class="left">
+				<image src="../../static/complain_icon_complain@2x.png" style="width: 100%;height: 100%;"></image>
+			</view>
+			<view class="right">
+				<view style="width:100%;height:44rpx;display: flex;justify-content: space-between;">
+					<view class="name">明灯三千</view>
+					<view class="topBtn" v-if="false">已处理</view>
+					<view v-else class="topBtn" style="border:2rpx solid rgba(41,138,253,1);color:#298AFD;">未处理</view>
+				</view>
+				<view class="text">
+					水龙头坏了了了了
+				</view>
+				<view class="img">
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 180rpx;height: 180rpx;padding-right: 10rpx;margin-bottom: 10rpx;"></image>
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 180rpx;height: 180rpx;padding-right: 10rpx;margin-bottom: 10rpx;"></image>
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 180rpx;height: 180rpx;padding-right: 10rpx;margin-bottom: 10rpx;"></image>
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 180rpx;height: 180rpx;padding-right: 10rpx;margin-bottom: 10rpx;"></image>
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 180rpx;height: 180rpx;padding-right: 10rpx;margin-bottom: 10rpx;"></image>
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 180rpx;height: 180rpx;padding-right: 10rpx;margin-bottom: 10rpx;"></image>
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 180rpx;height: 180rpx;padding-right: 10rpx;margin-bottom: 10rpx;"></image>
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 180rpx;height: 180rpx;padding-right: 10rpx;margin-bottom: 10rpx;"></image>
+				</view>
+				<!-- 回复信息 -->
+				<view class="replay">
+					<view style="width: 100%;margin: 20rpx 0rpx 20rpx 20rpx;">
+						<view class="replayItem">
+							<view class="replayName"><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;">物业
+								</text><text style="color:rgba(51,51,51,1);">回复</text><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;margin-left: 5rpx;">肖战:</text></view>
+							<view class="replayContent">换了一个新的，已经修好啦~</view>
+						</view>
+						<view class="replayItem">
+							<view class="replayName"><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;">小赞
+								</text><text style="color:rgba(51,51,51,1);">回复</text><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;margin-left: 5rpx;">肖战:</text></view>
+							<view class="replayContent">换了一个新的，已经修好啦~</view>
+						</view>
+					</view>
+				</view>
+				<!-- 我要评论 -->
+				<view class="bottomBtn" @tap="myTalk">我的评价</view>
+				<view class="date">2020-01-21 12:31</view>
+			</view>
+		</view>
+		<!-- 底部按钮 -->
+		<view class="btnBox" @tap="myRepairs">
+			我要投诉
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {}
+		},
+		methods: {
+			// 我的评价
+			myTalk() {
+				uni.navigateTo({
+					url: "./evaluateCompalin"
+				})
+			},
+			// 我要投诉
+			myRepairs() {
+				uni.navigateTo({
+					url: "./wantCompalin"
+				})
+			}
+			
+		}
+	}
+</script>
+
+<style scoped>
+	.leftBtn {
+		width: 340rpx;
+		height: 90rpx;
+		background: rgba(102, 193, 143, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 90rpx;
+	}
+
+	.rightBtn {
+		width: 340rpx;
+		height: 90rpx;
+		background: rgba(41, 138, 253, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 90rpx;
+	}
+
+	.btnBox {
+		width: 702rpx;
+		height: 90rpx;
+		position: fixed;
+		bottom: 56rpx;
+		left: 24rpx;
+		background: rgba(41, 138, 253, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 90rpx;
+	}
+
+	.date {
+		width: 230rpx;
+		height: 34rpx;
+		font-size: 24rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(204, 204, 204, 1);
+		margin-top: 10rpx;
+		margin-left: 356rpx;
+		text-align: right;
+		margin-bottom: 30rpx;
+	}
+
+	.bottomBtn {
+		width: 140rpx;
+		height: 42rpx;
+		background: rgba(255, 255, 255, 1);
+		border: 2rpx solid rgba(41, 138, 253, 1);
+		opacity: 1;
+		border-radius: 22rpx;
+		font-size: 20rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		line-height: 42rpx;
+		color: rgba(41, 138, 253, 1);
+		text-align: center;
+		margin-top: 40rpx;
+		margin-left: 446rpx;
+	}
+
+	.replayItem {
+		margin-top: 10rpx;
+	}
+
+	.replayContent {
+		font-size: 24rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(51, 51, 51, 1);
+		margin-top: 4rpx;
+	}
+
+	.replay {
+		width: 586rpx;
+		margin-top: 20rpx;
+		background: rgba(247, 247, 247, 1);
+		opacity: 1;
+		border-radius: 8rpx;
+		overflow: hidden;
+	}
+
+	.text {
+		width: 100%;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(51, 51, 51, 1);
+		margin-top: 30rpx;
+	}
+	.img {
+		width: 100%;
+		margin-top: 10rpx;
+		display: flex;
+		flex-wrap: wrap;
+	}
+	.img image :nth-child(3n){
+		margin-right: none;
+	}
+	.name {
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+
+	}
+
+	.topBtn {
+		width: 120rpx;
+		height: 42rpx;
+		background: rgba(255, 255, 255, 1);
+		border: 2rpx solid rgba(204, 204, 204, 1);
+		opacity: 1;
+		border-radius: 22rpx;
+		font-size: 20rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(204, 204, 204, 1);
+		text-align: center;
+		line-height: 42rpx;
+	}
+
+	.item {
+		width: 702rpx;
+		margin: 0 auto;
+		border-bottom: 2rpx solid rgba(247, 247, 247, 1);
+		display: flex;
+		margin-top: 40rpx;
+	}
+
+	.left {
+		width: 86rpx;
+		height: 86rpx;
+	}
+
+	.right {
+		width: 586rpx;
+		margin-left: 30rpx;
+	}
+</style>

pages/complain/wantCompalin.vue

@@ -0,0 +1,228 @@
+<!-- 我要投诉 -->
+<template>
+	<view class="pageBg">
+		<view class="content">
+			<view class="topBack" :style="{marginTop:phoneHeight + 'px'}">
+				<image src="../../static/icon_back@2x(1).png" style="width:48rpx ;height: 48rpx;margin-left: 36rpx;margin-top: 18rpx;"
+				 @tap="back"></image>
+			</view>
+			<view class="topImg">
+				<image src="../../static/complain_icon_complain@2x.png" style="width: 100%;height: 100%;"></image>
+			</view>
+			<view class="topTitle">
+				我要投诉
+			</view>
+			<view class="main">
+				<image src="../../static/appraise_bgimage@2x.png" style="width: 100%;height: 100%;"></image>
+				<image src="../../static/guarantee_icon_summary@2x.png" class="mainImg"></image>
+				<view class="fa">投诉摘要</view>
+				<view class="star">
+					
+				   <textarea placeholder="请填写投诉摘要" style="width: 100%;height: 100%;" v-model="digest"></textarea>
+				</view>
+				<image src="../../static/guarantee_icon_content@2x.png" class="contentImg"></image>
+				<view class="contentTitle">
+					投诉内容
+				</view>
+				<view class="textContent">
+					<textarea placeholder="请填写投诉内容" style="width: 100%;height: 100%;" v-model="textRea"></textarea>
+				</view>
+				<!-- 图片盒字 -->
+				<view style="width:646rpx;height: 114rpx;position: absolute;left: 24rpx;bottom: 40rpx;display: flex;">
+					<view style="height: 114rpx;margin-right: 10rpx;display: flex;justify-content: space-between;" v-show="imgData" >
+						<image style="width: 114rpx;height: 114rpx;margin-right: 10rpx;" :src="item.path" v-for="(item,index) in imgData" :key="index"></image>
+					</view>
+					<image src="../../static/circle_image@2x.png" style="width: 114rpx;height: 114rpx;" @tap="uploadImg(item)"></image>
+				</view>
+			</view>
+		</view>
+		<view class="submit" :class="{active:digest && textRea}" @tap="submit">提交</view>
+	</view>
+</template>
+
+<script>
+	
+	export default {
+		data() {
+			return {
+				digest:'',//报修摘要
+				textRea:'',//评价内容
+				starNum:0,//星星数量
+				phoneHeight: 0, //手机状态栏的高度
+				isShow: false,
+				imgData: []
+			}
+		},
+		 components: {},
+		created() {
+			// 获取状态栏的高度
+			this.phoneHeight = uni.getSystemInfoSync().statusBarHeight
+		},
+		methods: {
+			// 选择评分
+		changeRate(e){
+			this.starNum=e.value
+		},
+			// 图片上传
+			uploadImg(item) {
+				let that = this
+				uni.chooseImage({
+					count: 3, //默认9
+					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['album'], //从相册选择
+					success:(res)=> {
+						console.log(res);
+						this.imgData = res.tempFiles
+					},
+					
+				});
+			},
+			// 提交
+			submit(){
+				console.log(this.textRea,this.imgData,this.starNum)
+			},
+			// 返回上一页
+			back(){
+				uni.navigateBack({
+					delta:1
+				})
+			}
+		},
+		
+	}
+</script>
+
+<style scoped>
+	.submit {
+		width: 702rpx;
+		height: 90rpx;
+		background: rgba(244, 244, 244, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(204, 204, 204, 1);
+		position: absolute;
+		bottom:56rpx;
+		left: 26rpx;
+		text-align: center;
+		line-height: 90rpx;
+	}
+
+	.textContent {
+		width: 646rpx;
+		height: 168rpx;
+		background: rgba(246, 250, 255, 1);
+		border: 2rpx solid rgba(197, 224, 255, 1);
+		opacity: 1;
+		border-radius: 6rpx;
+		position: absolute;
+		left: 24rpx;
+		bottom: 180rpx;
+	}
+
+	.contentImg {
+		width: 33rpx;
+		height: 40rpx;
+		position: absolute;
+		bottom: 460rpx;
+		left: 330rpx;
+	}
+
+	.contentTitle {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+		position: absolute;
+		bottom: 388rpx;
+		left: 290rpx;
+	}
+
+	.star {
+		width: 646rpx;
+		height: 80rpx;
+		display: flex;
+		justify-content: space-between;
+		position: absolute;
+		left: 24rpx;
+		top: 164rpx;
+		background:rgba(246,250,255,1);
+		border:2rpx solid rgba(197,224,255,1);
+		opacity:1;
+		border-radius:6rpx;
+
+	}
+
+	.starImg {
+		width: 51rpx;
+		height: 49rpx;
+	}
+
+	.fa {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+		position: absolute;
+		top: 114rpx;
+		left: 288rpx;
+	}
+
+	.mainImg {
+		width: 40rpx;
+		height: 46rpx;
+		position: absolute;
+		top: 40rpx;
+		left: 326rpx;
+	}
+
+	.main {
+		width: 692rpx;
+		height: 844rpx;
+		margin: 0 auto;
+		margin-top: 24rpx;
+		position: relative;
+	}
+
+	.topTitle {
+		width: 128rpx;
+		height: 44rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(255, 255, 255, 1);
+		margin: 0 auto;
+		margin-top: 26rpx;
+	}
+
+	.topImg {
+		width: 122rpx;
+		height: 122rpx;
+		margin: 0 auto;
+		margin-top: 4rpx;
+	}
+
+	.pageBg {
+		width: 100%;
+		height: 100vh;
+		background: linear-gradient(180deg, rgba(205, 227, 255, 1) 0%, rgba(133, 188, 255, 1) 100%);
+		opacity: 1;
+	}
+
+	.content {
+		width: 100%;
+		position: absolute;
+		top: 0;
+	}
+	.active{
+		color:rgba(255,255,255,1);
+		background:rgba(41,138,253,1);
+		opacity:1;
+	}
+</style>

pages/family/family.vue

@@ -0,0 +1,355 @@
+<template>
+	<view>
+		<view class="topImg">
+			<image src="../../static/care_family.png" style="width: 100%;height: 100%;"></image>
+			<view class="topTile">家人关怀</view>
+			<view class="topNum">今天有<text style="font-weight:400;">1</text>条出行异常</view>
+		</view>
+		<!-- <view style="margin-top: 30rpx;"> -->
+		<view class="content" >
+			<view style="width:100%;min-height: 280rpx;box-shadow:0px 6px 10px rgba(0,0,0,0.1);" v-for="(allData,index) in data" :key="index">
+				
+			
+			<view class="item" >
+				<view class="leftIcon">
+				</view>
+				<view style="margin-left: 30rpx;display: flex;justify-content: space-between;">
+					<view class="leftDate">
+						{{allData.date}}
+					</view>
+					<view class="right">
+						<view class="rightStatus" v-if="allData.status==1">出行正常</view>
+						<view class="rightStatus" v-else style="color:rgba(231,0,30,1);">出现异常</view>   
+						<view style="width: 30rpx;height: 30rpx;" @tap="seeMore(index)">
+							<image src="../../static/icon_combo@2x.png" style="width: 100%;height:100%;margin-top: 5rpx;" v-show="!allData.show"></image>
+							<image src="../../static/icon_combo_set@2x.png" style="width:28rpx;height:14rpx;margin-top: 5rpx;" v-show="allData.show"></image>
+						</view>
+					</view>
+				</view>
+				<!-- 信息 -->
+				<!-- 默认展示第一条数据 -->
+				<view class="infoBox" v-show="!allData.show" style="border: none;">
+					<view class="name">
+						{{allData.child[0].name}}
+					</view>
+					<view style="width: 100%;display: flex;" v-for="(item,index) in allData.child[0].childInfo" :key="index">
+						<view class="leftIC">
+							<image src="../../static/care_icon_ic_nor@2x.png" style="width:28rpx ;height: 16rpx;" v-if="item.iconStatus==1"></image>
+							<image src="../../static/care_icon_ic_nor@2x.png" style="width:28rpx ;height: 16rpx;" v-else></image>
+						</view>
+						<view class="rightBox">
+							<view style="width: 100%;height: 40rpx;display: flex;justify-content: space-between;" v-for="(list,index) in item.endInfo" :key="index">
+								<view class="midInfo">
+									{{list.info}}
+								</view>
+								<view class="lastDate">
+									{{list.date}}
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+				 <!--  -->
+				<!-- 展示更多数据 -->
+				<view class="infoBox" v-for="(childData,index) in allData.child" :key="index" v-show="allData.show">
+					<view class="name">
+						{{childData.name}}
+					</view>
+					<view style="width: 100%;display: flex;" v-for="(item,index) in childData.childInfo" :key="index">
+						<view class="leftIC">
+							<image src="../../static/care_icon_ic_nor@2x.png" style="width:28rpx ;height: 16rpx;" v-if="item.iconStatus==1"></image>
+							<image src="../../static/care_icon_ic_nor@2x.png" style="width:28rpx ;height: 16rpx;" v-else></image>
+						</view>
+						<view class="rightBox">
+							<view style="width: 100%;height: 40rpx;display: flex;justify-content: space-between;" v-for="(list,index) in item.endInfo" :key="index">
+								<view class="midInfo">
+									{{list.info}}
+								</view>
+								<view class="lastDate">
+									{{list.date}}
+								</view>
+							</view>
+						</view>
+					</view>
+				</view>
+			</view>
+			</view>
+		</view>
+		
+		<!-- </view> -->
+
+	</view>
+</template>
+<script>
+	export default {
+		data() {
+			return {
+				moreIndex:'',
+				IsFirst: true, //判断是否显示更多数据
+				data: [
+					{
+					date: '04月29日',
+					status: 1,
+					show:false,
+					child:
+					[{
+						name: '肖',
+						childInfo:[
+							{
+							iconStatus: 1,
+							  endInfo:[{
+								info: '11号楼 2单元门',date:'10:00'
+							}, {
+								info: '07号楼 3单元门',date:'15:00'
+							}]
+						},
+						{
+							iconStatus: 1,
+							  endInfo:[{
+								info: '12号楼 2单元门',date:'20:00'
+							}, ]
+						},
+						]
+					},
+					{
+						name: '哈哈',
+						childInfo:[
+							{
+							iconStatus: 1,
+							  endInfo:[{
+								info: '11号楼 2单元门',date:'10:00'
+							}, {
+								info: '07号楼 3单元门',date:'15:00'
+							}]
+						},
+						]
+					},
+					]
+				},
+				{
+					date: '04月39日',
+					status: 1,
+					show:false,
+					child:
+					[
+						{
+						name: '小赞',
+						childInfo:[
+							{
+							iconStatus: 1,
+							  endInfo:[{
+								info: '11号楼 2单元门',date:'10:00'
+							}, {
+								info: '07号楼 3单元门',date:'15:00'
+							}]
+						},
+						]
+					},
+					{
+						name: '小赞2',
+						childInfo:[
+							{
+							iconStatus: 1,
+							  endInfo:[{
+								info: '11号楼 2单元门',date:'10:00'
+							}, {
+								info: '07号楼 3单元门',date:'15:00'
+							}]
+						},
+						]
+					},
+					{
+						name: '小小',
+						childInfo:[
+							{
+							iconStatus: 1,
+							  endInfo:[{
+								info: '11号楼 2单元门',date:'10:00'
+							}, {
+								info: '07号楼 3单元门',date:'15:00'
+							}]
+						},
+						]
+					},
+					]
+				},
+				{
+					date: '04月39日',
+					status: 1,
+					show:false,
+					child:
+					[
+						{
+						name: '小赞',
+						childInfo:[
+							{
+							iconStatus: 1,
+							  endInfo:[{
+								info: '11号楼 2单元门',date:'10:00'
+							}, {
+								info: '07号楼 3单元门',date:'15:00'
+							}]
+						},
+						]
+					},
+					{
+						name: '小小',
+						childInfo:[
+							{
+							iconStatus: 1,
+							  endInfo:[{
+								info: '11号楼 2单元门',date:'10:00'
+							}, {
+								info: '07号楼 3单元门',date:'15:00'
+							}]
+						},
+						]
+					},
+					]
+				}
+				]
+			}
+		},
+		methods:{
+			// 查看更多数据
+			seeMore(index){
+				this.IsFirst=!this.IsFirst
+				this.moreIndex=index
+				this.data[index].show=!this.data[index].show
+			}
+		}
+	}
+</script>
+
+<style>
+	.name {
+		width: 100%;
+		height: 42rpx;
+		font-size: 30rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(51, 51, 51, 1);
+		padding-bottom:24rpx ;
+	}
+
+	.lastDate {
+		width: 68rpx;
+		height: 34rpx;
+		font-size: 24rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		line-height: 34rpx;
+		color: rgba(153, 153, 153, 1);
+	}
+
+	.midInfo {
+		height: 40rpx;
+		max-width: 408rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		line-height: 40rpx;
+		color: rgba(102, 102, 102, 1);
+	}
+
+	.leftIC {
+		width: 28rpx;
+	}
+
+	.infoBox {
+		width: 608rpx;
+		margin-left: 68rpx;
+		padding-top: 24rpx;
+		overflow: hidden;
+		border-bottom:  2rpx solid rgba(245,245,245,1);
+		padding-bottom: 20rpx;
+	}
+
+	.leftIcon {
+		width: 18rpx;
+		height: 18rpx;
+		background: rgba(41, 138, 253, 1);
+		border-radius: 50%;
+		opacity: 1;
+		position: absolute;
+		left: -9rpx;
+		top: 52rpx;
+	}
+
+	.right {
+		width: 152rpx;
+		height: 40rpx;
+		display: flex;
+		justify-content: space-between;
+	}
+
+	.rightStatus {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+	}
+
+	.leftDate {
+		width: 148rpx;
+		height: 44rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(51, 51, 51, 1);
+	}
+
+	.item {
+		width: 700rpx;
+		border-left: 2rpx solid rgba(245, 245, 245, 1);
+		margin: 0 auto;
+		/* margin-top: 40rpx; */
+		position: relative;
+		padding-top: 40rpx;
+	}
+
+	.content {
+		width: 100%;
+		min-height: 280rpx;
+		background: rgba(255, 255, 255, 1);
+		/* box-shadow: 0rpx 6rpx 10rpx rgba(0, 0, 0, 0.1); */
+		opacity: 1;
+		overflow: hidden;
+		padding-top: 20rpx;
+	}
+
+	.topImg {
+		width: 100%;
+		height: 300rpx;
+		position: relative;
+	}
+
+	.topTile {
+		width: 180px;
+		height: 60px;
+		font-size: 44rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(255, 255, 255, 1);
+		position: absolute;
+		top: 146rpx;
+		left: 28rpx;
+	}
+
+	.topNum {
+		height: 44rpx;
+		font-size: 26rpx;
+		font-family: PingFang SC;
+		color: rgba(255, 255, 255, 1);
+		position: absolute;
+		top: 216rpx;
+		left: 28rpx;
+	}
+
+	.rightBox {
+		width: 572rpx;
+		margin-left: 12rpx;
+	}
+</style>

pages/index/detail.vue

@@ -0,0 +1,152 @@
+<!-- 物业公告信息详情 -->
+<template>
+	<view class="pageBg">
+		<image src="../../static/announcement_bgimage@2x.png" style="width: 100%;height: 100%;"></image>
+		<view class="content">
+			<view style="display: flex;" :style="{marginTop:phoneHeight + 'px'}">
+				<view style="width: 48rpx;height: 48rpx;margin-left: 24rpx;margin-top: 18rpx;" @tap="back">
+					<image src="../../static/icon_back@2x(1).png" style="width: 100%;height: 100%;"></image>
+				</view>
+					<view class="topTitle" >物业公告</view>
+			</view>
+				<view class="infoBox">
+					<view class="infoTitle">
+						停电通知
+					</view>
+					<view class="infoDate">
+						<view style="">2020-02-02</view>
+						<view>阅读 15</view>
+					</view>
+					<view class="main">
+						<text style="margin-top: 20rpx;">
+							尊敬的各位业主/住户：
+							因本小区主自来水管网阀门损坏需紧急停水抢修，今日下午15：30分进行临时对本小区临时停水，开始对自来水的主管道阀门进行紧急抢修更换。届时本小区11号楼2号楼3号楼的生活用水将受影响，预计在晚20：00左右管道维修完毕后恢复正常供水，因自来水管道阀门更换抢修工作给您生活带来的不便敬请谅解，感谢您对我们物业服务工作的理解和支持。特此通知！
+						</text>
+					
+					</view>
+				</view>
+				<view  class="company">青海旺业物业有限公司</view>
+				<view class="date">
+					2020年02月02日
+				</view>
+		</view>
+	
+
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				phoneHeight: 0, //手机状态栏的高度
+			}
+		},
+		created() {
+			// 获取状态栏的高度
+			this.phoneHeight = uni.getSystemInfoSync().statusBarHeight
+		},
+		methods:{
+			// 返回上个页面
+			back(){
+				uni.navigateBack({
+					delta:1
+				})
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.date{
+		width: 90%;
+		height: 40rpx;
+		font-size:28rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(41,138,253,1);
+		margin: 0 auto;
+		position: absolute;
+		bottom: 160rpx;
+		left: 88rpx;
+	}
+	.company{
+		width: 90%;
+		height: 40rpx;
+		font-size:28rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(41,138,253,1);
+		margin: 0 auto;
+		position: absolute;
+		bottom: 206rpx;
+		left: 88rpx;
+	}
+	.content{
+		position: absolute;
+		top: 0;
+		width: 100%;
+		height: 100%;
+	}
+	.main {
+		width: 90%;
+		margin: 0 auto;
+		margin-top: 20rpx;
+		border-top:2rpx solid rgba(244,244,244,1);
+	}
+	
+	.infoDate {
+		width: 90%;
+		height: 34rpx;
+		display: flex;
+		justify-content: space-between;
+		margin: 0 auto;
+		margin-top: 20rpx;
+		font-size:24rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(153,153,153,1);
+
+	}
+
+	.infoTitle {
+		width: 132rpx;
+		height: 44rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+		margin-top: 180rpx;
+		margin-left: 30rpx;
+	}
+
+	.infoBox {
+		width: 80%;
+		height: 900rpx;
+		border-radius: 20rpx;
+		margin: 0 auto;
+		margin-top: 46rpx;
+		/* border: 1rpx solid #333333; */
+		/* background-color: #FFFFFF; */
+	}
+
+	.pageBg {
+		width: 100%;
+		height: 100vh;
+		/* background-image: url(../../static/announcement_bgimage@2x.png); */
+		background-size: 100% 100%;
+
+	}
+
+	.topTitle {
+		width: 140rpx;
+		height: 48rpx;
+		font-size: 34rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color:rgba(255,255,255,1);
+		/* color: #333333; */
+		margin: 0 auto;
+		padding-top: 20rpx;
+	}
+</style>

pages/index/index.vue

@@ -0,0 +1,356 @@
+<template>
+	<view style="background:rgba(245,245,245,1);
+opacity:1;">
+		<view class="topBox">
+			<image :src="photoData[swiperIndex]" style="width: 100%;height:391rpx;"></image>
+			<view class="topBoxInfo">
+				<view class="topInfo" :style="{marginTop:phoneHeight + 'px'}" @tap="selectHouse">
+					<view>
+						<text>xx小区</text> <text>111楼</text> <text>2单元 801</text>
+					</view>
+					<view class="topIcon">
+						<image src="../../static/home_combo_more@2x.png" style="width: 100%;height: 100%;margin-bottom: 5rpx;"></image>
+					</view>
+				</view>
+				<!-- 轮播图 -->
+				<view class="swiperBox">
+					<swiper @change="changeImg" :current="swiperIndex" :indicator-dots="true" :autoplay="true" :interval="2000" :duration="1000" style="width: 100%;height: 100%;"
+					 indicator-active-color="#298AFD" indicator-color="#fff">
+						<swiper-item v-for="(item,index) in photoData" :key="index">
+							<view class="swiper-item">
+								<image :src="item" style="width: 100%;border-radius: 15rpx;height:342px;"></image>
+							</view>
+						</swiper-item>
+						<!-- <swiper-item>
+							<view class="swiper-item">
+								<image src="" style="width: 100%;height:342px;border-radius: 15rpx;
+"></image>
+							</view>
+						</swiper-item> -->
+					</swiper>
+				</view>
+				<!--功能栏  -->
+				<view class="meau">
+					<view style="width: 116rpx;height: 100%; text-align: center;line-height: 90rpx;" @tap="visitorPass">
+						<view class="meauIcon">
+							<image src="../../static/home_icon_password@2x.png" style="width: 100%;height: 100%;"></image>
+						</view>
+						<view class="meauText">访客密码</view>
+					</view>
+					<view style="width: 116rpx;height: 100%;text-align: center;line-height: 90rpx;" @tap="openDoor">
+						<view class="meauIcon">
+							<image src="../../static/home_icon_open@2x.png" style="width: 100%;height: 100%;"></image>
+						</view>
+						<view class="meauText">一键开门</view>
+					</view>
+					<view style="width: 116rpx;height: 100%;text-align: center;line-height: 90rpx;" @tap="onlineRepairs">
+						<view class="meauIcon">
+							<image src="../../static/home_icon_guarantee@2x.png" style="width: 100%;height: 100%;"></image>
+						</view>
+						<view class="meauText">在线报修</view>
+					</view>
+					<view style="width: 116rpx;height: 100%; text-align: center;line-height: 90rpx;" @tap="onlineComplain">
+						<view class="meauIcon">
+							<image src="../../static/home_icon_complain@2x.png" style="width: 100%;height: 100%;"></image>
+						</view>
+						<view class="meauText">在线投诉</view>
+					</view>
+				</view>
+			</view>
+		</view>
+		<!-- 物业公告 -->
+		<view class="main">
+			<view class="mainTitle">
+				<view class="mainIcon">
+					<image src="../../static/home_icon@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<view class="mainText">物业公告</view>
+				<view class="moreBtn" @tap="moreBtn">
+					更多
+				</view>
+			</view>
+			<!-- 公告信息 -->
+			<view class="item">
+				<view class="mainInfo" @tap="seeDetail">
+					<view class="left">
+						<view style="width: 100%;height: 42rpx;ont-size:30rx;font-family:PingFang SC;font-weight:bold;color:rgba(51,51,51,1);margin-top: 40rpx;">
+							【得月苑】停水通知
+						</view>
+						<view class="leftInfo">因本小区主自来水管网阀门损坏萨达飒飒飒飒</view>
+						<view class="leftDate">
+							<view class="leftTag">最新</view>
+							<view style="width:230rpx;height:34rpx;font-size:24rpx;font-family:PingFang SC;font-weight:400;line-height:34rpx;color:rgba(204,204,204,1);position: absolute;right: 0;">2019-04-01
+								11:20</view>
+						</view>
+					</view>
+					<view class="right">
+						<image src="../../static/authorization.png" style="width: 100%;height: 100%;"></image>
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				phoneHeight: 0, //手机状态栏的高度
+				swiperIndex:0,//当前显示轮播图的索引
+				photoData:["../../static/empower_image@2x.png","../../static/login_bgground@2x.png"]
+
+			}
+		},
+		created() {
+			// 获取状态栏的高度
+			this.phoneHeight = uni.getSystemInfoSync().statusBarHeight
+
+		},
+		onLoad() {
+
+		},
+		methods: {
+			// 查看物业公告详情
+			seeDetail(){
+				uni.navigateTo({
+					url:'./detail'
+				})
+				},
+			// 监听轮播图当前索引
+			changeImg(e){
+				this.swiperIndex=e.detail.current
+			},
+			// 访客密码
+			visitorPass() {
+				uni.navigateTo({
+					url: "./visitorPass"
+				})
+			},
+			// 一键开门
+			openDoor() {
+				uni.navigateTo({
+					url: "../openDoor/openDoor"
+				})
+			},
+			// 在线保修
+			onlineRepairs() {
+				uni.navigateTo({
+					url: "../onlineRpair/index"
+				})
+			},
+			// 在线投诉
+			onlineComplain() {
+				uni.navigateTo({
+					url: "../complain/index"
+				})
+			},
+			// 更多跳转
+			moreBtn() {
+				uni.navigateTo({
+					url: './more'
+				})
+			},
+			// 选择房屋认证
+			selectHouse() {
+				uni.navigateTo({
+					url: "../authentication/selectHouse"
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	.topIcon {
+		width: 14rpx;
+		height: 9rpx;
+		margin-left: 6rpx;
+
+	}
+
+	.leftTag {
+		width: 56rpx;
+		height: 28rpx;
+		background: rgba(84, 162, 255, 1);
+		opacity: 1;
+		border-radius: 6rpx;
+		font-size: 20rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 26rpx;
+		margin-top: 6rpx;
+		margin-right: 120rpx;
+	}
+
+	.leftDate {
+		width: 100%;
+		height: 34rpx;
+		margin-top: 38rpx;
+		display: flex;
+		position: relative;
+	}
+
+	.left {
+		width: 442rpx;
+		height: 204rpx;
+	}
+
+	.leftInfo {
+		width: 100%;
+		height: 34rpx;
+		font-size: 24rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(153, 153, 153, 1);
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		margin-top: 16rpx;
+	}
+
+	.right {
+		width: 207rpx;
+		height: 204rpx;
+		border-radius: 10px;
+
+	}
+
+	.mainInfo {
+		width: 688rpx;
+		height: 222rpx;
+		display: flex;
+		justify-content: space-between;
+		border-bottom: 2px solid rgba(247, 247, 247, 1);
+	}
+
+	.item {
+		width: 688rpx;
+		margin: 0 auto;
+		margin-top: 20rpx;
+	}
+
+	.main {
+		width: 100%;
+		margin-top: 20rpx;
+		background: rgba(255, 255, 255, 1);
+		opacity: 1;
+		overflow: hidden;
+	}
+
+	.mainIcon {
+		width: 30rpx;
+		height: 30rpx;
+		/* border: 1rpx solid #333333; */
+		margin-top: 6rpx;
+		margin-right: 10rpx;
+	}
+
+	.mainText {
+		width: 132rpx;
+		height: 44rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(51, 51, 51, 1);
+	}
+
+	.moreBtn {
+		width: 100rpx;
+		height: 50rpx;
+		background: rgba(255, 255, 255, 1);
+		border: 2rpx solid rgba(238, 238, 238, 1);
+		opacity: 1;
+		border-radius: 26rpx;
+		text-align: center;
+		font-size: 24rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		line-height: 50rpx;
+		position: absolute;
+		right: 0;
+		top: 2rpx;
+		color: #999999;
+	}
+
+	.mainTitle {
+
+		position: relative;
+		width: 688rpx;
+		/* height: 44rpx; */
+		margin: 0 auto;
+		display: flex;
+		margin-top: 40rpx;
+	}
+
+	.meauText {
+		width: 100%;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(51, 51, 51, 1);
+		/* color: rgba(255, 255, 255, 1); */
+		/* margin-top: 40rpx; */
+	}
+
+	.meauIcon {
+		width: 60rpx;
+		height: 60rpx;
+		/* border: 1rpx solid #4CD964; */
+		margin-left: 28rpx;
+	}
+
+	.meau {
+		width: 590rpx;
+		height: 124rpx;
+		margin: 0 auto;
+		margin-top: 40rpx;
+		/* border: 1rpx solid #FFFFFF; */
+		display: flex;
+		justify-content: space-between;
+	}
+
+	.swiperBox {
+		width: 666rpx;
+		height: 342rpx;
+		border-radius: 14rpx;
+		margin: 0 auto;
+		/* border: 1rpx solid #333333; */
+		margin-top: 48rpx;
+	}
+
+	.topBox {
+		width: 100%;
+		height: 718rpx;
+		background-color: #FFFFFF;
+
+	}
+
+	.topBoxInfo {
+		width: 100%;
+		/* height: 688rpx; */
+		position: absolute;
+		top: 0;
+		margin-top: 30rpx;
+	}
+
+	.topInfo {
+		width: 305rpx;
+		height: 36rpx;
+		margin-left: 50rpx;
+		font-size: 26rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		line-height: 36rpx;
+		color: rgba(255, 255, 255, 1);
+		display: flex;
+
+	}
+
+	.swiperBox .swiperHeight {
+		height: 100% !important;
+	}
+</style>

pages/index/more.vue

@@ -0,0 +1,119 @@
+<!--物业公告更多列表 -->
+<template>
+	<view>
+		<view class="item">
+			<view class="mainInfo" v-for="(item,index) in listData" :key="index" @tap="seeDetail(item)">
+				<view class="left">
+					<view style="width: 100%;height: 42rpx;ont-size:30rx;font-family:PingFang SC;font-weight:bold;color:rgba(51,51,51,1);margin-top: 40rpx;">
+						{{item.title}}
+					</view>
+					<view class="leftInfo">{{item.dec}}</view>
+					<view class="leftDate">
+						<view class="leftTag" v-if="item.isShow>0">最新</view>
+						<view style="width:230rpx;height:34rpx;font-size:24rpx;font-family:PingFang SC;font-weight:400;line-height:34rpx;color:rgba(204,204,204,1);position: absolute;right: 0;">{{item.time}}</view>
+					</view>
+				</view>
+				<view class="right">
+					<image :src="item.img" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				listData: [{
+					title: '【得月苑】停水通知',
+					dec: '因本小区主自来水管网阀门损坏萨达萨达是',
+					img: '../../static/authorization.png',
+					time: '2019-04-01 11:20',
+					isShow: 1
+				}, {
+					title: '【揽月豪庭】召开大会通知',
+					dec: '关于召开小区业主大会的公告撒大苏打西西',
+					img: '../../static/authorization.png',
+					time: '2019-04-01 11:20',
+					isShow: 0
+				}]
+			}
+		},
+		methods:{
+			// 查看物业公告详情
+			seeDetail(item){
+				console.log(item)
+				uni.navigateTo({
+					url:'./detail'
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	.leftTag {
+		width: 56rpx;
+		height: 28rpx;
+		background: rgba(84, 162, 255, 1);
+		opacity: 1;
+		border-radius: 6rpx;
+		font-size: 20rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 26rpx;
+		margin-top: 6rpx;
+		margin-right: 120rpx;
+	}
+
+	.leftDate {
+		width: 100%;
+		height: 34rpx;
+		margin-top: 38rpx;
+		display: flex;
+		position: relative;
+	}
+
+	.left {
+		width: 442rpx;
+		height: 204rpx;
+	}
+
+	.leftInfo {
+		width: 100%;
+		height: 34rpx;
+		font-size: 24rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(153, 153, 153, 1);
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		margin-top: 16rpx;
+	}
+
+	.right {
+		width: 207rpx;
+		height: 204rpx;
+		border-radius: 10px;
+
+	}
+
+	.mainInfo {
+		width: 688rpx;
+		height: 222rpx;
+		display: flex;
+		justify-content: space-between;
+		border-bottom: 2px solid rgba(247, 247, 247, 1);
+	}
+
+	.item {
+		width: 688rpx;
+		margin: 0 auto;
+		margin-top: 20rpx;
+		
+	}
+</style>

pages/index/visitorPass.vue

@@ -0,0 +1,329 @@
+<template>
+	<view>
+		<view style="width:100%;height:516rpx;position: relative;">
+			<view class="navImage">
+				<image src="../../static/login_bgground@2x.png" style="width:100%;height:516rpx;"></image>
+			</view>
+		</view>
+		<!--  -->
+		<view style="width: 100%;position: absolute;top: 0;">
+			<!-- 返回icon -->
+			<view class="topBack" :style="{marginTop:phoneHeight + 'px'}">
+				<image src="../../static/icon_back@2x(1).png" style="width:48rpx ;height: 48rpx;margin-left: 36rpx;margin-top: 18rpx;" @tap="back"></image>
+				<view style="color:#fff;" class="nvaTitle">访客密码</view>
+			</view>
+			<view class="info">
+				<!-- 截止日期 -->
+					<view class="endDate">截止日期：2020-1-1 13：10</view>
+				<view class="topType"></view>
+				<view class="info-title">访客信息填写</view>
+				<view class="item" style="margin-top: -50rpx;">
+					<view class="left-icon">
+						<image src="../../static/register_icon_name@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input" v-model="form.name" focus placeholder="请输入真实姓名" />
+				</view>
+				<view class="item">
+					<view class="left-icon">
+							<image src="../../static/register_icon_identity@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input" v-model="form.idNumber" focus placeholder="请输入身份证号" />
+				</view>
+				<view class="item">
+					<view class="left-icon">
+						<image src="../../static/login_icon_phone@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input" v-model="form.phone" focus placeholder="请输入手机号" />
+				</view>
+				<view class="item" @tap="selectDate">
+					<view class="left-icon">
+							<image src="../../static/visitor_icon_hour@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input" v-model="form.date" focus placeholder="访问时间" />
+					<image src="../../static/icon_combo@2x.png" style="width: 56rpx;height: 30rpx;margin-top: 68rpx;margin-right: 54rpx;"></image>
+				</view>
+				<view class="item">
+				
+					<view class="left-icon">
+							<image src="../../static/visitor_icon_regard@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input"  v-model="form.dec" placeholder="请输入您的来访事由" />
+			</view>
+			</view>
+			<!-- 获取临时开门码 -->
+			<button class="loginNow" @tap="loginNow()" :class="{active:form.name && form.idNumber && form.phone && form.date &&form.dec}">
+				获取临时开门码
+			</button>
+			
+		</view>
+		<!-- 来访时间选择组件 -->
+		 <lb-picker ref="date" :list="dateData" @confirm="confirm">
+		 	<!-- <view slot="cancle-text">取消</view>
+		 	  <view slot="confirm-text" >确定</view> -->
+		 </lb-picker>
+	</view>
+</template>
+
+<script>
+	import LbPicker from '@/components/lb-picker'
+	export default {
+		components: {
+			LbPicker
+		},
+		data() {
+			return {
+				phoneHeight: 0, //手机状态栏的高度
+				// 时间数据
+			    dateData:[{label:'一个小时',value:1,child:[]},{label:'一天',value:24,child:[]},],
+				 time:'',//选择时间绑定值
+				//表单绑定值
+				form: {
+					name: '', //姓名
+					idNumber: '', //身份证号
+					phone: '', //手机号
+					date:'',//时间
+					dec: '', //来访事由
+				}
+			}
+		},
+		created() {
+			// 获取状态栏的高度
+			this.phoneHeight = uni.getSystemInfoSync().statusBarHeight
+		},
+		methods: {
+			// 返回
+			back(){
+				uni.switchTab({
+					url:"index"
+				})
+			},
+			// 选择时间确定
+			confirm(data){
+				this.form.date=data.item.label
+				this.time=data.item.value
+				console.log(this.time)
+			},
+			//选择时间打开组件
+			 selectDate(){
+				 this.$refs.date.show()
+			 },
+			// 现在登录
+			loginNow() {
+				// 判断输入框是否都有值  否不可以点击
+				if (!this.form.name || !this.form.idNumber || !this.form.date || !this.form.phone|| !this.form.dec) {
+					return
+				} else {
+					let idNumerReg = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/; //身份证正则
+					let phoneReg = /^1[3|4|5|7|8][0-9]{9}$/; //手机号正则校验
+					if (!this.form.name) {
+						uni.showToast({
+							icon: 'none',
+							title: '姓名不能为空',
+							duration: 2000
+						});
+					} else if (!idNumerReg.test(this.form.idNumber)) {
+						console.log(this.form.idNumber)
+						uni.showToast({
+							icon: 'none',
+							title: '身份证号码格式不正确',
+							duration: 2000
+						});
+					} else if (!phoneReg.test(this.form.phone)) {
+						uni.showToast({
+							icon: 'none',
+							title: '手机号码格式不正确',
+							duration: 2000
+						});
+					}else{
+						uni.navigateTo({
+							url: "../visitor/doorCode"
+						})
+					}
+					
+				}
+				
+			},
+		},
+		
+	}
+</script>
+
+<style>
+	.endDate{
+		width: 342rpx;
+		height:34rpx ;
+		font-size:24rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(102,102,102,1);
+	    position: absolute;
+		top: 542rpx;
+		left: 90rpx;
+	}
+	.topBack{
+		display: flex;
+		position: absolute;
+	}
+	.popupClose{
+		width: 44rpx;
+		height: 44rpx;
+		position: absolute;
+		right: 20rpx;
+		top: 20rpx;
+		
+	}
+	.popupBtn{
+		width: 342rpx;
+		height: 80rpx;
+		position: absolute;
+		bottom: 80rpx;
+		left: 128rpx;
+		background:rgba(41,138,253,1);
+		color: #FFFFFF;
+		font-size: 32rpx;
+ 	}
+	.popupTitle{
+		width: 260rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		color: #999999;
+		position: absolute;
+		bottom: 232rpx;
+		left: 170rpx;
+	}
+	.popupImage{
+	width:100%;
+	height:300rpx;
+/* 	background-image: url(../../static/success_popup@2x.png);
+     position: absolute;
+	 top: -64rpx; */
+	 
+	}
+	.loginNow {
+		width: 702rpx;
+		height: 90rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		color:rgba(255,255,255,1);
+		position: absolute;
+		top: 1188rpx;
+		left: 26rpx;
+		line-height: 90rpx;
+		background:rgba(163,197,237,1);
+		opacity:1;
+	}
+
+	.info-btn {
+		width: 342rpx;
+		height: 88rpx;
+		background: rgba(163, 197, 237, 1);
+		opacity: 1;
+		border-radius: 14rpx;
+		font-size: 32rpx;
+		text-align: center;
+		line-height: 88rpx;
+		color: rgba(255, 255, 255, 1);
+		margin: 0 auto;
+		margin-top: 44rpx;
+	}
+
+	.item-input {
+		width: 100%;
+		margin-left: 20rpx;
+		height: 40rpx;
+		margin-top: 62rpx;
+		font-size: 32rpx;
+		color: #999999;
+		color: #333333;
+		opacity: 1;
+	}
+
+	.active {
+		background:rgba(41,138,253,1);
+	}
+
+	.left-icon {
+		width: 40rpx;
+		height: 40rpx;
+		/* border: 1rpx solid #555555; */
+		/* box-sizing: border-box; */
+		margin-top: 62rpx;
+	}
+	.item {
+		display: flex;
+		width: 531rpx;
+		height: 120rpx;
+		margin: 0 auto;
+		border-bottom: 2px solid rgba(247, 247, 247, 1);
+		opacity: 1;
+		/* margin-top: 50rpx; */
+	}
+
+	.info-box {
+		width: 90%;
+		margin: 0 auto;
+		border: 1px solid #808080;
+	}
+
+	.info-title {
+		width: 100%;
+		height: 48rpx;
+		font-size: 34rpx;
+		text-align: center;
+		line-height: 48rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		position: absolute;
+		top: 30rpx;
+	}
+
+	.topType {
+		width: 150rpx;
+		height: 150rpx;
+		border-radius: 50%;
+		background: #FFFFFF;
+		margin: 0 auto;
+		margin-top: -50rpx;
+		border: 1rpx solide #C0C0C0;
+	}
+	.info {
+		width: 602rpx;
+		height: 747rpx;
+		background: rgba(255, 255, 255, 1);
+		box-shadow: 0px 6px 30px rgba(41, 138, 253, 0.15);
+		opacity: 1;
+		position: absolute;
+		top: 369rpx;
+		left: 74rpx;
+		border-radius: 20rpx;
+	}
+
+	.btn {
+		width: 702rpx;
+		height: 90rpx;
+		background: rgba(41, 138, 253, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 90rpx;
+		position: absolute;
+		top: 990rpx;
+		left: 27rpx;
+	}
+	.nvaTitle {
+		width: 140rpx;
+		height: 48rpx;
+		text-align: center;
+		font-size: 32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		color:rgba(255,255,255,1);
+		margin: 0 auto;
+		padding-top: 20rpx;
+		margin-left: 234rpx;
+	}
+</style>

pages/login/authorization.vue

@@ -0,0 +1,49 @@
+<template>
+	<view>
+		<view class="title">
+			平安E家小程序需要获得您的用户信息
+		</view>
+		<image src="../../static/authorization.png" style="width: 100%;height: 503rpx;margin-top: 48rpx;"></image>
+		<button class="btn" @getuserinfo="login">授权并登陆</button>
+	</view>
+</template>
+
+<script>
+	export default {
+  data(){
+	  return{
+		  
+	  }
+	},
+		methods:{
+			// 授权登录
+			login(){
+				
+			}
+		}
+  }
+</script>
+<style>
+	.title{
+		width: 504rpx;
+		height: 118rpx;
+		text-align: center;
+		margin: 0 auto;
+		font-size: 40rpx;
+		color:rgba(51,51,51,1);
+		margin-top: 246rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+	}
+	.btn{
+		width: 702rpx;
+		height: 88rpx;
+		background:rgba(41,138,253,1);
+		color:rgba(255,255,255,1);
+		font-size: 36rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		margin-top: 170rpx;
+	}
+	
+</style>

pages/login/login.vue

@@ -0,0 +1,233 @@
+<template>
+	<view>
+		<view style="width:100%;height:516rpx;position: relative;">
+			<view class="navImage">
+				<image src="../../static/login_bgground@2x.png" style="width:100%;height:516rpx;"></image>
+			</view>
+			<!-- <view style="color:#fff;" class="nvaTitle">访客密码</view> -->
+		</view>
+		<view>
+			<view class="info">
+				<view class="topType"></view>
+				<view class="info-title">登录</view>
+				<view class="item">
+					<view class="left-icon">
+						<image src="../../static/login_icon_phone@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input" v-model="form.phone" focus placeholder="请输入手机号" />
+				</view>
+				<view class="item">
+					<view class="left-icon">
+						<image src="../../static/login_icon_code@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input" style="width:190rpx;" v-model="form.code" placeholder="请输入验证码" />
+					<view style="margin-left: 150rpx;font-size: 24rpx;text-align: center;line-height: 40rpx;color:rgba(41,138,253,1);"
+					 v-show="isGet" @tap="getCode">获取验证码</view>
+					<view v-show="isShow" @tap="againGetCode" style="width: 160rpx; margin-left: 116rpx;font-size: 24rpx;text-align: center;line-height: 45rpx;color:rgba(41,138,253,1);">重新获取<sapn>({{num}}s)</sapn>
+					</view>
+				</view>
+				<!--注册按钮 -->
+				<view class="info-btn" @tap="login" :class="{active: form.phone && form.code}">
+					登录
+				</view>
+
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				isShow: false, //判断是否显示重新获取
+				isGet: true, //判断是否显示获取验证码
+				// 倒计时数字
+				num: 59,
+				// 倒计时
+				timer: null,
+				//表单绑定值
+				form: {
+					name: '', //姓名
+					idNumber: '', //身份证号
+					phone: '', //手机号
+					code: '', //验证码
+				}
+			}
+		},
+		methods: {
+			// 获取验证码
+			getCode() {
+				this.isShow = true
+				this.isGet = false
+				const TIME_COUNT = 60;
+				// 判断当前timer是否有值
+				if (!this.timer) {
+					this.num = TIME_COUNT;
+					this.show = false;
+					this.timer = setInterval(() => {
+						// 判断当前num值大于0并且小于等于60执行
+						if (this.num > 0 && this.num <= TIME_COUNT) {
+							this.num--;
+						} else {
+							//否则就清除定时
+							clearInterval(this.timer);
+							this.timer = null;
+						}
+					}, 1000)
+				}
+			},
+			//重新获取验证码
+			againGetCode() {
+
+			},
+			// 登录
+			login() {
+				let phoneReg = /^1[3|4|5|7|8][0-9]{9}$/; //手机号正则校验
+				// 判断输入框是否都有值  是可以点击注册 否不可以点击
+				if (!this.form.code || !this.form.phone) {
+					return
+				} else {
+					if (!phoneReg.test(this.form.phone)) {
+						uni.showToast({
+							icon: 'none',
+							title: '手机号码格式不正确',
+							duration: 2000
+						});
+					}
+					uni.switchTab({
+						url:'../index/index'
+					})
+				}
+			}
+		}
+	}
+</script>
+
+<style>
+	.loginNow {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		color: #333333;
+		margin: 0 auto;
+		margin-top: 48rpx;
+	}
+
+	.info-btn {
+		width: 342rpx;
+		height: 88rpx;
+		background: rgba(163, 197, 237, 1);
+		opacity: 1;
+		border-radius: 14rpx;
+		font-size: 32rpx;
+		text-align: center;
+		line-height: 88rpx;
+		color: rgba(255, 255, 255, 1);
+		margin: 0 auto;
+		margin-top: 88rpx;
+	}
+
+	.item-input {
+		width: 100%;
+		margin-left: 20rpx;
+		height: 40rpx;
+		/* margin-top: 5rpx; */
+		font-size: 32rpx;
+		color: #999999;
+		color: #333333;
+		opacity: 1;
+	}
+
+	.active {
+		background: rgba(41, 138, 253, 1);
+	}
+
+	.left-icon {
+		width: 40rpx;
+		height: 40rpx;
+		/* border: 1rpx solid #555555; */
+		/* box-sizing: border-box; */
+	}
+
+	.item {
+		display: flex;
+		width: 531rpx;
+		height: 59rpx;
+		margin: 0 auto;
+		border-bottom: 2px solid rgba(247, 247, 247, 1);
+		opacity: 1;
+		margin-top: 50rpx;
+	}
+
+	.info-box {
+		width: 90%;
+		margin: 0 auto;
+		border: 1px solid #808080;
+	}
+
+	.info-title {
+		width: 100%;
+		height: 48rpx;
+		font-size: 34rpx;
+		text-align: center;
+		line-height: 48rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		position: absolute;
+		top: 30rpx;
+	}
+
+	.topType {
+		width: 150rpx;
+		height: 150rpx;
+		border-radius: 50%;
+		background: #FFFFFF;
+		margin: 0 auto;
+		margin-top: -50rpx;
+		border: 1rpx solide #C0C0C0;
+	}
+
+	.navImage {}
+
+	.info {
+		width: 602rpx;
+		height: 458rpx;
+		background: rgba(255, 255, 255, 1);
+		box-shadow: 0px 6px 30px rgba(41, 138, 253, 0.15);
+		opacity: 1;
+		position: absolute;
+		top: 484rpx;
+		left: 74rpx;
+		border-radius: 20rpx;
+	}
+
+	.btn {
+		width: 702rpx;
+		height: 90rpx;
+		background: rgba(41, 138, 253, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 90rpx;
+		position: absolute;
+		top: 990rpx;
+		left: 27rpx;
+	}
+
+	.nvaTitle {
+		position: absolute;
+		text-align: center;
+		max-width: 400rpx;
+		overflow: hidden;
+		top: 0;
+		left: 0;
+		bottom: 0;
+		right: 0;
+		font-size: 32rpx;
+		margin: auto;
+	}
+</style>

pages/mine/addCar.vue

@@ -0,0 +1,126 @@
+<!-- 绑定新的车辆 -->
+<template>
+	<view class="">
+		<view>
+			<view class="item">
+				<view class="topTile">车辆类型</view>
+				<view class="content" @tap="chooseType">
+					<view v-text="type" class="carType" :class="{typeActive:typeNum}">
+					</view>
+					<image src="../../static/icon_combo_nor@2x.png" style="width: 20rpx;height: 12rpx;margin-top: 15rpx;margin-right: 18rpx;"></image>
+				</view>
+			</view>
+			<view class="item">
+				<view class="topTile">车牌号</view>
+				<view class="content">
+					<view class="carNum">
+						<input type="text" v-model="carNum"  placeholder="请输入车牌号" placeholder-class="holder" style="width: 100%;height: 100%;"/>
+					</view>
+					<!-- <image src="../../static/icon_combo_nor@2x.png" style="width: 20rpx;height: 12rpx;margin-top: 15rpx;margin-right: 18rpx;"></image> -->
+				</view>
+			</view>
+		</view>
+		<!-- 车辆类型 -->
+		 <lb-picker ref="type" :list="typeData" @confirm="confirm">
+		 	<!-- <view slot="cancle-text">取消</view>
+		 	  <view slot="confirm-text" >确定</view> -->
+		 </lb-picker>
+		 <!-- 保存 -->
+		 <view class="btn" :class="{active:type && carNum}">保存</view>
+	</view>
+</template>
+
+<script>
+	import LbPicker from '@/components/lb-picker'
+	export default{
+		data(){
+			return{
+				type:'请选择车辆类型',//车辆类型
+				typeNum:'',
+				carNum:'',//车牌号
+				typeData:[{label:'机动车',value:1,child:[]},{label:'电动车',value:2,child:[]},],
+			}
+		},
+		methods:{
+			// 车辆类型选择确定
+			confirm(data){
+				this.type=data.item.label
+				this.typeNum=data.item.value
+			},
+			// 选择车辆类型
+			chooseType(){
+				this.$refs.type.show()
+			
+			},
+		},
+		components: {
+			LbPicker
+		},
+	}
+</script>
+
+<style>
+	.btn{
+		width:702rpx;
+		height:90rpx;
+		background:rgba(163,197,237,1);
+		opacity:1;
+		border-radius:18rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		line-height:90rpx;
+		color:rgba(255,255,255,1);
+		text-align: center;
+		position: fixed;
+		bottom: 56rpx;
+		left:26rpx ;
+	}
+	.active{
+		background:rgba(41,138,253,1);
+	}
+	.item{
+		width: 662rpx;
+		height: 135rpx;
+		border-bottom:2rpx solid rgba(247,247,247,1);
+		margin: 0 auto;
+	}
+	.carType{
+		width:202rpx;
+		height:40rpx;
+		font-size:28rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(153,153,153,1);
+	}
+	.carNum{
+		width:202rpx;
+		height:40rpx;
+		font-size:28rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(51,51,51,1);
+	}
+	.content{
+		width: 100%;
+		height: 40rpx;
+		display: flex;
+		justify-content: space-between;
+		margin-top: 28rpx;
+	}
+	.topTile{
+		width:132rpx;
+		height:44rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		color:rgba(51,51,51,1);
+		margin-top: 32rpx;
+	}
+	.holder{
+		color:rgba(153,153,153,1);
+	}
+	.typeActive{
+		color:rgba(51,51,51,1);
+	}
+</style>

pages/mine/addFamily.vue

@@ -0,0 +1,151 @@
+<!-- 添加家人信息 -->
+<template>
+	<view class="">
+		<view class="item">
+			<view class="title">姓名</view>
+			<view class="content">
+				<input type="text" v-model="name" placeholder="请输入姓名" placeholder-class="holder" />
+			</view>
+		</view>
+		<view class="item">
+			<view class="title">手机号 </view>
+			<view class="content">
+				<input type="number" v-model="phone" placeholder="请输入手机号" placeholder-class="holder" />
+			</view>
+		</view>
+		<view class="item">
+			<view class="title">身份证号</view>
+			<view class="content">
+				<input type="number" v-model="idNumber" placeholder="请输入身份证号" placeholder-class="holder" />
+			</view>
+		</view>
+		<view class="item" style="height: 414rpx;">
+			<view class="title">人脸照片 </view>
+			<view class="content" style="height: 300rpx;" >
+				<image src="../../static/circle_image@2x.png" style="width: 330rpx;height: 300rpx;" @tap="chooseImg" v-show="isShow"></image>
+				<image :src="photo" style="width: 330rpx;height: 300rpx;" v-show="isImg"></image>
+			</view>
+		</view>
+		<!-- <view class="tip">注：带*为必填项</view> -->
+		<view class="btn" :class="{active: name && phone && idNumber && photo}" @tap="save">保存</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				name:'',//姓名
+				phone:'',//手机号
+				idNumber:'',//身份证号
+				photo:'',//人脸照片
+				isShow:true,//判断添加照片是否显示
+				isImg:false
+			}
+		},
+		methods:{
+			// 选择照片
+			chooseImg(){
+				uni.chooseImage({
+					count: 1, //默认9
+					    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					    sourceType: ['album'], //从相册选择
+					    success: (res)=> {
+					      this.photo=res.tempFiles[0].path
+						  this.isShow=false
+						  this.isImg=true
+					    }
+				})
+			},
+			//提交表单数据
+			save(){
+				if(!this.name || !this.phone || !this.idNumber || !this.photo){
+					return
+				}else{
+					let idNumerReg = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/; //身份证正则
+					let phoneReg = /^1[3|4|5|7|8][0-9]{9}$/; //手机号正则校验
+					if(!phoneReg.test(this.phone)){
+						uni.showToast({
+							'icon':'none',
+							title:"手机号码格式不正确"
+						})
+					}else if(!idNumerReg.test(this.idNumber)){
+						uni.showToast({
+							'icon':'none',
+							title:"身份证号码格式不正确"
+						})
+					}else{
+						uni.showToast({
+							'icon':'none',
+							title:"保存成功"
+						})
+					}
+				}
+				
+			}
+		}
+	}
+</script>
+
+<style>
+	.btn{
+		width:702rpx;
+		height:90rpx;
+		background:rgba(163,197,237,1);
+		opacity:1;
+		border-radius:18rpx;
+		text-align: center;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		line-height:90rpx;
+		color:rgba(255,255,255,1);
+		margin: 0 auto;
+		margin-top:140rpx ;
+		
+	}
+	.tip{
+		width:186rpx;
+		height:34rpx;
+		font-size:24rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(231,0,30,1);
+		margin-left:44rpx;
+		margin-top: 20rpx;
+	}
+	.title{
+		width:100%;
+		height:44rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		line-height:44px;
+		color:rgba(51,51,51,1);
+		margin-top: 32rpx;
+		margin-bottom: 58rpx;
+		/* overflow: hidden; */
+	}
+	.content{
+		width: 100%;
+		height:40rpx;
+		font-size:28rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		line-height:40rpx;
+		color:rgba(51,51,51,1);
+		margin-left: 18rpx;
+	}
+	.item{
+		width: 662rpx;
+		height: 154rpx;
+		border-bottom: 2rpx solid rgba(247,247,247,1);;
+		margin: 0 auto;
+	}
+	.holder{
+		color:rgba(153,153,153,1);
+	}
+	.active{
+		background:rgba(41,138,253,1);
+	}
+</style>

pages/mine/family.vue

@@ -0,0 +1,105 @@
+<template>
+	<view class="">
+		<view class="item">
+			<view class="left">
+				<image src="../../static/care_family.png" style="width:140rpx;height:140rpx;border-radius: 20rpx;"></image>
+			</view>
+			<view class="right">
+				<view class="name">小宝</view>
+				<view class="phone">
+					<text>手机号 :</text><text style="margin-left:15rpx">15822222222</text>
+				</view>
+				<view class="idNumber">
+					<text>身份证号 :</text><text style="margin-left:15rpx">3713222000005050202</text>
+				</view>
+			</view>
+		</view>
+		<!-- 添加家人信息 -->
+		<view class="btn" @tap="addFamily">添加家人信息</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				
+			}
+		},
+		methods:{
+			// 添加家人信息
+			addFamily(){
+				uni.navigateTo({
+					url:"addFamily"
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	.btn{
+		width:702rpx;
+		height:90rpx;
+		background:rgba(41,138,253,1);
+		opacity:1;
+		border-radius:18rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		line-height:90rpx;
+		color:rgba(255,255,255,1);
+		text-align: center;
+		position: fixed;
+		left: 26rpx;
+		bottom: 56rpx;
+	}
+	.idNumber{
+		width: 100%;
+		height:34rpx ;
+		font-size:24rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		line-height:34rpx;
+		color:rgba(51,51,51,1);
+	}
+	.name{
+		width: 100%;
+		height:44rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		line-height:44px;
+		color:rgba(51,51,51,1);
+	}
+	.phone{
+		width: 100%;
+		height:34rpx ;
+		font-size:24rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		line-height:34rpx;
+		color:rgba(51,51,51,1);
+		margin-top: 28rpx;
+		margin-left: 26rpx;
+	}
+	.left{
+		width:140rpx;
+		height:140rpx;
+		border-radius:20rpx;
+		margin-top: 40rpx;
+	}
+	.right{
+		width:100%;
+		margin-left: 20rpx;
+		margin-top: 40rpx;
+	}
+		
+	.item{
+		width: 680rpx;
+		height: 220rpx;
+		border-bottom:2rpx solid rgba(247,247,247,1); ;
+		margin: 0 auto;
+		display: flex;
+	}
+</style>

pages/mine/message.vue

@@ -0,0 +1,126 @@
+<!-- 我的消息 -->
+<template>
+	<view class="">
+		<view class="item" v-for="(item,index) in data" :key="index">
+			<view class="top">
+				<view class="left" v-if="item.status==1">
+					<view class="icon">审核</view>
+					<view class="title">审核信息</view>
+				</view>
+				<view class="left" v-else-if="item.status==2">
+					<view class="icon" style="background:rgba(248,195,72,1);">报修</view>
+					<view class="title">报修信息</view>
+				</view>
+				<view class="left" v-else-if="item.status==3">
+					<view class="icon" style="background:rgba(96,139,233,1);">投诉</view>
+					<view class="title">投诉信息</view>
+				</view>
+				<view class="left" v-else>
+					<view class="icon" style="background:rgba(87,224,135,1);">访问</view>
+					<view class="title">访问信息</view>
+				</view>
+				<view class="right">{{item.date}}</view>
+			</view>
+			<view class="content" @tap="seeMore(index)">
+				<view class="info" :class="{active:item.show}">{{item.info}}</view>
+				<image src="../../static/icon_combo_nor@2x.png" style="width:29rpx;height: 15rpx;margin-left: 28rpx;margin-top: 15rpx;" v-show="!item.show" ></image>
+				<image src="../../static/icon_combo_set@2x.png" style="width:29rpx;height: 15rpx;margin-left: 28rpx;margin-top: 15rpx;" v-show="item.show"></image>
+			</view>
+		</view>
+		
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				isShow:true,//
+				status:4,
+				data:[{status:1,date:'07-21 10:24',info:'恭喜您！您在花园小区1单元101室的审核已经通过！安全现已接收到您提交的报修信息',show:false},{status:2,date:'07-21 10:24',show:false,info:'恭喜您！您在花园小区1单元101室的审核已经通过！安全现已接收到您提交的报修信息'},{status:3,date:'07-21 10:24',show:false,info:'恭喜您！您在花园小区1单元101室的审核已经通过！安全现已接收到您提交的报修信息'}]
+			}
+		},
+		methods:{
+			// 查看更多
+			seeMore(index){
+				this.data[index].show=!this.data[index].show
+			}
+		}
+	}
+</script>
+
+<style>
+	.content{
+		width: 100%;
+	display: flex;
+	margin-top:14rpx ;
+	padding-bottom: 40rpx;
+	}
+	.info{
+		width: 644rpx;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		font-size:26rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(102,102,102,1);
+	}
+	.title{
+		width:116rpx;
+		height:40rpx;
+		font-size:28rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(51,51,51,1);
+		margin-left: 10rpx;
+	}
+		
+	.icon{
+		width:56rpx;
+		height:28rpx;
+		background:rgba(84,162,255,1);
+		opacity:1;
+		border-radius:6rpx;
+		font-size:20rpx;
+		font-family:PingFang SC;
+		/* line-height:28rpx; */
+		text-align: center;
+		color:rgba(255,255,255,1);
+		margin-top: 7rpx;
+	}
+	.item{
+		width: 700rpx;
+		margin: 0 auto;
+		border-bottom:2px solid rgba(247,247,247,1) ;
+	}
+	.top{
+		width: 100%;
+		height: 40rpx;
+		display: flex;
+		justify-content: space-between;
+		padding-top: 40rpx;
+	}
+	.left{
+		width:184rpx ;
+		height: 40rpx;
+		display: flex;
+	}
+	.right{
+		width:166rpx ;
+		margin-top: 3rpx;
+		height: 36rpx;
+		font-size:26rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(153,153,153,1);
+		text-align: right;
+	}
+	.active{
+		width: 644rpx;
+		height: auto;
+		overflow: inherit;
+		text-overflow: inherit;
+		white-space: inherit;
+	}
+</style>

pages/mine/mine.vue

@@ -0,0 +1,230 @@
+<template>
+	<view>
+		<view class="topBox">
+			<image src="../../static/login_bgground@2x.png" style="width: 100%;height: 100%;"></image>
+			<view class="headPhoto" @tap="seeMyInfo">
+				<image src="../../static/login_bgground@2x.png" style="width: 122rpx;height: 122rpx;border-radius: 50%;margin:18rpx;"></image>
+			</view>
+			<view class="name">
+				星河
+			</view>
+			<view class="phone">15825252525</view>
+			<!-- 车辆数 -->
+			<view class="carBox" @tap="seeMyCar">
+				<view class="leftCar">
+					<view class="num">10</view>
+					<view class="text">轿车辆数</view>
+				</view>
+				<view class="rightCar">
+					<view class="num" style="width: 134rpx;">1</view>
+					<view class="text" style="width: 134rpx;">电动车辆数</view>
+				</view>
+			</view>
+		</view>
+		<!-- 菜单栏 -->
+		<view class="main">
+			<view class="item" @tap="seeMyhouse">
+				<view class="leftIcon">
+					<image src="../../static/my_icon_house@2x.png" style="width: 38rpx;height: 40rpx;"></image>
+				</view>
+				<view style="display: flex;justify-content: space-between;margin-left: 32rpx;width: 100%;margin-top: 48rpx;">
+					<view class="title">我的房屋</view>
+						<image src="../../static/icon_more@2x.png" style="width:15rpx ;height: 28rpx;margin-top: 8rpx;"></image>
+				</view>
+			</view>
+			<view class="item" @tap="visitorInfo">
+				<view class="leftIcon">
+					<image src="../../static/my_icon_information@2x.png" style="width:40rpx;height:35rpx;margin-top: 5rpx;"></image>
+				</view>
+				<view style="display: flex;justify-content: space-between;margin-left: 32rpx;width: 100%;margin-top: 48rpx;">
+					<view class="title">访客信息</view>
+						<image src="../../static/icon_more@2x.png" style="width:15rpx ;height: 28rpx;margin-top: 8rpx;"></image>
+				</view>
+			</view>
+			<view class="item" @tap="changeFace">
+				<view class="leftIcon">
+					<image src="../../static/my_icon_formwork@2x.png" style="width: 38rpx;height: 40rpx;"></image>
+				</view>
+				<view style="display: flex;justify-content: space-between;margin-left: 32rpx;width: 100%;margin-top: 48rpx;">
+					<view class="title">人脸模板</view>
+						<image src="../../static/icon_more@2x.png" style="width:15rpx ;height: 28rpx;margin-top: 8rpx;"></image>
+				</view>
+			</view>
+			<view class="item" @tap="seeMyFamily">
+				<view class="leftIcon">
+					<image src="../../static/my_icon_family@2x.png" style="width: 38rpx;height: 40rpx;"></image>
+				</view>
+				<view style="display: flex;justify-content: space-between;margin-left: 32rpx;width: 100%;margin-top: 48rpx;">
+					<view class="title">我的家人</view>
+						<image src="../../static/icon_more@2x.png" style="width:15rpx ;height: 28rpx;margin-top: 8rpx;"></image>
+				</view>
+			</view>
+			<view class="item" @tap="seeMyMessage">
+				<view class="leftIcon">
+					<image src="../../static/myMessage.png" style="width: 38rpx;height: 40rpx;"></image>
+				</view>
+				<view style="display: flex;justify-content: space-between;margin-left: 32rpx;width: 100%;margin-top: 48rpx;">
+					<view class="title">我的消息</view>
+						<image src="../../static/icon_more@2x.png" style="width:15rpx ;height: 28rpx;margin-top: 8rpx;"></image>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				
+			}
+		},
+		methods:{
+			// 访客信息
+			visitorInfo(){
+				uni.navigateTo({
+					url:"../visitor/historyList"
+				})
+			},
+			// 查看个人资料
+			seeMyInfo(){
+				uni.navigateTo({
+					url:"myInfo"
+				})
+			},
+			// 查看我的汽车
+			seeMyCar(){
+				uni.navigateTo({
+					url:"myCar"
+				})
+			},
+			// 查看我的房屋
+			seeMyhouse(){
+				uni.navigateTo({
+					url:"myHouse"
+				})
+			},
+			//更换人脸模板
+			changeFace(){
+				uni.navigateTo({
+					url:"./face"
+				})
+			},
+			// 查看我的家人
+			seeMyFamily(){
+				uni.navigateTo({
+					url:"./family"
+				})
+			},
+			// 查看我的消息
+			seeMyMessage(){
+				uni.navigateTo({
+					url:"./message"
+				})
+			}
+				
+		}
+	}
+</script>
+
+<style>
+	.leftIcon{
+		width:38rpx;
+		height:40rpx;
+		margin-top: 48rpx;
+	}
+		
+	.item{
+		width: 650rpx;
+		height: 140rpx;
+		margin: 0 auto;
+		border-bottom:2rpx solid rgba(245,245,245,1);
+		display: flex;
+		
+	}
+	.main{
+		width: 100%;
+		margin-top: 50rpx;
+		overflow: hidden;
+	}
+	.carBox{
+		width:650rpx;
+		height:170rpx;
+		background:rgba(255,255,255,1);
+		box-shadow:0rpx 6rpx 20rpx rgba(0,0,0,0.12);
+		opacity:1;
+		border-radius:86rpx;
+		position: absolute;
+		left: 50rpx;
+		bottom: -54rpx;
+		display: flex;
+	}
+	.leftCar{
+		width: 218rpx;
+		height: 90rpx;
+		margin-left: 108rpx;
+		border-right:2px solid rgba(247,247,247,1); ;
+		margin-top: 40rpx;
+	}
+	.rightCar{
+		height: 90rpx;
+			margin-top: 40rpx;
+			margin-left: 96rpx;
+	}
+	.num{
+		width: 108rpx;
+		height:44rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		color:rgba(51,51,51,1);
+		text-align: center;
+	line-height: 44rpx;
+	}
+	.text{
+		height:36rpx;
+		font-size:26rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(51,51,51,1);
+	}
+	.name{
+		height: 50rpx;
+		font-size:36rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(255,255,255,1);
+		position: absolute;
+		bottom: 216rpx;
+		left: 220rpx;
+		
+	}
+	.phone{
+		width:168rpx;
+		height:34rpx;
+		font-size:24rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(255,255,255,1);
+		position: absolute;
+		bottom: 176rpx;
+		left: 220rpx;
+	}
+		
+	.topBox{
+		width: 100%;
+		height: 430rpx;
+		position: relative;
+	}
+	.headPhoto{
+		width:160rpx;
+		height:160rpx;
+		border:2rpx solid rgba(255,255,255,1);
+		border-radius:50%;
+		opacity:1;
+		position: absolute;
+		left: 50rpx;
+		bottom: 142rpx;
+		background:#000000;
+	}
+</style>

pages/mine/myCar.vue

@@ -0,0 +1,174 @@
+<!-- 我的汽车 -->
+<template>
+	<view class="">
+		<view class="item" v-for="(item,index) in data" :key="index">
+			<view class="content">
+				<view class="left">
+					<image src="../../static/car_icon_automobile@2x.png" style="width: 50rpx;height: 40rpx;" v-if="item.status==1"></image>
+					<image src="../../static/car_icon_%20bicycle@2x.png" style="width: 50rpx;height: 40rpx;" v-if="item.status==2"></image>
+					<view class="num">{{item.number}}</view>
+				</view>
+				<view class="right" @tap="seeMore(index)">
+					<view class="tong">通行记录</view>
+					<image src="../../static/icon_combo_nor@2x.png" style="width: 20rpx;height: 12rpx;margin-top: 15rpx;" v-show="!item.show"></image>
+					<image src="../../static/icon_combo_set@2x.png" style="width: 20rpx;height: 12rpx;margin-top: 15rpx;" v-show="item.show"></image>
+				</view>
+			</view>
+			<view class="more" v-show="item.show">
+				<view class="list" v-for="(list,index) in item.moreInfo" :key="index">
+					<view class="listText">
+						{{list.title}}
+					</view>
+					<view class="date">
+						{{list.date}}
+					</view>
+				</view>
+			</view>
+		</view>
+		<!-- 绑定新的车辆 -->
+		<view class="btn" @tap="addCar">
+			绑定新的车辆
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+				isShow: false,
+				data: [{
+					status: 1,
+					number: "鲁Q 6666",
+					show: false,
+					moreInfo: [{
+						title: '通过花园小区东门',
+						date: '2020-01-02 12:25'
+					},
+					 {
+					 	title: '通过花园小区东门',
+					 	date: '2020-01-02 12:25'
+					 },]
+				}, {
+					status: 2,
+					show: false,
+					number: "鲁Q 888",
+					moreInfo: [{
+						title: '通过花园小区东门',
+						date: '2020-01-02 12:25'
+					}, ]
+				}, ]
+			}
+		},
+		methods: {
+			// 查看或隐藏记录
+			seeMore(index) {
+				this.data[index].show=!this.data[index].show
+			},
+			// 绑定新的车辆
+			addCar() {
+				uni.navigateTo({
+					url: "addCar"
+				})
+			}
+		}
+	}
+</script>
+
+<style>
+	.btn {
+		width: 702rpx;
+		height: 90rpx;
+		background: rgba(41, 138, 253, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 90rpx;
+		position: fixed;
+		bottom: 56rpx;
+		left: 26rpx;
+	}
+
+	.list {
+		width: 100%;
+		height: 36rpx;
+		display: flex;
+		justify-content: space-between;
+
+	}
+
+	.listText {
+		height: 100%;
+		font-size: 26rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(51, 51, 51, 1);
+	}
+
+	.date {
+		width: 240rpx;
+		height: 34rpx;
+		font-size: 24rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(153, 153, 153, 1);
+		text-align: right;
+	}
+
+	.right {
+		width: 160rpx;
+		height: 40rpx;
+		display: flex;
+	}
+
+	.tong {
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(153, 153, 153, 1);
+		margin-right: 25rpx;
+	}
+
+	.left {
+		width: 210rpx;
+		display: flex;
+	}
+
+	.num {
+		width: 160rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		line-height: 40rpx;
+		color: rgba(41, 138, 253, 1);
+		margin-left: 14rpx;
+	}
+
+	.item {
+		width: 702rpx;
+		margin: 0 auto;
+		margin-top: 40rpx;
+		background: rgba(249, 252, 255, 1);
+		opacity: 1;
+
+	}
+
+	.content {
+		width: 620rpx;
+		margin: 0 auto;
+		padding-top: 26rpx;
+		padding-bottom: 26rpx;
+		display: flex;
+		justify-content: space-between;
+	}
+
+	.more {
+		width: 620rpx;
+		margin: 0 auto;
+	}
+</style>

pages/mine/myHouse.vue

@@ -0,0 +1,106 @@
+<!-- 我的房屋 -->
+<template>
+	<view class="">
+		<view class="item">
+			<view class="content">
+				<view class="city">
+					<view style="height: 100%;display: flex;">
+						<image src="../../static/house_icon_location@2x.png" style="width: 40rpx;height:40rpx;margin-right: 18rpx;"></image>
+						<view class="text">山东 临沂</view>
+					</view>
+					<view class="delete">
+						删除
+					</view>
+				</view>
+				<view class="address">
+					<image src="../../static/house_icon_house@2x.png" style="width: 40rpx;height:40rpx;margin-right: 18rpx;" ></image>
+					<view class="text">后花园小区 11号楼 02单元 801</view>
+				</view>
+			</view>
+		</view>
+		<!-- 添加房屋信息 -->
+		<view class="btn">添加房屋信息</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				
+			}
+		}
+	}
+</script>
+
+<style>
+	.btn{
+		width:702rpx;
+		height:90rpx;
+		background:rgba(41,138,253,1);
+		opacity:1;
+		border-radius:18rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		line-height:90rpx;
+		color:rgba(255,255,255,1);
+		text-align: center;
+		position: absolute;
+		bottom: 56rpx;
+		left: 26rpx;
+	}
+	.address{
+		height: 40rpx;
+		margin-top:42rpx ;
+		margin-bottom: 20rpx;
+		display: flex;
+	}
+	
+	.delete{
+		width:44rpx;
+		height:32rpx;
+		font-size:22rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(41,138,253,1);
+	}
+	.item{
+		width:702rpx;
+		height:164rpx;
+		background:rgba(249,252,255,1);
+		opacity:1;
+		margin: 0 auto;
+		margin-top: 40rpx;
+		overflow: hidden;
+	}
+	.content{
+		width: 622rpx;
+		margin: 0 auto;
+	}
+	.city{
+		width: 100%;
+		height: 40rpx;
+		display: flex;
+		justify-content: space-between;
+		margin-top: 26rpx;
+	}
+	.text{
+		width:136rpx;
+		height:40rpx;
+		font-size:28rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		line-height:40rpx;
+		color:rgba(41,138,253,1);
+	}
+	.address .text{
+		width: 400rpx;
+		height:36rpx;
+		font-size:26rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(51,51,51,1);
+	}
+	
+</style>

pages/mine/myInfo.vue

@@ -0,0 +1,127 @@
+ <!-- 个人资料 -->
+<template>
+	<view class="">
+		<view style="width: 100%;border-bottom:2rpx solid rgba(247,247,247,1);height:88rpx;margin-top: 30rpx;overflow: hidden;">
+			<view class="item" @tap="changeHeadPhoto">
+				 <view class="left">头像</view>
+				 <view class="right">
+					 <image :src="headImg" style="width: 72rpx;height: 72rpx;border-radius: 50%;margin-right: 20rpx;"></image>
+					 <image src="../../static/icon_more@2x.png" style="width: 15rpx;height: 23rpx;margin-bottom:30rpx ;"></image>
+				 </view>
+			</view>
+		</view>
+		<!-- 昵称 -->
+		<view style="width: 100%;border-bottom:2rpx solid rgba(247,247,247,1);height:88rpx;margin-top: 30rpx;overflow: hidden;">
+			<view class="item">
+				 <view class="left">昵称</view>
+				 <view class="right" style="width:500rpx;position: relative;">
+					  <input type="text"  @bulr="changeName" v-model="userName" style="max-width: 400rpx;height: 40rpx;text-align: right;position: absolute;right: 37rpx;top: 10rpx;color:rgba(153,153,153,1);">
+					 <image src="../../static/icon_more@2x.png" style="width: 15rpx;height: 23rpx;position: absolute;right: 0;bottom:35rpx ;"></image>
+				 </view>
+			</view>
+		</view>
+		<!-- 手机号 -->
+		<view style="width: 100%;border-bottom:2rpx solid rgba(247,247,247,1);height:88rpx;margin-top: 30rpx;overflow: hidden;">
+			<view class="item">
+				 <view class="left" style="width: 98rpx;">手机号</view>
+				 <view class="right" style="width:500rpx;position: relative;">
+					  <input type="number" @blur="changePhone" v-model="phone" style="max-width: 400rpx;height: 40rpx;text-align: right;position: absolute;right: 37rpx;top: 10rpx;color:rgba(153,153,153,1);">
+					 <image src="../../static/icon_more@2x.png" style="width: 15rpx;height: 23rpx;position: absolute;right: 0;bottom:35rpx ;"></image>
+				 </view>
+			</view>
+		</view>
+		<!-- 微信 -->
+		<view style="width: 100%;border-bottom:2rpx solid rgba(247,247,247,1);height:88rpx;margin-top: 30rpx;overflow: hidden;">
+			<view class="item" @tap="wxLogin">
+				 <view class="left" style="width: 98rpx;">微信</view>
+				 <view class="right" style="width:500rpx;position: relative;">
+					  <text  style="max-width: 400rpx;height: 40rpx;text-align: right;position: absolute;right: 37rpx;top: 10rpx;color:rgba(153,153,153,1);">已绑定</text>
+					 <image src="../../static/icon_more@2x.png" style="width: 15rpx;height: 23rpx;position: absolute;right: 0;bottom:35rpx ;"></image>
+				 </view>
+			</view>
+		</view>
+		<!-- 人脸模板 -->
+		<view style="width: 100%;border-bottom:2rpx solid rgba(247,247,247,1);height:300rpx;margin-top: 30rpx;overflow: hidden;">
+			<view class="item" style="height: 100%;">
+				 <view class="left" style="width: 132rpx;margin-top: 128rpx;">人脸模板</view>
+				 <view class="right" style="width:500rpx;position: relative;">
+					  <image src="../../static/care_family.png" style="width: 256rpx;height:256rpx;position: absolute;right: 37rpx;color:rgba(153,153,153,1);"></image>
+					 <image src="../../static/icon_more@2x.png" style="width: 15rpx;height: 23rpx;position: absolute;right: 0;bottom:142rpx ;"></image>
+				 </view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				userName:'呵呵',//昵称
+				phone:15855391987,//手机号
+				headImg:'',//头像
+			}
+		},
+		methods:{
+			// 修改头像
+			changeHeadPhoto(){
+				uni.chooseImage({
+				    count: 1, //默认9
+				    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+				    sourceType: ['album'], //从相册选择
+				    success: (res)=> {
+				       this.headImg=res.tempFiles[0].path
+				    }
+				});
+			},
+			//微信授权登录
+			wxLogin(){
+				uni.navigateTo({
+					url:"../login/authorization"
+				})
+			},
+			// 修改昵称
+			changeName(){
+				
+			},
+			//修改手机号
+			changePhone(){
+					let phoneReg = /^1[3|4|5|7|8][0-9]{9}$/; //手机号正则校验
+					if(!phoneReg.test(this.phone)){
+						uni.showToast({
+							'icon':'none',
+							title:"手机号码格式不正确"
+						})
+					}else{
+						
+					}
+			}
+			
+		}
+	}
+</script>
+
+<style>
+	.item{
+		width:698rpx;
+		height: 88rpx;
+		margin: 0 auto;
+		display: flex;
+		justify-content: space-between;
+		
+	}
+	.left{
+		width:64rpx;
+		height:44rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(51,51,51,1);
+		margin-top: 22rpx;
+		opacity:1;
+	}
+	.right{
+		width:110rpx;
+		margin-top: 10rpx;
+	}
+</style>

pages/onlineRpair/evalueSuccess.vue

@@ -0,0 +1,40 @@
+<template>
+	<view class="">
+		<view  class="imgBox">
+			<image src="../../static/null_image_success@2x.png" style="width: 100%;height: 100%;"></image>
+		</view>
+		<view class="text">
+			恭喜您~ 评价完成~
+		</view>
+	</view>
+</template>
+
+<script>
+	export default{
+		data(){
+			return{
+				
+			}
+		}
+	}
+</script>
+
+<style>
+	.imgBox{
+		width: 520rpx;
+		height: 520rpx;
+		margin: 0 auto;
+		margin-top: 262rpx;
+		
+	}
+	.text{
+		width:310rpx;
+		height:50rpx;
+		font-size:36rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(36,36,36,1);
+		margin-top: 47rpx;
+		margin: 0 auto;
+	}
+</style>

pages/onlineRpair/index.vue

@@ -0,0 +1,291 @@
+<template>
+	<view style="margin-top: 40rpx;">
+		<view class="item">
+			<view class="left">
+				<image src="../../static/complain_icon_complain@2x.png" style="width: 100%;height: 100%;"></image>
+			</view>
+			<view class="right">
+				<view style="width:100%;height:44rpx;display: flex;justify-content: space-between;">
+					<view class="name">明灯三千</view>
+					<view class="topBtn" v-if="false">已处理</view>
+					<view v-else class="topBtn" style="border:2rpx solid rgba(41,138,253,1);color:#298AFD;">未处理</view>
+				</view>
+				<view class="text">
+					水龙头坏了了了了
+				</view>
+				<view class="img">
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 180rpx;height: 180rpx;padding-right: 10rpx;margin-bottom: 10rpx;"></image>
+				</view>
+				<!-- 回复信息 -->
+				<view class="replay">
+					<view style="width: 100%;margin: 20rpx 0rpx 20rpx 20rpx;">
+						<view class="replayItem">
+							<view class="replayName"><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;">物业
+								</text><text style="color:rgba(51,51,51,1);">回复</text><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;margin-left: 5rpx;">肖战:</text></view>
+							<view class="replayContent">换了一个新的，已经修好啦~</view>
+						</view>
+						<view class="replayItem">
+							<view class="replayName"><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;">小赞
+								</text><text style="color:rgba(51,51,51,1);">回复</text><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;margin-left: 5rpx;">肖战:</text></view>
+							<view class="replayContent">换了一个新的，已经修好啦~</view>
+						</view>
+					</view>
+				</view>
+				<!-- 我要评论 -->
+				<view class="bottomBtn" @tap="myTalk">我的评价</view>
+				<view class="date">2020-01-21 12:31</view>
+			</view>
+		</view>
+		<view class="item">
+			<view class="left">
+				<image src="../../static/complain_icon_complain@2x.png" style="width: 100%;height: 100%;"></image>
+			</view>
+			<view class="right">
+				<view style="width:100%;height:44rpx;display: flex;justify-content: space-between;">
+					<view class="name">明灯三千</view>
+					<view class="topBtn">已处理</view>
+				</view>
+				<view class="text">
+					水龙头坏了了了了
+				</view>
+				<view class="img">
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 188rpx;height: 188rpx;"></image>
+				</view>
+				<!-- 回复信息 -->
+				<view class="replay">
+					<view style="width: 100%;margin: 20rpx 0rpx 20rpx 20rpx;">
+						<view class="replayItem">
+							<view class="replayName"><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;">物业
+								</text><text style="color:rgba(51,51,51,1);">回复</text><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;margin-left: 5rpx;">肖战:</text></view>
+							<view class="replayContent">换了一个新的，已经修好啦~</view>
+						</view>
+						<view class="replayItem">
+							<view class="replayName"><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;">小赞
+								</text><text style="color:rgba(51,51,51,1);">回复</text><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;margin-left: 5rpx;">肖战:</text></view>
+							<view class="replayContent">换了一个新的，已经修好啦~</view>
+						</view>
+					</view>
+				</view>
+				<!-- 我要评论 -->
+				<view class="bottomBtn">我要评论</view>
+				<view class="date">2020-01-21 12:31</view>
+			</view>
+		</view>
+		<view class="item">
+			<view class="left">
+				<image src="../../static/complain_icon_complain@2x.png" style="width: 100%;height: 100%;"></image>
+			</view>
+			<view class="right">
+				<view style="width:100%;height:44rpx;display: flex;justify-content: space-between;">
+					<view class="name">明灯三千</view>
+					<view class="topBtn">已处理</view>
+				</view>
+				<view class="text">
+					水龙头坏了了了了
+				</view>
+				<view class="img">
+					<image src="../../static/opening_top_bgimage@2x.png" style="width: 188rpx;height: 188rpx;"></image>
+				</view>
+				<!-- 回复信息 -->
+				<view class="replay">
+					<view style="width: 100%;margin: 20rpx 0rpx 20rpx 20rpx;">
+						<view class="replayItem">
+							<view class="replayName"><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;">物业
+								</text><text style="color:rgba(51,51,51,1);">回复</text><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;margin-left: 5rpx;">肖战:</text></view>
+							<view class="replayContent">换了一个新的，已经修好啦~</view>
+						</view>
+						<view class="replayItem">
+							<view class="replayName"><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;">小赞
+								</text><text style="color:rgba(51,51,51,1);">回复</text><text style="font-size: 28rpx;color: #333333;font-family:PingFang SC;font-weight:bold;margin-left: 5rpx;">肖战:</text></view>
+							<view class="replayContent">换了一个新的，已经修好啦~</view>
+						</view>
+					</view>
+				</view>
+				<!-- 我要评论 -->
+				<view class="bottomBtn" @tap="talk">我要评论</view>
+				<view class="date">2020-01-21 12:31</view>
+			</view>
+		</view>
+		<!-- 底部按钮 -->
+		<view class="btnBox" @tap="myRepairs">
+			我要报修
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {}
+		},
+		methods: {
+			// 我的评价
+			myTalk() {
+				uni.navigateTo({
+					url: "./repairsEvaluate"
+				})
+			},
+			// 我要保修
+			myRepairs() {
+				uni.navigateTo({
+					url: "./wantRepair"
+				})
+			}
+		}
+	}
+</script>
+
+<style scoped>
+	.leftBtn {
+		width: 340rpx;
+		height: 90rpx;
+		background: rgba(102, 193, 143, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 90rpx;
+	}
+
+	.rightBtn {
+		width: 340rpx;
+		height: 90rpx;
+		background: rgba(41, 138, 253, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 90rpx;
+	}
+
+	.btnBox {
+		width: 702rpx;
+		height: 90rpx;
+		position: fixed;
+		bottom: 56rpx;
+		left: 24rpx;
+		background: rgba(41, 138, 253, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 90rpx;
+	}
+
+	.date {
+		width: 230rpx;
+		height: 34rpx;
+		font-size: 24rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(204, 204, 204, 1);
+		margin-top: 10rpx;
+		margin-left: 356rpx;
+		text-align: right;
+		margin-bottom: 30rpx;
+	}
+
+	.bottomBtn {
+		width: 140rpx;
+		height: 42rpx;
+		background: rgba(255, 255, 255, 1);
+		border: 2rpx solid rgba(41, 138, 253, 1);
+		opacity: 1;
+		border-radius: 22rpx;
+		font-size: 20rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		line-height: 42rpx;
+		color: rgba(41, 138, 253, 1);
+		text-align: center;
+		margin-top: 40rpx;
+		margin-left: 446rpx;
+	}
+
+	.replayItem {
+		margin-top: 10rpx;
+	}
+
+	.replayContent {
+		font-size: 24rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(51, 51, 51, 1);
+		margin-top: 4rpx;
+	}
+
+	.replay {
+		width: 586rpx;
+		margin-top: 20rpx;
+		background: rgba(247, 247, 247, 1);
+		opacity: 1;
+		border-radius: 8rpx;
+		overflow: hidden;
+	}
+
+	.text {
+		width: 100%;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(51, 51, 51, 1);
+		margin-top: 30rpx;
+	}
+
+	.img {
+		width: 100%;
+		margin-top: 10rpx;
+		display: flex;
+		flex-wrap: wrap;
+	}
+
+	.name {
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+
+	}
+
+	.topBtn {
+		width: 120rpx;
+		height: 42rpx;
+		background: rgba(255, 255, 255, 1);
+		border: 2rpx solid rgba(204, 204, 204, 1);
+		opacity: 1;
+		border-radius: 22rpx;
+		font-size: 20rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(204, 204, 204, 1);
+		text-align: center;
+		line-height: 42rpx;
+	}
+
+	.item {
+		width: 702rpx;
+		margin: 0 auto;
+		border-bottom: 2rpx solid rgba(247, 247, 247, 1);
+		display: flex;
+		margin-top: 40rpx;
+	}
+
+	.left {
+		width: 86rpx;
+		height: 86rpx;
+	}
+
+	.right {
+		width: 586rpx;
+		margin-left: 30rpx;
+	}
+</style>

pages/onlineRpair/repairsEvaluate.vue

@@ -0,0 +1,229 @@
+<!-- 报修评价 -->
+<template>
+	<view class="pageBg">
+		<view class="content">
+			<view class="topBack" :style="{marginTop:phoneHeight + 'px'}">
+				<image src="../../static/icon_back@2x(1).png" style="width:48rpx ;height: 48rpx;margin-left: 36rpx;margin-top: 18rpx;"
+				 @tap="back"></image>
+			</view>
+			<view class="topImg">
+				<image src="../../static/guarantee_icon_guarantee@2x.png" style="width: 100%;height: 100%;"></image>
+			</view>
+			<view class="topTitle">
+				报修评价
+			</view>
+			<view class="main">
+				<image src="../../static/appraise_bgimage@2x.png" style="width: 100%;height: 100%;"></image>
+				<image src="../../static/appraise_icon_appraise@2x.png" class="mainImg"></image>
+				<view class="fa">发表评价</view>
+				<view class="star">
+					
+					<uni-rate :value="starNum" style="margin-top: 10rpx;margin-left: 80rpx;" @change="changeRate()"></uni-rate>
+				</view>
+				<image src="../../static/guarantee_icon_content@2x.png" class="contentImg"></image>
+				<view class="contentTitle">
+					评价内容
+				</view>
+				<view class="textContent">
+					<textarea placeholder="请填写评价" style="width: 100%;height: 100%;" v-model="textRea"></textarea>
+				</view>
+				<!-- 图片盒字 -->
+				<view style="width:646rpx;height: 114rpx;position: absolute;left: 24rpx;bottom: 40rpx;display: flex;">
+					<!-- <view style="height: 114rpx;margin-right: 10rpx;display: flex;justify-content: space-between;" v-show="imgData" > -->
+						<image style="width: 114rpx;height: 114rpx;margin-right: 10rpx;" :src="item" v-for="(item,index) in imgData" :key="index"></image>
+						<image src="../../static/circle_image@2x.png" style="width: 114rpx;height: 114rpx;" @tap="uploadImg(item)"></image>
+					<!-- </view> -->
+					
+				</view>
+			</view>
+		</view>
+		<view class="submit" :class="{active:starNum && textRea}" @tap="submit">提交</view>
+	</view>
+</template>
+
+<script>
+	import uniRate from '@/components/uni-rate/uni-rate.vue'
+	export default {
+		data() {
+			return {
+				textRea:'',//评价内容
+				starNum:0,//星星数量
+				phoneHeight: 0, //手机状态栏的高度
+				isShow: false,
+				imgData: []
+			}
+		},
+		 components: {uniRate},
+		created() {
+			// 获取状态栏的高度
+			this.phoneHeight = uni.getSystemInfoSync().statusBarHeight
+		},
+		methods: {
+			// 选择评分
+		changeRate(e){
+			this.starNum=e.value
+		},
+			// 图片上传
+			uploadImg(item) {
+				if(this.imgData.length){
+					
+				}
+				let that = this
+				uni.chooseImage({
+					count: 3, //默认9
+					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['album'], //从相册选择
+					success:(res)=> {
+						this.imgData = res.tempFiles
+						res.tempFiles.forEach((item)=>{
+							this.imgData.push(item.path)
+						})
+					},
+					
+				});
+			},
+			// 提交
+			submit(){
+				
+			},
+			// 返回上一层
+			back(){
+				uni.navigateBack({
+					delta:1
+				})
+			}
+		},
+		
+	}
+</script>
+
+<style scoped>
+	.submit {
+		width: 702rpx;
+		height: 90rpx;
+		background: rgba(244, 244, 244, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(204, 204, 204, 1);
+		position: absolute;
+		bottom:56rpx;
+		left: 26rpx;
+		text-align: center;
+		line-height: 90rpx;
+	}
+
+	.textContent {
+		width: 646rpx;
+		height: 168rpx;
+		background: rgba(246, 250, 255, 1);
+		border: 2rpx solid rgba(197, 224, 255, 1);
+		opacity: 1;
+		border-radius: 6rpx;
+		position: absolute;
+		left: 24rpx;
+		bottom: 180rpx;
+	}
+
+	.contentImg {
+		width: 33rpx;
+		height: 40rpx;
+		position: absolute;
+		bottom: 460rpx;
+		left: 330rpx;
+	}
+
+	.contentTitle {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+		position: absolute;
+		bottom: 388rpx;
+		left: 290rpx;
+	}
+
+	.star {
+		width: 386rpx;
+		height: 49rpx;
+		display: flex;
+		justify-content: space-between;
+		position: absolute;
+		left: 156rpx;
+		top: 194rpx;
+
+	}
+
+	.starImg {
+		width: 51rpx;
+		height: 49rpx;
+	}
+
+	.fa {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+		position: absolute;
+		top: 114rpx;
+		left: 288rpx;
+	}
+
+	.mainImg {
+		width: 40rpx;
+		height: 46rpx;
+		position: absolute;
+		top: 40rpx;
+		left: 326rpx;
+	}
+
+	.main {
+		width: 692rpx;
+		height: 844rpx;
+		margin: 0 auto;
+		margin-top: 24rpx;
+		position: relative;
+	}
+
+	.topTitle {
+		width: 128rpx;
+		height: 44rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(255, 255, 255, 1);
+		margin: 0 auto;
+		margin-top: 26rpx;
+	}
+
+	.topImg {
+		width: 122rpx;
+		height: 122rpx;
+		margin: 0 auto;
+		margin-top: 4rpx;
+	}
+
+	.pageBg {
+		width: 100%;
+		height: 100vh;
+		background: linear-gradient(180deg, rgba(205, 227, 255, 1) 0%, rgba(133, 188, 255, 1) 100%);
+		opacity: 1;
+	}
+
+	.content {
+		width: 100%;
+		position: absolute;
+		top: 0;
+	}
+	.active{
+		color:rgba(255,255,255,1);
+		background:rgba(41,138,253,1);
+		opacity:1;
+	}
+</style>

pages/onlineRpair/wantRepair.vue

@@ -0,0 +1,229 @@
+
+<!-- 我要报修-->
+<template>
+	<view class="pageBg">
+		<view class="content">
+			<view class="topBack" :style="{marginTop:phoneHeight + 'px'}">
+				<image src="../../static/icon_back@2x(1).png" style="width:48rpx ;height: 48rpx;margin-left: 36rpx;margin-top: 18rpx;"
+				 @tap="back"></image>
+			</view>
+			<view class="topImg">
+				<image src="../../static/guarantee_icon_guarantee@2x.png" style="width: 100%;height: 100%;"></image>
+			</view>
+			<view class="topTitle">
+				我要保修
+			</view>
+			<view class="main">
+				<image src="../../static/appraise_bgimage@2x.png" style="width: 100%;height: 100%;"></image>
+				<image src="../../static/guarantee_icon_summary@2x.png" class="mainImg"></image>
+				<view class="fa">报修摘要</view>
+				<view class="star">
+					
+				   <textarea placeholder="请填写报修摘要" style="width: 100%;height: 100%;" v-model="digest"></textarea>
+				</view>
+				<image src="../../static/guarantee_icon_content@2x.png" class="contentImg"></image>
+				<view class="contentTitle">
+					报修内容
+				</view>
+				<view class="textContent">
+					<textarea placeholder="请填写报修内容" style="width: 100%;height: 100%;" v-model="textRea"></textarea>
+				</view>
+				<!-- 图片盒字 -->
+				<view style="width:646rpx;height: 114rpx;position: absolute;left: 24rpx;bottom: 40rpx;display: flex;">
+					<view style="height: 114rpx;margin-right: 10rpx;display: flex;justify-content: space-between;" v-show="imgData" >
+						<image style="width: 114rpx;height: 114rpx;margin-right: 10rpx;" :src="item.path" v-for="(item,index) in imgData" :key="index"></image>
+					</view>
+					<image src="../../static/circle_image@2x.png" style="width: 114rpx;height: 114rpx;" @tap="uploadImg(item)"></image>
+				</view>
+			</view>
+		</view>
+		<view class="submit" :class="{active:digest && textRea}" @tap="submit">提交</view>
+	</view>
+</template>
+
+<script>
+	
+	export default {
+		data() {
+			return {
+				digest:'',//报修摘要
+				textRea:'',//评价内容
+				starNum:0,//星星数量
+				phoneHeight: 0, //手机状态栏的高度
+				isShow: false,
+				imgData: []
+			}
+		},
+		 components: {},
+		created() {
+			// 获取状态栏的高度
+			this.phoneHeight = uni.getSystemInfoSync().statusBarHeight
+		},
+		methods: {
+			// 选择评分
+		changeRate(e){
+			this.starNum=e.value
+		},
+			// 图片上传
+			uploadImg(item) {
+				let that = this
+				uni.chooseImage({
+					count: 3, //默认9
+					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
+					sourceType: ['album'], //从相册选择
+					success:(res)=> {
+						console.log(res);
+						this.imgData = res.tempFiles
+					},
+					
+				});
+			},
+			// 提交
+			submit(){
+				console.log(this.textRea,this.imgData,this.starNum)
+			},
+			// 返回上一层
+			back(){
+				uni.navigateBack({
+					delta:1
+				})
+			}
+		},
+		
+	}
+</script>
+
+<style scoped>
+	.submit {
+		width: 702rpx;
+		height: 90rpx;
+		background: rgba(244, 244, 244, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(204, 204, 204, 1);
+		position: absolute;
+		bottom:56rpx;
+		left: 26rpx;
+		text-align: center;
+		line-height: 90rpx;
+	}
+
+	.textContent {
+		width: 646rpx;
+		height: 168rpx;
+		background: rgba(246, 250, 255, 1);
+		border: 2rpx solid rgba(197, 224, 255, 1);
+		opacity: 1;
+		border-radius: 6rpx;
+		position: absolute;
+		left: 24rpx;
+		bottom: 180rpx;
+	}
+
+	.contentImg {
+		width: 33rpx;
+		height: 40rpx;
+		position: absolute;
+		bottom: 460rpx;
+		left: 330rpx;
+	}
+
+	.contentTitle {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+		position: absolute;
+		bottom: 388rpx;
+		left: 290rpx;
+	}
+
+	.star {
+		width: 646rpx;
+		height: 80rpx;
+		display: flex;
+		justify-content: space-between;
+		position: absolute;
+		left: 24rpx;
+		top: 164rpx;
+		background:rgba(246,250,255,1);
+		border:2rpx solid rgba(197,224,255,1);
+		opacity:1;
+		border-radius:6rpx;
+
+	}
+
+	.starImg {
+		width: 51rpx;
+		height: 49rpx;
+	}
+
+	.fa {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		color: rgba(41, 138, 253, 1);
+		position: absolute;
+		top: 114rpx;
+		left: 288rpx;
+	}
+
+	.mainImg {
+		width: 40rpx;
+		height: 46rpx;
+		position: absolute;
+		top: 40rpx;
+		left: 326rpx;
+	}
+
+	.main {
+		width: 692rpx;
+		height: 844rpx;
+		margin: 0 auto;
+		margin-top: 24rpx;
+		position: relative;
+	}
+
+	.topTitle {
+		width: 128rpx;
+		height: 44rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		font-weight: 400;
+		color: rgba(255, 255, 255, 1);
+		margin: 0 auto;
+		margin-top: 26rpx;
+	}
+
+	.topImg {
+		width: 122rpx;
+		height: 122rpx;
+		margin: 0 auto;
+		margin-top: 4rpx;
+	}
+
+	.pageBg {
+		width: 100%;
+		height: 100vh;
+		background: linear-gradient(180deg, rgba(205, 227, 255, 1) 0%, rgba(133, 188, 255, 1) 100%);
+		opacity: 1;
+	}
+
+	.content {
+		width: 100%;
+		position: absolute;
+		top: 0;
+	}
+	.active{
+		color:rgba(255,255,255,1);
+		background:rgba(41,138,253,1);
+		opacity:1;
+	}
+</style>

pages/openDoor/openDoor.vue

@@ -0,0 +1,202 @@
+<!-- 一键开门 -->
+<template>
+	<view class="">
+		<image src="../../static/history_top_bgimage@2x.png" style="width: 100%;height: 278rpx;"></image>
+		<view class="main">
+			<view class="item">
+				<view class="leftIcon">
+					<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<view class="" style="position: absolute;left: 100rpx;">
+					<view class="name">花园小区</view>
+					<view class="dec">
+						1号楼 2单元 602
+					</view>
+				</view>
+				<view class="rightIcon">
+					<image src="../../static/open_icon_key@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			<view class="item">
+				<view class="leftIcon">
+					<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<view class="" style="position: absolute;left: 100rpx;">
+					<view class="name">花园小区</view>
+					<view class="dec">
+						1号楼 2单元 602
+					</view>
+				</view>
+				<view class="rightIcon">
+					<image src="../../static/open_icon_key@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			<view class="item">
+				<view class="leftIcon">
+					<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<view class="" style="position: absolute;left: 100rpx;">
+					<view class="name">花园小区</view>
+					<view class="dec">
+						1号楼 2单元 602
+					</view>
+				</view>
+				<view class="rightIcon">
+					<image src="../../static/open_icon_key@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			<view class="item">
+				<view class="leftIcon">
+					<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<view class="" style="position: absolute;left: 100rpx;">
+					<view class="name">花园小区</view>
+					<view class="dec">
+						1号楼 2单元 602
+					</view>
+				</view>
+				<view class="rightIcon">
+					<image src="../../static/open_icon_key@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			<view class="item">
+				<view class="leftIcon">
+					<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<view class="" style="position: absolute;left: 100rpx;">
+					<view class="name">花园小区</view>
+					<view class="dec">
+						1号楼 2单元 602
+					</view>
+				</view>
+				<view class="rightIcon">
+					<image src="../../static/open_icon_key@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			<view class="item">
+				<view class="leftIcon">
+					<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<view class="" style="position: absolute;left: 100rpx;">
+					<view class="name">花园小区</view>
+					<view class="dec">
+						1号楼 2单元 602
+					</view>
+				</view>
+				<view class="rightIcon">
+					<image src="../../static/open_icon_key@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			<view class="item">
+				<view class="leftIcon">
+					<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<view class="" style="position: absolute;left: 100rpx;">
+					<view class="name">花园小区</view>
+					<view class="dec">
+						1号楼 2单元 602
+					</view>
+				</view>
+				<view class="rightIcon">
+					<image src="../../static/open_icon_key@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			<view class="item">
+				<view class="leftIcon">
+					<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+				<view class="" style="position: absolute;left: 100rpx;">
+					<view class="name">花园小区</view>
+					<view class="dec">
+						1号楼 2单元 602
+					</view>
+				</view>
+				<view class="rightIcon">
+					<image src="../../static/open_icon_key@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+		</view>
+		<!-- 解锁记录按钮 -->
+		<button class="btn" @tap="seeList">解锁记录</button>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+	methods:{
+		// 查看解锁记录
+		 seeList(){
+			 uni.navigateTo({
+			 	url:"./openDoorList"
+			 })
+		 }
+	}
+	}
+</script>
+
+<style scoped>
+	.btn{
+		width:702rpx;
+		height:90rpx;
+		background:rgba(41,138,253,1);
+		opacity:1;
+		border-radius:18rpx;
+		position: fixed;
+		bottom: 56rpx;
+		left: 24rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		color:rgba(255,255,255,1);
+	}
+	.dec{
+		width:244rpx;
+		height:40rpx;
+		font-size:28rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(51,51,51,1);
+		margin-top: 12rpx;
+	}
+	.name{
+		width:132rpx;
+		height:44rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		color:rgba(41,138,253,1);
+		margin-top: 38rpx;
+	}
+	.item{
+		width: 702rpx;
+		height: 170rpx;
+		border-bottom:2px solid rgba(247,247,247,1); ;
+		margin: 0 auto;
+		display: flex;
+		position: relative;
+	}
+	.leftIcon{
+		width: 60rpx;
+		height: 60rpx;
+		position: absolute;
+		left: 24rpx;
+		bottom: 60rpx;
+	}
+	.rightIcon{
+		width: 80rpx;
+		height: 80rpx;
+		position: absolute;
+		right: 24rpx;
+		bottom: 44rpx;
+	}
+	.main{
+		width: 100%;
+		position: absolute;
+		top: 0rpx;
+	}
+</style>

pages/openDoor/openDoorList.vue

@@ -0,0 +1,173 @@
+<!-- 解锁记录 -->
+<!-- 一键开门 -->
+<template>
+	<view class="">
+		<image src="../../static/history_top_bgimage@2x.png" style="width: 100%;height: 278rpx;"></image>
+		<view class="main">
+			<view class="infoBox" style="margin-top: 40rpx;">
+				<view class="title">
+					番茄小区
+				</view>
+				<view class="item">
+					<view class="leftIcon">
+						<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<view class="" style="position: absolute;left: 100rpx;">
+						<view class="name">1号楼 2单元 602</view>
+						<view class="dec">
+							解锁时间：2020-02-02 13:01
+						</view>
+					</view>
+					
+				</view>
+				<view class="item">
+					<view class="leftIcon">
+						<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<view class="" style="position: absolute;left: 100rpx;">
+						<view class="name">1号楼 2单元 602</view>
+						<view class="dec">
+							解锁时间：2020-02-02 13:01
+						</view>
+					</view>
+					
+				</view>
+				<view class="item">
+					<view class="leftIcon">
+						<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<view class="" style="position: absolute;left: 100rpx;">
+						<view class="name">1号楼 2单元 602</view>
+						<view class="dec">
+							解锁时间：2020-02-02 13:01
+						</view>
+					</view>
+					
+				</view>
+			</view>
+			<view class="infoBox" style="margin-top: 40rpx;">
+				<view class="title">
+					花园小区
+				</view>
+				<view class="item">
+					<view class="leftIcon">
+						<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<view class="" style="position: absolute;left: 100rpx;">
+						<view class="name">1号楼 2单元 602</view>
+						<view class="dec">
+							解锁时间：2020-02-02 13:01
+						</view>
+					</view>
+				</view>
+				<view class="item">
+					<view class="leftIcon">
+						<image src="../../static/open_icon@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<view class="" style="position: absolute;left: 100rpx;">
+						<view class="name">1号楼 2单元 602</view>
+						<view class="dec">
+							解锁时间：2020-02-02 13:01
+						</view>
+					</view>
+					
+				</view>
+			</view>
+			
+		</view>
+	
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+
+			}
+		},
+		methods:{
+			// 查看解锁记录
+			 seeList(){
+				 uni.navigateTo({
+				 	url:""
+				 })
+			 }
+		}
+	
+	}
+</script>
+
+<style scoped>
+	.title{
+		width:100%;
+		height:44rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		color:rgba(41,138,253,1);
+	}
+	.btn{
+		width:702rpx;
+		height:90rpx;
+		background:rgba(41,138,253,1);
+		opacity:1;
+		border-radius:18rpx;
+		position: fixed;
+		bottom: 56rpx;
+		left: 24rpx;
+		font-size:32rpx;
+		font-family:PingFang SC;
+		font-weight:bold;
+		color:rgba(255,255,255,1);
+	}
+	.dec{
+		width:356rpx;
+		height:40rpx;
+		font-size:24rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(153,153,153,1);
+		margin-top: 12rpx;
+	}
+	.name{
+		width:262rpx;
+		height:44rpx;
+		font-size:30rpx;
+		font-family:PingFang SC;
+		font-weight:400;
+		color:rgba(51,51,51,1);
+		margin-top: 38rpx;
+	}
+	.item{
+		width: 702rpx;
+		height: 170rpx;
+		border-bottom:2px solid rgba(247,247,247,1); ;
+		display: flex;
+		position: relative;
+	}
+	.infoBox{
+			width: 702rpx;
+			margin: 0 auto;
+	}
+	.leftIcon{
+		width: 60rpx;
+		height: 60rpx;
+		position: absolute;
+		left: 24rpx;
+		bottom: 60rpx;
+	}
+	.rightIcon{
+		width: 80rpx;
+		height: 80rpx;
+		position: absolute;
+		right: 24rpx;
+		bottom: 44rpx;
+	}
+	.main{
+		width: 100%;
+		position: absolute;
+		top: 0rpx;
+	}
+</style>
+

pages/register/register.vue

@@ -0,0 +1,333 @@
+<template>
+	<view>
+		<view style="width:100%;height:516rpx;position: relative;">
+			<view class="navImage">
+				<image src="../../static/login_bgground@2x.png" style="width:100%;height:516rpx;"></image>
+			</view>
+			<!-- <view style="color:#fff;" class="nvaTitle">访客密码</view> -->
+		</view>
+		<view>
+			<view class="info">
+				<view class="topType"></view>
+				<view class="info-title">注册</view>
+				<view class="item">
+					<view class="left-icon">
+						<image src="../../static/register_icon_name@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input" v-model="form.name" focus placeholder="请输入真实姓名" />
+				</view>
+				<view class="item">
+					<view class="left-icon">
+							<image src="../../static/register_icon_identity@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input" v-model="form.idNumber" focus placeholder="请输入身份证号" />
+				</view>
+				<view class="item">
+					<view class="left-icon">
+							<image src="../../static/login_icon_phone@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input" v-model="form.phone" focus placeholder="请输入手机号" />
+				</view>
+				<view class="item">
+					<view class="left-icon">
+							<image src="../../static/login_icon_code@2x.png" style="width: 100%;height: 100%;"></image>
+					</view>
+					<input class="uni-input item-input" style="width:190rpx;" v-model="form.code" placeholder="请输入验证码" />
+					<view style="margin-left: 150rpx;font-size: 24rpx;text-align: center;line-height: 40rpx;color:rgba(41,138,253,1);"
+					 v-show="isGet" @tap="getCode">获取验证码</view>
+					<view v-show="isShow" @tap="againGetCode" style="width: 160rpx; margin-left: 116rpx;font-size: 24rpx;text-align: center;line-height: 45rpx;color:rgba(41,138,253,1);">重新获取<sapn>({{num}}s)</sapn>
+					</view>
+				</view>
+				<!--注册按钮 -->
+				<view class="info-btn" @tap="register" :class="{active:form.name && form.idNumber && form.phone && form.code}">
+					注册
+				</view>
+				<!-- 现在登录 -->
+				<view class="loginNow" @tap="loginNow()">
+					现在登录
+				</view>
+			</view>
+		</view>
+		<!-- 注册成功弹窗 -->
+		<uni-popup ref="popup" type="center">
+			<view style="width: 600rpx;height: 522rpx;background-color: #fff;border-radius: 10rpx;" class="popupBox">
+				<image src="../../static/success_popup@2x.png" style="width:100%;height: 100%;margin-top: -70rpx;"></image>
+				<!-- <view class="popupImage">
+					
+				</view> -->
+				<view class="popupTitle">恭喜您，注册成功！</view>
+				<button class="popupBtn" @tap="backLogin">返回登录</button>
+				<view class="popupClose" @tap="popupClose">
+					<image src="../../static/icon_colse@2x.png" style="width: 100%;height: 100%;"></image>
+				</view>
+			</view>
+			</uni-popup>
+	</view>
+</template>
+
+<script>
+	import uniPopup from "../../components/uni-popup/uni-popup.vue"
+	export default {
+		components: {
+			uniPopup
+		},
+		data() {
+			return {
+				isPopup: false, //判断弹窗是否显示
+				isShow: false, //判断是否显示重新获取
+				isGet: true, //判断是否显示获取验证码
+				// 倒计时数字
+				num: 59,
+				// 倒计时
+				timer: null,
+				//表单绑定值
+				form: {
+					name: '', //姓名
+					idNumber: '', //身份证号
+					phone: '', //手机号
+					code: '', //验证码
+				}
+			}
+		},
+		methods: {
+			// 注册成功弹窗关闭
+			 popupClose(){
+				 this.$refs.popup.close()
+			 },
+			 // 返回登录
+			 backLogin(){
+				 uni.navigateTo({
+				 	url:"../login/login"
+				 })
+			 },
+			// 现在登录
+			loginNow() {
+				uni.navigateTo({
+					url: '/pages/login/login'
+				})
+			},
+			// 获取验证码
+			getCode() {
+				this.isShow = true
+				this.isGet = false
+				const TIME_COUNT = 60;
+				// 判断当前timer是否有值
+				if (!this.timer) {
+					this.num = TIME_COUNT;
+					this.show = false;
+					this.timer = setInterval(() => {
+						// 判断当前num值大于0并且小于等于60执行
+						if (this.num > 0 && this.num <= TIME_COUNT) {
+							this.num--;
+						} else {
+							//否则就清除定时
+							clearInterval(this.timer);
+							this.timer = null;
+						}
+					}, 1000)
+				}
+			},
+			//重新获取验证码
+			againGetCode() {
+
+			},
+			// 注册
+			register() {
+				this.$refs.popup.open()
+				// 判断输入框是否都有值  是可以点击注册 否不可以点击
+				if (!this.form.name || !this.form.idNumber || !this.form.code || !this.form.phone) {
+					return
+				} else {
+					let idNumerReg = /^[1-9]\d{5}(18|19|20)\d{2}((0[1-9])|(1[0-2]))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/; //身份证正则
+					let phoneReg = /^1[3|4|5|7|8][0-9]{9}$/; //手机号正则校验
+					if (!this.form.name) {
+						uni.showToast({
+							icon: 'none',
+							title: '姓名不能为空',
+							duration: 2000
+						});
+					} else if (!idNumerReg.test(this.form.idNumber)) {
+						console.log(this.form.idNumber)
+						uni.showToast({
+							icon: 'none',
+							title: '身份证号码格式不正确',
+							duration: 2000
+						});
+					} else if (!phoneReg.test(this.form.phone)) {
+						uni.showToast({
+							icon: 'none',
+							title: '手机号码格式不正确',
+							duration: 2000
+						});
+					}
+					
+				}
+
+			}
+		},
+		
+	}
+</script>
+
+<style>
+	.popupClose{
+		width: 44rpx;
+		height: 44rpx;
+		position: absolute;
+		right: 20rpx;
+		top: 20rpx;
+		
+	}
+	.popupBtn{
+		width: 342rpx;
+		height: 80rpx;
+		position: absolute;
+		bottom: 80rpx;
+		left: 128rpx;
+		background:rgba(41,138,253,1);
+		color: #FFFFFF;
+		font-size: 32rpx;
+ 	}
+	.popupTitle{
+		width: 260rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		color: #999999;
+		position: absolute;
+		bottom: 232rpx;
+		left: 170rpx;
+	}
+	.popupImage{
+	width:100%;
+	height:300rpx;
+/* 	background-image: url(../../static/success_popup@2x.png);
+     position: absolute;
+	 top: -64rpx; */
+	 
+	}
+	.loginNow {
+		width: 116rpx;
+		height: 40rpx;
+		font-size: 28rpx;
+		color: #333333;
+		margin: 0 auto;
+		margin-top: 48rpx;
+	}
+
+	.info-btn {
+		width: 342rpx;
+		height: 88rpx;
+		background: rgba(163, 197, 237, 1);
+		opacity: 1;
+		border-radius: 14rpx;
+		font-size: 32rpx;
+		text-align: center;
+		line-height: 88rpx;
+		color: rgba(255, 255, 255, 1);
+		margin: 0 auto;
+		margin-top: 44rpx;
+	}
+
+	.item-input {
+		width: 100%;
+		margin-left: 20rpx;
+		height: 40rpx;
+		/* margin-top: 5rpx; */
+		font-size: 32rpx;
+		color: #999999;
+		color: #333333;
+		opacity: 1;
+	}
+
+	.active {
+		background: rgba(41, 138, 253, 1);
+	}
+
+	.left-icon {
+		width: 40rpx;
+		height: 40rpx;
+		/* border: 1rpx solid #555555; */
+		/* box-sizing: border-box; */
+	}
+
+	.item {
+		display: flex;
+		width: 531rpx;
+		height: 59rpx;
+		margin: 0 auto;
+		border-bottom: 2px solid rgba(247, 247, 247, 1);
+		opacity: 1;
+		margin-top: 50rpx;
+	}
+
+	.info-box {
+		width: 90%;
+		margin: 0 auto;
+		border: 1px solid #808080;
+	}
+
+	.info-title {
+		width: 100%;
+		height: 48rpx;
+		font-size: 34rpx;
+		text-align: center;
+		line-height: 48rpx;
+		font-family: PingFang SC;
+		font-weight: bold;
+		position: absolute;
+		top: 30rpx;
+	}
+
+	.topType {
+		width: 150rpx;
+		height: 150rpx;
+		border-radius: 50%;
+		background: #FFFFFF;
+		margin: 0 auto;
+		margin-top: -50rpx;
+		border: 1rpx solide #C0C0C0;
+	}
+
+	.navImage {}
+
+	.info {
+		width: 602rpx;
+		height: 624rpx;
+		background: rgba(255, 255, 255, 1);
+		box-shadow: 0px 6px 30px rgba(41, 138, 253, 0.15);
+		opacity: 1;
+		position: absolute;
+		top: 484rpx;
+		left: 74rpx;
+		border-radius: 20rpx;
+	}
+
+	.btn {
+		width: 702rpx;
+		height: 90rpx;
+		background: rgba(41, 138, 253, 1);
+		opacity: 1;
+		border-radius: 18rpx;
+		font-size: 32rpx;
+		font-family: PingFang SC;
+		color: rgba(255, 255, 255, 1);
+		text-align: center;
+		line-height: 90rpx;
+		position: absolute;
+		top: 990rpx;
+		left: 27rpx;
+	}
+
+	.nvaTitle {
+		position: absolute;
+		text-align: center;
+		max-width: 400rpx;
+		overflow: hidden;
+		top: 0;
+		left: 0;
+		bottom: 0;
+		right: 0;
+		font-size: 32rpx;
+		margin: auto;
+	}
+</style>