|
@@ -0,0 +1,455 @@
|
|
|
+<style>
|
|
|
+ .layui-upload-list {
|
|
|
+ width: auto;
|
|
|
+ height: auto;
|
|
|
+ margin-bottom: 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .layui-elem-quote {
|
|
|
+ padding-bottom: 5px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .layui-upload-img {
|
|
|
+ /*width: 92px;*/
|
|
|
+ height: 92px;
|
|
|
+ }
|
|
|
+
|
|
|
+ hr {
|
|
|
+ margin: 15px 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .uk-alert-danger {
|
|
|
+ background: #fff1f0;
|
|
|
+ color: #d85030;
|
|
|
+ margin-bottom: 15px;
|
|
|
+ padding: 10px;
|
|
|
+ border: 1px solid rgba(216, 80, 48, .3);
|
|
|
+ border-radius: 4px;
|
|
|
+ text-shadow: 0 1px 0 #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ .imgItem {
|
|
|
+ display: inline-block;
|
|
|
+ position: relative;
|
|
|
+ margin: 0 10px 10px 0;
|
|
|
+ }
|
|
|
+
|
|
|
+ .imgItem .layui-close {
|
|
|
+ position: absolute;
|
|
|
+ top: 0;
|
|
|
+ right: 0;
|
|
|
+ height: 16px;
|
|
|
+ line-height: 16px;
|
|
|
+ text-align: center;
|
|
|
+ color: #000;
|
|
|
+ width: 16px;
|
|
|
+ border: 1px solid #000;
|
|
|
+ background-color: #fff;
|
|
|
+ }
|
|
|
+
|
|
|
+ iframe.fr-iframe {
|
|
|
+ padding: 0 20px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .fr-wrapper.show-placeholder .fr-placeholder {
|
|
|
+ padding-left: 30px !important;
|
|
|
+ }
|
|
|
+
|
|
|
+ .layui-form-label {
|
|
|
+ width: {{ $colWidth }}px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .layui-input-block {
|
|
|
+ margin-left: {{ $colWidth + 30 }}px;
|
|
|
+ }
|
|
|
+
|
|
|
+ .weadmin-body {
|
|
|
+ overflow: initial;
|
|
|
+ }
|
|
|
+</style>
|
|
|
+<script src="/js/admin/xm-select.js"></script>
|
|
|
+<script src="/laydate/laydate.js"></script>
|
|
|
+<form class="layui-form" id="form-unify" method="post" action="{{ $path ?? '' }}" style="padding:20px;">
|
|
|
+ @csrf
|
|
|
+ <h2 class="uk-modal-title">{{ $fromTitle }}</h2>
|
|
|
+ <br>
|
|
|
+ @foreach($columns as $key => $column)
|
|
|
+ @switch($column['type'])
|
|
|
+ @case('tree_select')
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <label class="layui-form-label">{{ $column['label'] }}</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ {{-- {!! json_encode($column) !!} --}}
|
|
|
+ <select name="{{ $key }}">
|
|
|
+ @if($column['isShowNull'] == true)
|
|
|
+ <option value="0" @if(!isset($item)) selected @endif>无</option>
|
|
|
+ @endif
|
|
|
+ @if(count($column['options']) > 0)
|
|
|
+ @include('admin::component.multi_select_option', ['selects' => $column['options'], 'selectPid' => $item[$key] ?? ($column['default'] ?? '')])
|
|
|
+ @endif
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ @break
|
|
|
+ @endswitch
|
|
|
+ @endforeach
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <label class="layui-form-label">摄像头名称</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input class="layui-input" type="text" placeholder="请输入摄像头名称" name="camera_name"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <label class="layui-form-label">摄像头类型</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <?php /*dd($columns);exit;*/?>
|
|
|
+ <select name="camera_type">
|
|
|
+ <option value="0">无</option>
|
|
|
+ @foreach($columns['camera_type']['options'] as $k=>$v)
|
|
|
+ @if($k == 1 && count($columns['camera_type']['options']) > 0)
|
|
|
+ <option value="{{ $k }}" selected>{{ $v }}</option>
|
|
|
+ @else
|
|
|
+ <option value="{{ $k }}">{{ $v }}</option>
|
|
|
+ @endif
|
|
|
+ @endforeach
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <label class="layui-form-label">摄像头来源</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <select name="camera_source" id="camera_source" lay-filter="camera_source">
|
|
|
+ <option value="0">无</option>
|
|
|
+ @foreach($columns['camera_source']['options'] as $k=>$v)
|
|
|
+ @if($k == 1 && count($columns['camera_source']['options']) > 0)
|
|
|
+ <option value="{{ $k }}" selected>{{ $v }}</option>
|
|
|
+ @else
|
|
|
+ <option value="{{ $k }}">{{ $v }}</option>
|
|
|
+ @endif
|
|
|
+ @endforeach
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <div class="layui-form-label">录像机品牌</div>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ @foreach($columns['video_recorder']['options'] as $k => $v)
|
|
|
+ @if($k == 1 && count($columns['video_recorder']['options']) > 0)
|
|
|
+ <label><input type="radio" name="video_recorder" value="{{ $k }}" checked title="{{ $v }}"/></label>
|
|
|
+ @else
|
|
|
+ <label><input type="radio" name="video_recorder" value="{{ $k }}" title="{{ $v }}"/></label>
|
|
|
+ @endif
|
|
|
+ @endforeach
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item" id="camera_url">
|
|
|
+ <label class="layui-form-label">摄像头链接</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input class="layui-input" type="text" placeholder="请输入摄像头链接" name="camera_url"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item" id="user_name">
|
|
|
+ <label class="layui-form-label">用户名</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input class="layui-input" type="text" placeholder="请输入用户名" name="user_name"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item" id="password">
|
|
|
+ <label class="layui-form-label">密码</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input class="layui-input" type="text" placeholder="请输入密码" name="password"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item" id="ip">
|
|
|
+ <label class="layui-form-label">ip地址</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input class="layui-input" type="text" placeholder="请输入ip地址" name="ip"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item" id="port">
|
|
|
+ <label class="layui-form-label">端口</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input class="layui-input" type="text" placeholder="请输入端口" name="port"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item" id="com_number">
|
|
|
+ <label class="layui-form-label">通道号</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input class="layui-input" type="text" placeholder="请输入通道号" name="com_number"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item" id="code_stream">
|
|
|
+ <label class="layui-form-label">视频码流</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <?php /*dd($columns);exit;*/?>
|
|
|
+ <select name="code_stream">
|
|
|
+ <option value="0">无</option>
|
|
|
+ @foreach($columns['code_stream']['options'] as $k=>$v)
|
|
|
+ @if($k == 1 && count($columns['code_stream']['options']) > 0)
|
|
|
+ <option value="{{ $k }}" selected>{{ $v }}</option>
|
|
|
+ @else
|
|
|
+ <option value="{{ $k }}">{{ $v }}</option>
|
|
|
+ @endif
|
|
|
+ @endforeach
|
|
|
+ </select>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="layui-form-item">
|
|
|
+ <label class="layui-form-label">排序</label>
|
|
|
+ <div class="layui-input-block">
|
|
|
+ <input class="layui-input" type="text" placeholder="请输入排序" name="sort" value="0"/>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ @foreach($columns as $key => $column)
|
|
|
+ @switch($column['type'])
|
|
|
+ @case('uploadImg')
|
|
|
+ <label class="layui-form-label">{{ $column['label'] }}</label>
|
|
|
+ <div class="layui-upload">
|
|
|
+ <img id="pre" class="layui-upload-img none">
|
|
|
+
|
|
|
+ @if (strlen($column['default']) > 0)
|
|
|
+ <script>
|
|
|
+ $('#pre').attr('src', '{{ $column['default'] }}');
|
|
|
+ </script>
|
|
|
+ @endif
|
|
|
+
|
|
|
+ <span style="display: inline-table;">
|
|
|
+ <button type="button" class="layui-btn" id="selectImgBtn">上传图片</button>
|
|
|
+ <p id="uploadTips">
|
|
|
+ <input type="hidden" name="{{ $key }}" value="{{ $column['default'] ?? '' }}"/>
|
|
|
+ </p>
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+ <style>
|
|
|
+ .layui-upload-img {
|
|
|
+ /*width: 92px;*/
|
|
|
+ height: 92px;
|
|
|
+ margin: 10px 10px 10px 10px;
|
|
|
+ }
|
|
|
+
|
|
|
+ #uploadTips {
|
|
|
+ line-height: 30px;
|
|
|
+ }
|
|
|
+ </style>
|
|
|
+ <script>
|
|
|
+ layui.use('upload', function () {
|
|
|
+
|
|
|
+ var $ = layui.jquery
|
|
|
+ , upload = layui.upload;
|
|
|
+
|
|
|
+ var uploadInst = upload.render({
|
|
|
+ elem: '#selectImgBtn'
|
|
|
+ , url: "{{ $column['uploadURLPath'] }}"
|
|
|
+ , acceptMime: 'image/jpg, image/png, image/jpeg'
|
|
|
+ , number: 1
|
|
|
+ , before: function (obj) {
|
|
|
+ //预读本地文件示例,不支持ie8
|
|
|
+ obj.preview(function (index, file, result) {
|
|
|
+ $('#pre').attr('src', result); //图片链接(base64)
|
|
|
+ });
|
|
|
+ }
|
|
|
+ , done: function (res) {
|
|
|
+ //如果上传失败
|
|
|
+ if (res.code > 0) {
|
|
|
+ return layer.msg('上传失败');
|
|
|
+ }
|
|
|
+ //上传成功
|
|
|
+ $("input[name='{{ $key }}']").val(res.data.image_path);
|
|
|
+ }
|
|
|
+ , error: function () {
|
|
|
+ //演示失败状态,并实现重传
|
|
|
+ var uploadTips = $('#uploadTips');
|
|
|
+ uploadTips.html('<span style="color: #FF5722; text-align:center">上传失败</span> <a class="layui-btn layui-btn-xs demo-reload">重试</a>');
|
|
|
+ uploadTips.find('.demo-reload').on('click', function () {
|
|
|
+ uploadInst.upload();
|
|
|
+ });
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ });
|
|
|
+ </script>
|
|
|
+ @break
|
|
|
+
|
|
|
+ @default
|
|
|
+ @endswitch
|
|
|
+ @if($hasHr)
|
|
|
+ <hr>
|
|
|
+ @endif
|
|
|
+ @endforeach
|
|
|
+
|
|
|
+ @if(!is_null($footBtns))
|
|
|
+ <hr>
|
|
|
+ <div style="text-align: right">
|
|
|
+ @if(in_array('goback',$footBtns))
|
|
|
+ @if($isAjax)
|
|
|
+ <button class="layui-btn layui-btn-primary layui-layer-close" style="position:relative;"
|
|
|
+ type="button">
|
|
|
+ 取消
|
|
|
+ </button>
|
|
|
+ @else
|
|
|
+ <button class="layui-btn layui-btn-primary layui-layer-close" style="position:relative;"
|
|
|
+ type="button"
|
|
|
+ onclick="javascript:history.go(-1);">返回
|
|
|
+ </button>
|
|
|
+ @endif
|
|
|
+ @endif
|
|
|
+ @if(in_array('save',$footBtns))
|
|
|
+ <button class="layui-btn" type="submit" lay-submit lay-filter="formBox">保存</button>
|
|
|
+ @endif
|
|
|
+ </div>
|
|
|
+ @endif
|
|
|
+</form>
|
|
|
+
|
|
|
+<script>
|
|
|
+ //根据摄像头来源显示内容
|
|
|
+ if(document.getElementById("camera_source").value == 1){//硬盘录像机
|
|
|
+ document.getElementById("camera_url").style.display = 'none';
|
|
|
+ document.getElementById("user_name").style.display = 'block';
|
|
|
+ document.getElementById("password").style.display = 'block';
|
|
|
+ document.getElementById("ip").style.display = 'block';
|
|
|
+ document.getElementById("port").style.display = 'block';
|
|
|
+ document.getElementById("com_number").style.display = 'block';
|
|
|
+ document.getElementById("code_stream").style.display = 'block';
|
|
|
+ }
|
|
|
+ if(document.getElementById("camera_source").value == 2){//视频服务器
|
|
|
+ document.getElementById("camera_url").style.display = 'none';
|
|
|
+ document.getElementById("user_name").style.display = 'none';
|
|
|
+ document.getElementById("password").style.display = 'none';
|
|
|
+ document.getElementById("ip").style.display = 'none';
|
|
|
+ document.getElementById("port").style.display = 'none';
|
|
|
+ document.getElementById("com_number").style.display = 'none';
|
|
|
+ document.getElementById("code_stream").style.display = 'block';
|
|
|
+ }
|
|
|
+ if(document.getElementById("camera_source").value == 3){//内网摄像头
|
|
|
+ document.getElementById("camera_url").style.display = 'block';
|
|
|
+ document.getElementById("user_name").style.display = 'none';
|
|
|
+ document.getElementById("password").style.display = 'none';
|
|
|
+ document.getElementById("ip").style.display = 'none';
|
|
|
+ document.getElementById("port").style.display = 'none';
|
|
|
+ document.getElementById("com_number").style.display = 'none';
|
|
|
+ document.getElementById("code_stream").style.display = 'none';
|
|
|
+ }
|
|
|
+ layui.use(['form', 'laydate', 'table'], function () {
|
|
|
+
|
|
|
+ var form = layui.form, table = layui.table;
|
|
|
+ form.render();
|
|
|
+
|
|
|
+ form.on('checkbox', function (data) {
|
|
|
+ $(data.othis).toggleClass('layui-form-checked');
|
|
|
+ });
|
|
|
+
|
|
|
+ form.on('select(camera_source)', function(data){
|
|
|
+ var val=data.value;
|
|
|
+ if(val == 1){
|
|
|
+ document.getElementById("camera_url").style.display = 'none';
|
|
|
+ document.getElementById("user_name").style.display = 'block';
|
|
|
+ document.getElementById("password").style.display = 'block';
|
|
|
+ document.getElementById("ip").style.display = 'block';
|
|
|
+ document.getElementById("port").style.display = 'block';
|
|
|
+ document.getElementById("com_number").style.display = 'block';
|
|
|
+ document.getElementById("code_stream").style.display = 'block';
|
|
|
+ }else if(val == 2){
|
|
|
+ document.getElementById("camera_url").style.display = 'none';
|
|
|
+ document.getElementById("user_name").style.display = 'none';
|
|
|
+ document.getElementById("password").style.display = 'none';
|
|
|
+ document.getElementById("ip").style.display = 'none';
|
|
|
+ document.getElementById("port").style.display = 'none';
|
|
|
+ document.getElementById("com_number").style.display = 'none';
|
|
|
+ document.getElementById("code_stream").style.display = 'block';
|
|
|
+ }else if(val == 3){
|
|
|
+ document.getElementById("camera_url").style.display = 'block';
|
|
|
+ document.getElementById("user_name").style.display = 'none';
|
|
|
+ document.getElementById("password").style.display = 'none';
|
|
|
+ document.getElementById("ip").style.display = 'none';
|
|
|
+ document.getElementById("port").style.display = 'none';
|
|
|
+ document.getElementById("com_number").style.display = 'none';
|
|
|
+ document.getElementById("code_stream").style.display = 'none';
|
|
|
+ }
|
|
|
+ });
|
|
|
+
|
|
|
+ @if($isAjax)
|
|
|
+ form.on('submit(formBox)', function (data) {
|
|
|
+ var urlPost = $('#form-unify').attr('action');
|
|
|
+ var submitBtn = $(data.elem);
|
|
|
+ submitBtn.addClass('layui-btn-disabled').prop('disabled', true).text('提交中……');
|
|
|
+ $.ajax({
|
|
|
+ url: urlPost,
|
|
|
+ type: 'POST',
|
|
|
+ dataType: 'json',
|
|
|
+ data: data.field
|
|
|
+ })
|
|
|
+ .done(function (res) {
|
|
|
+ if (res.code === 0) {
|
|
|
+ submitBtn.text('完成');
|
|
|
+ layer.msg('完成!', {anim: 0}, function () {
|
|
|
+ if (res.data.table === '') {
|
|
|
+ location.reload();
|
|
|
+ } else {
|
|
|
+ layer.closeAll();
|
|
|
+ if (res.data.table !== undefined) {
|
|
|
+ table.reload(res.data.table);
|
|
|
+ }
|
|
|
+ if (res.url !== undefined) {
|
|
|
+ location.href = res.url;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ });
|
|
|
+ } else {
|
|
|
+ layer.msg(res.message, {anim: 0}, function () {
|
|
|
+ submitBtn.removeClass('layui-btn-disabled').prop('disabled', false).text('重新保存');
|
|
|
+ });
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .fail(function (res) {
|
|
|
+ layer.msg(res.message, {anim: 0}, function () {
|
|
|
+ submitBtn.removeClass('layui-btn-disabled').prop('disabled', false).text('重新保存');
|
|
|
+ });
|
|
|
+ });
|
|
|
+ return false;
|
|
|
+ });
|
|
|
+ @endif
|
|
|
+ });
|
|
|
+
|
|
|
+ $('.layui-form').on('click', '.layui-close', function () {
|
|
|
+ var self = $(this);
|
|
|
+ self.closest('.imgItem').remove();
|
|
|
+ });
|
|
|
+
|
|
|
+ $('.layui-form').on('click', '.file-delete', function () {
|
|
|
+ var self = $(this);
|
|
|
+ self.closest('tr').remove();
|
|
|
+ });
|
|
|
+
|
|
|
+ $('.date-input').datepicker({
|
|
|
+ language: 'zh-CN',
|
|
|
+ format: 'yyyy-mm-dd',
|
|
|
+ zIndex: 19999999,
|
|
|
+ autoHide: true
|
|
|
+ });
|
|
|
+ $('.dateMonth-input').datepicker({
|
|
|
+ language: 'zh-CN',
|
|
|
+ format: 'yyyy-mm',
|
|
|
+ zIndex: 19999999,
|
|
|
+ autoHide: true
|
|
|
+ });
|
|
|
+ $('.dateYear-input').datepicker({
|
|
|
+ language: 'zh-CN',
|
|
|
+ format: 'yyyy',
|
|
|
+ zIndex: 19999999,
|
|
|
+ autoHide: true
|
|
|
+ });
|
|
|
+</script>
|
|
|
+
|