mooho-base-admin-plus 0.1.0

package/src/pages/system/tableView.vue

@@ -0,0 +1,386 @@
+<template>
+  <div>
+    <div class="i-layout-page-header">
+      <PageHeader :title="$route.meta.title" :content="$route.meta.description" hidden-breadcrumb />
+    </div>
+    <Card :bordered="false" dis-hover class="ivu-mt">
+      <view-table ref="table" view-code="TableView" :filter="filter" :selectEnable="true" @create="create" @edit="edit">
+        <template #filterCommand>
+          <Button size="small" type="info" custom-icon="fa fa-cloud-download-alt" @click="exportFile()">导出</Button>
+          <file-upload url="api/DataView/importFile" accept=".view" @on-success="importFileSuccess" style="display: inline-block; margin-left: 4px; margin-right: 4px">
+            <template #>
+              <Button type="primary" custom-icon="fa fa-cloud-upload-alt" size="small">导入</Button>
+            </template>
+          </file-upload>
+        </template>
+        <template #command="{ row }">
+          <Button size="small" title="字段设置" type="info" custom-icon="fa fa-bars" @click="tableSetting(row)"></Button>
+          <Button size="small" title="筛选设置" type="info" custom-icon="fa fa-filter" @click="filterSetting(row)"></Button>
+        </template>
+      </view-table>
+    </Card>
+    <modal-form ref="form" view-code="TableViewEdit" @on-change="formChange" @on-after-save="$refs.table.loadData()">
+      <template #column="{ data, code }">
+        <div v-if="code == 'keywordColumn'">
+          <Input type="text" :readonly="true" v-model="data.keywordColumn" @click="keywordColumnOpen()"></Input>
+        </div>
+        <div v-if="code == 'sorting'">
+          <Input type="text" :readonly="true" v-model="$refs.form.data.sorting" @click="openSort">
+            <template #prepend>
+              <Button custom-icon="fa fa-edit" @click="openSort"></Button>
+            </template>
+          </Input>
+        </div>
+        <div v-if="code == 'filtering'">
+          <Input type="text" :readonly="true" v-model="$refs.form.data.filtering" @click="openFilter">
+            <template #prepend>
+              <Button custom-icon="fa fa-edit" @click="openFilter"></Button>
+            </template>
+          </Input>
+        </div>
+        <div v-if="code == 'batchSelectDataCode'">
+          <Input type="text" :readonly="true" v-model="$refs.form.data.batchSelectDataCode" @click="openColumnCheck($refs.form.data, 'batchSelectDataCode')">
+            <template #prepend>
+              <Button custom-icon="fa fa-search" @click="openColumnCheck($refs.form.data, 'batchSelectDataCode')"></Button>
+            </template>
+          </Input>
+        </div>
+        <div v-if="code == 'groupColumn'">
+          <Input
+            type="text"
+            :readonly="true"
+            v-model="$refs.form.data.groupColumn"
+            @click="
+              $refs.groupColumn.open($refs.form.data.model, $refs.form.data.groupColumn, json => {
+                $refs.form.data.groupColumn = json;
+              })
+            "
+          >
+            <template #prepend>
+              <Button
+                custom-icon="fa fa-edit"
+                @click="
+                  $refs.groupColumn.open($refs.form.data.model, $refs.form.data.groupColumn, json => {
+                    $refs.form.data.groupColumn = json;
+                  })
+                "
+              ></Button>
+            </template>
+          </Input>
+        </div>
+        <div v-if="code == 'groupMethod'">
+          <Input
+            type="text"
+            :readonly="true"
+            v-model="$refs.form.data.groupMethod"
+            @click="
+              $refs.groupMethod.open($refs.form.data.model, $refs.form.data.groupMethod, json => {
+                $refs.form.data.groupMethod = json;
+              })
+            "
+          >
+            <template #prepend>
+              <Button
+                custom-icon="fa fa-edit"
+                @click="
+                  $refs.groupMethod.open($refs.form.data.model, $refs.form.data.groupMethod, json => {
+                    $refs.form.data.groupMethod = json;
+                  })
+                "
+              ></Button>
+            </template>
+          </Input>
+        </div>
+        <div v-if="code == 'editEnable'">
+          <Switch
+            :model-value="!!data.editEnable"
+            v-if="showCheck(data.editEnableJson)"
+            @update:model-value="
+              $event => {
+                data.editEnable = $event;
+                //$forceUpdate();
+              }
+            "
+            @on-change="checkChange('editEnableJson', 'editEnable')"
+          />
+          <Button
+            style="margin-left: 8px"
+            @click="$refs.conditionEdit.open(data, 'editEnableJson', 'editEnable', $refs.form.data.model)"
+            type="primary"
+            size="small"
+            icon="ios-settings"
+          >
+            条件
+          </Button>
+        </div>
+        <div v-if="code == 'removeEnable'">
+          <Switch
+            :model-value="!!data.removeEnable"
+            v-if="showCheck(data.removeEnableJson)"
+            @update:model-value="
+              $event => {
+                data.removeEnable = $event;
+                //$forceUpdate();
+              }
+            "
+            @on-change="checkChange('removeEnableJson', 'removeEnable')"
+          />
+          <Button
+            style="margin-left: 8px"
+            @click="$refs.conditionEdit.open(data, 'removeEnableJson', 'removeEnable', $refs.form.data.model)"
+            type="primary"
+            size="small"
+            icon="ios-settings"
+          >
+            条件
+          </Button>
+        </div>
+      </template>
+      <template #footer>
+        <Button type="primary" custom-icon="fa fa-save" @click="() => $refs.form.onSave()">保存</Button>
+        <Button type="primary" v-if="canCopy" custom-icon="fa fa-copy" @click="copy">复制</Button>
+      </template>
+    </modal-form>
+    <modal-form-sort ref="modal_sort" :sort="data.sorting" :dataView="data" @bindSort="bindSort" />
+    <modal-form-filter ref="modal_filter" :filter="data.filtering" :dataView="data" @bindFilter="bindFilter" />
+    <table-setting ref="tableSetting" />
+    <filter-setting ref="filterSetting" />
+    <column-select ref="columnSelect" />
+    <column-check ref="columnCheck" />
+    <group-method ref="groupMethod" />
+    <group-column ref="groupColumn" />
+    <condition-edit ref="conditionEdit" />
+  </div>
+</template>
+<script>
+  import dataViewApi from '../../api/dataView';
+  import mixinPage from '../../mixins/page';
+  import viewColumnApi from '../../api/viewColumn';
+  import filterColumnApi from '../../api/filterColumn';
+  import columnSelect from '../../components/view/column-select';
+  import columnCheck from '../../components/view/column-check';
+  import filterSetting from '../../components/view/filter-setting';
+  import groupMethod from '../../components/view/group-method';
+  import groupColumn from '../../components/view/group-column';
+  import conditionEdit from '../../components/view/condition-edit';
+
+  export default {
+    name: 'system-ui-tableView',
+    mixins: [mixinPage],
+    components: { columnSelect, columnCheck, filterSetting, groupMethod, groupColumn, conditionEdit },
+    data() {
+      return {
+        filter: {
+          viewType: 'TableView',
+          newCode: null
+        },
+        data: {},
+        canCopy: null
+      };
+    },
+    computed: {},
+    created() {},
+    methods: {
+      formChange() {
+        const data = this.$refs.form.data;
+        const columns = this.$refs.form.columns;
+
+        const columnModel = columns.find(item => {
+          return item.code === 'model';
+        });
+        const columnDataSource = columns.find(item => {
+          return item.code === 'dataSource';
+        });
+        const columnIsVirtual = columns.find(item => {
+          return item.code === 'isVirtual';
+        });
+        // const columnBatchSelectDataCode = columns.find(item => {
+        //     return item.code === 'batchSelectDataCode';
+        // });
+        // const columnHolder1 = columns.find(item => {
+        //     return item.code === 'holder1';
+        // });
+
+        if (data.isDataSource) {
+          columnIsVirtual.isShow = false;
+          columnModel.isShow = false;
+          columnDataSource.isShow = true;
+        } else {
+          columnIsVirtual.isShow = true;
+          columnDataSource.isShow = false;
+
+          if (data.isVirtual) {
+            columnModel.isShow = false;
+          } else {
+            columnModel.isShow = true;
+          }
+        }
+
+        // if (data.batchSelectEnable) {
+        //     columnBatchSelectDataCode.isShow = true;
+        //     columnHolder1.isShow = false;
+        // } else {
+        //     columnBatchSelectDataCode.isShow = false;
+        //     columnHolder1.isShow = true;
+        // }
+
+        //this.$refs.form.forceUpdate();
+      },
+      // 字段设置
+      async tableSetting(row) {
+        let res = await viewColumnApi.queryByDataViewID(row.id);
+        this.$refs.tableSetting.open(row, res.data);
+      },
+      // 筛选设置
+      async filterSetting(row) {
+        let res = await filterColumnApi.queryByDataViewID(row.id);
+        this.$refs.filterSetting.open(row, res.data);
+      },
+      //绑定排序组件返回的排序json
+      bindSort(value) {
+        this.$refs.form.data.sorting = value;
+        // this.data.sorting = value;
+      },
+      //绑定筛选组件返回的排序json
+      bindFilter(value) {
+        this.$refs.form.data.filtering = value;
+        // this.data.filtering = value;
+      },
+      // 打开排序编辑框
+      async openSort() {
+        if (!this.$refs.form.data.model == '') {
+          this.data = this.$refs.form.data;
+          this.$refs.modal_sort.open();
+        } else {
+          this.error('请先选择模型！');
+        }
+      },
+      // 打开筛选编辑框
+      async openFilter() {
+        if (!this.$refs.form.data.model == '') {
+          this.data = this.$refs.form.data;
+          this.$refs.modal_filter.open();
+        } else {
+          this.error('请先选择模型！');
+        }
+      },
+      // 导出文件
+      exportFile() {
+        let ids = this.$refs.table.getSelected().map(x => {
+          return x.id;
+        });
+        if (ids.length > 0) {
+          dataViewApi.exportFile(ids);
+        } else {
+          this.error('请选择需要导出的内容！');
+        }
+      },
+      // 导入成功
+      importFileSuccess(res) {
+        if (res.code == 0) {
+          this.success('导入成功！', () => {
+            this.$refs.table.loadData();
+          });
+        } else {
+          this.error(res.message);
+        }
+      },
+      // 复制
+      copy() {
+        if (!this.$refs.form.data.id) {
+          this.error('新建时不能复制');
+          return;
+        }
+
+        this.confirmInput(
+          '确认要复制并创建新的视图吗？',
+          '视图代码',
+          async () => {
+            let dataView = await dataViewApi.copy(this.$refs.form.data.id, this.newCode);
+            this.$refs.form.open(dataView);
+            this.$refs.table.loadData();
+          },
+          newCode => {
+            if (!(newCode || '').trim()) {
+              this.warning('请输入需要创建的视图代码！');
+              return false;
+            } else {
+              this.newCode = newCode;
+              return true;
+            }
+          }
+        );
+      },
+      // 新建
+      create() {
+        this.canCopy = false;
+        this.$refs.form.openDefault({ viewType: 'TableView' });
+      },
+      // 编辑
+      edit({ row }) {
+        this.canCopy = true;
+        this.$refs.form.open(row);
+      },
+      // 打开字段选择界面
+      openColumnCheck(data, code) {
+        if (data.model == null) {
+          return;
+        }
+
+        this.$refs.columnCheck.open(data.model, checked => {
+          data[code] = checked.code;
+          //this.$forceUpdate();
+        });
+      },
+      // 打开筛选字段选择
+      keywordColumnOpen() {
+        if (!(this.$refs.form.data.model || '').trim()) {
+          this.error('请先选择模型！');
+          return;
+        }
+
+        let data = this.$refs.form.data;
+        let keywordColumn = data.keywordColumn;
+        let columns = [];
+
+        if (!!(keywordColumn || '').trim()) {
+          columns = keywordColumn.split(',').map(item => {
+            return { code: item };
+          });
+        }
+
+        this.$refs.columnSelect.open(this.$refs.form.data, columns, checked => {
+          this.$refs.form.data.keywordColumn = checked
+            .map(item => {
+              return item.code;
+            })
+            .join();
+
+          //this.$forceUpdate();
+        });
+      },
+      // 是否显示选择框
+      showCheck(json) {
+        if (!(json || '').trim()) {
+          return true;
+        } else {
+          let setting = JSON.parse(json);
+
+          return setting.type == 'True' || setting.type == 'False';
+        }
+      },
+      // 选择框变化
+      checkChange(jsonKey, checkKey) {
+        if (!!(this.data[jsonKey] || '').trim()) {
+          let setting = JSON.parse(this.data[jsonKey]);
+          if (this.data[checkKey]) {
+            setting.type = 'True';
+          } else {
+            setting.type = 'False';
+          }
+          this.data[jsonKey] = JSON.stringify(setting);
+        }
+      }
+    }
+  };
+</script>

