@extends('admin.master')

@section('style')
<link href="{{ asset('data/assets/css/lightbox.css') }}" rel="stylesheet">
@endsection

@section('top')
	<div class="top-breadcrumb pull-left">
        <h5>风格管理</h5>
    </div>
	<div class="top-btn-group pull-right">
		<a href="{{ url('admin/theme').'?'.rand(1000,100000) }}" class="btn btn-primary">
			<i class="iconfont icon-jiantou-copy-copy"></i><span>已选风格</span>
		</a>
	</div>
@endsection

@section('content')
    <div class="order-search mb-10">
        {!! Form::model($where, ['method'=>'get', 'class'=>'form-inline']) !!}
        <div class="form-group pr-10">
            <label class="control-label">标题：</label>
            {!! Form::text('q', null, ['class'=>'form-control len260 wd-search', 'id'=>'kw', 'placeholder'=>'请输入架构编号']) !!}
        </div>
        <button type="submit" class="btn btn-default">查询</button>
        {!! Form::close() !!}
    </div>
    <div class="loading">
        <img src="{{ asset('data/assets/images/load03.gif') }}" title="安装中..."><br>安装中...
    </div>
	@if(!empty(json_decode($themes, true)['data']))
		<ul class="theme-install-list">
			@foreach (json_decode($themes, true)['data'] as $value)
				<li>
					<div class="theme-list-img">
                        <img src="{{ $value['img'] }}">
                        <div class="back-color"></div>
                        <a class="theme-preview" href="{{ $value['original_img'] }}" data-lightbox="roadtrip">
                            <i class="iconfont icon-sousuo2" ></i>预览
                        </a>
                        <a class="theme-download" href="Javascript: void(0)" data-zip="{{ substr(basename($value['filePath']), 0, -4) }}" data-name="{{ $value['name'] }}" data-filepath="{{ $value['filePath'] }}">
                            <i class="iconfont icon-weibiaoti102" ></i>安装
                        </a>
                    </div>
                    <div class="theme-list-text">
                        架构编号：<span class="text-blues">{{ $value['name'] }}</span>
                    </div>
				</li>
			@endforeach
		</ul>
	@endif
    @if(empty(json_decode($themes, true)['data']))
        <div class="nodata-wrap">
            <div class="notice-null"><span class="inline-block">暂无数据</span></div>
        </div>
    @endif
@endsection

@section('notice')
<!-- Modal -->
<div class="modal fade" id="dialog" tabindex="-1" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="true"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title">提示</h4>
        </div>
        <div class="modal-body clearfix">
            <div class='col-sm-1 text-center'><i class='iconfont icon-zhuyi'></i></div>
            <div class='col-sm-11 breakall'><p>主题已存在，请谨慎操作</p><p class='text-muted'>您确认要覆盖吗？</p></div>
        </div>
        <div class="modal-footer">
        	<button type="button" class="btn btn-primary btn-modal-ok">确定</button>
        	<button class="btn btn-default btn-modal-cancel btn-modal-close" data-dismiss="modal">取消</button>
        </div>
    </div>
  </div>
</div>
<!-- Modal End -->

<!-- Modal -->
<div class="modal fade" id="dialog-tip" tabindex="-1" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="true"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title">提示</h4>
        </div>
        <div class="modal-body clearfix">
			<div class='col-sm-1 text-center'><i class='glyphicon glyphicon-ok text-size-32 text-warning'></i></div>
			<div class='col-sm-11 breakall'><p class="delete-error">删除失败！</p></div>
		</div>	
        <div class="modal-footer">
			<button class="btn btn-primary btn-modal-close" data-dismiss="modal">确定</button>
        </div>
    </div>
  </div>
</div>
<!-- Modal End -->

<!-- Modal -->
<div class="modal fade" id="dialog-error" tabindex="-1" role="dialog">
  <div class="modal-dialog">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="true"><span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title">提示</h4>
        </div>
        <div class="modal-body clearfix">
			<div class='col-sm-1 text-center'><i class='fa fa-times-circle text-size-32 text-warning'></i></div>
			<div class='col-sm-11 breakall'><p class="delete-error">删除失败！</p></div>
		</div>	
        <div class="modal-footer">
			<button class="btn btn-primary btn-modal-close" data-dismiss="modal">确定</button>
        </div>
    </div>
  </div>
</div>
<!-- Modal End -->

@endsection

@section('foot')
<script src="{{ asset('data/assets/js/lightbox.js') }}"></script>
<script type="text/javascript">
    $('body').on('click', '.theme-download', function() {
        themeName = $(this).data('name');
        filePath  = $(this).data('filepath');
        zipName   = $(this).data('zip');
        url       = HOME_URL + '/admin/theme/download';
        $.ajax({
            type: "POST",
            url: url,
            data: {"name": themeName, "filePath": filePath, "zipName": zipName},
            beforeSend: function(){
                $('.loading').show(500);
            },
            success: function(json) {
                $('.loading').hide(500);
                if (json.status == "existence") {
                    $('#dialog').modal('show');
                    return false;
                } else if (json.status == "success") {
                    $('.delete-error').html(json.message);
                    $('#dialog-tip').modal('show');
                }

            }
        });
    });
    $('body').on('click', '.btn-modal-ok', function() {
        $(this).parents('#dialog').modal('hide');
        $.ajax({
            type: "POST",
            url: url,
            data: {"name": themeName, "filePath": filePath, "zipName": zipName, "cover": 1},
            success: function(json) {
                if(json.status == "success") {
                    $('.delete-error').html(json.message);
                    $('#dialog-tip').modal('show');
                }
            }
        });
    });
</script>
@endsection
