eoss-ui 0.5.79 → 0.5.81-beta

package/packages/main/src/simplicity/sub-menu.vue

@@ -0,0 +1,120 @@
+<template>
+  <div class="es-simplicity-menus">
+    <div class="es-simplicity-menus-box">
+      <div class="es-simplicity-menus-title">{{ text }}</div>
+      <menu-list
+        :data="menus"
+        :menuIcon="menuIcon"
+        :color="color"
+        :backgroundColor="backgroundColor"
+        @command="handleCommand"
+      ></menu-list>
+    </div>
+    <div
+      class="es-simplicity-menus-box"
+      v-if="subMenus.length"
+      v-for="(item, index) in subMenus"
+      :key="item.id"
+    >
+      <div class="es-simplicity-menus-title">{{ item.text || item.name }}</div>
+      <menu-list
+        :index="index"
+        :data="item.data"
+        :menuIcon="menuIcon"
+        @command="handleCommand"
+      ></menu-list>
+    </div>
+  </div>
+</template>
+
+<script>
+import MenuList from './menu-list.vue';
+export default {
+  name: 'SubMenu',
+  components: { MenuList },
+  props: {
+    color: {
+      type: [String, Array],
+      default: '#fff'
+    },
+    backgroundColor: {
+      type: [String, Array],
+      default() {
+        return [
+          '#FF9C52',
+          '#2591F7',
+          '#17C27B',
+          '#1265D7',
+          '#FFC724',
+          '#E34D59'
+        ];
+      }
+    },
+    text: String,
+    menuIcon: String,
+    children: {
+      type: Array,
+      default() {
+        return [];
+      }
+    },
+    fourthTabs: {
+      type: Array,
+      default() {
+        return [];
+      }
+    }
+  },
+  data() {
+    return {
+      active: '',
+      subMenus: []
+    };
+  },
+  computed: {
+    menus() {
+      return [...this.children, ...this.fourthTabs];
+    }
+  },
+  watch: {},
+  created() {},
+  mounted() {},
+  methods: {
+    handleCommand(res, num) {
+      if (res.url) {
+        if (res.urlopenmode == 1) {
+          util.win.open(res.url);
+        } else if (res.urlopenmode == 2) {
+          util.win.location.href = res.url;
+        } else {
+          this.$emit('command', res);
+        }
+      } else if (this.active !== res.id) {
+        this.active = res.id;
+        this.subMenus = [];
+      }
+      let data = [...(res.children || []), ...(res.fourthTabs || [])];
+      if (data.length) {
+        if (num === undefined) {
+          this.subMenus = [{ ...res, data: data }];
+        } else {
+          this.subMenus.push({ ...res, data: data });
+        }
+        this.$emit(
+          'command',
+          num === undefined ? 2 : 2 + parseInt(num, 10) + 1
+        );
+      } else {
+        if (num === undefined) {
+          this.$emit('command', 1);
+        } else {
+          this.subMenus.splice(parseInt(num, 10) + 1, 1);
+          this.$emit('command', 2 + parseInt(num, 10));
+        }
+      }
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

package/packages/main/src/simplicity/user.vue

@@ -0,0 +1,243 @@
+<template>
+  <div class="es-simplicity-userinfo">
+    <div class="es-simplicity-user">
+      <div class="es-simplicity-user-name">
+        {{ user.username }}
+        <el-dropdown
+          v-if="user.identityList && user.identityList.length"
+          trigger="click"
+          placement="bottom-start"
+          @command="handleSelect"
+        >
+          <span class="el-dropdown-link">
+            <i class="es-icon-renyuanqiehuan"></i>
+          </span>
+          <el-dropdown-menu slot="dropdown">
+            <el-dropdown-item
+              v-for="item in user.identityList"
+              :key="item.id"
+              :command="item"
+              :class="{ 'is-active': user.identityId == item.id }"
+              >{{ item.name }}</el-dropdown-item
+            >
+          </el-dropdown-menu>
+        </el-dropdown>
+      </div>
+      <div class="es-simplicity-org-name">{{ user.orgName }}</div>
+      <div class="es-simplicity-dep-post">
+        <span class="es-simplicity-dep-name"> {{ user.depName }}</span>
+        <template v-if="user.postName">
+          |<span class="es-simplicity-post-name">{{ user.postName }}</span>
+        </template>
+      </div>
+
+      <avatar
+        slot="reference"
+        upload
+        :user="user"
+        :code="headImgCode"
+        @change="handleChange"
+      >
+      </avatar>
+    </div>
+    <div class="es-simplicity-notice-type" v-if="userScanBindImgUrl">
+      <div class="es-simplicity-notice-title">微信公众号：</div>
+      <img class="es-simplicity-qrcode" @click="getQrcode" :src="qrcode" />
+    </div>
+    <div class="es-simplicity-notice-type">
+      <div class="es-simplicity-notice-title">接收消息类型：</div>
+      <es-checkbox-group
+        class="es-simplicity-notice-list"
+        v-model="checked"
+        :min="1"
+        :data="notifyList"
+        @change="handleCheckboxChange"
+      ></es-checkbox-group>
+    </div>
+    <div class="es-simplicity-password" @click="handleOpen">
+      修改密码 <i class="es-icon-arrow-right"></i>
+    </div>
+    <es-dialog title="修改密码" :visible.sync="visible">
+      <userinfo v-if="visible" :contents="contents" :value="userInfo">
+      </userinfo>
+    </es-dialog>
+  </div>
+</template>
+
+<script>
+import avatar from './avatar.vue';
+import userinfo from './userinfo.vue';
+import util from 'eoss-ui/src/utils/util';
+import { debounce } from 'throttle-debounce';
+import {
+  initUserSet,
+  switchUserTo,
+  updateUserCustomInfo
+} from 'eoss-ui/src/config/api.js';
+export default {
+  name: 'User',
+  components: { avatar, userinfo },
+  props: {
+    notify: String,
+    notifyList: Array,
+    user: Object,
+    contents: Array
+  },
+  data() {
+    return {
+      userScanBindImgUrl: null,
+      qrcode: null,
+      checked: [],
+      visible: false,
+      checkPassword: null,
+      checkPasswordMsg: null,
+      headImgCode: undefined
+    };
+  },
+  computed: {},
+  watch: {
+    notify: {
+      immediate: true,
+      userInfo: {},
+      handler(val) {
+        if (val) {
+          this.checked = val.split(',');
+        }
+      }
+    }
+  },
+  beforeCreate() {
+    this.setNoticeType = debounce(1000, () => {
+      this.setNotice();
+    });
+  },
+  created() {},
+  mounted() {
+    this.getData();
+  },
+  methods: {
+    //获取用户详细信息
+    getData() {
+      util
+        .ajax({
+          url: initUserSet
+        })
+        .then((res) => {
+          if (res.rCode === 0) {
+            const results = JSON.parse(JSON.stringify(res.results));
+            this.userInfo = results.simpleUserInfo;
+            if (results.userScanBindImgUrl) {
+              this.userScanBindImgUrl = results.userScanBindImgUrl;
+              this.qrcode = this.userScanBindImgUrl;
+            }
+            this.checkPassword = results.checkPassword;
+            this.checkPasswordMsg = results.checkPasswordMsg;
+            this.headImgCode = results.headImgCode || undefined;
+          } else {
+            let msg = res.msg || '系统错误，请联系管理员！';
+            this.$message.error(msg);
+          }
+        })
+        .catch((err) => {
+          if (err.message && err.message !== 'canceled') {
+            this.$message.error(err.message);
+          }
+        });
+    },
+    //刷新公众号二维码图片
+    getQrcode() {
+      this.qrcode =
+        this.userScanBindImgUrl +
+        '&_tt=' +
+        Math.random().toString().split('.')[1];
+    },
+    //修改头像
+    handleChange(res) {
+      this.$emit('change', 'userHeadUrl', res);
+    },
+    //设置通知类型
+    setNotice() {
+      let notify = this.checked.join(',');
+      util
+        .ajax({
+          method: 'post',
+          url: updateUserCustomInfo,
+          data: {
+            notify: notify
+          }
+        })
+        .then((results) => {
+          if (results.rCode === 0) {
+            this.$message.success(results.msg);
+            this.$emit('change', 'notify', notify);
+          } else {
+            this.$message.error(results.msg || '系统错误，请联系管理员！');
+          }
+        })
+        .catch((err) => {
+          if (err.message && err.message !== 'canceled') {
+            this.$message.error(err.message);
+          }
+        });
+    },
+    //改变通知类型回调
+    handleCheckboxChange() {
+      this.setNoticeType(this.checked);
+    },
+    //切换职务
+    handleSelect(res) {
+      if (this.user.identityId !== res.id) {
+        util
+          .ajax({
+            method: 'post',
+            url: switchUserTo,
+            data: { userId: res.value }
+          })
+          .then((res) => {
+            if (res.rCode == 0) {
+              this.$emit('close');
+              util.setStorage({
+                type: this.storage,
+                key: 'userId',
+                value: res.value
+              });
+              util.removeStorage(['mainConfig', 'jump']);
+              this.$message({
+                message: res.msg,
+                type: 'success',
+                duration: 500,
+                onClose: () => {
+                  if (
+                    util.win.location.href.indexOf('#/main') > -1 ||
+                    util.win.location.href.indexOf('/main.html') > -1
+                  ) {
+                    location.reload();
+                  } else {
+                    this.$router.replace('/main');
+                  }
+                }
+              });
+            } else {
+              this.$message({
+                message: res.msg || '系统错误，请联系管理员！',
+                type: 'error',
+                duration: 1500
+              });
+            }
+          })
+          .catch((err) => {
+            if (err.message && err.message !== 'canceled') {
+              this.$message.error(err.message);
+            }
+          });
+      }
+    },
+    //打开修改密码弹窗
+    handleOpen() {
+      this.visible = true;
+    }
+  }
+};
+</script>
+
+<style lang="scss" scoped></style>

package/packages/main/src/simplicity/userinfo.vue

@@ -0,0 +1,302 @@
+<template>
+  <es-form
+    ref="form"
+    :model="model"
+    :contents="forms"
+    class="es-user-info"
+    @submit="handleFormSubmit"
+  >
+    <template slot="other">
+      <slot></slot>
+    </template>
+  </es-form>
+</template>
+<script>
+import { updateUserInfo } from 'eoss-ui/src/config/api.js';
+import util from 'eoss-ui/src/utils/util';
+
+export default {
+  props: {
+    showNotify: {
+      type: Boolean,
+      default: true
+    },
+    secret: {
+      type: Boolean,
+      default: true
+    },
+    contents: Array,
+    value: {
+      type: Object,
+      default() {
+        return {};
+      }
+    }
+  },
+  data() {
+    return {
+      model: this.value
+    };
+  },
+  computed: {
+    forms() {
+      return this.contents
+        ? this.contents
+        : [
+            {
+              name: 'orgName',
+              label: '所属机构',
+              type: 'text',
+              disabled: true,
+              col: 6
+            },
+            {
+              name: 'depName',
+              label: '所属部门',
+              type: 'text',
+              disabled: true,
+              col: 6
+            },
+            {
+              name: 'idCard',
+              label: '身份证号',
+              type: 'text',
+              disabled: true,
+              col: 6
+            },
+            {
+              name: 'outCode',
+              label: '工号',
+              type: 'text',
+              disabled: true,
+              col: 6
+            },
+            {
+              name: 'phone',
+              placeholder: '联系电话',
+              label: '联系电话',
+              type: 'text',
+              col: 6
+            },
+            {
+              name: 'email',
+              placeholder: '电子邮箱',
+              label: '电子邮箱',
+              type: 'text',
+              rules: {
+                type: 'email',
+                message: '请输入正确的邮箱地址',
+                trigger: 'blur'
+              },
+              col: 6
+            },
+            {
+              name: 'officetel',
+              placeholder: '座机号',
+              label: '座机号',
+              type: 'text',
+              rules: {
+                type: 'telephone'
+                //message: '请输入正确的邮箱地址',
+                //trigger: 'blur'
+              },
+              col: 6
+            },
+            {
+              name: 'oldpassword',
+              placeholder: '旧密码',
+              label: '旧密码',
+              type: 'text',
+              col: 6,
+              rules:
+                this.model.password || this.model.repassword
+                  ? {
+                      required: true,
+                      message: '请输入旧密码'
+                    }
+                  : {},
+              events: {
+                change: () => {
+                  if (
+                    !this.model.repassword &&
+                    !this.model.oldpassword &&
+                    !this.model.repassword
+                  ) {
+                    this.$refs.form.clearValidate();
+                  }
+                }
+              }
+            },
+            {
+              name: 'password',
+              placeholder: '新密码',
+              label: '新密码',
+              type: 'text',
+              col: 6,
+              rules: [
+                this.model.repassword || this.model.oldpassword
+                  ? {
+                      required: true,
+                      message: '请输入新密码'
+                    }
+                  : {},
+                {
+                  pattern: this.checkPassword,
+                  message: this.checkPasswordMsg
+                    ? this.checkPasswordMsg
+                    : '密码格式不合法',
+                  trigger: 'blur'
+                }
+              ],
+              events: {
+                change: () => {
+                  if (
+                    !this.model.repassword &&
+                    !this.model.oldpassword &&
+                    !this.model.repassword
+                  ) {
+                    this.$refs.form.clearValidate();
+                  }
+                }
+              }
+            },
+            {
+              name: 'repassword',
+              placeholder: '确认新密码',
+              label: '确认新密码',
+              type: 'text',
+              col: 6,
+              rules: [
+                this.model.password || this.model.oldpassword
+                  ? {
+                      required: true,
+                      message: '请再次输入新密码'
+                    }
+                  : {},
+                { validator: this.repassword, trigger: 'blur' },
+                this.checkPassword
+                  ? {
+                      pattern: this.checkPassword,
+                      message: this.checkPasswordMsg
+                        ? this.checkPasswordMsg
+                        : '密码格式不合法',
+                      trigger: 'blur'
+                    }
+                  : {}
+              ],
+              events: {
+                change: () => {
+                  if (
+                    !this.model.repassword &&
+                    !this.model.oldpassword &&
+                    !this.model.repassword
+                  ) {
+                    this.$refs.form.clearValidate();
+                  }
+                }
+              }
+            }
+          ];
+    }
+  },
+  created() {},
+  mounted() {},
+  methods: {
+    handleFormSubmit() {
+      let initLogin = util.getStorage('initLogin');
+      initLogin && (initLogin = JSON.parse(initLogin));
+      util
+        .ajax({
+          url: updateUserInfo,
+          params: {
+            email: this.model.email,
+            officeTel: this.model.officeTel,
+            phone: this.model.phone,
+            oldPassword:
+              this.secret &&
+              initLogin &&
+              initLogin.secret &&
+              this.model.oldpassword
+                ? util.esmEncrypt({
+                    data: this.model.oldpassword,
+                    key: initLogin.secret
+                  })
+                : this.model.oldpassword,
+            password:
+              this.secret &&
+              initLogin &&
+              initLogin.secret &&
+              this.model.password
+                ? util.esmEncrypt({
+                    data: this.model.password,
+                    key: initLogin.secret
+                  })
+                : this.model.password
+          }
+        })
+        .then((res) => {
+          if (res.rCode === 0) {
+            if (this.model.oldpassword && this.model.password) {
+              this.$confirm('密码修改成功,请重新登录！', '提示', {
+                confirmButtonText: '确定',
+                cancelButtonText: '取消',
+                closeOnClickModal: false,
+                type: 'warning'
+              })
+                .then(() => {
+                  const loginPage =
+                    util.getStorage('login') || util.getStorage('loginPage');
+                  try {
+                    if (loginPage) {
+                      let src;
+                      if (!util.startWith(loginPage, ['http', '/'], true)) {
+                        let pathname = util.win.top.location.pathname;
+                        if (pathname !== '/') {
+                          pathname = pathname.split('/');
+                          pathname.splice(pathname.length - 1);
+                          pathname = pathname.join('/');
+                          src = pathname + '/' + loginPage.replace('./', '');
+                        } else {
+                          src = pathname + loginPage.replace('./', '');
+                        }
+                      } else {
+                        src = loginPage;
+                      }
+                      util.win.top.location.href = src;
+                    } else if (
+                      util.win.top.location.href.indexOf('main.html') > -1
+                    ) {
+                      util.win.top.location.href = './login.html';
+                    } else {
+                      const hash = util.win.top.location.hash;
+                      if (hash) {
+                        const len = util.win.top.location.href.indexOf(hash);
+                        util.win.top.location.href =
+                          util.win.location.href.slice(0, len) + '#/login';
+                      } else {
+                        util.win.top.location.href = '/login.html';
+                      }
+                    }
+                  } catch (error) {
+                    util.win.postMessage({ type: 1 }, '*');
+                  }
+                })
+                .catch((e) => {});
+            }
+          } else {
+            let msg = res.msg || '系统错误，请联系管理员！';
+            this.$message.error(msg);
+          }
+        });
+    },
+    repassword(rule, value, callback) {
+      if (this.model.oldpassword && this.model.password && value) {
+        util.identical({ value: [value, this.model.password], callback });
+      } else {
+        callback();
+        return true;
+      }
+    }
+  }
+};
+</script>