swdz_crm/resources/views/admin/company/info/search.blade.php

@extends('admin.layouts.app')

@section('content')
    <div class="row">
        <div class="col-sm-12">
            <div class="ibox float-e-margins">
                <div class="ibox-title">
                    <h5>挖掘线索</h5>

                    <div class="ibox-tools">
                        <a class="collapse-link"> <i class="fa fa-chevron-up"></i>
                        </a>
                    </div>
                </div>

                <div class="ibox-content">
                    <div class="form-group">
                        <div class="row">
                            <div class="col-sm-8">
                                满足下列
                                <select name="" id="">
                                    <option value="所有">所有</option>
                                    <option value="任一">任一</option>
                                </select>
                                条件：
                            </div>
                        </div>
                    </div>

                    <div id="app">

                        <div class="form-group">
                            <div class="row">
                                <div class="col-sm-2">
                                    <select name="filterFiled[]" class="form-control" v-on:change="choseFilters" v-model="selected">
                                        <option v-for="filter in filters" v-bind:value='filter.value'>@{{ filter.name }}
                                        </option>
                                    </select>
                                </div>


                                <div class="col-sm-2" v-if="selected === 'companyName'">
                                    <input name="companyName" class="form-control" placeholder="">
                                </div>
                                <div class="col-sm-2" v-else>
                                    <select :name='selected'  class="form-control">
                                        <option v-for="item in items" v-bind:value='item.value'>@{{ item.name }}
                                        </option>
                                    </select>
                                </div>
                            </div>
                        </div>


                        <div class="form-group">
                            <div class="row">
                                <div class="col-sm-8">
                                    <button class="btn btn-outline-primary" id="addFilter" v-on:click="addFilter">添加条件
                                    </button>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('js')
    <script>
        new Vue({
            el: '#app',
            data: {
                selected:'companyName',
                filters: [
                    {name: '企业名称', value: 'companyName'},
                    {name: '企业类型', value: 'entType'},
                    {name: '注册资本', value: 'regCapital'},
                    {name: '所属行业', value: 'industry'},
                ],

                items: [

                ]
            },
            methods: {
                addFilter: function (event) {

                },
                choseFilters: function (event) {
                    if(this.selected == 'regCapital'){
                        this.items = [
                            {name:'50万以下',value:'50万以上'},
                            {name:'50万-100万',value:'50万-100万'},
                            {name:'100万以上',value:'100万以上'}
                        ]
                    }else if(this.selected == 'industry'){
                        this.items = [
                            {name:'互联网',value:'互联网'},
                            {name:'软件开发',value:'软件开发'}
                        ]
                    }else {
                        console.log(this.selected)
                    }

                }
            }
        })
    </script>
@endsection