@epxing/business 0.0.0-stage → 5.3.0-beta.2

package/src/views/App.vue

@@ -0,0 +1,53 @@
+<template>
+  <!-- app入口 -->
+  <component v-if="load" :is="component" :page="firstPage"></component>
+</template>
+
+<script>
+/**
+ * 应用入口  获取应用配置模板
+ */
+export default {
+  name: 'epx-app',
+  computed: {
+    appConfig () {
+      return this.$store.state.config.appConfig
+    }
+  },
+
+  data () {
+    return {
+      load: false,
+      component: 'epx-app-index',
+      firstPage: {}
+    }
+  },
+  methods: {
+    getPage () {
+      const { FIRST_PAGE, MOBILE_FIRST_PAGE } = this.appConfig
+      this.$store.dispatch({ // 加回调
+        type: 'ADD_PAGE',
+        pageId: this.$isMobile ? MOBILE_FIRST_PAGE : FIRST_PAGE
+      })
+        .then((page = {}) => {
+          const { pagePath } = page
+          this.firstPage = page
+          this.component = this.$loadComponent(pagePath, this.component)
+          this.load = true
+        })
+        .catch(() => {
+          // this.component = this.$loadComponent(null, this.component)
+          this.load = true
+        })
+    }
+  },
+  created () {
+    this.getPage()
+  }
+
+}
+</script>
+
+<style>
+
+</style>

package/src/views/AppRoleSelect.vue

