添加密码修改

chuanyi_client2/src/api/user.js

@@ -87,3 +87,19 @@ export function getUserInfo(params) {
         params
     })
 }
+
+/**
+ * 修改密码
+ * @param data
+ * @returns {AxiosPromise}
+ */
+export function updatePwd(data) {
+    return request({
+        url: '/user/updatePassWord',
+        headers: {
+            isToken: true
+        },
+        method: 'post',
+        data
+    })
+}

chuanyi_client2/src/components/HeaderPersonal/index.vue

@@ -13,19 +13,90 @@
         <el-dropdown-item @click.native="logout">退出登录</el-dropdown-item>
       </el-dropdown-menu>
     </el-dropdown>
+
+    <!-- 用户密码修改 -->
+    <el-dialog
+        title="修改密码"
+        width="500px"
+        center
+        :before-close="dialogClose"
+        :visible.sync="dialogPwdVisible"
+        :close-on-click-modal="false"
+        :append-to-body="true">
+      <div>
+        <el-form ref="userPwdForm" :model='userPwdForm' :rules="userPwdRules" label-width='100px'>
+          <el-form-item label='原密码' prop="password">
+            <el-input v-model='userPwdForm.password'
+                      type="password"
+                      auto-complete="off"
+                      placeholder="请输入原密码"></el-input>
+          </el-form-item>
+          <el-form-item label='新密码' prop="newPassword">
+            <el-input v-model='userPwdForm.newPassword'
+                      type="password"
+                      auto-complete="off"
+                      placeholder="请输入新密码"></el-input>
+          </el-form-item>
+          <el-form-item label='确认密码' prop="confirmPassword">
+            <el-input v-model='userPwdForm.confirmPassword'
+                      type="password"
+                      auto-complete="off"
+                      placeholder="请再次输入密码"></el-input>
+          </el-form-item>
+        </el-form>
+      </div>
+      <div style="text-align: center; margin-top: 40px;">
+        <el-button type="primary" @click="updateUserPwdEvent">确定</el-button>
+        <el-button @click="dialogClose">取消</el-button>
+      </div>
+    </el-dialog>
+
   </div>
 </template>
 
 <script>
 import avatarDefault from '@/assets/images/default.png'
-import { mapGetters } from 'vuex'
-import { Message } from 'element-ui'
+import {mapGetters} from 'vuex'
+import {updatePwd} from '@/api/user'
+import {getPubKey} from '@/utils/auth'
+import {encrypt} from '@/utils/jsencrypt'
+import {showLoading} from '@/utils/cqcy'
 
 export default {
   name: "HeaderPersonal",
   data() {
+    let checkPwd = ((rule, value, callback) => {
+      if (value.trim().length == 0) {
+        callback(new Error("请输入确认密码"))
+      } else if (value != this.userPwdForm.newPassword) {
+        callback(new Error("两次密码不一致"))
+      } else {
+        callback()
+      }
+    })
     return {
-      avatarDefault: avatarDefault
+      avatarDefault: avatarDefault,
+      dialogPwdVisible: false,
+      userPwdForm: {
+        password: '',
+        newPassword: '',
+        confirmPassword: ''
+      },
+      userPwdRules: {
+        password: [
+          {required: true, message: '原密码不能为空', trigger: 'blur'},
+          {min: 6, max: 20, message: '原密码长度必须介于 6 和 20 之间', trigger: 'blur'}
+        ],
+        newPassword: [
+          {required: true, message: '新密码不能为空', trigger: 'blur'},
+          {min: 6, max: 20, message: '新密码长度必须介于 6 和 20 之间', trigger: 'blur'}
+        ],
+        confirmPassword: [
+          {required: true, message: '新密码不能为空', trigger: 'blur'},
+          {min: 6, max: 20, message: '新密码长度必须介于 6 和 20 之间', trigger: 'blur'},
+          {validator: checkPwd, required: true, trigger: 'blur'}
+        ]
+      }
     }
   },
   computed: {
@@ -45,12 +116,45 @@ export default {
      * 修改密码
      */
     updateUserPwd() {
-      Message.success("敬请期待")
+      if (this.$refs['userPwdForm'])
+        this.$refs['userPwdForm'].resetFields()
+      this.dialogPwdVisible = true
+    },
+    updateUserPwdEvent() {
+      this.$refs['userPwdForm'].validate(valid => {
+        if (valid) {
+          const loading = showLoading(this, '修改中，请稍候···')
+          let pubKey = getPubKey()
+          let data = {
+            'password': encrypt(this.userPwdForm.password, pubKey),
+            'newPassword': encrypt(this.userPwdForm.newPassword, pubKey),
+            'userName': this.name,
+            'userId': this.uid
+          }
+          updatePwd(data).then(res => {
+            loading.close()
+            if (res.code != 200) {
+              this.$message({
+                message: res.msg,
+                type: 'error'
+              })
+              return
+            }
+            this.$message({
+              message: '修改成功！',
+              type: 'success'
+            })
+            this.dialogClose()
+          }).catch((e) => {
+            loading.close()
+          })
+        }
+      })
     },
     /**
      * 退出登录
      */
-   logout() {
+    logout() {
       this.$confirm('您确定要退出系统吗？', '提示', {
         confirmButtonText: '确定',
         cancelButtonText: '取消',
@@ -62,6 +166,16 @@ export default {
         })
       }).catch(() => {
       });
+    },
+    /** 弹出层关闭事件 */
+    dialogClose(done) {
+      if (this.$refs['userPwdForm'])
+        this.$refs['userPwdForm'].resetFields()
+      if (typeof (done) === 'function') {
+        done()
+      } else {
+        this.dialogPwdVisible = false
+      }
     }
   }
 }

chuanyi_client2/src/utils/cqcy.js

@@ -249,3 +249,27 @@ export function showLoading(_this, tips) {
     });
     return loading
 }
