diff --git a/ruoyi-ui/src/views/flowable/definition/indexDrawer.vue b/ruoyi-ui/src/views/flowable/definition/indexDrawer.vue
new file mode 100644
index 00000000..a3712847
--- /dev/null
+++ b/ruoyi-ui/src/views/flowable/definition/indexDrawer.vue
@@ -0,0 +1,120 @@
+<template>
+    <div class="projectect-attendance-drawer">
+      <el-drawer
+        v-if="isOpen"
+        :visible.sync="isOpen"
+        size="70%"
+      >
+        <template slot="title">
+          <div>流程发起角色配置</div>
+        </template>
+        <el-tabs
+          v-model="activeName"
+          style="margin-left: 20px; margin-right: 20px"
+          @tab-click="getList"
+        >
+          <el-tab-pane
+            v-for="(it,idx) in processRoleList"
+            :key="idx"
+            :label="it.roleName+''"
+            :name="it.roleId+''"
+          ></el-tab-pane>
+        </el-tabs>
+  
+        <!-- 流程发起角色设置 -->
+        <el-form ref="form" v-loading="loading" :model="form" :rules="rules" label-width="80px;" style="padding: 20px;">
+            <el-checkbox-group v-model="form.keys">
+              <el-checkbox v-for="it in definitionList" :label="it.flowKey" :value="it.flowKey" border>{{ it.name+'（'+it.flowKey+'）' }}</el-checkbox>
+            </el-checkbox-group>
+            <div style="text-align: center">
+                <el-button type="primary" @click="submitForm">提交保存</el-button>
+                <el-button @click="doCanel">取 消</el-button>
+            </div>
+        </el-form>
+      </el-drawer>
+    </div>
+  </template>
+  
+  <script>
+  import {
+  roleList,
+  listDefinition,
+  updateProcKeyByRoleId
+} from "@/api/flowable/definition";
+  
+  export default {
+    name: "indexDrawer",
+    components: {},
+    data() {
+      return {
+        loading: false,
+        isOpen: false,
+        nodes: [],
+        activeName: "0",
+        // 遮罩层
+        loading: true,
+        // 查询参数
+        queryParams: {
+          pageNum: 1,
+          pageSize: 100
+        },
+        definitionList:[],
+        processRoleList: [],
+        form: {
+          keys:[]
+        },
+        rules: {},
+      };
+    },
+    computed: { },
+    mounted() {},
+    methods: {
+      show() {
+        this.getRoleList();
+        this.isOpen=true;
+      },
+      // 页签点击
+      getList() {
+        this.queryParams.roleId=null;
+        listDefinition(this.queryParams).then(response => {
+          this.definitionList = response.data.records;
+        });
+        this.queryParams.roleId=this.activeName;
+        this.form.roleId = this.activeName;
+        listDefinition(this.queryParams).then(response => {
+          let list=[];
+          response.data.records.forEach(item => {
+            list.push(item.flowKey);
+          })
+          this.form.keys = list;
+        });
+      },
+      getRoleList(){
+        this.loading=true;
+        this.queryParams.roleKey="lc_";
+        this.queryParams.roleId=null;
+        roleList(this.queryParams).then(response => {
+          this.processRoleList = response.data;
+          this.activeName=response.data[0].roleId+'';
+          this.getList();
+          this.loading=false;
+        });
+      },
+      // 取消按钮
+      doCanel() {
+        this.isOpen = false;
+      },
+      /** 提交按钮 */
+      submitForm() {
+        this.loading=true;
+        updateProcKeyByRoleId(this.form).then(response => {
+          this.$modal.msgSuccess("保存成功");
+          this.getList();
+          this.loading=false;
+        });
+      }
+    },
+  };
+  </script>
+  <style lang="scss" scoped></style>
+  
\ No newline at end of file
diff --git a/ruoyi-ui/src/views/flowable/definition/indexOrderDrawer.vue b/ruoyi-ui/src/views/flowable/definition/indexOrderDrawer.vue
new file mode 100644
index 00000000..591cacc8
--- /dev/null
+++ b/ruoyi-ui/src/views/flowable/definition/indexOrderDrawer.vue
@@ -0,0 +1,137 @@
+<template>
+    <div class="projectect-attendance-drawer">
+      <el-drawer
+        v-if="isOpen"
+        :visible.sync="isOpen"
+        size="70%"
+      >
+        <template slot="title">
+          <div>流程发起角色配置</div>
+        </template>
+        <el-tabs
+          v-model="activeName"
+          style="margin-left: 20px; margin-right: 20px"
+          @tab-click="getList"
+        >
+          <el-tab-pane
+            v-for="(it,idx) in processRoleList"
+            :key="idx"
+            :label="it.roleName+''"
+            :name="it.roleId+''"
+          ></el-tab-pane>
+          <el-table v-loading="loading" fit :data="definitionList">
+            <el-table-column label="流程编号" align="center" prop="deploymentId" :show-overflow-tooltip="true"/>
+            <el-table-column label="流程标识" align="center" prop="flowKey" :show-overflow-tooltip="true" />
+            <el-table-column label="流程分类" align="center" prop="category" >
+                <template slot-scope="scope">
+                <dict-tag :options="dict.type.sys_process_category" :value="scope.row.category" />
+                </template>
+            </el-table-column>
+            <el-table-column label="流程名称" align="center" width="200" prop="name" :show-overflow-tooltip="true"/>
+            <el-table-column
+                label="项目排序"
+                align="center"
+                width="150"
+            >
+                <template slot-scope="scope">
+                <el-input-number
+                    size="mini"
+                    v-model="scope.row.sorts"
+                    :min="1"
+                    :max="999"
+                    @change="setSort(scope.row, $event)"
+                ></el-input-number>
+                </template>
+            </el-table-column>
+            <el-table-column label="流程版本" align="center" width="80">
+                <template slot-scope="scope">
+                <el-tag size="medium" >v{{ scope.row.version }}</el-tag>
+                </template>
+            </el-table-column>
+            <el-table-column label="状态" align="center">
+                <template slot-scope="scope">
+                <el-tag type="success" v-if="scope.row.suspensionState === 1">激活</el-tag>
+                <el-tag type="warning" v-if="scope.row.suspensionState === 2">挂起</el-tag>
+                </template>
+            </el-table-column>
+            <el-table-column label="部署时间" align="center" prop="deploymentTime" width="180"/>
+          </el-table>
+        </el-tabs>
+      </el-drawer>
+    </div>
+  </template>
+  
+  <script>
+  import {
+  roleList,
+  listDefinition,
+  updateProcKeyRoleSort,
+} from "@/api/flowable/definition";
+  
+  export default {
+    name: "indexDrawer",
+    components: {},
+    dicts: ['sys_process_category'],
+    data() {
+      return {
+        loading: false,
+        isOpen: false,
+        nodes: [],
+        activeName: "0",
+        // 遮罩层
+        loading: true,
+        // 查询参数
+        queryParams: {
+          pageNum: 1,
+          pageSize: 100
+        },
+        definitionList:[],
+        processRoleList: [],
+        form: {},
+        rules: {},
+      };
+    },
+    computed: { },
+    mounted() {},
+    methods: {
+      show() {
+        this.getRoleList();
+        this.isOpen=true;
+      },
+      // 页签点击
+      getList() {
+        this.queryParams.roleId=this.activeName;
+        this.form.roleId=this.activeName;
+        listDefinition(this.queryParams).then(response => {
+          this.definitionList = response.data.records;
+        });
+      },
+      getRoleList(){
+        this.loading=true;
+        this.queryParams.roleKey="lc_";
+        this.queryParams.roleId=null;
+        roleList(this.queryParams).then(response => {
+          this.processRoleList = response.data;
+          this.activeName=response.data[0].roleId+'';
+          this.getList();
+          this.loading=false;
+        });
+      },
+      // 取消按钮
+      doCanel() {
+        this.isOpen = false;
+      },
+      /** 设置排序 */
+      setSort(row,val) {
+        this.form.key=row.flowKey;
+        this.form.sort=val;
+        updateProcKeyRoleSort(this.form).then((response) => {
+            this.$modal.msgSuccess("修改成功");
+            this.getList();
+        });
+      }
+    },
+  };
+  </script>
+  <style lang="scss" scoped></style>
+  
\ No newline at end of file