添加密码找回，邮箱

src/api/cretlogin.js

@@ -0,0 +1,11 @@
+import request from '@/utils/request-emal'
+
+//修改密码
+export function modifypass (params) {
+  return request({
+      url: '/openApi/query',
+      method: 'post',
+      data: params,
+      istoken: true
+  })
+}

src/api/login.js

@@ -62,3 +62,13 @@ export function getToken (params) {
         istoken: true
     })
 }
+
+//修改密码
+export function modifypass (params) {
+    return request({
+        url: '/openApi/query',
+        method: 'post',
+        data: params,
+        istoken: true
+    })
+}

src/utils/request-emal.js

@@ -0,0 +1,118 @@
+import axios from 'axios'
+import { MessageBox, Message } from 'element-ui'
+import { getToken, getCodeToken, TokenKey } from '@/utils/auth'
+import store from '@/store'
+let isMttoken
+// create an axios instance
+const service = axios.create({
+  //baseURL: baseURL, // url = base url + request url
+  // baseURL: 'http://106.14.243.117:9112',
+  //baseURL: 'http://106.14.243.117:9111',
+  baseURL: `${PLATFROM_CONFIG.baseNewUrl}`,
+  // withCredentials: true, // send cookies when cross-domain requests
+  timeout: 30000, // request timeout
+  headers: {
+    'Content-Type': 'application/json'
+  },
+})
+// request interceptor
+service.interceptors.request.use(
+  config => {
+    config.headers["token"] = getCodeToken();
+    // config.headers.common["content-type"] = "application/json"
+    if (config.istoken) {
+      config.headers['appSecret'] = PLATFROM_CONFIG.appKeyString
+      isMttoken = config.istoken
+    }
+    return config
+  },
+  error => {
+    // do something with request error
+
+    return Promise.reject(error)
+  }
+)
+
+// response interceptor
+service.interceptors.response.use(
+  /**
+   * If you want to get http information such as headers or status
+   * Please return  response => response
+  */
+
+  /**
+   * Determine the request status by custom code
+   * Here is just an example
+   * You can also judge the status by HTTP Status Code
+   */
+  response => {
+    const res = response.data
+
+    // if the custom code is not 20000, it is judged as an error.
+    if (res.code != 0) {
+      Message({
+        message: res.message || 'Error',
+        type: 'error',
+        duration: 5 * 1000
+      })
+
+      // 50008: Illegal token; 50012: Other clients logged in; 50014: Token expired;
+      if (!isMttoken) {
+        if (res.code == 500) {
+          // to re-login
+          Message({
+            message: '身份令牌过期或失效，即将重新登录',
+            type: 'error',
+            duration: 5 * 1000,
+            onClose: () => {
+              store.dispatch('user/resetToken').then(() => {
+                location.reload()
+              })
+            }
+          })
+        }
+      }
+      return Promise.reject(new Error(res.message || 'Error'))
+    } else {
+      return res
+    }
+  },
+  error => {
+    if (isMttoken) {
+      store.dispatch("user/setIsLogin", true);
+    }
+
+    // const des = `${error}`.split(" ").includes('500')
+    // if (des) {
+    //   Message({
+    //     message: '身份令牌过期或失效，即将重新登录',
+    //     type: 'error',
+    //     duration: 5 * 1000,
+    //     onClose: () => {
+    //       store.dispatch('user/resetToken').then(() => {
+    //         location.reload()
+    //       })
+    //     }
+    //   })
+    //   // MessageBox.confirm('You have been logged out, you can cancel to stay on this page, or log in again', 'Confirm logout', {
+    //   //   confirmButtonText: 'Re-Login',
+    //   //   cancelButtonText: 'Cancel',
+    //   //   type: 'warning'
+    //   // }).then(() => {
+    //   //   store.dispatch('user/resetToken').then(() => {
+    //   //     location.reload()
+    //   //   })
+    //   // })
+    // } else {
+    //   Message({
+    //     message: error.message,
+    //     type: 'error',
+    //     duration: 5 * 1000
+    //   })
+    // }
+    //loadingInstance.close()
+    return Promise.reject(error)
+  }
+)
+
+export default service

src/views/login/index.vue

@@ -31,19 +31,43 @@
         </el-form-item>
         <img @click="changeCode" style="width: 116px;height: 40px;margin-left: 18px;cursor: pointer;" :src="baseImg" alt="验证码">
       </div>
