1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556 |
- <template>
- <el-space>
- <el-button type="primary">新增</el-button>
- <el-input v-model="input">
- <template #append>
- <el-button :icon="Search" />
- </template>
- </el-input>
- </el-space>
- <el-table :data="tableData" style="width: 100%">
- <el-table-column align="center" prop="date" label="Date" width="180" />
- <el-table-column align="center" prop="name" label="Name" width="180" />
- <el-table-column align="center" prop="address" label="Address" />
- <el-table-column align="center" label="操作">
- <template #default="scope">
- <el-button
- size="small"
- type="danger"
- @click="handleDelete(scope.$index, scope.row)"
- >删除</el-button
- >
- </template>
- </el-table-column>
- </el-table>
- </template>
- <script setup>
- import { Search } from "@element-plus/icons-vue";
- const input = ref("");
- const tableData = [
- {
- date: "2016-05-03",
- name: "Tom",
- address: "No. 189, Grove St, Los Angeles",
- },
- {
- date: "2016-05-02",
- name: "Tom",
- address: "No. 189, Grove St, Los Angeles",
- },
- {
- date: "2016-05-04",
- name: "Tom",
- address: "No. 189, Grove St, Los Angeles",
- },
- {
- date: "2016-05-01",
- name: "Tom",
- address: "No. 189, Grove St, Los Angeles",
- },
- ];
- const handleDelete = () => {};
- </script>
- <style lang="scss" scoped></style>
|