Pārlūkot izejas kodu

'第一次提交'

周杰伦 4 gadi atpakaļ
vecāks
revīzija
1e25623b54

+ 1 - 0
operation-frontend/package.json

@@ -30,6 +30,7 @@
     "vue-clipboard2": "^0.2.1",
     "vue-cropper": "0.4.9",
     "vue-i18n": "^8.17.4",
+    "vue-monoplasty-slide-verify": "^1.1.3",
     "vue-quill-editor": "^3.0.6",
     "vue-router": "^3.1.2",
     "vue-svg-component-runtime": "^1.0.1",

+ 4 - 0
operation-frontend/src/components/Model/index.js

@@ -0,0 +1,4 @@
+
+import SDialog from './index.vue'
+
+export default SDialog

+ 53 - 0
operation-frontend/src/components/Model/index.vue

@@ -0,0 +1,53 @@
+<template>
+  <a-modal
+    title="title"
+    :visible="visible"
+    :confirm-loading="confirmLoading"
+    :footer="footer"
+    @ok="handleOk"
+    @cancel="handleCancel"
+    class="model"
+  >
+    <slot></slot>
+  </a-modal>
+</template>
+
+<script>
+export default {
+  name: 'Dialog',
+  props: {
+      title: {
+          type: String,
+          default: 'title'
+      },
+      visible: {
+          type: Boolean,
+          default: true
+      },
+      footer: {
+        type: null,
+        default: !null
+      }
+  },
+  data () {
+    return {
+      confirmLoading: false
+    }
+  },
+  methods: {
+    handleOk () {
+
+    },
+    handleCancel () {
+      this.$emit('cancle')
+    }
+  }
+}
+</script>
+<style scoped lang="less">
+/deep/ .ant-modal-body {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+</style>

+ 5 - 0
operation-frontend/src/global.less

@@ -92,3 +92,8 @@ ol {
     }
   }
 }
+
+
+.cp {
+  cursor: pointer;
+}

+ 2 - 1
operation-frontend/src/main.js

@@ -10,7 +10,7 @@ import i18n from './locales'
 import { VueAxios } from './utils/request'
 import ProLayout, { PageHeaderWrapper } from '@ant-design-vue/pro-layout'
 import themePluginConfig from '../config/themePluginConfig'
-
+import SlideVerify from 'vue-monoplasty-slide-verify'
 // mock
 // WARNING: `mockjs` NOT SUPPORT `IE` PLEASE DO NOT USE IN `production` ENV.
 // import './mock'
@@ -20,6 +20,7 @@ import './core/lazy_use'
 import './permission' // permission control
 import './utils/filter' // global filter
 import './global.less'
+Vue.use(SlideVerify)
 
 Vue.config.productionTip = false
 

+ 7 - 5
operation-frontend/src/utils/request.js

@@ -4,12 +4,13 @@ import storage from 'store'
 import notification from 'ant-design-vue/es/notification'
 import { VueAxios } from './axios'
 import { ACCESS_TOKEN } from '@/store/mutation-types'