-
+      <div class="pass">
+        <div class="retrieve" @click="retrievepas">找回密码</div>
+      </div>
       <el-button :loading="loading" type="primary" style="width: 100%;margin-top: 18px;height: 42px;border-radius: 2px;" @click.native.prevent="handleLogin">登录</el-button>
     </el-form>
+    <Dialog width="496px" customClass="dataStoreInfoDialog" :flag="pwdflag">
+      <div class="dialog-public-background">
+        <div class="title">修改密码</div>
+        <div class="content">
+          <el-form :model="dataForm" :rules="dataRules" ref="dataForm" class="demo-dataForm">
+            <el-form-item label="账号" prop="username">
+              <el-input size="medium" placeholder="请输入账号"  v-model="dataForm.username"></el-input>
+            </el-form-item>
+            <el-form-item label="邮箱" prop="mailbox">
+              <el-input size="medium" placeholder="请输入邮箱"  v-model="dataForm.mailbox"></el-input>
+            </el-form-item>
+          </el-form>
+        </div>
+        <div class="foot center t30">
+          <el-button size="medium" type="primary" @click.native.prevent="modpass('dataForm')" class="r24">保存</el-button>
+          <el-button size="medium" @click="resetForm('dataForm')">取消</el-button>
+        </div>
+      </div>
+    </Dialog>
   </div>
 </template>
 
 <script>
 import { isValue } from "@/utils/validate";
 import { getVCode, getToken } from "@/api/login";
+import { modifypass } from "@/api/cretlogin";
 import { setCodeToken, getCodeToken, setToken } from '@/utils/auth';
+import Dialog from '@/layout/components/Dialog'
 import MD5 from 'blueimp-md5'
 export default {
   name: "Login",
+  components: {Dialog},
   data () {
     return {
       text: `<a onclick='("XSS")'>链接</a>`,
@@ -70,7 +94,18 @@ export default {
       pageTitle: '',
       imgSrc: '',
       baseImg: '',
-      appId: ''
+      appId: '',
+      dataForm: {
+        username: '',
+        mailbox: ''
+      },
+      pwdflag: false,
+      dataRules:{
+        //数据项表单验证
+        username: [{ required: true, message: '请输入账号', trigger: 'blur' }],
+        mailbox: [{ required: true, pattern: /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/, message: '请输入正确的邮箱格式', trigger: 'blur' }],
+      },
+      app_token: ''
     };
   },
   watch: {
@@ -92,6 +127,7 @@ export default {
         this.imgSrc = window.location.origin + app_log
         this.pageTitle = app_name
         this.isCode = app_code_rule
+        this.app_token = app_token
         setCodeToken(app_token);
         setToken('active_duration', active_duration);
         sessionStorage.setItem('appLog', app_log)
@@ -164,6 +200,39 @@ export default {
     },
     errorHandler () {
       return true
+    },
+    //找回密码
+    retrievepas(){
+      this.pwdflag = true
+    },
+    //存储数据项-取消
+    resetForm (formName) {
+      this.$refs[formName].resetFields()
+      this.pwdflag=false
+    },
+    //修改密码
+    async modpass (formName) {
+      try {
+        const { code, returnData, message } = await modifypass({
+        "page": 1,
+        "pageSize": 10,
+        "serviceId": 2006021,
+        "dataContent": {
+          "user_name": this.dataForm.username,
+          "email": this.dataForm.mailbox
+        },
+        "event":"0"
+      })
+      if (code == 0 ) {
+        this.$message.success('修改成功');
+        this.pwdflag = false,
+        this.$refs[formName].resetFields()
+      }else {
+        this.$message.error(message);
+      }
+      } catch (error) {
+        this.$message.error(error.message);
+      }
     }
   },
 };
@@ -208,6 +277,16 @@ $light_gray: #eee;
       }
     }
   }