package/src/pages/system/taskQueue.vue

@@ -0,0 +1,48 @@
+<template>
+  <div>
+    <div class="i-layout-page-header">
+      <PageHeader :title="$route.meta.title" :content="$route.meta.description" hidden-breadcrumb />
+    </div>
+    <Card :bordered="false" dis-hover class="ivu-mt">
+      <view-table ref="table" view-code="TaskQueue">
+        <template #command="{ row }">
+          <Button size="small" title="执行" type="primary" custom-icon="fa fa-bolt" @click="execute(row)"></Button>
+          <Button size="small" v-if="row.status == 'Pending' || row.status == 'Retry'" title="取消" type="warning" custom-icon="fa fa-times" @click="cancel(row)"></Button>
+        </template>
+      </view-table>
+    </Card>
+  </div>
+</template>
+<script>
+  import mixinPage from '../../mixins/page';
+  import taskQueueApi from '../../api/taskQueue';
+
+  export default {
+    name: 'system-taskQueue',
+    mixins: [mixinPage],
+    components: {},
+    data() {
+      return {};
+    },
+    computed: {},
+    created() {},
+    methods: {
+      // 执行
+      execute(row) {
+        this.confirm('确定要立即执行该任务吗？', async () => {
+          await taskQueueApi.execute(row.id);
+          this.success('操作成功！');
+          this.$refs.table.loadData();
+        });
+      },
+      // 取消
+      cancel(row) {
+        this.confirm('确定要取消该任务吗？', async () => {
+          await taskQueueApi.cancel(row.id);
+          this.success('取消成功');
+          this.$refs.table.loadData();
+        });
+      }
+    }
+  };
+</script>