+
+/**
+ * HOST 地址验证
+ * @param url
+ * @returns {boolean}
+ */
+export function testHost(url) {
+    const strRegex = '^(http(s)?://)' // (https或http或ftp):// 可有可无
+        + '(([\\w_!~*\'()\\.&=+$%-]+: )?[\\w_!~*\'()\\.&=+$%-]+@)?' // ftp的user@ 可有可无
+        + '(([0-9]{1,3}\\.){3}[0-9]{1,3}' // IP形式的URL- 3位数字.3位数字.3位数字.3位数字
+        + '|' // 允许IP和DOMAIN（域名）
+        + '(localhost)|' // 匹配localhost
+        + '([\\w_!~*\'()-]+\\.)*' // 域名- 至少一个[英文或数字_!~*\'()-]加上.
+        + '\\w+\\.' // 一级域名 -英文或数字 加上.
+        + '[a-zA-Z]{1,6})' // 顶级域名- 1-6位英文
+        + '(:[0-9]{1,5})?' // 端口- :80 ,1-5位数字
+        + '((/?)|' // url无参数结尾 - 斜杆或这没有
+        + '(/[\\w_!~*\'()\\.;?:@&=+$,%#-]+)+/?)$'; // 请求参数结尾- 英文或数字和[]内的各种字符
+    const re = new RegExp(strRegex, 'i'); // 大小写不敏感
+    if (!re.test(encodeURI(url))) {
+        return false
+    }
+    return true
+}

chuanyi_client2/src/utils/request.js

@@ -15,8 +15,9 @@ axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
 // 创建axios实例
 const service = axios.create({
     // axios中请求配置有baseURL选项，表示请求URL公共部分
+    // baseURL: "http://192.168.0.40:8081",
     // baseURL: "http://192.168.1.226:8081",
-    baseURL: "http://localhost:8081",
+    baseURL: "http://127.0.0.1:8081",
     // 超时
     timeout: 30000
 })
@@ -31,6 +32,11 @@ service.interceptors.request.use(config => {
         config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改
         config.headers['token'] = getToken()
     }
+    let sysHost = localStorage.getItem('SYS_HOST')
+    if (sysHost) {
+        config.baseURL = sysHost
+    }
+    console.log(config.baseURL)
     // get请求映射params参数
     if (config.method === 'get' && config.params) {
         let url = config.url + '?' + tansParams(config.params);

chuanyi_client2/src/views/login.vue

@@ -1,6 +1,9 @@
 <template>
   <div class="login">
     <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
+      <i class="el-icon-setting"
+         @click="editHostEvent"
+         style="float: right; margin-top: -17px; margin-right: -10px; cursor: pointer;"></i>
       <h3 class="title">川仪READOPC报表软件</h3>
       <el-form-item prop="username">
         <el-input
@@ -59,13 +62,15 @@
     <div class="el-login-footer">
       <span>Copyright © {{ copyrightDate }} 重庆川仪控制系统有限公司版权所有</span>
     </div>
+
   </div>
 </template>
 
 <script>
 import errorCode from '@/utils/errorCode'
-import { getCode } from '@/api/user';
-import { Message } from "element-ui";
+import {getCode} from '@/api/user'
+import {Message} from 'element-ui'
+import {testHost} from '@/utils/cqcy'
 
 export default {
   name: "Login",
@@ -99,6 +104,7 @@ export default {
       rememberMeView: true,
       // 版权信息
       copyrightDate: new Date().getFullYear(),
+      dialogServerVisible: false,
       redirect: undefined
     };
   },
@@ -154,7 +160,7 @@ export default {
           }
           this.loading = true;
           this.$store.dispatch('user/Login', this.loginForm).then(() => {
-            this.$router.push({ path: this.redirect || '/', query: {} })
+            this.$router.push({path: this.redirect || '/', query: {}})
             this.loading = false
           }).catch(() => {
             this.loading = false
@@ -164,6 +170,30 @@ export default {
           })
         }
       });
+    },
+    /** 设置服务端请求地址 */
+    editHostEvent() {
+      let sysHost = localStorage.getItem('SYS_HOST')
+      this.$prompt('请输入服务端地址', '温馨提示', {
+        confirmButtonText: '确定',
+        cancelButtonText: '取消',
+        inputValue: sysHost,
+        inputValidator: (val) => {
+          if (!testHost(val)) {
+            return '请输入合法的地址信息'
+          }
+        }
+      }).then(({value}) => {
+        localStorage.setItem('SYS_HOST', value)
+        this.$message({
+          type: 'success',
+          message: '设置成功 '
+        })
+        setTimeout(() => {
+          window.location.reload()
+        }, 500)
+      }).catch(() => {
+      })
     }
   }
 };

chuanyi_client2/src/views/my_report/index.vue

@@ -188,6 +188,9 @@ export default {
       this.loadReport()
     },
     switchChangeEvent(val, data) {
+      if (val) {
+        console.log(val)
+      }
       const loading = showLoading(this, '请稍候···')
       let params = {
         'id': data.id,
@@ -718,7 +721,7 @@ export default {
   }
 
   .cy-main-right {
-    width: 80%;
+    width: 100%;
     height: 100%;
     float: left;
     overflow: hidden;