+  .pass{
+    display: flex;
+    justify-content: flex-end;
+    .retrieve{
+      font-size: 12px;
+      cursor: pointer;
+      color: #2d67e3;
+      border-bottom: 1px solid #2d67e3;
+    }
+  }
   .forgetPwd {
     display: flex;
     justify-content: flex-end;

src/views/newUserManagement/index.vue

@@ -84,10 +84,13 @@
         <div class="newUserManagement-content-right-bottom">
           <div class="head flex">
             <div class="title">账号列表</div>
-            <el-button @click="handleTableAdd" type="primary" size="small" :disabled="addUserDisabled">新增</el-button>
+            <div>
+              <el-button @click="handleTableAdd" type="primary" size="small" :disabled="addUserDisabled">新增</el-button>
+              <el-button @click="exportHandler('userTableData')" type="primary" size="small" :disabled="addUserDisabled">导出</el-button>
+            </div>
           </div>
           <div class="contents">
-            <el-table :data="tableData" height="100%" border style="width: 100%">
+            <el-table :data="tableData" height="100%" border style="width: 100%" ref="userTableData">
               <el-table-column prop="user_name" label="用户名">
               </el-table-column>
               <el-table-column prop="user_status" label="状态">
@@ -105,6 +108,8 @@
                   <div v-if="scope.row.LogoutTime">{{ scope.row.LogoutTime.replace('T',' ') }}</div>
                 </template>
               </el-table-column>
+              <el-table-column prop="email" label="邮箱">
+              </el-table-column>
               <el-table-column prop="user_comment" label="描述">
               </el-table-column>
               <el-table-column label="操作" width="235">
@@ -161,6 +166,9 @@
             <el-form-item label="二级密码" prop="user_sec_pwd">
               <el-input v-model="ruleForm.user_sec_pwd" size="small" placeholder="请输入二级密码" />
             </el-form-item>
+            <el-form-item label="邮箱" prop="email">
+              <el-input v-model="ruleForm.email" size="small" placeholder="请输入邮箱" />
+            </el-form-item>
             <!-- <el-form-item label="令牌有限期" prop="token_valid_duration">
               <el-input v-model="ruleForm.token_valid_duration" size="small" placeholder="请输入令牌有限期(小时)" />
             </el-form-item> -->
@@ -217,6 +225,9 @@ import Dialog from '@/layout/components/Dialog'
 import pf from '@/layout/mixin/publicFunc'
 import MD5 from 'blueimp-md5'
 import { listToTree } from '@/utils/validate'
+import XLSX from "xlsx";
+import { Format } from '@/utils/validate'
+import { exportToExcel } from '@/utils/table'
 export default {
   name: 'NewManageMent',
   components: { Dialog },
@@ -257,12 +268,14 @@ export default {
         "user_pwd": null,
         "user_sec_pwd": null,
         "user_status": null,
-        "user_token": null
+        "user_token": null,
+        "email":null
       },
       tableRules: {
         user_name: [{ required: true, message: "请输入账号名称", trigger: "blur" }],
         user_group_id: [{ required: true, message: '请选择账号组', trigger: 'change' }],
         user_pwd: [{ required: true, message: "请输入密码", trigger: "blur" }],
+        email: [{ required: true, pattern: /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/, message: '请输入正确的邮箱格式', trigger: 'blur' }],
       },
       paswordFlag: false,//修改密码
       tableFlag: false,
@@ -292,7 +305,8 @@ export default {
         label: 'user_group_name'
       },
       arrTree: [],
-      treeCheckObj: {}
+      treeCheckObj: {},
+      groupname:''
     }
   },
   watch: {
@@ -344,6 +358,7 @@ export default {
       // this.treeCheckId = this.arrs[this.arrs.length-1].user_group_id
     },
     async handleNodeClick (data) {
+      this.groupname = data.user_group_name
       if (data.user_group_id) {
         const datas = this.arrTree.filter(item => item.user_group_id == data.up_user_group_id)
         this.treeCheckId = data.user_group_id
@@ -623,7 +638,39 @@ export default {
       this.paswordFlag = false
       this.tableFlag = false
       this.clearTableForm()
-    }
+    },
+    //导出
+    downFile() {
+      var wb = XLSX.utils.table_to_book(
+        document.querySelector("#userTableData")
+      );
+      var wbout = XLSX.write(wb, {
+        bookType: "xlsx",
+        bookSST: true,
+        type: "array",
+      });
+      try {
+        FileSaver.saveAs(
+          new Blob([wbout], {
+            type: "application/octet-stream",
+          }),
+        this.groupname + Format('yyyy-MM-dd', new Date()), + ".xlsx"
+        );
+      } catch (e) {
+        if (typeof console !== "undefined") console.log(e, wbout);
+      }
+      return wbout;
+    },
+    exportHandler: _.throttle(
+      function (refName) {
+        const table = this.$refs[refName].$el.cloneNode(true)
+        const fileName = `${ this.groupname + Format('yyyy-MM-dd', new Date())}.xlsx`
+        console.log(fileName)
+        exportToExcel(table, this.groupname, fileName)
+      },
+      2000,
+      { trailing: false }
+    ),
   }
 }
 </script>