index.js 5.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244
  1. const { museumApi } = require('../../../utils/api.js');
  2. Page({
  3. data: {
  4. showAddForm: false,
  5. contactList: [],
  6. newVisitor: {
  7. name: '',
  8. phone: '',
  9. idType: '身份证',
  10. idCard: '',
  11. nameError: '',
  12. phoneError: '',
  13. idNumberError: ''
  14. },
  15. idTypes: ['身份证', '护照']
  16. },
  17. onLoad() {
  18. this.fetchContactList();
  19. },
  20. onPullDownRefresh() {
  21. this.fetchContactList().then(() => {
  22. wx.stopPullDownRefresh();
  23. });
  24. },
  25. // 显示新增参观人表单
  26. showAddVisitor() {
  27. this.setData({ showAddForm: true });
  28. this.resetForm();
  29. },
  30. // 隐藏新增表单
  31. hideAddForm() {
  32. this.setData({ showAddForm: false });
  33. },
  34. // 重置表单
  35. resetForm() {
  36. this.setData({
  37. newVisitor: {
  38. name: '',
  39. phone: '',
  40. idType: '身份证',
  41. idCard: '',
  42. nameError: '',
  43. phoneError: '',
  44. idNumberError: ''
  45. }
  46. });
  47. },
  48. // 表单输入处理
  49. onNameInput(e) {
  50. this.setData({
  51. 'newVisitor.name': e.detail.value,
  52. 'newVisitor.nameError': ''
  53. });
  54. },
  55. onPhoneInput(e) {
  56. this.setData({
  57. 'newVisitor.phone': e.detail.value,
  58. 'newVisitor.phoneError': ''
  59. });
  60. },
  61. onIdNumberInput(e) {
  62. this.setData({
  63. 'newVisitor.idCard': e.detail.value,
  64. 'newVisitor.idNumberError': ''
  65. });
  66. },
  67. onIdTypeChange(e) {
  68. this.setData({
  69. 'newVisitor.idType': this.data.idTypes[e.detail.value]
  70. });
  71. },
  72. // 验证姓名
  73. validateName() {
  74. const name = this.data.newVisitor.name.trim();
  75. if (!name) {
  76. this.setData({ 'newVisitor.nameError': '请输入姓名' });
  77. return false;
  78. }
  79. if (!/^[\u4e00-\u9fa5a-zA-Z]+$/.test(name)) {
  80. this.setData({ 'newVisitor.nameError': '姓名只能包含中文和英文字母' });
  81. return false;
  82. }
  83. this.setData({ 'newVisitor.nameError': '' });
  84. return true;
  85. },
  86. // 验证电话号码
  87. validatePhone() {
  88. const phone = this.data.newVisitor.phone.trim();
  89. if (!phone) {
  90. this.setData({ 'newVisitor.phoneError': '请输入电话号码' });
  91. return false;
  92. }
  93. if (!/^1[3-9]\d{9}$/.test(phone)) {
  94. this.setData({ 'newVisitor.phoneError': '请输入正确的11位手机号码' });
  95. return false;
  96. }
  97. this.setData({ 'newVisitor.phoneError': '' });
  98. return true;
  99. },
  100. // 验证身份证号码
  101. validateIdNumber() {
  102. const idCard = this.data.newVisitor.idCard.trim();
  103. if (!idCard) {
  104. this.setData({ 'newVisitor.idNumberError': '请输入证件号码' });
  105. return false;
  106. }
  107. if (this.data.newVisitor.idType === '护照') {
  108. // if (!/^[A-Za-z0-9]+$/.test(idCard)) {
  109. // this.setData({ 'newVisitor.idNumberError': '请输入正确的护照号码' });
  110. // return false;
  111. // }
  112. } else {
  113. if (!/^[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]$/.test(idCard)) {
  114. this.setData({ 'newVisitor.idNumberError': '请输入正确的18位身份证号码' });
  115. return false;
  116. }
  117. }
  118. this.setData({ 'newVisitor.idNumberError': '' });
  119. return true;
  120. },
  121. // 确认添加
  122. confirmAdd() {
  123. // 验证所有字段
  124. const isNameValid = this.validateName();
  125. const isPhoneValid = this.validatePhone();
  126. const isIdNumberValid = this.validateIdNumber();
  127. if (!isNameValid || !isPhoneValid || !isIdNumberValid) {
  128. return;
  129. }
  130. // 显示加载提示
  131. wx.showLoading({
  132. title: '添加中...'
  133. });
  134. this.addContactToServer(this.data.newVisitor)
  135. .then(() => {
  136. wx.showToast({
  137. title: '添加成功',
  138. icon: 'success'
  139. });
  140. // 添加成功后回到联系人列表并刷新数据
  141. this.setData({ showAddForm: false });
  142. this.fetchContactList();
  143. wx.hideLoading();
  144. })
  145. .catch(error => {
  146. wx.hideLoading();
  147. console.error('添加联系人失败:', error);
  148. wx.showToast({
  149. title: '添加失败,请重试',
  150. icon: 'none'
  151. });
  152. });
  153. },
  154. // 删除联系人
  155. editContact(e) {
  156. const index = e.currentTarget.dataset.index;
  157. const contact = this.data.contactList[index];
  158. wx.showModal({
  159. title: '确认删除',
  160. content: `确定要删除联系人"${contact.name}"吗?`,
  161. success: (res) => {
  162. if (res.confirm) {
  163. this.deleteContactFromServer(contact.id || contact.visitorId, index);
  164. }
  165. }
  166. });
  167. },
  168. // API调用 - 删除联系人
  169. deleteContactFromServer(id, index) {
  170. wx.showLoading({
  171. title: '删除中...'
  172. });
  173. museumApi.deleteVisitor(id)
  174. .then(() => {
  175. wx.hideLoading();
  176. wx.showToast({
  177. title: '删除成功',
  178. icon: 'success'
  179. });
  180. // 删除成功后刷新列表
  181. this.fetchContactList();
  182. })
  183. .catch(error => {
  184. wx.hideLoading();
  185. console.error('删除联系人失败:', error);
  186. wx.showToast({
  187. title: '删除失败,请重试',
  188. icon: 'none'
  189. });
  190. });
  191. },
  192. // API调用 - 添加联系人
  193. addContactToServer(contact) {
  194. // 构造API参数
  195. const params = {
  196. cardType: contact.idType === '身份证' ? '1' : '2', // 暂时都设为身份证类型
  197. id: 0, // 新增时为0
  198. idCard: contact.idCard,
  199. name: contact.name,
  200. phone: contact.phone
  201. };
  202. return museumApi.addVisitor(params);
  203. },
  204. // 获取联系人列表
  205. fetchContactList() {
  206. return museumApi.getMyVisitors()
  207. .then(response => {
  208. console.log('获取参观人列表成功:', response);
  209. // 如果没有数据,使用模拟数据
  210. const contactList = response || [];
  211. this.setData({ contactList });
  212. })
  213. .catch(error => {
  214. console.error('获取参观人列表失败:', error);
  215. // 使用模拟数据
  216. this.setData({ contactList: this.getMockContactList() });
  217. });
  218. },
  219. });