package/src/pages/system/user.vue

@@ -0,0 +1,250 @@
+<template>
+  <div>
+    <div class="i-layout-page-header">
+      <PageHeader :title="$route.meta.title" :content="$route.meta.description" hidden-breadcrumb />
+    </div>
+    <Card :bordered="false" dis-hover class="ivu-mt">
+      <view-table ref="table" view-code="User" @create="$refs.form.open()">
+        <template #command="{ row }">
+          <Button size="small" title="角色" type="info" custom-icon="fa fa-users" @click="$refs.userRoleTable.open({ userID: row.id })"></Button>
+          <Button size="small" title="编辑" type="primary" custom-icon="fa fa-edit" @click="$refs.form.open(row)"></Button>
+          <Button size="small" title="删除" type="warning" custom-icon="fa fa-trash-alt" @click="$refs.table.remove(row)"></Button>
+        </template>
+      </view-table>
+    </Card>
+    <modal-form ref="form" view-code="UserEdit" @on-after-save="$refs.table.loadData()">
+      <template #footer>
+        <Button type="primary" custom-icon="fa fa-save" @click="$refs.form.onSave()">保存</Button>
+        <Button type="primary" custom-icon="fa fa-user-lock" @click="resetPassword">重置密码</Button>
+      </template>
+    </modal-form>
+    <modal-table ref="userRoleTable" view-code="UserRole" @edit="({ row }) => editUserRole(row)">
+      <template #filterCommand>
+        <Button size="small" type="primary" custom-icon="fa fa-plus" @click="addUserRole()">添加</Button>
+      </template>
+    </modal-table>
+    <modal-form ref="userRoleForm" view-code="UserRoleEdit" @on-after-save="$refs.userRoleTable.loadData()" @on-change="userRoleChange">
+      <template #bottom>
+        <view-table ref="userRoleDataTable" view-code="UserRoleDataEdit" :static="true">
+          <template #column="{ row, code }">
+            <template v-if="row.controlType === 'TextInput'">
+              <Input type="text" size="small" v-model="row.propertyValue" />
+            </template>
+            <template v-else-if="row.controlType === 'NumberInput'">
+              <Input type="number" size="small" number v-model="row.propertyValue" />
+            </template>
+            <template v-else-if="row.controlType === 'Select'">
+              <Select size="small" v-model="row.propertyValue" clearable :transfer="true">
+                <Option v-for="item in row._dataSource" :key="item.id" :value="item.id">{{ item.name }}</Option>
+              </Select>
+            </template>
+            <template v-else-if="row.controlType === 'DialogSelect'">
+              <dialog-select
+                v-model="row.propertyValue"
+                size="small"
+                :source="row.source"
+                :source-data-code="row.sourceDataCode"
+                :source-display-code="row.sourceDisplayCode"
+                :param="getParam(row)"
+              ></dialog-select>
+            </template>
+            <template v-else-if="row.controlType === 'MultiDialogSelect'">
+              <dialog-select
+                v-model="row.propertyValue"
+                size="small"
+                :multi="true"
+                :source="row.source"
+                :source-data-code="row.sourceDataCode"
+                :source-display-code="row.sourceDisplayCode"
+                :param="getParam(row)"
+              ></dialog-select>
+            </template>
+            <template v-else-if="row.controlType === 'Check'">
+              <Checkbox :model-value="!!parseData(row, code)" @update:model-value="$event => setData(row, code, $event)" />
+            </template>
+          </template>
+        </view-table>
+      </template>
+      <template #footer>
+        <Button type="primary" custom-icon="fa fa-save" @click="userRoleSave">保存</Button>
+      </template>
+    </modal-form>
+  </div>
+</template>
+<script>
+  import mixinPage from '../../mixins/page';
+  import modelApi from '../../api/model';
+  import userApi from '../../api/user';
+  import customModelApi from '../../api/customModel';
+
+  export default {
+    name: 'system-user',
+    mixins: [mixinPage],
+    components: {},
+    data() {
+      return {
+        userID: null,
+        factories: []
+      };
+    },
+    computed: {},
+    created() {},
+    methods: {
+      // 给角色添加用户
+      async addUserRole() {
+        this.$refs.userRoleForm.columns.find(item => item.code == 'roleID').isReadonly = false;
+
+        this.$refs.userRoleDataTable.loadData([]);
+        this.$refs.userRoleForm.openDefault(this.$refs.userRoleTable.param);
+      },
+      // 用户角色编辑
+      async editUserRole(row) {
+        this.$refs.userRoleForm.columns.find(item => item.code == 'roleID').isReadonly = true;
+
+        this.initUserRoleData(row.userID, row.roleID);
+        this.$refs.userRoleForm.open(row);
+      },
+      // 加载数据源
+      async initDataSource() {
+        for (let i = 0; i < this.roleProperties.length; i++) {
+          let item = this.roleProperties[i];
+          if (!!(item.source || '').trim()) {
+            if (item.controlType === 'Select') {
+              item._dataSource = [];
+              let param = this.getParam(item);
+
+              // 选择框、单选框组
+              if (param != null) {
+                await this.fillDataSource(item, param);
+              }
+            }
+          }
+        }
+      },
+      // 填充数据源
+      async fillDataSource(data, param) {
+        // 参数完整，查询数据
+        let res;
+        if (data.isSourceCustom) {
+          res = await customModelApi.query(data.source, param);
+        } else {
+          res = await modelApi.query(data.source, param);
+        }
+        res.data.forEach(item => {
+          data._dataSource.push({
+            id: !(data.sourceDataCode || '').trim() ? item.id : this.parseData(item, data.sourceDataCode),
+            name: this.parseData(item, data.sourceDisplayCode)
+          });
+        });
+      },
+      // 获取参数
+      getParam(data) {
+        let param = {};
+
+        if (!!(data.param || '').trim()) {
+          // 有参数
+          param = JSON.parse(data.param);
+
+          // 填充参数
+          for (let key in param) {
+            // 常量
+            let index = param[key].search(/^\[.*?\]$/);
+            if (index === 0) {
+              param[key] = param[key].substring(1, param[key].length - 1);
+              continue;
+            }
+
+            // 变量
+            let paramData = this.parseData(data, param[key]);
+
+            if (paramData != null) {
+              param[key] = paramData;
+              continue;
+            }
+
+            // 参数不完整
+            return null;
+          }
+        }
+
+        return param;
+      },
+      // 用户角色保存
+      async userRoleSave() {
+        let isOK = await this.$refs.userRoleForm.validate();
+
+        if (!isOK) {
+          this.error('有内容不符合要求，请正确填写！');
+        } else {
+          this.confirm('确定要保存吗？', async () => {
+            let userRole = this.$refs.userRoleForm.getFullData();
+
+            if (!userRole) {
+              // 表格验证失败
+              return;
+            }
+
+            let userRoleDatas = this.$refs.userRoleDataTable.data;
+
+            let data = {
+              userRole,
+              userRoleDatas
+            };
+
+            if (!userRole.id) {
+              await modelApi.add('UserRole', data);
+            } else {
+              await modelApi.update('UserRole', data);
+            }
+
+            this.success('操作成功！', () => {
+              this.$refs.userRoleDataTable.loadData([]);
+              this.$refs.userRoleTable.loadData();
+              this.$refs.userRoleForm.close();
+            });
+          });
+        }
+      },
+      // 角色变化
+      async userRoleChange(sender) {
+        if (sender && sender.code == 'roleID') {
+          let roleID = this.$refs.userRoleForm.data.roleID;
+          let userID = this.$refs.userRoleForm.data.userID;
+
+          this.initUserRoleData(userID, roleID);
+        }
+      },
+      // 初始化用户角色数据
+      async initUserRoleData(userID, roleID) {
+        let res = await modelApi.query('RoleProperty', { roleID });
+        let roleProperties = res.data;
+
+        let userRoleDatas = [];
+
+        if (this.$refs.userRoleForm.data.id) {
+          res = await modelApi.query('UserRoleData', { userID: userID, roleID: roleID });
+          userRoleDatas = res.data;
+        }
+
+        this.roleProperties = roleProperties.map(roleProperty => {
+          let userRoleData = userRoleDatas.find(item => item.propertyCode == roleProperty.propertyCode);
+
+          return {
+            ...roleProperty,
+            propertyValue: userRoleData == null ? null : userRoleData.propertyValue
+          };
+        });
+        await this.initDataSource();
+
+        this.$refs.userRoleDataTable.loadData(this.roleProperties);
+      },
+      // 重置密码
+      async resetPassword() {
+        this.confirm('确定要重置该用户的密码吗？', async () => {
+          await userApi.resetPassword(this.$refs.form.data.id);
+          this.success('已重置为初始密码！');
+        });
+      }
+    }
+  };
+</script>