123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144 |
- <template>
- <div class="saga-audit-record">
- <div class="header">
- <span>时间段:
- <el-date-picker
- v-model="dataValue"
- type="daterange"
- range-separator="至"
- start-placeholder="开始日期"
- end-placeholder="结束日期"
- />
- </span>
- <span style="margin-left: 20px">
- 项目/集团:
- <el-select v-model="value" placeholder="请选择">
- <el-option
- v-for="item in options"
- :key="item.value"
- :label="item.label"
- :value="item.value">
- </el-option>
- </el-select>
- </span>
- <span style="margin-left: 20px">
- 对象类型:
- <el-select v-model="value" placeholder="请选择">
- <el-option
- v-for="item in options"
- :key="item.value"
- :label="item.label"
- :value="item.value">
- </el-option>
- </el-select>
- </span>
- <span style="margin-left: 20px">
- 审核状态:
- <el-select v-model="value" placeholder="请选择">
- <el-option
- v-for="item in options"
- :key="item.value"
- :label="item.label"
- :value="item.value">
- </el-option>
- </el-select>
- </span>
- </div>
- <div class="content">
- <el-table :data="tableData" height="700" border style="width: 100%;" :header-cell-style="{background:'#eef1f6'}">
- <el-table-column prop="date" label="审核完成时间" align="center"/>
- <el-table-column prop="name" label="集团" align="center"/>
- <el-table-column prop="name" label="项目" align="center"/>
- <el-table-column prop="name" label="对象类型" align="center"/>
- <el-table-column prop="name" label="变更类型" align="center"/>
- <el-table-column prop="name" label="内容" align="center"/>
- <el-table-column prop="name" label="申请人" align="center"/>
- <el-table-column prop="name" label="审核状态" align="center"/>
- <el-table-column prop="name" label="不通过原因" align="center"/>
- <el-table-column prop="name" label="审核人" align="center"/>
- </el-table>
- </div>
- <div class="footer">
- <el-pagination
- @size-change="handleSizeChange"
- @current-change="handleCurrentChange"
- :current-page="currentPage"
- :page-sizes="[100, 200, 300, 400]"
- :page-size="100"
- layout="total, sizes, prev, pager, next, jumper"
- :total="400"
- />
- </div>
- </div>
- </template>
- <script>
- export default {
- name: "auditRecord",
- components: {},
- data() {
- return {
- currentPage: 0,
- dataValue: '',
- value: '',
- options: [],
- tableData: [{
- date: '2016-05-02',
- name: '王小虎',
- }, {
- date: '2016-05-04',
- name: '王小虎',
- }, {
- date: '2016-05-01',
- name: '王小虎',
- }, {
- date: '2016-05-03',
- name: '王小虎',
- }]
- }
- },
- methods: {
- handleSizeChange(val) {
- console.log(`每页 ${val} 条`);
- },
- handleCurrentChange(val) {
- console.log(`当前页: ${val}`);
- }
- }
- }
- </script>
- <style scoped lang="scss">
- .saga-audit-record {
- background: #ffffff;
- border: 1px solid #eee;
- .header {
- margin: 20px;
- overflow: hidden;
- .search {
- float: left;
- width: 20%;
- }
- .button {
- float: right;
- }
- }
- .content {
- margin-top: 20px;
- .cursor {
- cursor: pointer;
- }
- }
- .footer{
- position: absolute;
- bottom: 30px;
- left: 40%;
- }
- }
- </style>
|