customServiceApplication.vue 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273
  1. <template>
  2. <view class="membershipApplication">
  3. <u-navbar :back-text="i18n('Back')" :back-text-style="backStyle" :title-width="400"
  4. back-icon-color="#fff" title-color="#fff"
  5. :background="background" :title="i18n('CustomServiceApplication')">
  6. </u-navbar>
  7. <view class="content">
  8. <view class="title">{{$t('common.CustomServiceApplication')}}</view>
  9. <view class="form-box">
  10. <u-form :model="form" ref="uForm" label-position="top">
  11. <u-form-item :label="$i18n.locale == 'zh'? '姓名': 'Name'" prop="name" required>
  12. <u-input v-model="form.name" :placeholder="placeholder.name" />
  13. </u-form-item>
  14. <u-form-item :label="$i18n.locale == 'zh'? '单位名称': 'Company name'" prop="unitName" required>
  15. <u-input v-model="form.unitName" :placeholder="placeholder.unitName" />
  16. <u-button slot="right" type="primary" shape="square" size="mini" @click="showSelect">{{i18n('Search')}}</u-button>
  17. </u-form-item>
  18. <u-form-item :label="$i18n.locale == 'zh'? '申请类型': 'Support Type'" prop="applicationType" required>
  19. <u-input v-model="form.applicationType" type="select" :placeholder="placeholder.applicationType" @click="selectShow = true" />
  20. </u-form-item>
  21. <u-form-item :label="$i18n.locale == 'zh'? '邮箱': 'E-mail'" prop="email" required>
  22. <u-input v-model="form.email" :placeholder="placeholder.email" />
  23. </u-form-item>
  24. <u-form-item :label="$i18n.locale == 'zh'? '联系电话': 'Contact phone number'" prop="tel" required>
  25. <u-input v-model="form.tel" :placeholder="placeholder.tel" />
  26. </u-form-item>
  27. </u-form>
  28. <u-button shape="circle" type="primary" class="custom-style" @click="submit">{{$t('common.submit')}}</u-button>
  29. </view>
  30. </view>
  31. <!-- 申请类型 -->
  32. <u-select mode="single-column" :list="typeDialog1" v-model="selectShow" @confirm="selectConfirm" :confirm-text="i18n('submit')" :cancel-text="i18n('cancel')"></u-select>
  33. <!-- 单位名称 -->
  34. <u-select v-model="unitNameShow" mode="single-column" :list="projectList" @confirm="confirm" label-name="unitName"
  35. value-name="baseEntityId" :confirm-text="i18n('submit')" :cancel-text="i18n('cancel')"></u-select>
  36. <u-toast ref="uToast" />
  37. </view>
  38. </template>
  39. <script>
  40. export default {
  41. data() {
  42. return {
  43. background:{
  44. backgroundImage: 'linear-gradient(270deg, #4BC0E2 0%, #538BE7 100%)',
  45. },
  46. backStyle:{
  47. color:'#fff'
  48. },
  49. form: {
  50. name: '',
  51. unitName: '',
  52. unitId: '',
  53. applicationType: '',
  54. childTypeDict: '',
  55. email: '',
  56. tel: ''
  57. },
  58. placeholder: {
  59. name: this.$i18n.locale == 'zh'? '请输入姓名': 'Please enter name',
  60. unitName: this.$i18n.locale == 'zh'? '请输入单位名称': 'Please enter the company name',
  61. applicationType: this.$i18n.locale == 'zh'? '请输入申请类型': 'Please enter the Support Type',
  62. email: this.$i18n.locale == 'zh'? '请输入邮箱': 'Please enter the e-mail',
  63. tel: this.$i18n.locale == 'zh'? '请输入联系电话': 'Please enter the contact number'
  64. },
  65. typeDialog1: [],
  66. baseUnitViews: [],
  67. projectList: [],
  68. selectShow: false,
  69. unitNameShow: false,
  70. token: '',
  71. coopCustomService: {
  72. id: null,
  73. unitId: '',
  74. unitZhName: '',
  75. serviceType: this.$i18n.locale == 'zh'?'定制服务':'Costomized',
  76. serviceTypeDict: '1',
  77. childType: '',
  78. childTypeDict: '',
  79. supportWay: '',
  80. supportWayDict: '',
  81. applyUserName: '',
  82. linkNumber: '',
  83. linkEmail: '',
  84. userType: '1',
  85. unitIntroduction: '',
  86. applyContent: '',
  87. applyDate: '',
  88. subName: '',
  89. subAccount: '',
  90. subCompany: '',
  91. subMail: '',
  92. subPhone: '',
  93. language: '',
  94. status: '',
  95. statusDict: '1',
  96. createBy: '',
  97. createDate: '',
  98. updateBy: '',
  99. updateDate: '',
  100. },
  101. rules: {
  102. name: [
  103. {
  104. required: true,
  105. message: this.$i18n.locale == 'zh'? '请输入姓名': 'Please enter name',
  106. trigger: 'blur',
  107. }
  108. ],
  109. unitName: [
  110. {
  111. required: true,
  112. message: this.$i18n.locale == 'zh'? '请输入单位名称': 'Please enter the company name',
  113. trigger: ['blur','change']
  114. }
  115. ],
  116. applicationType: [
  117. {
  118. required: true,
  119. message: this.$i18n.locale == 'zh'? '请输入申请类型': 'Please enter the application type',
  120. trigger: ['blur','change']
  121. }
  122. ],
  123. email: [
  124. {
  125. required: true,
  126. message: this.$i18n.locale == 'zh'? '请输入邮箱': 'Please enter the e-mail',
  127. trigger: 'blur'
  128. },
  129. {
  130. message: this.$i18n.locale == 'zh'? '邮箱格式不正确': 'Email format is not correct, please input again',
  131. type: 'email',
  132. trigger: 'blur'
  133. }
  134. ],
  135. tel: [
  136. {
  137. required: true,
  138. message: this.$i18n.locale == 'zh'? '请输入联系电话': 'Please enter the contact phone number',
  139. trigger: 'blur'
  140. },
  141. {
  142. validator: (rule, value, callback) => {
  143. return this.$u.test.mobile(value);
  144. },
  145. message: this.$i18n.locale == 'zh'? '手机号码不正确': 'The contact phone number is incorrect',
  146. trigger: 'blur'
  147. }
  148. ]
  149. }
  150. }
  151. },
  152. onLoad() {
  153. this.getSelectList();
  154. },
  155. onReady() {
  156. this.$refs.uForm.setRules(this.rules);
  157. },
  158. methods: {
  159. i18n (data) {
  160. return this.$t('common.'+data);
  161. },
  162. async showSelect() {
  163. await this.getProjectViews();
  164. this.unitNameShow = true;
  165. },
  166. async getProjectViews() {
  167. const res = await this.$myRequest({
  168. url: '/project/coopCustomServices/getUnitViews',
  169. data: {
  170. language: this.$i18n.locale.toUpperCase(),
  171. unitName: this.form.unitName
  172. }
  173. });
  174. // console.log(res);
  175. this.projectList = res.data.baseUnitViewList;
  176. },
  177. async getSelectList() { //申请类型
  178. let type = "";
  179. if(this.$i18n.locale == 'zh') {
  180. type = "SERVICE_TYPE_DICT,SERVICE_CHILD_TYPE_DICT,STATUS_DICT,SUPPORT_WAY_DICT";
  181. }else {
  182. type = "SERVICE_TYPE_DICT_EN,SERVICE_CHILD_TYPE_DICT_EN,STATUS_DICT,SUPPORT_WAY_DICT_EN";
  183. }
  184. const res = await this.$myRequest({
  185. url: '/sys/sysDicts',
  186. data: {
  187. type
  188. }
  189. });
  190. // console.log(res);
  191. this.typeDialog1 = res.data[1] || [];
  192. },
  193. selectConfirm(e) {
  194. this.form.applicationType = e[0].label;
  195. this.form.childTypeDict = e[0].value;
  196. },
  197. confirm(e) {
  198. this.form.unitName = e[0].label;
  199. this.form.unitId = e[0].value;
  200. },
  201. submit() {
  202. this.$refs.uForm.validate(valid => {
  203. if (valid) {
  204. this.getToken();
  205. } else {
  206. console.log('验证失败');
  207. }
  208. });
  209. },
  210. async saveOrUpdate() {
  211. this.coopCustomService.applyUserName = this.form.name;
  212. this.coopCustomService.unitId = this.form.unitId;
  213. this.coopCustomService.childType = this.form.applicationType;
  214. this.coopCustomService.childTypeDict = this.form.childTypeDict;
  215. this.coopCustomService.linkEmail = this.form.email;
  216. this.coopCustomService.linkNumber = this.form.tel;
  217. const res = await this.$myRequest({
  218. url: '/project/coopCustomServices',
  219. method: 'POST',
  220. data: {
  221. coopCustomService: JSON.stringify(this.coopCustomService),
  222. attachmentIds: null,
  223. statements: null,
  224. dataSource: 'gate',
  225. token: this.token
  226. }
  227. });
  228. // console.log(res);
  229. if(res.status == 200) {
  230. uni.navigateTo({
  231. url: '/pages/service/membership/successful?value=custom&key='+res.data
  232. })
  233. }else {
  234. this.$refs.uToast.show({
  235. title: this.$i18n.locale == 'zh'?'申请失败!':'Application failed!',
  236. type: 'error'
  237. });
  238. }
  239. },
  240. async getToken() {
  241. const res = await this.$myRequest({
  242. url: '/sys/token'
  243. });
  244. // console.log(res);
  245. this.token = res.data;
  246. this.saveOrUpdate();
  247. }
  248. }
  249. }
  250. </script>
  251. <style lang="scss" scoped>
  252. .membershipApplication {
  253. .content {
  254. margin-top: 20upx;
  255. background-color: #FFFFFF;
  256. padding: 30upx;
  257. height: calc(100vh - 20upx - 44px - var(--status-bar-height));
  258. }
  259. .title {
  260. color: #1777FE;
  261. font-size: 32upx;
  262. margin-bottom: 20upx;
  263. }
  264. .custom-style {
  265. width: 100%;
  266. height: 80upx;
  267. margin-top: 60upx;
  268. }
  269. }
  270. </style>