From b80d0c5dd5ca242427a07f4891e8a0dc354889b3 Mon Sep 17 00:00:00 2001 From: 明梦爽 <2972214568@qq.com> Date: 星期三, 19 一月 2022 23:46:29 +0800 Subject: [PATCH] 后台查看功能完成 --- src/components/page/telephone.vue | 106 ++++++++++++++++++++++++++++++----------------------- 1 files changed, 60 insertions(+), 46 deletions(-) diff --git a/src/components/page/telephone.vue b/src/components/page/telephone.vue index d3bc8e2..d043278 100644 --- a/src/components/page/telephone.vue +++ b/src/components/page/telephone.vue @@ -1,14 +1,36 @@ <template> <div> <globalTitle /> - <el-table :data="tableData" stripe style="width: 100%;"> - <el-table-column type="index" label="搴忓彿" width="80px"></el-table-column> - <el-table-column prop="zhize" label="鑱岃矗" width="180"> </el-table-column> - <el-table-column prop="name" label="濮撳悕" width="180"> </el-table-column> - <el-table-column prop="tele" label="鑱旂郴鐢佃瘽" width="180"> - </el-table-column> - <el-table-column prop="e" label="閭"> </el-table-column> - </el-table> + <el-card class="card"> + <div class="max"> + <div class="left"> + <el-card style="" class="img"> + <p>寰俊鍏紬鍙�</p> + <img src="../../assets/gongZhongHao.jpg" alt=""> + </el-card> + <el-card style="" class="img"> + <p>鏂版氮寰崥</p> + <img src="../../assets/weiBo.jpg" alt=""> + </el-card> + </div> + <divc class="right"> + <el-table :data="tableData" border :header-cell-style="{textAlign: 'center'}" :cell-style="{ textAlign: 'center' }"> + <!-- :header-cell-style="{textAlign: 'center'}"璁剧疆澶撮儴灞呬腑锛� --> + <!-- :cell-style="{ textAlign: 'center' }"璁剧疆鏁翠釜琛ㄦ牸鍐呭姘村钩灞呬腑锛� --> + <el-table-column prop="id" label="搴忓彿" width="60" > + </el-table-column> + <el-table-column prop="zhize" label="鑱岃矗" width=""> + </el-table-column> + <el-table-column prop="name" label="濮撳悕"> + </el-table-column> + <el-table-column prop="tel" label="鑱旂郴鐢佃瘽"> + </el-table-column> + <el-table-column prop="mail" label="閭" width="200"> + </el-table-column> + </el-table> + </divc> + </div> + </el-card> </div> </template> @@ -19,47 +41,39 @@ name: 'telephone', data() { return { - tableData: [ - { - zhize: '鏍$鍗忎富甯�', - name: '鐜嬪皬铏�', - tele: '17630124661', - e: '2345@qq.com' - }, - { - zhize: '鏍$鍗忕涔﹂暱', - name: '鐜嬪皬铏�', - tele: '17630124661', - e: '2345@qq.com' - }, - { - zhize: '鏍$鍗忚仈缁滃憳', - name: '鐜嬪皬铏�', - tele: '17630124661', - e: '2345@qq.com' - }, - { - zhize: '闈掑勾鍒嗕細涓诲腑', - name: '鐜嬪皬铏�', - tele: '17630124661', - e: '2345@qq.com' - }, - { - zhize: '瀛︾敓鍒嗕細鑱旂粶鍛�', - name: '鐜嬪皬铏�', - tele: '17630124661', - e: '2345@qq.com' - }, - { - zhize: 'XXXXX', - name: 'XXX', - tele: '17630124661', - e: '2345@qq.com' - } + tableData:[{id:1,zhize:'鏍¢暱',name:'鏉ㄩ福',tel:'12345678910',mail:'12312312@qq.com'}, + {id:1,zhize:'鏍¢暱',name:'鏉ㄩ福',tel:'12345678910',mail:'12312312@qq.com'}, + {id:1,zhize:'鏍¢暱',name:'鏉ㄩ福',tel:'12345678910',mail:'12312312@qq.com'}, + {id:1,zhize:'鏍¢暱',name:'鏉ㄩ福',tel:'12345678910',mail:'12312312@qq.com'}, + {id:1,zhize:'鏍¢暱',name:'鏉ㄩ福',tel:'12345678910',mail:'12312312@qq.com'}, + {id:1,zhize:'鏍¢暱',name:'鏉ㄩ福',tel:'12345678910',mail:'12312312@qq.com'}, ] } } } </script> -<style lang="less" scoped></style> +<style lang="less" scoped> +.card{ + margin-top: 10px; +} +.max{ + display: flex; + justify-content: space-between; +} +p{ + text-align: center; +} +.right{ + width: 800px; +} +.left{ + width: 200px; +} +.img{ + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; +} +</style> \ No newline at end of file -- Gitblit v1.8.0