与牧同行-小程序用户端
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

615 lines
19 KiB

1 month ago
  1. Page({
  2. data: {
  3. // 原始药品列表数据
  4. medicineList: [],
  5. // 筛选后的列表
  6. filteredList: [],
  7. // 搜索相关
  8. searchKeyword: '',
  9. // 筛选相关
  10. currentCategory: 'all',
  11. // 分页相关
  12. page: 1,
  13. pageSize: 12,
  14. hasMore: true,
  15. loading: false,
  16. // 弹窗控制
  17. showDetailModal: false,
  18. currentMedicine: null,
  19. // 滚动相关
  20. showBackToTop: false,
  21. scrollTop: 0
  22. },
  23. onLoad: function() {
  24. this.initData();
  25. },
  26. onShow: function() {
  27. // 页面显示时刷新数据
  28. this.refreshList();
  29. },
  30. onPullDownRefresh: function() {
  31. // 下拉刷新
  32. this.refreshList();
  33. },
  34. onReachBottom: function() {
  35. // 上拉加载更多
  36. if (this.data.hasMore && !this.data.loading) {
  37. this.loadMore();
  38. }
  39. },
  40. onPageScroll: function(e) {
  41. // 显示/隐藏返回顶部按钮
  42. if (e.scrollTop > 300 && !this.data.showBackToTop) {
  43. this.setData({ showBackToTop: true });
  44. } else if (e.scrollTop <= 300 && this.data.showBackToTop) {
  45. this.setData({ showBackToTop: false });
  46. }
  47. this.setData({ scrollTop: e.scrollTop });
  48. },
  49. // 初始化数据
  50. initData: function() {
  51. const mockData = this.getMockData();
  52. this.setData({
  53. medicineList: mockData,
  54. filteredList: mockData
  55. });
  56. },
  57. // 获取模拟数据
  58. getMockData: function() {
  59. return [
  60. {
  61. id: 1,
  62. name: "阿莫西林胶囊",
  63. manufacturer: "华北制药股份有限公司",
  64. specification: "0.25g*24粒/盒",
  65. category: "prescription",
  66. categoryText: "处方药",
  67. indication: "用于敏感菌所致的呼吸道感染、泌尿系统感染等",
  68. price: 25.8,
  69. originalPrice: 32.0,
  70. isHot: true,
  71. salesCount: 1280,
  72. stock: 150,
  73. image: "https://via.placeholder.com/300x300/3a7ff3/ffffff?text=阿莫西林",
  74. expert: {
  75. name: "张明华",
  76. title: "主任医师",
  77. hospital: "北京协和医院",
  78. avatar: "https://via.placeholder.com/100x100/3a7ff3/ffffff?text=张",
  79. reason: "本品为广谱抗生素,对多数革兰氏阳性菌和革兰氏阴性菌均有良好的抗菌作用,是临床常用的一线抗生素。",
  80. expertise: "呼吸内科",
  81. years: 15,
  82. recommendTime: "2024-01-15"
  83. },
  84. store: {
  85. name: "仁和堂大药房",
  86. address: "北京市朝阳区建国路88号",
  87. phone: "010-88888888",
  88. businessHours: "8:00-22:00",
  89. features: "24小时营业,专业药师咨询,医保定点药店",
  90. distance: "1.2",
  91. latitude: 39.9042,
  92. longitude: 116.4074,
  93. rating: 4.8,
  94. images: [
  95. "https://via.placeholder.com/400x300/4CAF50/ffffff?text=药店外观",
  96. "https://via.placeholder.com/400x300/2196F3/ffffff?text=店内环境"
  97. ]
  98. },
  99. details: {
  100. usage: "口服。成人一次0.5g,每6~8小时1次,一日剂量不超过4g。",
  101. precautions: "青霉素过敏者禁用,用药期间可能出现腹泻、恶心等胃肠道反应。",
  102. storage: "密封,在干燥处保存。",
  103. validity: "24个月"
  104. }
  105. },
  106. {
  107. id: 2,
  108. name: "连花清瘟胶囊",
  109. manufacturer: "石家庄以岭药业股份有限公司",
  110. specification: "0.35g*24粒/盒",
  111. category: "chinese",
  112. categoryText: "中成药",
  113. indication: "用于治疗流行性感冒属热毒袭肺证",
  114. price: 28.5,
  115. originalPrice: 35.0,
  116. isHot: true,
  117. salesCount: 2560,
  118. stock: 89,
  119. image: "https://via.placeholder.com/300x300/4CAF50/ffffff?text=连花清瘟",
  120. expert: {
  121. name: "李芳",
  122. title: "副主任医师",
  123. hospital: "上海瑞金医院",
  124. avatar: "https://via.placeholder.com/100x100/4CAF50/ffffff?text=李",
  125. reason: "在新冠肺炎疫情防控中显示出良好效果,具有清瘟解毒、宣肺泄热的功效,适用于流感治疗。",
  126. expertise: "中医科",
  127. years: 12,
  128. recommendTime: "2024-01-14"
  129. },
  130. store: {
  131. name: "同济堂药店",
  132. address: "上海市黄浦区南京东路100号",
  133. phone: "021-66666666",
  134. businessHours: "9:00-21:00",
  135. features: "中药配方齐全,提供代煎服务,老字号药店",
  136. distance: "2.5",
  137. latitude: 31.2304,
  138. longitude: 121.4737,
  139. rating: 4.7,
  140. images: [
  141. "https://via.placeholder.com/400x300/FF9800/ffffff?text=中药柜台"
  142. ]
  143. },
  144. details: {
  145. usage: "口服。一次4粒,一日3次。",
  146. precautions: "风寒感冒者不适用,高血压、心脏病患者慎用。",
  147. storage: "密封,置阴凉干燥处。",
  148. validity: "36个月"
  149. }
  150. },
  151. {
  152. id: 3,
  153. name: "维生素C片",
  154. manufacturer: "养生堂药业有限公司",
  155. specification: "100mg*60片/瓶",
  156. category: "health",
  157. categoryText: "保健品",
  158. indication: "用于预防和治疗维生素C缺乏症",
  159. price: 18.9,
  160. originalPrice: 24.0,
  161. isHot: false,
  162. salesCount: 890,
  163. stock: 320,
  164. image: "https://via.placeholder.com/300x300/FF9800/ffffff?text=维生素C",
  165. expert: {
  166. name: "王建国",
  167. title: "执业药师",
  168. hospital: "广州中医药大学附属医院",
  169. avatar: "https://via.placeholder.com/100x100/FF9800/ffffff?text=王",
  170. reason: "增强免疫力,促进铁吸收,抗氧化作用明显,适合日常保健和预防感冒。",
  171. expertise: "临床药学",
  172. years: 8,
  173. recommendTime: "2024-01-13"
  174. },
  175. store: {
  176. name: "老百姓大药房",
  177. address: "广州市天河区体育西路189号",
  178. phone: "020-77777777",
  179. businessHours: "7:30-23:00",
  180. features: "连锁品牌,价格实惠,会员优惠,支持医保",
  181. distance: "0.8",
  182. latitude: 23.1358,
  183. longitude: 113.3269,
  184. rating: 4.6,
  185. images: []
  186. },
  187. details: {
  188. usage: "口服。成人一次1片,一日1次。",
  189. precautions: "不宜长期过量服用,肾功能不全者慎用。",
  190. storage: "避光,密封保存。",
  191. validity: "24个月"
  192. }
  193. },
  194. {
  195. id: 4,
  196. name: "布洛芬缓释胶囊",
  197. manufacturer: "中美天津史克制药有限公司",
  198. specification: "0.3g*20粒/盒",
  199. category: "otc",
  200. categoryText: "非处方药",
  201. indication: "用于缓解轻至中度疼痛如头痛、关节痛、偏头痛等",
  202. price: 22.5,
  203. originalPrice: 28.0,
  204. isHot: true,
  205. salesCount: 1870,
  206. stock: 120,
  207. image: "https://via.placeholder.com/300x300/9C27B0/ffffff?text=布洛芬",
  208. expert: {
  209. name: "陈晓东",
  210. title: "主任医师",
  211. hospital: "武汉同济医院",
  212. avatar: "https://via.placeholder.com/100x100/9C27B0/ffffff?text=陈",
  213. reason: "解热镇痛效果确切,缓释剂型作用持久,胃肠道刺激小,适合各种疼痛的缓解。",
  214. expertise: "疼痛科",
  215. years: 20,
  216. recommendTime: "2024-01-12"
  217. },
  218. store: {
  219. name: "九州通大药房",
  220. address: "武汉市江汉区解放大道688号",
  221. phone: "027-55555555",
  222. businessHours: "8:30-21:30",
  223. features: "药品齐全,支持线上订购,送货上门",
  224. distance: "3.2",
  225. latitude: 30.5928,
  226. longitude: 114.3052,
  227. rating: 4.9,
  228. images: [
  229. "https://via.placeholder.com/400x300/3F51B5/ffffff?text=现代药店",
  230. "https://via.placeholder.com/400x300/E91E63/ffffff?text=专业服务"
  231. ]
  232. },
  233. details: {
  234. usage: "口服。成人一次1粒,一日2次。",
  235. precautions: "胃肠道溃疡患者禁用,不宜长期服用。",
  236. storage: "密封,在阴凉干燥处保存。",
  237. validity: "36个月"
  238. }
  239. },
  240. {
  241. id: 5,
  242. name: "盐酸左氧氟沙星片",
  243. manufacturer: "浙江医药股份有限公司",
  244. specification: "0.5g*6片/盒",
  245. category: "prescription",
  246. categoryText: "处方药",
  247. indication: "用于敏感细菌引起的呼吸系统、泌尿系统感染",
  248. price: 42.8,
  249. originalPrice: 56.0,
  250. isHot: false,
  251. salesCount: 560,
  252. stock: 75,
  253. image: "https://via.placeholder.com/300x300/2196F3/ffffff?text=左氧氟沙星",
  254. expert: {
  255. name: "刘涛",
  256. title: "副主任医师",
  257. hospital: "南京鼓楼医院",
  258. avatar: "https://via.placeholder.com/100x100/2196F3/ffffff?text=刘",
  259. reason: "抗菌谱广,对多种革兰氏阴性菌和阳性菌有效,特别适用于泌尿系统感染的治疗。",
  260. expertise: "泌尿外科",
  261. years: 10,
  262. recommendTime: "2024-01-11"
  263. },
  264. store: {
  265. name: "金陵大药房",
  266. address: "南京市鼓楼区中山路321号",
  267. phone: "025-44444444",
  268. businessHours: "8:00-21:00",
  269. features: "专业处方药房,药师驻店咨询",
  270. distance: "1.8",
  271. latitude: 32.0603,
  272. longitude: 118.7969,
  273. rating: 4.5,
  274. images: []
  275. },
  276. details: {
  277. usage: "口服。一次1片,一日1次。",
  278. precautions: "18岁以下患者禁用,孕妇及哺乳期妇女禁用。",
  279. storage: "遮光,密封保存。",
  280. validity: "24个月"
  281. }
  282. },
  283. {
  284. id: 6,
  285. name: "板蓝根颗粒",
  286. manufacturer: "广州白云山和记黄埔中药有限公司",
  287. specification: "10g*20袋/盒",
  288. category: "chinese",
  289. categoryText: "中成药",
  290. indication: "清热解毒,凉血利咽,用于肺胃热盛所致的咽喉肿痛",
  291. price: 15.9,
  292. originalPrice: 19.9,
  293. isHot: true,
  294. salesCount: 3200,
  295. stock: 450,
  296. image: "https://via.placeholder.com/300x300/FF5722/ffffff?text=板蓝根",
  297. expert: {
  298. name: "孙丽",
  299. title: "主治医师",
  300. hospital: "成都中医药大学附属医院",
  301. avatar: "https://via.placeholder.com/100x100/FF5722/ffffff?text=孙",
  302. reason: "传统经典方剂,清热解毒效果显著,特别适合预防和治疗感冒初期症状。",
  303. expertise: "中医内科",
  304. years: 6,
  305. recommendTime: "2024-01-10"
  306. },
  307. store: {
  308. name: "康恩贝大药房",
  309. address: "成都市锦江区春熙路58号",
  310. phone: "028-33333333",
  311. businessHours: "9:00-22:00",
  312. features: "连锁品牌,中药西药齐全",
  313. distance: "0.5",
  314. latitude: 30.6578,
  315. longitude: 104.0657,
  316. rating: 4.4,
  317. images: []
  318. },
  319. details: {
  320. usage: "开水冲服。一次1袋,一日3次。",
  321. precautions: "风寒感冒者不适用,糖尿病患者慎用。",
  322. storage: "密封,防潮。",
  323. validity: "36个月"
  324. }
  325. },
  326. {
  327. id: 7,
  328. name: "复方甘草片",
  329. manufacturer: "北京双鹤药业股份有限公司",
  330. specification: "100片/瓶",
  331. category: "prescription",
  332. categoryText: "处方药",
  333. indication: "用于镇咳祛痰,适用于感冒咳嗽",
  334. price: 12.5,
  335. originalPrice: 16.0,
  336. isHot: false,
  337. salesCount: 780,
  338. stock: 200,
  339. image: "https://via.placeholder.com/300x300/673AB7/ffffff?text=甘草片",
  340. expert: {
  341. name: "赵国强",
  342. title: "主任医师",
  343. hospital: "天津医科大学总医院",
  344. avatar: "https://via.placeholder.com/100x100/673AB7/ffffff?text=赵",
  345. reason: "传统止咳良药,镇咳祛痰效果确切,价格实惠,适合普通感冒咳嗽。",
  346. expertise: "呼吸内科",
  347. years: 18,
  348. recommendTime: "2024-01-09"
  349. },
  350. store: {
  351. name: "天津医药大药房",
  352. address: "天津市和平区南京路128号",
  353. phone: "022-22222222",
  354. businessHours: "8:00-21:30",
  355. features: "国营药店,药品质量有保障",
  356. distance: "2.0",
  357. latitude: 39.1172,
  358. longitude: 117.2056,
  359. rating: 4.3,
  360. images: []
  361. },
  362. details: {
  363. usage: "口服。一次3-4片,一日3次。",
  364. precautions: "不宜长期服用,孕妇及哺乳期妇女慎用。",
  365. storage: "密封,在干燥处保存。",
  366. validity: "36个月"
  367. }
  368. },
  369. {
  370. id: 8,
  371. name: "葡萄糖酸钙口服液",
  372. manufacturer: "哈药集团制药六厂",
  373. specification: "10ml*12支/盒",
  374. category: "otc",
  375. categoryText: "非处方药",
  376. indication: "用于预防和治疗钙缺乏症",
  377. price: 35.0,
  378. originalPrice: 42.0,
  379. isHot: true,
  380. salesCount: 1560,
  381. stock: 180,
  382. image: "https://via.placeholder.com/300x300/00BCD4/ffffff?text=葡萄糖酸钙",
  383. expert: {
  384. name: "周敏",
  385. title: "副主任医师",
  386. hospital: "西安交通大学第一附属医院",
  387. avatar: "https://via.placeholder.com/100x100/00BCD4/ffffff?text=周",
  388. reason: "钙吸收好,口感适宜,特别适合儿童、孕妇和老年人补钙。",
  389. expertise: "儿科",
  390. years: 14,
  391. recommendTime: "2024-01-08"
  392. },
  393. store: {
  394. name: "西安医药大药房",
  395. address: "西安市碑林区南大街58号",
  396. phone: "029-11111111",
  397. businessHours: "8:30-21:00",
  398. features: "专业儿科用药,儿童健康咨询",
  399. distance: "1.5",
  400. latitude: 34.2583,
  401. longitude: 108.9426,
  402. rating: 4.7,
  403. images: []
  404. },
  405. details: {
  406. usage: "口服。一次1-2支,一日3次。",
  407. precautions: "肾功能不全者慎用,不宜与洋地黄类药物同时使用。",
  408. storage: "密封,置阴凉处。",
  409. validity: "24个月"
  410. }
  411. }
  412. ];
  413. },
  414. // 获取简短文本(修复undefined问题)
  415. getShortText: function(text, maxLength) {
  416. if (!text || typeof text !== 'string') {
  417. return '';
  418. }
  419. if (text.length <= maxLength) {
  420. return text;
  421. }
  422. return text.substring(0, maxLength) + '...';
  423. },
  424. // 搜索输入处理(输入时自动搜索)
  425. onSearchInput: function(e) {
  426. const keyword = e.detail.value;
  427. this.setData({
  428. searchKeyword: keyword
  429. }, () => {
  430. // 输入后立即执行筛选
  431. this.filterList();
  432. });
  433. },
  434. // 清除搜索
  435. clearSearch: function() {
  436. this.setData({
  437. searchKeyword: ''
  438. }, () => {
  439. this.filterList();
  440. });
  441. },
  442. // 分类筛选切换
  443. onCategoryChange: function(e) {
  444. const category = e.currentTarget.dataset.category;
  445. this.setData({
  446. currentCategory: category
  447. }, () => {
  448. this.filterList();
  449. });
  450. },
  451. // 筛选列表
  452. filterList: function() {
  453. const { searchKeyword, currentCategory, medicineList } = this.data;
  454. let filteredList = [...medicineList];
  455. // 搜索筛选
  456. if (searchKeyword && searchKeyword.trim()) {
  457. const keyword = searchKeyword.trim().toLowerCase();
  458. filteredList = filteredList.filter(item => {
  459. // 搜索药品名称
  460. if (item.name && item.name.toLowerCase().includes(keyword)) {
  461. return true;
  462. }
  463. // 搜索专家姓名
  464. if (item.expert && item.expert.name && item.expert.name.toLowerCase().includes(keyword)) {
  465. return true;
  466. }
  467. // 搜索适用症状
  468. if (item.indication && item.indication.toLowerCase().includes(keyword)) {
  469. return true;
  470. }
  471. // 搜索生产厂家
  472. if (item.manufacturer && item.manufacturer.toLowerCase().includes(keyword)) {
  473. return true;
  474. }
  475. return false;
  476. });
  477. }
  478. // 分类筛选
  479. if (currentCategory !== 'all') {
  480. filteredList = filteredList.filter(item => item.category === currentCategory);
  481. }
  482. this.setData({
  483. filteredList: filteredList,
  484. page: 1,
  485. hasMore: filteredList.length > this.data.pageSize
  486. });
  487. },
  488. // 刷新列表
  489. refreshList: function() {
  490. wx.showLoading({
  491. title: '刷新中...',
  492. });
  493. // 模拟网络请求
  494. setTimeout(() => {
  495. const mockData = this.getMockData();
  496. this.setData({
  497. medicineList: mockData
  498. }, () => {
  499. // 刷新后重新筛选
  500. this.filterList();
  501. });
  502. wx.hideLoading();
  503. wx.stopPullDownRefresh();
  504. }, 800);
  505. },
  506. // 加载更多
  507. loadMore: function() {
  508. if (!this.data.hasMore) return;
  509. this.setData({ loading: true });
  510. // 模拟网络请求
  511. setTimeout(() => {
  512. const currentList = this.data.filteredList;
  513. // 这里简化为直接追加数据(实际项目中应该从服务器获取新数据)
  514. if (currentList.length < this.data.medicineList.length) {
  515. const allData = this.data.medicineList;
  516. const startIndex = currentList.length;
  517. const endIndex = Math.min(startIndex + 4, allData.length);
  518. const newData = allData.slice(startIndex, endIndex);
  519. const updatedList = [...currentList, ...newData];
  520. this.setData({
  521. filteredList: updatedList,
  522. hasMore: updatedList.length < allData.length,
  523. loading: false
  524. });
  525. } else {
  526. this.setData({
  527. hasMore: false,
  528. loading: false
  529. });
  530. }
  531. }, 1000);
  532. },
  533. // 显示药品详情
  534. showMedicineDetail: function(e) {
  535. const medId = e.currentTarget.dataset.id;
  536. // const medicine = this.data.filteredList[index];
  537. // this.setData({
  538. // showDetailModal: true,
  539. // currentMedicine: medicine
  540. // });
  541. wx.navigateTo({
  542. url: `/pagesA/pages/medicineDetails/medicineDetails?id=${medId}`,
  543. })
  544. },
  545. // 详情弹窗关闭
  546. onDetailModalClose: function() {
  547. this.setData({
  548. showDetailModal: false
  549. });
  550. },
  551. // 返回顶部
  552. scrollToTop: function() {
  553. wx.pageScrollTo({
  554. scrollTop: 0,
  555. duration: 300
  556. });
  557. }
  558. });