index.jsx 11 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378
  1. import { Component } from 'react'
  2. import Taro from '@tarojs/taro'
  3. import { connect } from 'react-redux'
  4. import { View, Input, Image } from '@tarojs/components'
  5. import { login, getWorkingHours, setOpenId } from '../../utils/servers/servers';
  6. import { add, minus, asyncAdd } from '../../actions/counter'
  7. import { AtButton, AtIcon, AtModal } from 'taro-ui'
  8. import NavBar from '../../components/common/NavBar';
  9. import BG from '../../image/bg.jpg';
  10. import 'taro-ui/dist/style/components/button.scss';
  11. import 'taro-ui/dist/style/components/loading.scss';
  12. import 'taro-ui/dist/style/components/icon.scss';
  13. import 'taro-ui/dist/style/components/modal.scss';
  14. import selectIcon from '../../image/select.png';
  15. import './index.less'
  16. @connect(({ counter }) => ({
  17. counter
  18. }), (dispatch) => ({
  19. add() {
  20. dispatch(add())
  21. },
  22. dec() {
  23. dispatch(minus())
  24. },
  25. asyncAdd() {
  26. dispatch(asyncAdd())
  27. }
  28. }))
  29. class Login extends Component {
  30. constructor(props) {
  31. super(props);
  32. this.state = {
  33. username: '',
  34. password: '',
  35. isOpened: false,
  36. openedType: 0,
  37. usernameList: Taro.getStorageSync('usernameList') || [],
  38. rememberPassword: true,
  39. }
  40. this.login = this.login.bind(this);
  41. this.authorization = this.authorization.bind(this);
  42. this.setUsernameList = this.setUsernameList.bind(this);
  43. this.getUsernameList = this.getUsernameList.bind(this);
  44. this.getWorkingHours = this.getWorkingHours.bind(this);
  45. }
  46. componentDidShow() {
  47. Taro.showShareMenu({
  48. withShareTicket: true
  49. })
  50. }
  51. componentDidMount() {
  52. }
  53. authorization() {
  54. this.setState({
  55. loading: true,
  56. })
  57. let _this = this;
  58. Taro.getSetting({
  59. withSubscriptions: true,
  60. success: (res) => {
  61. //console.log(res.subscriptionsSetting,'res.subscriptionsSetting')
  62. if (res.subscriptionsSetting.mainSwitch) {
  63. if (
  64. res.subscriptionsSetting['j7WH3EwQnxGxwuV2HwmJhryxySPE8vOiV5cVOpp-42I'] === "reject" ||
  65. res.subscriptionsSetting['pWia-KJPFwDM8ReDu_BOa9FJn31VFc81bp3yxfBmIRI'] === "reject" ||
  66. res.subscriptionsSetting['UGlNqF1VQsxYh6iVKrDuw_EkhrDNU6TXv4snGw4xze8'] === "reject") {
  67. this.setState({
  68. isOpened: true,
  69. loading: false,
  70. openedType: 1
  71. })
  72. return;
  73. }
  74. Taro.requestSubscribeMessage({ //获取下发权限
  75. tmplIds: [
  76. 'pWia-KJPFwDM8ReDu_BOa9FJn31VFc81bp3yxfBmIRI',
  77. 'j7WH3EwQnxGxwuV2HwmJhryxySPE8vOiV5cVOpp-42I',
  78. 'UGlNqF1VQsxYh6iVKrDuw_EkhrDNU6TXv4snGw4xze8'
  79. ], //此处写在后台获取的模板ID,可以写多个模板ID,看自己的需求
  80. success: function (s) {
  81. _this.setState({
  82. loading: false,
  83. })
  84. _this.login();
  85. },
  86. fail: function (err) {
  87. _this.setState({
  88. loading: false,
  89. })
  90. //console.log(err)
  91. }
  92. })
  93. } else {
  94. this.setState({
  95. isOpened: true,
  96. loading: false,
  97. })
  98. }
  99. },
  100. fail: () => {
  101. this.setState({
  102. loading: false,
  103. })
  104. }
  105. })
  106. }
  107. login() {
  108. if (!this.state.username) {
  109. Taro.showToast({
  110. title: '请输入用户名',
  111. icon: 'none',
  112. duration: 2000
  113. })
  114. return;
  115. }
  116. if (!this.state.password) {
  117. Taro.showToast({
  118. title: '请输入密码',
  119. icon: 'none',
  120. duration: 2000
  121. })
  122. return;
  123. }
  124. this.setState({
  125. loading: true,
  126. })
  127. login({
  128. username: this.state.username,
  129. password: this.state.password
  130. }).then((msg) => {
  131. this.setState({
  132. loading: false
  133. });
  134. if (!msg.data.openId) {
  135. Taro.login({
  136. success: (res) => {
  137. setOpenId({
  138. code: res.code,
  139. }).then(v => {
  140. if (v.error.length === 0) {
  141. this.setUsernameList(this.state.username, this.state.password);
  142. Taro.eventCenter.trigger('getStorageSync');
  143. this.getWorkingHours(msg.data.departmentId);
  144. } else {
  145. Taro.showToast({
  146. title: v.error[0].message,
  147. icon: 'none',
  148. })
  149. }
  150. })
  151. },
  152. fail: () => {
  153. Taro.showToast({ title: '系统错误,请稍后重试' })
  154. }
  155. });
  156. } else {
  157. this.setUsernameList(this.state.username, this.state.password);
  158. Taro.eventCenter.trigger('getStorageSync');
  159. this.getWorkingHours(msg.data.departmentId);
  160. }
  161. }).catch((err) => {
  162. //console.log(err)
  163. this.setState({
  164. loading: false
  165. })
  166. })
  167. }
  168. getWorkingHours(depId) {
  169. getWorkingHours({
  170. depId
  171. }).then((msg) => {
  172. if (msg.error.length === 0) {
  173. let obj = Taro.getStorageSync('userInfor');
  174. obj.workTimeInfor = msg.data;
  175. Taro.setStorageSync('userInfor', obj);
  176. Taro.switchTab({
  177. url: '/pages/punchClock/index',
  178. })
  179. } else {
  180. Taro.showToast({ title: msg.error[0].message, icon: 'none' })
  181. }
  182. }).catch((err) => {
  183. // console.log(err)
  184. })
  185. }
  186. setUsernameList(username, password) {
  187. if (!this.state.rememberPassword) {
  188. let usernameList = Taro.getStorageSync('usernameList') || [];
  189. let index = usernameList.findIndex(v => v.username === username);
  190. if (index !== -1) {
  191. usernameList.splice(index, 1)
  192. }
  193. Taro.setStorageSync('usernameList', usernameList);
  194. } else {
  195. let usernameList = Taro.getStorageSync('usernameList') || [];
  196. let index = usernameList.findIndex(v => v.username === username);
  197. if (index === -1) {
  198. usernameList.push({
  199. username,
  200. password
  201. })
  202. } else {
  203. usernameList[index] = {
  204. username,
  205. password
  206. }
  207. }
  208. Taro.setStorageSync('usernameList', usernameList);
  209. }
  210. }
  211. getUsernameList(value = this.state.username) {
  212. let usernameList = Taro.getStorageSync('usernameList') || [];
  213. let arr = [];
  214. for (let i of usernameList) {
  215. if (i.username.indexOf(value) !== -1) {
  216. arr.push(i)
  217. }
  218. }
  219. this.setState({
  220. usernameList: arr,
  221. isopenUsernameList: true
  222. })
  223. }
  224. render() {
  225. return (
  226. <View className='login' onClick={() => {
  227. this.setState({
  228. isopenUsernameList: false
  229. })
  230. }}>
  231. <NavBar
  232. extClass='NavBar'
  233. title='科德集团'
  234. background='#0000'
  235. color='#FFF'
  236. onHome={() => { }}
  237. />
  238. <View className='welcome'>
  239. <Image src={BG} className='bg' mode='heightFix' />
  240. <View className='welcomeTitle'>科德科技服务系统</View>
  241. <View className='welcomeTitle'>欢迎您!</View>
  242. </View>
  243. <privacy />
  244. <View className='loginContent'>
  245. <View className='loginItem'>
  246. <AtIcon value='user' size='20' color='#999999' />
  247. <View className='usernameContent'>
  248. <Input
  249. style={{ marginLeft: '15px', width: '100%' }}
  250. type='text'
  251. placeholder='请输入您的系统账户'
  252. value={this.state.username}
  253. onInput={(v) => {
  254. this.setState({
  255. username: v.detail.value
  256. })
  257. this.getUsernameList(v.detail.value);
  258. }}
  259. onFocus={() => {
  260. this.getUsernameList();
  261. }}
  262. onBlur={() => {
  263. // this.setState({
  264. // isopenUsernameList:false
  265. // })
  266. }}
  267. />
  268. </View>
  269. </View>
  270. <View className='usernameListContent'>
  271. {this.state.isopenUsernameList && this.state.usernameList.length > 0 ? <View className='usernameList'>
  272. {
  273. this.state.usernameList.map((v, k) => (
  274. <View key={k} className='usernameItem' onClick={() => {
  275. this.setState({
  276. username: v.username,
  277. password: v.password,
  278. isopenUsernameList: false
  279. })
  280. }}>
  281. <AtIcon value='user' size='20' color='#c6c4c4' />
  282. <View className='value'>
  283. <View className='name'>{v.username}</View>
  284. <View className='password'>*******</View>
  285. </View>
  286. </View>
  287. ))
  288. }
  289. </View> : null}
  290. </View>
  291. <View className='loginItem'>
  292. <AtIcon value='lock' size='20' color='#999999' />
  293. <Input
  294. style={{ marginLeft: '15px', width: '100%' }}
  295. type='password'
  296. placeholder='请输入密码'
  297. value={this.state.password}
  298. onInput={(v) => {
  299. this.setState({
  300. password: v.detail.value
  301. })
  302. }}
  303. />
  304. </View>
  305. <View className='rememberPassword'>
  306. <View className='selectContent' onClick={() => {
  307. this.setState({
  308. rememberPassword: !this.state.rememberPassword
  309. })
  310. }}>
  311. <Image src={selectIcon} className='selectIcon' style={{ visibility: this.state.rememberPassword ? "visible" : "hidden" }} />
  312. </View>
  313. 记住密码
  314. </View>
  315. <AtButton type='primary' circle loading={this.state.loading} onClick={this.authorization}>登录</AtButton>
  316. <View className='tips'>
  317. 暂无账号?请联系管理员进行添加
  318. </View>
  319. <View className='company'>
  320. 湖南科德信息咨询集团有限公司
  321. </View>
  322. </View>
  323. <AtModal
  324. isOpened={this.state.isOpened}
  325. title='提醒'
  326. cancelText='取消'
  327. confirmText='确认'
  328. onClose={() => {
  329. this.setState({
  330. isOpened: false,
  331. openedType: 0,
  332. })
  333. }}
  334. onCancel={() => {
  335. this.setState({
  336. isOpened: false,
  337. openedType: 0
  338. })
  339. }}
  340. onConfirm={() => {
  341. this.setState({
  342. isOpened: false,
  343. openedType: 0
  344. }, () => {
  345. Taro.openSetting({
  346. success: (value) => {
  347. }
  348. })
  349. })
  350. }}
  351. content={this.state.openedType === 1 ? '您存在拒绝接收的消息类型,请点击确认按钮,前往设置页->通知管理,点击不接受的消息通知类型,调整为允许' : '您关闭了接收通知权限,将不能收到订阅通知,请点击确认按钮,前往设置页->通知管理->接收通知,打开接收通知权限'}
  352. />
  353. </View>
  354. )
  355. }
  356. }
  357. export default Login