SSMWeb/src/views/admin1/me/index.vue

<script setup>
import { ArrowRight, Search } from '@element-plus/icons-vue'
import {getData} from '@/api/common'
import {onMounted, ref} from "vue";
import {useRoute} from "vue-router";
import {ElMessage} from "element-plus";

const Router = useRoute()
const total = 0
const tableData = ref([])

// TODO 初始化数据
onMounted(()=>{
    getWorkListData("/work/list")
})

// TODO 获取后端数据
const getWorkListData = async (url) => {
  let { data } = await getData(url)
  ElMessage.success("获取成功")
  if (data) return tableData.value = data
}
// TODO 渲染后端数据

const tableColumn = ref([
    {id:1,prop:'id',label:'序号'},
    {id:2,prop:'workId',label:'部门编号'},
    {id:3,prop:'workName',label:'部门名称'},
    {id:4,prop:'workDescription',label:'备注'},
    {id:5,prop:'createDate',label:'部门创建时间'},
])
// TODO 添加 添加操作弹窗

// TODO 返回操作状态

</script>

<template>
  <!-- 面包屑区域 -->
  <el-breadcrumb :separator-icon="ArrowRight">
    <el-breadcrumb-item :to="{ path: '/admin1' }" @click="">系统管理员</el-breadcrumb-item>
      <el-breadcrumb-item>{{ Router.meta.title }}</el-breadcrumb-item>
  </el-breadcrumb>

  <!-- 卡片区域 -->
 <el-row>
   <el-col >
     <el-card class="box-card">
       <div class="meinfo">

       </div>
     </el-card>
   </el-col>
   <el-col></el-col>
</el-row>
</template>

<style scoped lang="less">
.el-breadcrumb {
  margin-bottom: 15px;
  font-size: 16px;
}

.el-card {
  width: 100% !important;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15) !important;
}

.el-table{
  margin: 15px 0 !important;
}

.text {
  font-size: 14px;
}

.item {
  margin-bottom: 18px;
}

.box-card {
  width: 480px;
}
</style>