@extends('layouts.base')
@section('title', "服务标签")
@section('content')
    <link rel="stylesheet" type="text/css" href="{{static_url('yunshop/goods/vue-goods1.css')}}"/>
    <style>

    </style>
    <div class="all">
        <div id="app" v-cloak>
            {{--<div class="vue-head"></div>--}}
            <div class="vue-main">
                <div class="vue-main-form">
                    <div class="vue-main-title" style="margin-bottom:20px">
                        <div class="vue-main-title-left"></div>
                        <div class="vue-main-title-content" style="flex:0 0 120px">服务标签列表</div>
                        <div class="vue-main-title-button">
                        </div>
                    </div>
                    <el-table :data="list" style="width: 100%" v-loading="table_loading">
                        <el-table-column prop="label_id" label="标签编号" align="center"></el-table-column>
                        <el-table-column label="标签图标" align="center" prop="has_one_member">
                            <template slot-scope="scope">
                                <div v-if="scope.row.pic">
                                    <img :src="scope.row.pic" alt="" style="width:40px;height:40px;border-radius:50%">
                                </div>
                            </template>
                        </el-table-column>
                        <el-table-column prop="name" label="标签名称" max-width="100" align="center"></el-table-column>
                        <el-table-column prop="status" label="标签状态" align="center">
                            <template slot-scope="scope">
                                <el-switch v-model="scope.row.status"
                                           @change="editEnable(scope.row.label_id, scope.row.status)"
                                           :active-value="1"
                                           :inactive-value="0">

                                </el-switch>
                            </template>
                        </el-table-column>
                        <el-table-column label="操作" align="center">
                            <template slot-scope="scope">
                                <el-button type="primary" size="medium" @click="editLabel(scope.row.label_id)">编&nbsp;辑</el-button>
                            </template>
                        </el-table-column>
                    </el-table>
                </div>
            </div>
            <!-- 分页 -->
            {{--<div class="vue-page" v-if="total>0">--}}
                {{--<el-row>--}}
                    {{--<el-col align="right">--}}
                        {{--<el-pagination layout="prev, pager, next,jumper" @current-change="search" :total="total"--}}
                                       {{--:page-size="per_page" :current-page="current_page" background--}}
                        {{--></el-pagination>--}}
                    {{--</el-col>--}}
                {{--</el-row>--}}
            {{--</div>--}}

        </div>
    </div>

    <script>
        var app = new Vue({
            el: "#app",
            delimiters: ['[[', ']]'],
            data() {
                return {
                    list:[],
                    loading: false,
                    table_loading: false,
                    //分页
                    total: 0,
                    per_page: 0,
                    current_page: 0,
                    rules: {},

                }
            },
            created() {

            },
            mounted() {
                let result = this.viewReturn();
                this.__initial(result);
            },
            methods: {
                //视图返回数据
                viewReturn() {
                    return {!! $data?:'{}' !!};
                },
                //初始化页面数据，请求链接
                __initial(data) {

                    if (data.label_list) {
                        this.list = data.label_list;
                    }
                    console.log(data);
                },
                editLabel(label_id) {
                    window.location.href = `{!! yzWebFullUrl('plugin.label.admin.set.edit') !!}`+`&id=`+label_id;
                },

                editEnable(label_id,status) {


                    this.$http.post('{!! yzWebFullUrl('plugin.label.admin.set.edit-enable') !!}',{label_id:label_id,status:status}).then(function (response) {
                        if (response.data.result) {
                            this.$message({type: 'success',message: '设置成功！'});
                        } else{
                            this.$message({type: 'error',message: response.data.msg});
                        }
                        location.reload()
                    },function (response) {
                        this.$message({type: 'error',message: response.data.msg});
                    })
                },
            },
        })

    </script>


@endsection