users.vue

<template>
 <!-- 平台用户管理 -->
  <div class="user-wrapper height100">
      <div class="search-container">
          <el-form :inline="true" :model="form">
            <el-form-item>
                <el-input
                 v-model="form.user" 
                 placeholder="请输入平台用户名"
                 suffix-icon="el-icon-search"
                ></el-input>
            </el-form-item>
            <el-form-item>
                <div class="btn-group">
                   <el-button type="primary" @click="handleSubmit">查询</el-button>
                   <el-button @click="handleReset">重置</el-button>
                </div>     
            </el-form-item>
        </el-form>
        <div class="page-tip">
            <span class="page-tip-title">页面说明:</span>
            <span class="page-tips">可根据用户名称搜索对用户信息进行筛选。可以新增账号，“*”为必填项。可以对账号信息进行修改及重置密码</span>
        </div>
      </div>
      <div class="table-content">
          <div class="btn-group">
               <el-button type="primary">新建账户</el-button>
          </div>
           <!-- <party-table :feildList="feildList" :list="list"></party-table> -->
           <account-table
            :feildList="feildList"
            :list="list"
            @action="handleAction"
           />
           <party-pagination/>
      </div>
      <user-dialog/>
  </div>
</template>
<script>
import { partyPagination } from '@/components/index'
import accountTable from './components/accountTable'
import userDialog from './userDialog/index'
export default {
    data(){
        return{
            form:{
                user:''
            },
            addForm:{

            },
            
            feildList:[
                {prop:'username',label:'平台用户名'},
                {prop:'org',label:'所在机构'},
                {prop:'endTime',label:'到期时间'},
                {prop:'type',label:'账号类型'},
                {prop:'status',label:'账号状态'},
                {prop:'',label:'操作',isEdit:true, width:280},
            ],
            list: [
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'}, 
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'}, 
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'}, 
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'},
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'}, 
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'}, 
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'}, 
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'},
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'}, 
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'}, 
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'}, 
                { username: '丁晓晓', org:'北京市政府',type:'系统管理员',endTime:'永久有效', status:'活跃'}, 
              ]
        }
    },
    components:{ partyPagination, accountTable, userDialog},
    mounted(){

    },
    methods:{
        handleSubmit(){

        },
        handleReset(){
            this.form.user = ''
        },
        // 弹窗关闭
        handleClose(){
          this.$confirm('确认关闭？')
          .then(_ => {
            done();
          })
          .catch(_ => {});
        },
        handleAction(params){
            console.log(params.type)
        }
    }
}
</script>
<style lang="less" scoped>

</style>