index.js 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237
  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 (!/^[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)) {
  108. this.setData({ 'newVisitor.idNumberError': '请输入正确的18位身份证号码' });
  109. return false;
  110. }
  111. this.setData({ 'newVisitor.idNumberError': '' });
  112. return true;
  113. },
  114. // 确认添加
  115. confirmAdd() {
  116. // 验证所有字段
  117. const isNameValid = this.validateName();
  118. const isPhoneValid = this.validatePhone();
  119. const isIdNumberValid = this.validateIdNumber();
  120. if (!isNameValid || !isPhoneValid || !isIdNumberValid) {
  121. return;
  122. }
  123. // 显示加载提示
  124. wx.showLoading({
  125. title: '添加中...'
  126. });
  127. this.addContactToServer(this.data.newVisitor)
  128. .then(() => {
  129. wx.showToast({
  130. title: '添加成功',
  131. icon: 'success'
  132. });
  133. // 添加成功后回到联系人列表并刷新数据
  134. this.setData({ showAddForm: false });
  135. this.fetchContactList();
  136. wx.hideLoading();
  137. })
  138. .catch(error => {
  139. wx.hideLoading();
  140. console.error('添加联系人失败:', error);
  141. wx.showToast({
  142. title: '添加失败,请重试',
  143. icon: 'none'
  144. });
  145. });
  146. },
  147. // 删除联系人
  148. editContact(e) {
  149. const index = e.currentTarget.dataset.index;
  150. const contact = this.data.contactList[index];
  151. wx.showModal({
  152. title: '确认删除',
  153. content: `确定要删除联系人"${contact.name}"吗?`,
  154. success: (res) => {
  155. if (res.confirm) {
  156. this.deleteContactFromServer(contact.id || contact.visitorId, index);
  157. }
  158. }
  159. });
  160. },
  161. // API调用 - 删除联系人
  162. deleteContactFromServer(id, index) {
  163. wx.showLoading({
  164. title: '删除中...'
  165. });
  166. museumApi.deleteVisitor(id)
  167. .then(() => {
  168. wx.hideLoading();
  169. wx.showToast({
  170. title: '删除成功',
  171. icon: 'success'
  172. });
  173. // 删除成功后刷新列表
  174. this.fetchContactList();
  175. })
  176. .catch(error => {
  177. wx.hideLoading();
  178. console.error('删除联系人失败:', error);
  179. wx.showToast({
  180. title: '删除失败,请重试',
  181. icon: 'none'
  182. });
  183. });
  184. },
  185. // API调用 - 添加联系人
  186. addContactToServer(contact) {
  187. // 构造API参数
  188. const params = {
  189. cardType: contact.idType === '身份证' ? '1' : '1', // 暂时都设为身份证类型
  190. id: 0, // 新增时为0
  191. idCard: contact.idCard,
  192. name: contact.name,
  193. phone: contact.phone
  194. };
  195. return museumApi.addVisitor(params);
  196. },
  197. // 获取联系人列表
  198. fetchContactList() {
  199. return museumApi.getMyVisitors()
  200. .then(response => {
  201. console.log('获取参观人列表成功:', response);
  202. // 如果没有数据,使用模拟数据
  203. const contactList = response || [];
  204. this.setData({ contactList });
  205. })
  206. .catch(error => {
  207. console.error('获取参观人列表失败:', error);
  208. // 使用模拟数据
  209. this.setData({ contactList: this.getMockContactList() });
  210. });
  211. },
  212. });