@@ -0,0 +1,334 @@
+<template>
+  <div :class="{'role-select': true, 'm-role-select': $isMobile}" v-if="roleList">
+    <div class="role-select__bg" :style="clientConfig.BACKGROUND_CHOICEROLE? {backgroundImage: `url(${$util.getFileUrl(clientConfig.BACKGROUND_CHOICEROLE)})`}: {}"></div>
+    <div class="select__modal">
+      <div class="app__title">
+        <span class="app__prefix" :style="{background: appConfig.COLOR}">
+          <i :class="['app__icon fa',appConfig.ICON || 'el-icon-menu' ]"></i>
+        </span>
+        <i class="app__name">{{appConfig.NAME}}</i>
+      </div>
+      <div class="role__title">请选择您的角色</div>
+      <template v-if="roleList.length>0">
+        <el-radio-group class="radio-group" v-model="mainRole" @change="setMainRole">
+          <ul :class="{'role__list': true, 'm_role_list': $isMobile}">
+            <li class="role__item" v-for="role in roleList" :key="role.ID" @click="openApp(role)">
+              <span class="role__prefix" :style="{background: appConfig.ROLE_COLOR}">
+                <i :class="['fa',role.ICON || 'el-icon-user-solid']"></i>
+              </span>
+              <span class="role__name">{{role.NAME}}</span>
+              <span class="role__opera" @click.stop>
+                <el-radio class="radio" :label="role.ID" :value="role.ID">设为默认</el-radio>
+              </span>
+            </li>
+          </ul>
+        </el-radio-group>
+      </template>
+      <div class="no-role" v-else>
+        <p>对不起，您还未得到该应用的访问授权！</p>
+        <el-button type="primary" @click="logout">退出登录</el-button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import { mapState } from 'vuex'
+import { roleStorage } from '@epxing/core/src/menu-route'
+import { migrateLegacyTheme, initTheme } from '@epxing/core/src/ui-settings'
+import storage from '@epxing/utils/src/storage'
+// 应用角色选择
+export default {
+  name: 'epx-app-role-select',
+  data () {
+    return {
+      roleList: null,
+      radio: '',
+      mainRole: null
+    }
+  },
+  computed: {
+    ...mapState({
+      clientConfig: state => state.config.clientConfig || {},
+      appConfig: state => state.config.appConfig || {}, // 应用配置
+      $isMobile: state => state.config.isMobile // 是否为移动端
+    })
+  },
+
+  methods: {
+    setTheme () {
+      const { 'CLIENT|THEME': clientTheme, 'SYSTEM|THEME': systemTheme } = this.appConfig
+      // 主题应用统一交给 core/ui-settings：个性化设置抽屉里选的主题色/暗色优先，老单值键
+      // epx_frame_theme 与应用配置（SYSTEM|THEME / CLIENT|THEME）只作兜底。
+      // 老实现在这里直接 setAttribute('data-theme', 老键)，会把用户在设置抽屉里选的主题色**盖掉**
+      // ——本页是顶层路由、不渲染 AppIndex，与「登录页个性化主题色不生效」是同一个病根。
+      // 预设名单也不再在本文件手抄一份（此前 AppIndex/本文件各一份，改一处即漂移）。
+      // 读取用 storage.get（sessionStorage 优先、localStorage 兜底，隐私模式/禁用存储时不抛错）而非裸 localStorage。
+      const skinCode = migrateLegacyTheme(storage.get('epx_frame_theme') || systemTheme || clientTheme)
+      // 自定义肤色码：查 SKIN_COLOR 取色注入 body{--color-primary}（data-theme=custom 迁移函数已写好）
+      if (skinCode) {
+        this.$http.find({
+          entityId: 'SKIN_COLOR',
+          'scope.CODE': skinCode
+        })
+          .then(data => {
+            const flag = /rgb\(([\d,\s]+)\)/.test(data.data.COLOR)
+            if (flag) {
+              const style = `body {--color-primary: ${RegExp.$1}}`
+              var css = document.createElement('style')
+              css.type = 'text/css'
+              css.id = 'custom-theme'
+              if (css.styleSheet) {
+                css.styleSheet.cssText = style
+              } else {
+                css.appendChild(document.createTextNode(style))
+              }
+              document.head.appendChild(css)
+            }
+          })
+      }
+      // 引导期 src/App.vue 已 initTheme()，此处幂等 no-op；保留是为了不依赖某个外壳一定调过它。
+      initTheme()
+    },
+    getServiceRoles () {
+      return this.$http.get({
+        action: 'getServiceRoles',
+        entityId: 'FM_ROLE',
+        serviceId: this.appConfig.ID,
+        order_fields: 'ORDER_NUM,LOG_C_TIME',
+        order_mode: 'asc,asc'
+      })
+        .then(role => {
+          if (role.entitys.length === 1) {
+            this.openApp(role.entitys[0])
+          } else {
+            const mainRole = role.entitys.find(role => role.MAIN_ROLE === 'true')
+            if (mainRole) {
+              this.mainRole = mainRole.ID
+              this.openApp(mainRole)
+            } else {
+            // 多个角色且没有设置默认角色
+              this.roleList = [...role.entitys]
+            }
+          }
+        })
+    },
+    setMainRole () {
+      this.$http.save({
+        action: 'setMainRole',
+        entityId: 'FM_USER_SERVICE_MAIN_ROLE',
+        serviceId: this.appConfig.ID,
+        roleId: this.mainRole
+      })
+        .then(() => {
+          this.$message.success('设置成功')
+        })
+    },
+    openApp (role) {
+      const roleCode = role.CODE + (role.TYPE === 'client' ? '-client' : '')
+      // 获取应用参数
+      const { CODE, 'SYSTEM|CODE': systemCode, 'CLIENT|CODE': clientCode } = this.appConfig
+      const { client = clientCode, system = systemCode, name: lastRouteName, ...otherParams } = this.$route.params
+      // 选定角色持久化（菜单直达路由不带 role 段，取数点从 localStorage 读）
+      roleStorage.set(client, system, roleCode)
+      let name = 'app1'
+      if (systemCode === 'epxing-frame') {
+        switch (CODE) {
+          case 'FM_SERVICE_SYSTEM':
+            name = 'system'
+            break
+          case 'FM_SERVICE_CLIENT':
+            name = 'client'
+            break
+          case 'FM_SERVICE_HALL':
+            name = 'hall'
+            break
+        }
+      }
+      // 从菜单直达链接被拦到本页的（守卫塞了 backMenu）：选完角色回到原菜单 URL
+      const { backMenu, ...restQuery } = this.$route.query
+      if (backMenu) {
+        return this.$router.replace({
+          name: name === 'hall' ? 'hallMenu' : 'appMenu',
+          params: { client, system, app: CODE, menuKey: backMenu },
+          query: restQuery
+        })
+      }
+      this.$router.replace({
+        name: lastRouteName || name,
+        params: {
+          client,
+          system,
+          app: CODE,
+          role: roleCode,
+          ...otherParams
+        },
+        query: { ...this.$route.query }
+      })
+    },
+    logout () {
+      this.$http.logout()
+        .then(() => {
+          this.$util.toLogin(true)
+        })
+    }
+  },
+  created () {
+    this.getServiceRoles()
+    this.setTheme()
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.role-select{
+  height: 100%;
+  background: #F1F3F7;
+}
+.role-select__bg {
+  height: 50%;
+  background: url('@/assets/images/role_select.webp') no-repeat center;
+  background-size: cover;
+}
+.select__modal {
+  width: 1200px;
+  height: 520px;
+  overflow: auto;
+  box-sizing: border-box;
+  padding: 30px;
+  background: var(--epx-bg-card);
+  position: relative;
+  left: 50%;
+  top: -260px;
+  margin-left: -600px;
+}
+.app__prefix {
+  float: left;
+  width: 56px;
+  height: 56px;
+  border-radius: 50%;
+  @include bg_color_primary;
+  margin-right: 20px;
+  text-align: center;
+  i {
+    font-size: 24px;
+    color: #fff;
+    line-height: 56px;
+  }
+}
+.app__name {
+  font-size: var(--epx-font-size-xl);
+  line-height: 56px;
+}
+.role__title {
+  font-size: 18px;
+  line-height: 48px;
+  text-align: center;
+  position: relative;
+  &::after {
+    content: '';
+    display: block;
+    position: absolute;
+    left: 50%;
+    bottom: 0;
+    margin-left: -38px;
+    width: 76px;
+    height: 2px;
+    background: #333333;
+  }
+}
+.radio-group {
+  width: 100%;
+}
+.role__list {
+  display: flex;
+  justify-content: center;
+  flex-wrap: wrap;
+  margin-top: 48px;
+}
+.role__item {
+  width: 200px;
+  height: 220px;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  justify-content: center;
+  margin: 0 12px;
+  cursor: pointer;
+  &:hover {
+    box-shadow: 0px 1px 16px 2px rgba(0, 0, 0, 0.1);
+    .role__opera .radio {
+      display: block;
+    }
+  }
+}
+
+.role__prefix {
+  display: block;
+  width: 82px;
+  height: 82px;
+  border-radius: 50%;
+  @include bg_color_primary;
+  text-align: center;
+  i {
+    font-size: 36px;
+    color: #fff;
+    line-height: 82px;
+  }
+}
+.role__name {
+  display: inline-block;
+  font-size: var(--epx-font-size-l);
+  padding: 20px 0;
+}
+.role__opera {
+  display: block;
+  height: 20px;
+  .radio {
+    display: none;
+  }
+}
+.no-role {
+  margin-top: 60px;
+  text-align: center;
+  >p {
+    font-size: 30px;
+    margin-bottom: 40px;
+    color: red;
+  }
+}
+.m-role-select {
+  .select__modal{
+    width: 100%;
+    height: 100%;
+    left: 0;
+    margin-left: 0;
+    padding: 10px 0;
+  }
+  .app__title {
+    display: none;
+  }
+  .role__list {
+    margin-top: 24px;
+    justify-content: flex-start;
+  }
+ .role__item {
+    width: calc(33.3% - 24px);
+    height: auto;
+    margin: 0 12px;
+ }
+ .role__prefix {
+   width: 48px;
+   height: 48px;
+   i {
+     font-size: 24px;
+     line-height: 48px;
+   }
+ }
+ .role__name {
+   font-size: var(--epx-font-size-base);
+   padding: 10px 0;
+ }
+}
+
+</style>

package/src/views/BatchEdit.vue

@@ -0,0 +1,238 @@
+<template>
+  <div class="batch-container">
+    <!-- 选择记录范围 -->
+    <el-card class="box-card noTop">
+      <template v-slot:header><div class="clearfix">
+        <span>选择记录范围</span>
+      </div></template>
+        <el-radio-group v-model="qeryscope">
+          <el-radio label="1" value="1">当前选择记录（{{$query.selects.length}}）</el-radio>
+          <el-radio label="2" value="2">当前查询记录（{{$query.total}}）</el-radio>
+        </el-radio-group>
+    </el-card>
+    <!-- 批量编辑 -->
+     <el-card class="box-card noTop">
+      <template v-slot:header><div class="clearfix">
+        <span>添加修改内容</span>
+        <el-input size="default" v-model="searchText" prefix-icon="el-icon-search" placeholder="请输入字段名称或编号" />
+      </div></template>
+      <div class="edit-container">
+        <!-- 左侧字段 -->
+        <div class="fields-container">
+          <!-- 列表 -->
+          <ul class="field-list" v-if="searchFields.length>0">
+            <li class="field-item" v-for="item in searchFields" :key="item.attriName" @click="addFormFields(item)">
+              <span>{{item.attriLabel}}</span>
+              <i class="el-icon-arrow-right"></i>
+            </li>
+          </ul>
+          <div class="no-fields" v-else>
+            暂无可选字段
+          </div>
+        </div>
+        <div class="form-container">
+          <!-- 显示表单字段 -->
+          <epx-table-form ref="form" :fieldsConfigs="formFieldConfigs" :column="1" v-model="data" :allow-delete="true" @delete="deleteFormFields"></epx-table-form>
+          <div class="form-buttons" >
+            <el-button type="primary" size="default" @click="submitForm" :loading="loading">保存</el-button>
+            <el-button size="default" @click="backPage">返回</el-button>
+          </div>
+        </div>
+      </div>
+    </el-card>
+  </div>
+</template>
+
+<script>
+import component from '@epxing/core/src/mixins/component'
+export default {
+  name: 'epx-batch-edit',
+  mixins: [component],
+  $componentType: 'page',
+  data () {
+    return {
+      loading: false,
+      qeryscope: '1',
+      fieldConfigs: [],
+      formFieldConfigs: [],
+      data: {},
+      searchText: ''
+    }
+  },
+  computed: {
+    searchFields () {
+      if (!this.searchText) return this.fieldConfigs
+      return this.fieldConfigs.filter(item => item.attriName.includes(this.searchText) || item.attriLabel.includes(this.searchText))
+    }
+  },
+  methods: {
+    addFormFields (field) {
+      // 替换数组以触发表单的 fieldsConfigs watcher，重建字段布局。
+      this.formFieldConfigs = [...this.formFieldConfigs, { ...field, state: 'EDIT' }]
+      const index = this.fieldConfigs.findIndex(item => item.attriName === field.attriName)
+      if (index !== -1) { this.fieldConfigs.splice(index, 1) }
+    },
+    deleteFormFields (field) {
+      this.fieldConfigs.push({ ...field })
+      this.formFieldConfigs = this.formFieldConfigs.filter(item => item.attriName !== field.attriName)
+    },
+    getFormData () {
+      let submitFlag = true
+      const params = {}
+      const form = this.$refs.form
+      form.validate((valid, err) => {
+        if (!valid) {
+          for (const key in err) {
+            const errMessgae = err[key][0]
+            this.$message.error(errMessgae.message)
+            submitFlag = false
+            return
+          }
+        }
+      })
+      if (submitFlag) {
+        for (let i = 0; i < this.formFieldConfigs.length; i++) {
+          const fieldConfig = this.formFieldConfigs[i]
+          const field = fieldConfig.attriName
+          const formValue = form.model.data[field]
+          if (!field.includes('#')) {
+            let submitValue = formValue
+            if (Array.isArray(formValue)) {
+              submitValue = formValue[formValue.length - 1]
+            }
+            params[fieldConfig.name || field] = submitValue || ''
+          }
+        }
+      }
+      return submitFlag ? params : false
+    },
+    submitForm () {
+      const num = this.qeryscope === '1' ? this.$query.selects.length : this.$query.total
+      // action 支持由前面页面（列表批量编辑操作）传入，优先级高于页面配置
+      const { scopeParams, params: queryParams = {}, action: queryAction } = this.$query
+      if (num < 1) {
+        this.$message.error('请选择要编辑的数据')
+        return
+      }
+      this.$confirm(`确认修改${num}条数据`, this.$t('hint'), {
+        confirmButtonText: this.$t('confirm'),
+        cancelButtonText: this.$t('cancel'),
+        type: 'warning'
+      }).then(() => {
+        const { action: pageAction = 'multiUpdateField' } = this.pageConfig
+        const action = queryAction || pageAction
+        const formParams = this.getFormData()
+        if (!formParams) return
+        // this.$http.save({
+        //   action: 'multiUpdate',
+        //   entityId: this.$metaId,
+        //   elFields: this.formFieldConfigs.map(item => item.attriName),
+        //   mulIds: this.$query.selects.map(item => item.ID),
+        //   qeryscope: this.qeryscope,
+        //   ...formParams,
+        //   ...this.$query.params
+        // })
+        const ids = this.$query.selectIds.join(',')
+        const params = {
+          action,
+          entityId: this.$metaId,
+          updateType: this.qeryscope === '2' ? 'scope' : 'id',
+          ids,
+          // qeryscope: this.qeryscope,
+          fieldValueMap: JSON.stringify(formParams),
+          scopeParams: JSON.stringify(scopeParams),
+          ...queryParams
+          // ...this.$query.params
+        }
+        if (this.qeryscope === '2') delete params.ids
+        this.loading = true
+        this.$http.save(params)
+          .then(() => {
+            this.loading = false
+            this.$message.success('编辑成功')
+            this.backPage({ reload: true })
+          })
+          .catch(err => {
+            this.loading = false
+            this.$message.error(err.message || '处理失败')
+          })
+      })
+    },
+    getFieldConfigs () {
+      this.$FieldFactory.createFields({
+        metaId: this.$metaId,
+        meta: this.$meta,
+        fields: this.$query.fields
+      })
+        .then(data => {
+          this.fieldConfigs = [...data]
+        })
+    }
+  },
+  created () {
+    if (this.$query.fields && this.$query.fields.length > 0) {
+      this.getFieldConfigs()
+    } else if (this.meta) {
+      this.fieldConfigs = this.meta.getAllFieldConfigs()
+    }
+  }
+}
+</script>
+
+<style lang="scss" scoped>
+.batch-container {
+  height: 100%;
+  overflow: auto;
+}
+.box-card {
+  margin-bottom: 16px;
+}
+.clearfix {
+  display: flex;
+  align-items: center;
+
+    :deep(.el-input) {
+      width: 200px;
+      margin-left: 16px;
+    }
+
+}
+.edit-container {
+  display: flex;
+  position: relative;
+}
+.field-list {
+  width: 240px;
+  border: 1px solid var(--epx-border);
+}
+.no-fields{
+  width: 240px;
+   padding:16px;
+   border: 1px solid var(--epx-border);
+}
+.field-item {
+  display: flex;
+  justify-content: space-between;
+  line-height: 1;
+  padding:16px;
+  border-bottom: 1px solid var(--epx-border);
+  cursor: pointer;
+  &:hover {
+    @include bg_color_primary(.2)
+  }
+}
+.field-item:last-child{
+  border-bottom: none;
+}
+.form-container {
+  display: flex;
+  flex-direction: column;
+}
+.form {
+  flex: 1;
+}
+.form-buttons {
+  margin-left: 120px;
+  margin-bottom: 10px;
+}
+</style>