1 line
6.2 KiB
Plaintext
1 line
6.2 KiB
Plaintext
{"version":3,"sources":["pages/mall/consumer/logistics.uvue"],"sourcesContent":["<template>\r\n <view class=\"logistics-page\">\r\n <view class=\"logistics-header\">\r\n <view class=\"product-info\">\r\n <image class=\"product-image\" :src=\"productImage\" mode=\"aspectFill\"></image>\r\n <view class=\"info-right\">\r\n <text class=\"status-text\">{{ logisticsStatus }}</text>\r\n <text class=\"courier-name\">{{ courierName }}: {{ trackingNo }}</text>\r\n <text class=\"phone-text\">官方电话: {{ courierPhone }}</text>\r\n </view>\r\n </view>\r\n </view>\r\n\r\n <view class=\"logistics-body\">\r\n <view class=\"track-list\">\r\n <view \r\n v-for=\"(item, index) in trackList\" \r\n :key=\"index\" \r\n class=\"track-item\"\r\n :class=\"{ first: index === 0 }\"\r\n >\r\n <view class=\"node-icon\">\r\n <view class=\"dot\"></view>\r\n <view class=\"line\" v-if=\"index !== trackList.length - 1\"></view>\r\n </view>\r\n <view class=\"node-content\">\r\n <text class=\"track-desc\">{{ item.desc }}</text>\r\n <text class=\"track-time\">{{ item.time }}</text>\r\n </view>\r\n </view>\r\n </view>\r\n </view>\r\n </view>\r\n</template>\r\n\r\n<script setup lang=\"uts\">\r\nimport { ref, onMounted } from 'vue'\r\n\r\nconst orderId = ref('')\r\nconst productImage = ref('/static/product1.jpg')\r\nconst logisticsStatus = ref('运输中')\r\nconst courierName = ref('顺丰速运')\r\nconst courierPhone = ref('95338')\r\nconst trackingNo = ref('SF1234567890')\r\n\r\ntype TrackItem = {\r\n desc: string\r\n time: string\r\n}\r\n\r\nconst trackList = ref<TrackItem[]>([\r\n {\r\n desc: '【深圳市】快件已到达 深圳南山集散中心',\r\n time: '2024-01-26 14:30:00'\r\n },\r\n {\r\n desc: '【广州市】快件已从 广州转运中心 发出，准备发往 深圳南山集散中心',\r\n time: '2024-01-26 09:20:00'\r\n },\r\n {\r\n desc: '【广州市】快件已到达 广州转运中心',\r\n time: '2024-01-25 22:15:00'\r\n },\r\n {\r\n desc: '【杭州市】商家已发货',\r\n time: '2024-01-25 18:00:00'\r\n }\r\n])\r\n\r\nonMounted(() => {\r\n const pages = getCurrentPages()\r\n const currentPage = pages[pages.length - 1]\r\n const options = currentPage.options\r\n if (options != null) {\r\n const optionsObj = options as UTSJSONObject\r\n const orderIdValue = optionsObj.getString('orderId')\r\n if (orderIdValue != null) {\r\n orderId.value = orderIdValue\r\n // 这里可以根据orderId去请求真实的物流信息\r\n }\r\n }\r\n})\r\n</script>\r\n\r\n<style scoped>\r\n.logistics-page {\r\n /* min-height: 100vh; */\r\n flex: 1;\r\n background-color: #f5f5f5;\r\n padding-bottom: 20px;\r\n}\r\n\r\n.logistics-header {\r\n background-color: #fff;\r\n padding: 15px;\r\n margin-bottom: 10px;\r\n}\r\n\r\n.product-info {\r\n display: flex;\r\n align-items: center;\r\n}\r\n\r\n.product-image {\r\n width: 60px;\r\n height: 60px;\r\n border-radius: 4px;\r\n margin-right: 15px;\r\n background-color: #eee;\r\n}\r\n\r\n.info-right {\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n.status-text {\r\n font-size: 16px;\r\n color: #ff5000;\r\n font-weight: bold;\r\n margin-bottom: 5px;\r\n}\r\n\r\n.courier-name {\r\n font-size: 14px;\r\n color: #333;\r\n margin-bottom: 2px;\r\n}\r\n\r\n.phone-text {\r\n font-size: 12px;\r\n color: #999;\r\n}\r\n\r\n.logistics-body {\r\n background-color: #fff;\r\n padding: 20px 15px;\r\n}\r\n\r\n.track-list {\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n.track-item {\r\n display: flex;\r\n position: relative;\r\n padding-bottom: 25px;\r\n}\r\n\r\n.track-item:last-child {\r\n padding-bottom: 0;\r\n}\r\n\r\n.node-icon {\r\n width: 20px;\r\n display: flex;\r\n flex-direction: column;\r\n align-items: center;\r\n margin-right: 15px;\r\n}\r\n\r\n.dot {\r\n width: 8px;\r\n height: 8px;\r\n border-radius: 4px;\r\n}\r\n\r\n.first .dot {\r\n background-color: #ff5000;\r\n width: 12px;\r\n height: 12px;\r\n margin-top: 4px;\r\n box-shadow: 0 0 0 4px rgba(255, 80, 0, 0.2);\r\n}\r\n\r\n.line {\r\n width: 1px;\r\n background-color: #eee;\r\n flex: 1;\r\n margin-top: 2px;\r\n}\r\n\r\n.node-content {\r\n flex: 1;\r\n display: flex;\r\n flex-direction: column;\r\n}\r\n\r\n.track-desc {\r\n font-size: 14px;\r\n color: #333;\r\n line-height: 1.5;\r\n margin-bottom: 5px;\r\n}\r\n\r\n.first .track-desc {\r\n color: #ff5000;\r\n font-weight: bold;\r\n}\r\n\r\n.track-time {\r\n font-size: 12px;\r\n color: #999;\r\n}\r\n</style>\r\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;YAsCA,IAAM,UAAU,IAAI;YACpB,IAAM,eAAe,IAAI;YACzB,IAAM,kBAAkB,IAAI;YAC5B,IAAM,cAAc,IAAI;YACxB,IAAM,eAAe,IAAI;YACzB,IAAM,aAAa,IAAI;YAOvB,IAAM,YAAY,QAAI,WAInB,UAFC,OAAM,uBACN,OAAM,wBAKP,UAFC,OAAM,qCACN,OAAM,wBAKP,UAFC,OAAM,qBACN,OAAM,wBAKP,UAFC,OAAM,cACN,OAAM;YAIV,UAAU,KAAK;gBACb,IAAM,QAAQ;gBACd,IAAM,cAAc,KAAK,CAAC,MAAM,MAAM,CAAA,CAAA,CAAG,CAAC,CAAC;gBAC3C,IAAM,UAAU,YAAY,OAAO;gBACnC,IAAI,QAAO,EAAA,CAAI,IAAI,EAAE;oBACnB,IAAM,aAAa,QAAO,EAAA,CAAI;oBAC9B,IAAM,eAAe,WAAW,SAAS,CAAC;oBAC1C,IAAI,aAAY,EAAA,CAAI,IAAI,EAAE;wBACxB,QAAQ,KAAK,GAAG;;;YAItB;;;uBAhFE,IA+BO,QAAA,IA/BD,WAAM,mBAAgB;oBAC1B,IASO,QAAA,IATD,WAAM,qBAAkB;wBAC5B,IAOO,QAAA,IAPD,WAAM,iBAAc;4BACxB,IAA2E,SAAA,IAApE,WAAM,iBAAiB,SAAK,aAAA,KAAY,EAAE,UAAK;;;4BACtD,IAIO,QAAA,IAJD,WAAM,eAAY;gCACtB,IAAsD,QAAA,IAAhD,WAAM,gBAAa,IAAI,gBAAA,KAAe,GAAA,CAAA;gCAC5C,IAAqE,QAAA,IAA/D,WAAM,iBAAc,IAAI,YAAA,KAAW,EAAA,CAAA,CAAG,KAAE,CAAA,CAAA,IAAG,WAAA,KAAU,GAAA,CAAA;gCAC3D,IAAwD,QAAA,IAAlD,WAAM,eAAa,SAAM,CAAA,CAAA,IAAG,aAAA,KAAY,GAAA,CAAA;;;;oBAKpD,IAkBO,QAAA,IAlBD,WAAM,mBAAgB;wBAC1B,IAgBO,QAAA,IAhBD,WAAM,eAAY;4BACtB,IAcO,UAAA,IAAA,EAAA,cAAA,UAAA,CAbmB,UAAA,KAAS,EAAA,IAAzB,MAAM,OAAN,SAAI,UAAA,GAAA,CAAA;uCADd,IAcO,QAAA,IAZJ,SAAK,OACN,WAAK,IAAA;oCAAC;oCACE,IAAA,YAAA,MAAA,GAAA,CAAA,CAAA;iCAAsB;oCAE9B,IAGO,QAAA,IAHD,WAAM,cAAW;wCACrB,IAAyB,QAAA,IAAnB,WAAM;wCACa,IAAA,MAAK,GAAA,CAAK,UAAA,KAAS,CAAC,MAAM,CAAA,CAAA,CAAA,CAAA,EAAnD;4CAAA,IAAgE,QAAA,gBAA1D,WAAM;;;;;oCAEd,IAGO,QAAA,IAHD,WAAM,iBAAc;wCACxB,IAA+C,QAAA,IAAzC,WAAM,eAAY,IAAI,KAAK,IAAI,GAAA,CAAA;wCACrC,IAA+C,QAAA,IAAzC,WAAM,eAAY,IAAI,KAAK,IAAI,GAAA,CAAA"} |