This commit is contained in:
sc
parent
beaf5ba069
commit
f1a46cffce
|
|
@ -19,6 +19,8 @@
|
||||||
.el-input-number__decrease, .el-input-number__increase {top:2px;}
|
.el-input-number__decrease, .el-input-number__increase {top:2px;}
|
||||||
.el-menu-item [class^=sc-icon-] {font-size: 18px;display: inline-block;line-height: 1;}
|
.el-menu-item [class^=sc-icon-] {font-size: 18px;display: inline-block;line-height: 1;}
|
||||||
.el-menu-item [class^=sc-icon-], .el-submenu [class^=sc-icon-] {margin-right: 5px;vertical-align: middle;width: 24px;text-align: center;}
|
.el-menu-item [class^=sc-icon-], .el-submenu [class^=sc-icon-] {margin-right: 5px;vertical-align: middle;width: 24px;text-align: center;}
|
||||||
|
.el-progress__text {font-size: 12px!important;}
|
||||||
|
.el-progress__text i {font-size: 14.4px!important;}
|
||||||
|
|
||||||
/* 覆盖tinymce样式 */
|
/* 覆盖tinymce样式 */
|
||||||
.sceditor .tox-tinymce {border: 1px solid #DCDFE6;}
|
.sceditor .tox-tinymce {border: 1px solid #DCDFE6;}
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,129 @@
|
||||||
|
<!--
|
||||||
|
* @Descripttion: 详情列表模板
|
||||||
|
* @version: 1.0
|
||||||
|
* @Author: sakuya
|
||||||
|
* @Date: 2021年6月16日15:05:15
|
||||||
|
* @LastEditors:
|
||||||
|
* @LastEditTime:
|
||||||
|
-->
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<el-container>
|
||||||
|
<el-header>
|
||||||
|
<div class="left-panel">
|
||||||
|
<el-button type="primary" icon="el-icon-plus"></el-button>
|
||||||
|
<el-button type="danger" plain icon="el-icon-delete" :disabled="selection.length==0"></el-button>
|
||||||
|
</div>
|
||||||
|
<div class="right-panel">
|
||||||
|
<el-radio-group v-model="group">
|
||||||
|
<el-radio-button label="0">所有</el-radio-button>
|
||||||
|
<el-radio-button label="1">未完成 (2)</el-radio-button>
|
||||||
|
<el-radio-button label="2">弃坑 (1)</el-radio-button>
|
||||||
|
<el-radio-button label="3">其他</el-radio-button>
|
||||||
|
</el-radio-group>
|
||||||
|
</div>
|
||||||
|
</el-header>
|
||||||
|
<el-main class="nopadding">
|
||||||
|
<scTable ref="table" :data="list" @selection-change="selectionChange">
|
||||||
|
<el-table-column type="selection" width="50"></el-table-column>
|
||||||
|
<el-table-column label="ID" prop="id" width="100"></el-table-column>
|
||||||
|
<el-table-column label="状态" prop="state" width="80">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-badge v-if="scope.row.state=='1'" is-dot></el-badge>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="名称" prop="name" width="300">
|
||||||
|
<template #default="scope">
|
||||||
|
<h4>{{scope.row.name}}</h4>
|
||||||
|
<p>{{scope.row.subtitle}}</p>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="类型" prop="type" width="150">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-tag>{{scope.row.type}}</el-tag>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="负责人" prop="user" width="150"></el-table-column>
|
||||||
|
<el-table-column label="进度" prop="progress" width="250">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-progress :percentage="scope.row.progress"></el-progress>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
<el-table-column label="创建时间" prop="time" width="150"></el-table-column>
|
||||||
|
<el-table-column label="操作" fixed="right" align="right" width="200">
|
||||||
|
<template #default="scope">
|
||||||
|
<el-button type="text" size="small" @click="table_show(scope.row, scope.$index)">查看</el-button>
|
||||||
|
<el-divider direction="vertical"></el-divider>
|
||||||
|
<el-dropdown>
|
||||||
|
<el-button type="text" size="small">更多<i class="el-icon-arrow-down el-icon--right"></i></el-button>
|
||||||
|
<template #dropdown>
|
||||||
|
<el-dropdown-menu>
|
||||||
|
<el-dropdown-item>编辑</el-dropdown-item>
|
||||||
|
<el-dropdown-item>推送至队列</el-dropdown-item>
|
||||||
|
<el-dropdown-item divided>删除</el-dropdown-item>
|
||||||
|
</el-dropdown-menu>
|
||||||
|
</template>
|
||||||
|
</el-dropdown>
|
||||||
|
</template>
|
||||||
|
</el-table-column>
|
||||||
|
|
||||||
|
</scTable>
|
||||||
|
</el-main>
|
||||||
|
</el-container>
|
||||||
|
|
||||||
|
<el-drawer title="我是标题" v-model="info" size="100%" direction="btt" destroy-on-close>
|
||||||
|
|
||||||
|
</el-drawer>
|
||||||
|
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'list',
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
group: "0",
|
||||||
|
selection: [],
|
||||||
|
list: [
|
||||||
|
{
|
||||||
|
id: "5001",
|
||||||
|
name: "scEcharts",
|
||||||
|
subtitle: "重新封装的Echarts，暴露源对象",
|
||||||
|
state: "1",
|
||||||
|
type: "数据",
|
||||||
|
progress: 70,
|
||||||
|
user: "Sakuya",
|
||||||
|
time: "2010-10-10"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "5002",
|
||||||
|
name: "scEditor",
|
||||||
|
subtitle: "Tinymce封装的富文本编辑器",
|
||||||
|
state: "1",
|
||||||
|
type: "表单",
|
||||||
|
progress: 10,
|
||||||
|
user: "Sakuya",
|
||||||
|
time: "2010-10-10"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
info: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
//表格选择后回调事件
|
||||||
|
selectionChange(selection){
|
||||||
|
this.selection = selection;
|
||||||
|
},
|
||||||
|
table_show(row, index){
|
||||||
|
console.log(row, index);
|
||||||
|
this.info = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
Loading…
Reference in New Issue