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.

262 lines
6.3 KiB

  1. <template>
  2. <view class="main">
  3. <view class="u-back-top">
  4. <view class="backBox">
  5. <u-icon name="arrow-left" color="#333" size="28"></u-icon>
  6. </view>
  7. </view>
  8. <view class="title">
  9. <image :src="imgUrl" mode=""></image>
  10. </view>
  11. <view class="form">
  12. <view class="form-item" @click="tenantClick">
  13. <mySelect :value="FormData.tenantName" placeholder="请选择服务地区"/>
  14. </view>
  15. <view class="form-item">
  16. <view class="inputBox my">
  17. <u--input placeholder="请输入登录账号" border="none" clearable v-model="FormData.username"></u--input>
  18. </view>
  19. </view>
  20. <view class="form-item">
  21. <view class="inputBox my">
  22. <u--input placeholder="请输入密码" border="none" clearable style="height: 100%;" :clearable="false" v-model="FormData.password"></u--input>
  23. </view>
  24. </view>
  25. <view class="forgetTps"> <text @click="$u.toast('请联系管理员重置密码!')">忘记密码</text></view>
  26. <view class="loginBtn" :class="{active: btnHighlight}" @click="submitFn"> </view>
  27. <!-- <view class="radioWrap">
  28. <u-checkbox-group >
  29. <u-checkbox v-model="isCheck" shape="circle" label="已阅读并同意" :labelSize="12" ></u-checkbox>
  30. </u-checkbox-group>
  31. <view class="privacyText">
  32. <text>用户协议</text> <text>隐私协议</text>
  33. </view>
  34. </view> -->
  35. </view>
  36. <u-picker :show="show" :columns="columnsArea" keyName="name" @confirm="confirmArea" @cancel="show=false" @close="show=false"></u-picker>
  37. <u-action-sheet :actions="list" :title="title" :show="showRole" @select="selectClick" ></u-action-sheet>
  38. </view>
  39. </template>
  40. <script>
  41. import { loginPwd, tenantPage } from '@/config/api.js'
  42. import { imgUrl } from '@/config/site.config.js'
  43. export default {
  44. data() {
  45. return {
  46. isCheck: false,
  47. codeText: '获取验证码',
  48. FormData: {
  49. username: '',
  50. password: '',
  51. tenantName: ''
  52. },
  53. imgUrl: imgUrl+'loginTitle.png',
  54. codeOn: false,
  55. show: false,
  56. columnsArea: [],
  57. list: [],
  58. title: '请选择您要登录的角色',
  59. showRole: false,
  60. roleObj: {}
  61. }
  62. },
  63. onLoad() {
  64. this.tenantPageFn()
  65. this.roleObj = this.$store.state.user.vuex_role
  66. },
  67. onPullDownRefresh() {
  68. this.tenantPageFn()
  69. },
  70. computed: {
  71. btnHighlight() {
  72. let { FormData } = this
  73. return FormData.username.length>3&&FormData.password.length>3&&FormData.tenantName
  74. }
  75. },
  76. methods: {
  77. tenantClick() {
  78. if(!this.columnsArea.length) return this.$u.toast('没有获得服务地区,请下拉刷新重新加载')
  79. this.show = true
  80. },
  81. selectClick(item) {
  82. this.showRole = false
  83. this.chooseIdentity(item.name)
  84. // alert(item.name)
  85. },
  86. chooseIdentity(name) {
  87. let url = '/pages/tabbar/statistics/index'
  88. this.$store.commit('upDateIdentity', name)
  89. if(name=='实操教练') {
  90. url = '/pages/tabbar/student/index'
  91. }else if(name=='模拟器老师') {
  92. url = '/pages/tabbar/examSimulation/index'
  93. }
  94. uni.reLaunch({
  95. url
  96. })
  97. },
  98. confirmArea(val) {
  99. let item = val.value[0]
  100. this.FormData.tenantName =item.name
  101. this.$store.commit('upDateTenantId', item.id)
  102. this.show = false
  103. },
  104. async tenantPageFn() {
  105. let obj = {
  106. pageNo: 1,
  107. pageSize: 100,
  108. status: 0
  109. }
  110. const {data: res} = await tenantPage(obj)
  111. this.columnsArea = [res.list]
  112. console.log(res)
  113. },
  114. // 是否选择协议
  115. groupChangeEnvnt(e) {
  116. this.isCheck = e.value
  117. console.log('是否选择协议', this.isCheck)
  118. },
  119. // 发送短信验证码
  120. async goSms() {
  121. const {
  122. FormData
  123. } = this
  124. if (!FormData.phone) return this.$u.toast('请输入手机号');
  125. if (!this.isPhone) return this.$u.toast('手机号格式有误');
  126. if (this.codeOn) return
  127. const data = await getLoginCode({
  128. codeType: 1,
  129. phone: FormData.phone,
  130. })
  131. console.log(data)
  132. // 获取验证码
  133. var time = 60;
  134. var timer = setInterval(() => {
  135. time--;
  136. this.codeText = time + "秒后重新发送"
  137. this.codeOn = true;
  138. if (time == 0) {
  139. clearInterval(timer);
  140. this.codeText = "获取验证码";
  141. this.codeOn = false;
  142. }
  143. }, 1000);
  144. },
  145. async submitFn() {
  146. // return
  147. if(!this.btnHighlight) return
  148. const {data: res} = await loginPwd(this.FormData)
  149. this.$store.commit('update_vuex_loginInfo', res)
  150. // this.chooseIdentity('实操教练')
  151. // return
  152. await this.$store.dispatch('getUserInfo')
  153. console.log(this.role)
  154. this.list = []
  155. this.role.forEach((item)=>{
  156. let obj = {
  157. name: this.roleObj[item]
  158. }
  159. this.list.push(obj)
  160. })
  161. if(this.list.length>1) {
  162. this.showRole = true
  163. }else {
  164. this.chooseIdentity(this.list[0].name)
  165. }
  166. console.log(this.list)
  167. }
  168. }
  169. }
  170. </script>
  171. <style lang="scss" scoped>
  172. .main {
  173. width: 100%;
  174. min-height: 100vh;
  175. // background: url('http://192.168.1.20:81/zhili/image/20230922/f5e2cfaf05f441c1b9f897e7dc284f1d.png') no-repeat;
  176. // background-size: 100% 360rpx;
  177. .u-back-top {
  178. padding: 32rpx 0 0 0;
  179. .backBox {
  180. padding: 24rpx;
  181. }
  182. }
  183. .title {
  184. width: 658rpx;
  185. height: 94rpx;
  186. margin: 100rpx auto 100rpx auto;
  187. }
  188. .form {
  189. padding: 0 46rpx;
  190. .form-item {
  191. height: 112rpx;
  192. background: #F4F7FF;
  193. border-radius: 16rpx;
  194. width: 100%;
  195. line-height: 112rpx;
  196. display: flex;
  197. margin-bottom: 40rpx;
  198. padding: 0 40rpx;
  199. .prefix {
  200. display: flex;
  201. align-items: center;
  202. font-size: 32rpx;
  203. color: #333;
  204. font-weight: 600;
  205. }
  206. .inputBox {
  207. flex: 1;
  208. }
  209. .code {
  210. color: #BBBBBB;
  211. margin-left: 30rpx;
  212. &.active {
  213. color: $themC
  214. }
  215. }
  216. }
  217. .forgetTps {
  218. font-size: 28rpx;
  219. color: $themC;
  220. margin-top: -20rpx;
  221. text-align: right;
  222. }
  223. .loginBtn {
  224. width: 100%;
  225. height: 112rpx;
  226. background: rgba(25,137,250,0.3);
  227. border-radius: 16rpx;
  228. text-align: center;
  229. line-height: 112rpx;
  230. font-size: 32rpx;
  231. font-weight: 600;
  232. color: #fff;
  233. margin-top: 100rpx;
  234. &.active {
  235. background: rgba(25,137,250,1);
  236. }
  237. }
  238. .radioWrap {
  239. display: flex;
  240. align-items: center;
  241. margin-top: 40rpx;
  242. .privacyText {
  243. font-size: 24rpx;
  244. color: #888E94;
  245. text {
  246. color: $themC;
  247. }
  248. }
  249. }
  250. }
  251. }
  252. </style>