基础设置

src/views/Basic/Role/Comp/RoleEmployee.vue

@@ -0,0 +1,46 @@
+<template>
+  <div>
+    <el-table v-loading="loading" :data="tableList" border>
+      <el-table-column type="index" width="50" />
+      <el-table-column
+        v-for="col in columns"
+        :prop="col.prop"
+        :key="col.prop"
+        :label="col.label"
+        :width="col.width"
+      />
+    </el-table>
+    <Pagination
+      v-model:limit="pageSize"
+      v-model:page="currentPage"
+      :total="total"
+      @pagination="getList"
+    />
+  </div>
+</template>
+
+<script setup name="RoleEmployee">
+const loading = ref(false)
+const tableList = ref([])
+const total = ref(0)
+const pageSize = ref(20)
+const currentPage = ref(1)
+
+const columns = ref([
+  { prop: 'userName', label: '姓名' },
+  { prop: '', label: '手机号' },
+  { prop: '', label: '部门' },
+  { prop: '', label: '角色', width: '300px' },
+  { prop: '', label: '性别' }
+])
+
+function getList() {
+  tableList.value = [{ userName: '测试', phone: '18899998888' }]
+}
+
+onMounted(() => {
+  getList()
+})
+</script>
+
+<style lang="scss" scoped></style>