+import { message } from 'ant-design-vue'
 console.log(process.env)
 // 创建 axios 实例
 const request = axios.create({
   // API 请求的默认前缀
-  baseURL: process.env.VUE_APP_API_BASE_URL,
-  // baseURL: '^/api',
+  // baseURL: process.env.VUE_APP_API_BASE_URL,
+  baseURL: '/api',
   // baseURL: 'http://192.168.1.20:38090',
 
   timeout: 6000, // 请求超时时间
@@ -57,9 +58,7 @@ request.interceptors.request.use(config => {
   // if (token) {
     // config.headers['Access-Token'] = token
   // }
-  // config.headers = {
-  //   'Access-Control-Allow-Origin': '*'
-  // }
+
   config.headers['Access-Control-Allow-Origin'] = '*'
 
   console.log(config)
@@ -69,6 +68,9 @@ request.interceptors.request.use(config => {
 // response interceptor
 request.interceptors.response.use((response) => {
   console.log(response)
+  if (response.data.code === 500) {
+    message.error(response.data.message)
+  }
   return response.data
 }, errorHandler)
 

+ 44 - 51
operation-frontend/src/views/user/Login.vue

@@ -20,7 +20,7 @@
               type="text"
               placeholder="请输入账号"
               v-decorator="[
-                'usercode',
+                'userCode',
                 {rules: [{ required: true, message: '请检查账号输入' }], validateTrigger: 'change'}
               ]"
             >
@@ -39,29 +39,9 @@
             >
               <a-icon slot="prefix" type="lock" :style="{ color: 'rgba(0,0,0,.25)' }"/>
             </a-input-password>
-          </a-form-item>
-          <a-form-item>
 
-            <a-row :gutter="8">
-              <a-col :span="16">
-                <a-input
-                  size="large"
-                  placeholder="请输入验证码"
-                  v-decorator="[
-                    'captchaCode',
-                    {rules: [{ required: true, message: '请输入验证码' }], validateTrigger: 'blur'}
-                  ]"
-                >
-                  <a-icon slot="prefix" type="lock" :style="{ color: 'rgba(0,0,0,.25)' }"/>
-                </a-input>
-              </a-col>
-              <a-col :span="8">
-
-                <img class="verify-code" @click="updateCaptchaCode" :src="img" alt="">
-
-              </a-col>
-            </a-row>
           </a-form-item>
+
         </a-tab-pane>
         <a-tab-pane key="tab2" tab="微信登录">
 
@@ -78,34 +58,49 @@
             type="primary"
             htmlType="submit"
             class="login-button"
-            :loading="state.loginBtn"
+
             :disabled="state.loginBtn"
           >确定</a-button>
         </a-form-item>
-
+        <!--     :loading="state.loginBtn" -->
       </a-form-item></a-form>
 
-    <two-step-captcha
+    <!-- <two-step-captcha
       v-if="requiredTwoStepCaptcha"
       :visible="stepCaptchaVisible"
       @success="stepCaptchaSuccess"
       @cancel="stepCaptchaCancel"
-    ></two-step-captcha>
-
+    ></two-step-captcha> -->
+
+    <!-- @fail="onFail"
+        @refresh="onRefresh" -->
+    <s-dialog :visible="visible" @cancle="visible = false" title="滑动验证">
+      <slide-verify
+        :l="42"
+        :r="10"
+        :w="310"
+        :h="155"
+        @success="userLogin"
+
+        slider-text="向右滑"
+      ></slide-verify>
+    </s-dialog>
   </div>
 </template>
 
 <script>
 import md5 from 'md5'
-import TwoStepCaptcha from '@/components/tools/TwoStepCaptcha'
+// import TwoStepCaptcha from '@/components/tools/TwoStepCaptcha'
 import { mapActions } from 'vuex'
+import SDialog from '@/components/Model'
 // import { timeFix } from '@/utils/util'
 // import { getSmsCaptcha, get2step } from '@/api/login'
 // import { getVerifyCode } from '@/api/user'
 export default {
   name: 'Login',
   components: {
-    TwoStepCaptcha
+    // TwoStepCaptcha,
+    SDialog
   },
   data () {
     return {
@@ -125,7 +120,8 @@ export default {
         smsSendBtn: false
       },
       img: '',
-      key: 1
+      key: 1,
+      visible: false
     }
   },
   created () {
@@ -163,32 +159,18 @@ export default {
     },
     handleSubmit (e) {
       e.preventDefault()
-      const {
+        const {
         form: { validateFields },
         state,
-        customActiveKey,
-        Login
-      } = this
+        customActiveKey
 
-      state.loginBtn = true
+      } = this
 
-      const validateFieldsKey = customActiveKey === 'tab1' ? ['username', 'password', 'captchaCode'] : ['mobile', 'captcha']
-      console.log(Login, 'Login')
-      validateFields(validateFieldsKey, { force: true }, async (err, values) => {
+      const validateFieldsKey = customActiveKey === 'tab1' ? ['userCode', 'password'] : ['mobile', 'captcha']
+      validateFields(validateFieldsKey, { force: true }, (err, values) => {
         if (!err) {
-          console.log('login form', values)
-          const loginParams = { ...values }
-          loginParams.password = md5(values.password)
-          const data = await Login(loginParams)
-
-          console.log(data)
-
-          // Login(loginParams)
-          //   .then((res) => this.loginSuccess(res))
-          //   .catch(err => this.requestFailed(err))
-          //   .finally(() => {
-          //     state.loginBtn = false
-          //   })
+          this.userInfo = { ...values }
+          this.visible = true
         } else {
           console.log('aaa')
           setTimeout(() => {
@@ -196,7 +178,18 @@ export default {
           }, 600)
         }
       })
+    },
+
+    // 验证通过,用户开始登陆
+    async userLogin () {
+      const { userInfo, Login } = this
+      // state.loginBtn = true
+      const loginParams = { ...userInfo }
+      loginParams.password = md5(loginParams.password)
+      const data = await Login(loginParams)
+      console.log(data)
     }
+
     // getCaptcha (e) {
     //   e.preventDefault()
     //   const { form: { validateFields }, state } = this

+ 2 - 4
operation-frontend/vue.config.js

@@ -108,10 +108,8 @@ const vueConfig = {
       '/api': {
         target: 'http://192.168.1.20:38090',
         ws: false,
-        changeOrigin: true,
-        pathRewrite: {
-          '^/api': ''
-        }
+        changeOrigin: true
+
       }
     }
   },