widget.html 7 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>
    <script type="text/javascript" src="/frontweb/libs/jquery/jquery.min.js"></script>
    <script src="/frontweb/libs/jquery/jquery.cookie.js"></script>
    <script type="text/javascript" src="/frontweb/common/js/global/global.localStorage.js"></script>
    <script type="text/javascript" src="/frontweb/common/js/global/global.modelctls.js"></script>
    <style>
        .contanier{
            margin:-20px 10px 0 10px;
            height:100%;
            background: #fff;
        }
        .el-row{
            margin-top:20px;
        }
        .el-input{
            margin-top:15px;
        }
        .el-button{
            margin-top: 20px;
        }
        .el-table{
            border: 1px solid #cac8c8;
            min-height:750px
        }
        .el-table__body-wrapper::-webkit-scrollbar {
            width: 4px;
            height: 6px;
        }
        .el-table__body-wrapper::-webkit-scrollbar-thumb {
            border-radius: 6px;
            -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
            background: rgba(0,0,0,0.2);
        }
        .el-table__body-wrapper::-webkit-scrollbar-track {
            -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
            border-radius: 0;
            background: rgba(0,0,0,0.1);

        }
        .el-table th {
            background:#F2F2F2 !important;
        }
        .el-table tbody tr:hover>td {
            background-color:#EEF9FF!important
        }
        .block{
            float: right;
            background: #fff;
            position: fixed;
            bottom: 15px;
            right: 11px;
        }
        .el-pagination__jump{
            margin-top: -15px;
        }
        .el-table__row{
            cursor: pointer;
        }
        .btns{
            width: 73px;
            height: 30px;
            border-radius: 2px;
            background-color: white;
            border: 1px solid #0096eb;
            color: #0096eb;
            cursor: pointer;
            padding: 4px 10px;
            margin-right: 7px;
            outline: 0;
        }
        .btns:hover{
            background: #0096eb;
            color: #fff;
        }
        .el-col-4{
            margin-top:20px
        }
        /*将导出按钮注释掉 margin-left 从-40 变成了 -125*/
        .div-search{
            border: 1px solid #cac8c8;
            border-radius: 2px;
            float: left;
            margin-right: 10px;
            width: 280px;
            height: 30px;
            margin-left: 10px;
            margin-left: -125px;
            margin-top: 18px;
        }
        .div-search input{
            border: none;
            height: 27px;
            padding-left: 15px;
            border-radius: 2px;
            outline: 0;
        }
    </style>
</head>
<body>
<div id="app">
    <div class='contanier'>
        <el-row :gutter="20">
            <el-col :span="4">
                <!--                <button class="btns">查询</button>-->
                <button class="btns" @click="AddNewPage">添加</button>
                <button class="btns" @click="handlDelete">删除</button>
<!--                <button class="btns">导出</button>-->
            </el-col>
            <el-col :span="6">
                <div class="div-search">
                    <input id="searchInput" type="text" placeholder="搜索待办项目" style="width: 82%;" v-model="search" @keyup.enter="SearchInfo" v-focus>
                    <img id="searchBtn" src="../../../../image/projecttask/search.png" style="margin-right: 10px; margin-top: 4px; width: 20px; height: 20px; float: right;">
                </div>
            </el-col>
        </el-row>
        <!-- 列表区域-->
        <div v-if="tabaledata.length!=0">
            <el-table
                    :data="tabaledata"
                    style="width: 100%;margin-top:10px;"
                    height="100%"
                    border
                    stripe
                    @row-click="clickData"
                    @selection-change="handleSelectionChange"
                    size="small"
            >
                <el-table-column
                        type="selection"
                        width="55">
                </el-table-column>
                <el-table-column
                        prop="xmmc"
                        width="375"
                        label="项目名称"
                        align="center"
                ></el-table-column>
                <el-table-column
                        prop="xmwz"
                        label="项目地址"
                        align="center"
                        width="280"
                >
                </el-table-column>
                <el-table-column
                        prop="ssqy"
                        label="所属区域"
                        align="center"
                        width="100"
                >
                </el-table-column>
                <el-table-column
                        prop="jzmj"
                        label="建筑面积(平方米)"
                        align="center"
                        width="200"
                >
                </el-table-column>
                <el-table-column
                        prop="zdmj"
                        label="占地面积(平方米)"
                        align="center"
                        width="200"
                >
                </el-table-column>
                <el-table-column
                        prop="wjlx"
                        label="认定类型"
                        align="center"
                        width="150"
                >
                </el-table-column>
                <el-table-column
                        prop="zrbm"
                        label="责任部门"
                        align="center"
                        width="150"
                >
                </el-table-column>
                <el-table-column
                        prop="rdsj"
                        label="录入时间"
                        align="center"
                        width="200"
                >
                </el-table-column>
            </el-table>
        </div>
    </div>
    <!-- 分页区域-->
    <div class="block">
        <el-pagination
                @size-change="handleSizeChange"
                @current-change="handleCurrentChange"
                :current-page="pageNum"
                :page-sizes="[5, 10, 15]"
                :page-size="pageSize"
                layout="total, sizes, prev, pager, next, jumper"
                :total="total">
        </el-pagination>
    </div>
</div>
<script src="./js/widget.js"></script>
</body>
</html>