index.js 9.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257
  1. const verify = require('../../utils/deleteMark');
  2. Component({
  3. externalClasses: [],
  4. properties: {
  5. form: Array,
  6. showAll: {
  7. type: Boolean,
  8. value: true
  9. }, //不显示必填项
  10. onConfirm: Function,
  11. interrupt: Function, //打断处理,用于条件判断 把form返回到上个页面处理重新传入
  12. },
  13. data: {
  14. temporary: null, //route选择暂存选中项
  15. },
  16. options: {
  17. multipleSlots: true //允许使用多个slot
  18. },
  19. methods: {
  20. toOptions(e) {
  21. const {
  22. item
  23. } = e.currentTarget.dataset;
  24. wx.navigateTo({
  25. url: '/packageA/options/index?data=' + JSON.stringify(item),
  26. })
  27. },
  28. route(e) {
  29. const {
  30. item
  31. } = e.currentTarget.dataset;
  32. if (item.disabled) return;
  33. getApp().globalData.handleSelect = this.handleRoute.bind(this);
  34. let result = (item.query && !item.query.indexOf("radio=true") && item.value[1]) ? `` : `&result=${JSON.stringify(item.value[1])}`
  35. wx.navigateTo({
  36. url: item.url + '?params=' + JSON.stringify(item.params) + (item.query || '') + result,
  37. fail(err) {
  38. console.log(err)
  39. }
  40. });
  41. this.setData({
  42. temporary: {
  43. item: item,
  44. index: this.data.form.findIndex(v => v.valueName == item.valueName)
  45. }
  46. })
  47. },
  48. /* 处理路由返回结果 */
  49. handleRoute(data) {
  50. let temporary = this.data.temporary;
  51. if (temporary.item.interrupt) {
  52. this.triggerEvent("interrupt", {
  53. data,
  54. form: this.data.form,
  55. temporary
  56. });
  57. } else {
  58. wx.navigateBack();
  59. this.setData({
  60. [`form[${temporary.index}].value`]: data.value
  61. });
  62. this.confirm()
  63. };
  64. this.data.temporary = null;
  65. },
  66. /* 改变值 */
  67. inputChange(e) {
  68. let item = e.target.dataset.item,
  69. index = this.data.form.findIndex(v => v.valueName === item.valueName),
  70. value = e.detail;
  71. //校验规则 不填:不校验 "base":默认校验 "phone":手机号 "mail":邮箱 "telephone":固定电话 "正则表达式":以自定义内容为校验标准
  72. if (item.checking) {
  73. let reg = item.checking;
  74. switch (item.checking) {
  75. case 'base':
  76. value = verify.queryStr(value);
  77. break;
  78. case 'phone':
  79. reg = /^1(3[0-9]|4[01456879]|5[0-35-9]|6[2567]|7[0-8]|8[0-9]|9[0-35-9])\d{8}$/;
  80. this.setData({
  81. [`form[${index}].errMsg`]: !reg.test(value) ? '请输入正确11位手机号码' : ''
  82. });
  83. break;
  84. case "telephone":
  85. let i = e.target.dataset.i;
  86. value = item.value;
  87. value[i] = e.detail.value;
  88. let result = value[0] + "-" + value[1];
  89. reg = /[0-9-()()]{7,18}/;
  90. this.setData({
  91. [`form[${index}].errMsg`]: !reg.test(result) ? '请输入正确固定座机电话' : '',
  92. [`form[${index}].result`]: result,
  93. });
  94. break;
  95. case 'mail':
  96. reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
  97. this.setData({
  98. [`form[${index}].errMsg`]: !reg.test(value) ? '请输入正确的邮箱格式' : ''
  99. });
  100. break;
  101. default:
  102. reg = new RegExp(reg);
  103. this.setData({
  104. [`form[${index}].errMsg`]: !reg.test(value) ? item.hint || '输入文本不符合条件!' : ''
  105. });
  106. break;
  107. };
  108. };
  109. this.setData({
  110. [`form[${index}].value`]: value,
  111. [`form[${index}].error`]: false,
  112. });
  113. if (!item.required && value == '') this.setData({
  114. [`form[${index}].errMsg`]: "",
  115. });
  116. this.confirm();
  117. },
  118. /* 单列选择器 */
  119. bindSelectorChange(e) {
  120. let {
  121. item,
  122. index
  123. } = e.target.dataset,
  124. value = e.detail.value;
  125. this.setData({
  126. [`form[${index}].value`]: item.range[value][item.rangeKey],
  127. [`form[${index}].rangeIndex`]: value,
  128. [`form[${index}].error`]: false,
  129. });
  130. if (item.interrupt) this.triggerEvent("interrupt", {
  131. data: this.data.form[index],
  132. form: this.data.form,
  133. temporary: {
  134. item,
  135. index
  136. }
  137. });
  138. this.confirm();
  139. },
  140. /* 日期,时间 选择器 */
  141. bindDateChange(e) {
  142. let item = e.target.dataset.item,
  143. index = this.data.form.findIndex(v => v.valueName === item.valueName),
  144. value = e.detail.value;
  145. this.setData({
  146. [`form[${index}].value`]: value,
  147. [`form[${index}].error`]: false,
  148. });
  149. if (item.interrupt) this.triggerEvent("interrupt", {
  150. data: this.data.form[index],
  151. form: this.data.form,
  152. temporary: {
  153. item,
  154. index
  155. }
  156. });
  157. this.confirm();
  158. },
  159. /* 时间范围选择器 */
  160. rangeDateChange(e) {
  161. let item = e.target.dataset.item,
  162. i = e.target.dataset.index,
  163. index = this.data.form.findIndex(v => v.valueName === item.valueName),
  164. value = e.detail.value;
  165. this.setData({
  166. [`form[${index}].value[${i}]`]: value,
  167. [`form[${index}].error`]: false,
  168. });
  169. this.confirm();
  170. },
  171. /* 省市县 */
  172. bindRegionChange(e) {
  173. let item = e.currentTarget.dataset.item,
  174. index = this.data.form.findIndex(v => v.valueName === item.valueName),
  175. value = e.detail.value;
  176. this.setData({
  177. [`form[${index}].value`]: value,
  178. [`form[${index}].error`]: false,
  179. });
  180. this.confirm();
  181. },
  182. /* 自定义选项 */
  183. setOption(item) {
  184. let i = this.data.form.findIndex(v => v.valueName == item.valueName);
  185. this.setData({
  186. [`form[${i}].value`]: item.value
  187. });
  188. this.confirm();
  189. },
  190. /* 是否完成必填项 */
  191. confirm() {
  192. this.triggerEvent("onConfirm", this.data.form.some(v => {
  193. if (v.type == "dateRange" && v.required) {
  194. return v.value[0] == "" || v.value[1] == "";
  195. } else {
  196. return v.required && v.value == '';
  197. }
  198. }))
  199. },
  200. /* 性别 */
  201. sexChange(e) {
  202. let item = e.currentTarget.dataset.item,
  203. index = this.data.form.findIndex(v => v.valueName === item.valueName);
  204. this.setData({
  205. [`form[${index}].value`]: e.detail,
  206. [`form[${index}].error`]: false,
  207. });
  208. this.confirm();
  209. },
  210. /* 单选 选择器改变 */
  211. radioChange(e) {
  212. let item = e.currentTarget.dataset.item,
  213. index = this.data.form.findIndex(v => v.valueName == item.valueName);
  214. this.setData({
  215. [`form[${index}].value`]: e.detail,
  216. [`form[${index}].error`]: false,
  217. });
  218. if (item.interrupt) this.triggerEvent("interrupt", {
  219. data: this.data.form[index],
  220. form: this.data.form,
  221. temporary: {
  222. item,
  223. index
  224. }
  225. });
  226. this.confirm();
  227. },
  228. /* 提交 */
  229. submit() {
  230. let obj = {},
  231. isPass = false;
  232. this.data.form.forEach((v, i) => {
  233. obj[v.valueName] = v.value;
  234. if (v.errMsg != '') {
  235. this.setData({
  236. [`form[${i}].error`]: true
  237. });
  238. isPass = true;
  239. }
  240. });
  241. if (isPass) {
  242. wx.showToast({
  243. title: '请检查表单内容',
  244. icon: "none"
  245. })
  246. } else {
  247. return obj;
  248. }
  249. },
  250. /* 查询结果 不验证是否必填 */
  251. query() {
  252. let obj = {};
  253. this.data.form.forEach(v => obj[v.valueName] = v.value);
  254. return obj;
  255. }
  256. }
  257. })