|
|
@@ -0,0 +1,198 @@
|
|
|
+<template>
|
|
|
+ <div>
|
|
|
+ <div class="filters-container">
|
|
|
+ <el-input placeholder="输入关键字" size="small" v-model="name" clearable class="filter-item"></el-input>
|
|
|
+ <el-button @click="getData" type="primary" size="small" icon="el-icon-search" class="filter-item">搜索
|
|
|
+ </el-button>
|
|
|
+ <el-button @click="showCreateModelDialog" type="primary" size="small" icon="el-icon-edit"
|
|
|
+ class="filter-item">创建
|
|
|
+ </el-button>
|
|
|
+ </div>
|
|
|
+ <el-table
|
|
|
+ :data="tableData"
|
|
|
+ :height="tableHeight"
|
|
|
+ row-key="id"
|
|
|
+ ref="table">
|
|
|
+ <el-table-column
|
|
|
+ v-if="multipleMode"
|
|
|
+ align="center"
|
|
|
+ type="selection"
|
|
|
+ min-width="50">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="id"
|
|
|
+ label="id"
|
|
|
+ width="150">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="name"
|
|
|
+ label="名称">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="createTime"
|
|
|
+ label="创建时间"
|
|
|
+ :formatter="datetimeFormatter">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ prop="lastUpdateTime"
|
|
|
+ label="更新时间"
|
|
|
+ :formatter="datetimeFormatter">
|
|
|
+ </el-table-column>
|
|
|
+ <el-table-column
|
|
|
+ label="操作"
|
|
|
+ align="center"
|
|
|
+ width="300">
|
|
|
+ <template slot-scope="scope">
|
|
|
+ <el-button @click="editRow(scope.row)" type="primary" size="mini" plain>编辑</el-button>
|
|
|
+ <el-button @click="editRow(scope.row)" type="success" size="mini" plain>发布</el-button>
|
|
|
+ <el-button @click="editRow(scope.row)" size="mini" plain>导出</el-button>
|
|
|
+ <el-button @click="deleteModel(scope.row)" type="danger" size="mini" plain>删除</el-button>
|
|
|
+ </template>
|
|
|
+ </el-table-column>
|
|
|
+ </el-table>
|
|
|
+ <div class="pagination-wrapper">
|
|
|
+ <el-pagination
|
|
|
+ background
|
|
|
+ @size-change="pageSizeChange"
|
|
|
+ @current-change="currentPageChange"
|
|
|
+ :current-page="currentPage"
|
|
|
+ :page-sizes="[10, 20, 30, 40, 50]"
|
|
|
+ :page-size="pageSize"
|
|
|
+ layout="total, sizes, prev, pager, next, jumper"
|
|
|
+ :total="totalNumber">
|
|
|
+ </el-pagination>
|
|
|
+ </div>
|
|
|
+ <el-dialog :visible.sync="dialogVisible" title="创建菜单">
|
|
|
+ <el-form :model="newModel" ref="newModelForm" label-position="top" size="small">
|
|
|
+ <el-form-item label="名称" prop="name" :rules="[{required: true, message: '请填写名称', trigger: 'blur'}]">
|
|
|
+ <el-input v-model="newModel.name"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ <el-form-item label="描述" prop="description"
|
|
|
+ :rules="[{required: true, message: '请填写描述', trigger: 'blur'}]">
|
|
|
+ <el-input v-model="newModel.description"></el-input>
|
|
|
+ </el-form-item>
|
|
|
+ </el-form>
|
|
|
+ <div slot="footer">
|
|
|
+ <el-button @click="dialogVisible = false" size="small">取消</el-button>
|
|
|
+ <el-button type="primary" @click="createModel" :loading="loading" size="small">保存</el-button>
|
|
|
+ </div>
|
|
|
+ </el-dialog>
|
|
|
+ </div>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ import {mapState} from 'vuex'
|
|
|
+ import axios from 'axios'
|
|
|
+
|
|
|
+ export default {
|
|
|
+ created() {
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ totalNumber: 0,
|
|
|
+ totalPage: 10,
|
|
|
+ currentPage: 1,
|
|
|
+ pageSize: 20,
|
|
|
+ tableData: [],
|
|
|
+ name: '',
|
|
|
+ multipleMode: false,
|
|
|
+ dialogVisible: false,
|
|
|
+ newModel: {
|
|
|
+ name: '',
|
|
|
+ description: ''
|
|
|
+ },
|
|
|
+ loading: false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState(['tableHeight']),
|
|
|
+ selection() {
|
|
|
+ return this.$refs.table.selection.map(i => i.id);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ pageSizeChange(size) {
|
|
|
+ this.pageSize = size;
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ currentPageChange(page) {
|
|
|
+ this.currentPage = page;
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ getData() {
|
|
|
+ var data = {};
|
|
|
+ if (this.name) {
|
|
|
+ data.name = this.name;
|
|
|
+ }
|
|
|
+ this.$http.get({
|
|
|
+ url: '/rest/repository/process-definitions',
|
|
|
+ data: data
|
|
|
+ }).then(res => {
|
|
|
+ if (res.success) {
|
|
|
+ this.totalNumber = res.data.length;
|
|
|
+ let i = this.currentPage - 1;
|
|
|
+ this.tableData = res.data.splice((i < 0 ? 0 : i) * this.pageSize, this.pageSize);
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ toggleMultipleMode(multipleMode) {
|
|
|
+ this.multipleMode = multipleMode;
|
|
|
+ if (!multipleMode) {
|
|
|
+ this.$refs.table.clearSelection();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ editRow(row) {
|
|
|
+ window.open(`${this.$baseUrl}/modeler.html?modelId=${row.id}`);
|
|
|
+ },
|
|
|
+ operation1() {
|
|
|
+ this.$notify({
|
|
|
+ title: '提示',
|
|
|
+ message: this.selection
|
|
|
+ });
|
|
|
+ },
|
|
|
+ operation2() {
|
|
|
+ this.$message('操作2');
|
|
|
+ },
|
|
|
+ showCreateModelDialog() {
|
|
|
+ this.newModel = {
|
|
|
+ name: '',
|
|
|
+ description: ''
|
|
|
+ };
|
|
|
+ this.dialogVisible = true;
|
|
|
+ },
|
|
|
+ createModel() {
|
|
|
+ this.$refs.newModelForm.validate(valid => {
|
|
|
+ if (valid) {
|
|
|
+ this.loading = true;
|
|
|
+ this.$http.get({
|
|
|
+ url: 'activiti/createModel',
|
|
|
+ data: this.newModel
|
|
|
+ }).then(res => {
|
|
|
+ this.loading = false;
|
|
|
+ if (res.success) {
|
|
|
+ this.dialogVisible = false;
|
|
|
+ this.$message.success('创建成功');
|
|
|
+ this.getData();
|
|
|
+ }
|
|
|
+ }).catch(() => {
|
|
|
+ this.loading = false;
|
|
|
+ })
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+ deleteModel(row) {
|
|
|
+ this.$alert('确认删除?', '警告', {type: 'error'}).then(() => {
|
|
|
+ return axios.delete(`rest/repository/models/${row.id}`)
|
|
|
+ }).then(() => {
|
|
|
+ this.$message.success("删除成功");
|
|
|
+ this.getData();
|
|
|
+ }).catch(() => {
|
|
|
+ this.$message.error("删除失败");
|
|
|
+ })
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+<style lang="less" scoped>
|
|
|
+
|
|
|
+</style>
|