faw-report-library-web/src/views/userCenter/processCenter.vue

<template>
    <div class="content">
        <div class="title">
            <span>流程中心</span>
        </div>
        <div class="searchForm">
            <div class="item">
                <div>流程编号：</div>
                <el-input v-model="form.id" ></el-input>
            </div>
            <div class="item">
                <div>流程名称：</div>
                <el-input v-model="form.name"></el-input>
            </div>
            <div class="item">
                <el-button type="primary"  @click="search">查询</el-button>
                <el-button type="" @click="reset">重置</el-button>
            </div>
        </div>
        <div class="tabs">
            <tabs :tableData="tableData"/>
        </div>
    </div>
</template>

<script>
import tabs from '../userCenter/processCenter/tabs.vue'
    export default {
        name:'processCenter',
        components:{
          tabs
        },
        data() {
            return {
                form: {},
                tableData:[]
            }
        },
        created () {
            ;
        },
        mounted () {
        this.$bus.$on('clearForm',()=>{
            this.form={}
        });
    },
        methods: {
            //查询
            search() {
                this.$bus.$emit('getSearchItem',this.form)
                // this.$api.processCenter.search({})
                this.tableData=[{createTime:'1999-10-1'}]
            },
            //重置
            reset(){
                this.form={}
                this.$forceUpdate()
                this.$bus.$emit('getSearchItem',this.form)
                this.tableData=[{createTime:'3000-10-1'}]
                // this.$api.processCenter.reset({})
            }
        },
    }
</script>

<style lang="scss" scoped>
.content{
    min-height: calc(100vh - 60px - 20px);
    box-shadow: 0 6px 11px 0 rgba(163, 163, 163, 0.2);
    border-radius: 6px;
    background: #FFFFFF;
    .title {
        border-bottom: 1px solid #EBEEF5;
        height: 42px;
        line-height: 42px;
        margin: 0 18px 0 22px;

        span {
            font-size: 16px;
            font-weight: 600;
            color: #262626;
        }
    }
    .searchForm{
        width: 1200px;
        display: flex;
        align-items: center;
        margin: 20px 0 0 22px;
        .item{
        width: 300px;
        display: flex;
        align-items: center;
        }

    }
    .tabs{
        margin: 20px 0 0 13px;
    }

}
::v-deep .el-input{
    width: 200px;
}
</style>