widget.html 4.23 KB
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>批后管理待办</title>
    <script src="/frontweb/common/js/config.js"></script>
    <link rel="stylesheet" href="/frontweb/libs/element-ui/lib-master/theme-chalk/index.css"/>
    <script src="/frontweb/libs/vue/vue.js"></script>
    <script src="/frontweb/libs/element/index.js"></script>
    <script src="/frontweb/libs/axios/axios.min.js"></script>
    <style>
        .contanier{
            margin:10px 10px 0 10px;
            height:100%;
            background: #fff;
        }
        .el-row{
            margin-top:20px;
        }
        .el-input{
            margin-top:15px;
        }
        .el-button{
            margin-top: 20px;
        }
        .block{
            float: right;
            background: #fff;
            margin-top: 10px;
        }
        .el-pagination__jump{
            margin-top: -15px;
        }
    </style>
</head>
<body>
<div id="app">
    <div class='contanier'>
        <el-row :gutter="20">
            <el-col :span="6">
                <el-input v-model="search" placeholder="请输入查询内容"></el-input>
            </el-col>
            <el-col :span="10">
                <el-button type="success" size="mini" icon="el-icon-search">查询</el-button>
                <el-button type="info" size="mini"  icon="el-icon-plus" >添加</el-button>
                <el-button type="danger"  size="mini"  icon='el-icon-delete'>删除</el-button>
            </el-col>
        </el-row>
<!-- 列表区域-->
        <el-table
                :data="tabaledata"
                style="width: 100%;margin-top:10px;"
                height="100%"
                border
                stripe
        >
            <el-table-column
                    type="selection"
                    width="55">
            </el-table-column>
            <el-table-column
                    prop="xmbh"
                    width="130"
                    label="项目编号"
                    align="center"
            ></el-table-column>
            <el-table-column
                    prop="xmmc"
                    label="项目名称"
                    align="center"
                    width="450"
            >
            </el-table-column>
            <el-table-column
                    prop="djbh"
                    label="地籍编号"
                    align="center"
                    width="100"
            >
            </el-table-column>
            <el-table-column
                    prop="ydmj"
                    label="用地面积(亩)"
                    align="center"
                    width="180"
            >
            </el-table-column>
            <el-table-column
                    prop="zdwz"
                    label="宗地位置"
                    align="center"
                    width="400"
            >
            </el-table-column>
            <el-table-column
                    prop="tdyt"
                    label="土地用途"
                    align="center"
                    width="150"
            >
            </el-table-column>
            <el-table-column
                    prop="zrdw"
                    label="责任单位"
                    align="center"
                    width="100"
            >
            </el-table-column>
            <el-table-column
                    prop="ssqy"
                    label="所属区域"
                    align="center"
                    width="100"
            >
            </el-table-column>
            <el-table-column
                    prop="cjsj"
                    label="创建时间"
                    align="center"
                    width="100"
            >
            </el-table-column>
        </el-table>
<!-- 分页区域-->
        <div class="block">
            <el-pagination
                    @size-change="handleSizeChange"
                    @current-change="handleCurrentChange"
                    :current-page="1"
                    :page-sizes="[2, 3, 5]"
                    :page-size="4"
                    layout="total, sizes, prev, pager, next, jumper"
                    :total="8">
            </el-pagination>
        </div>
    </div>
</div>
<script src="./js/widget.js"></script>
</body>
</html>