初始上传
157
addon/form/shop/view/form/edit.html
Executable file
@@ -0,0 +1,157 @@
|
||||
<link rel="stylesheet" href="STATIC_EXT/diyview/css/diyview.css?time=20240316" />
|
||||
<link rel="stylesheet" href="FORM_CSS/form.css" />
|
||||
<style>
|
||||
.layui-layout-admin .layui-body .body-content{margin: 15px !important;}
|
||||
#diyView{visibility: visible;}
|
||||
.preview-wrap .preview-restore-wrap{visibility: visible;}
|
||||
.edit-attribute{display: block;}
|
||||
</style>
|
||||
|
||||
<div id="diyView">
|
||||
<!-- 组件列表 -->
|
||||
<div class="component-list">
|
||||
<h3>表单</h3>
|
||||
<div>
|
||||
<input type="text" name="form_name" class="layui-input" placeholder="请输入表单标题" {notempty name="$info"}value="{$info['form_name']}"{/notempty}>
|
||||
</div>
|
||||
|
||||
<nav>
|
||||
<h3>组件</h3>
|
||||
<ul>
|
||||
{foreach name="component" item="li" key="li_k"}
|
||||
<li title="{$li.title}" @click="addComponent('{$li.name}')">
|
||||
<img src="__ROOT__/{$li.icon}" data-icon="__ROOT__/{$li.icon}" data-icon-selected="__ROOT__/{$li.icon_selected}" />
|
||||
<span>{$li.title}</span>
|
||||
</li>
|
||||
{/foreach}
|
||||
</ul>
|
||||
</nav>
|
||||
</div>
|
||||
|
||||
<div class="preview-wrap">
|
||||
<div class="preview-restore-wrap">
|
||||
<div class="div-wrap">
|
||||
<div class='diy-view-wrap layui-form'>
|
||||
<div class="preview-block">
|
||||
<div class="order-wrap">
|
||||
<img src="{:img($form_type.head_img)}" class="head-img"/>
|
||||
</div>
|
||||
|
||||
<div class="draggable-wrap" form-type="{$form_type.type}">
|
||||
<div class="draggable-element" :class="{'selected' : index == currIndex}" v-for="(item, index) in list" :key="item.id" @click="currIndex = index">
|
||||
<i class="del" @click="list.splice(index, 1)">x</i>
|
||||
<form-text v-if="item.controller == 'Text'" :value="item.value" :ref="item.id"></form-text>
|
||||
<form-textarea v-if="item.controller == 'Textarea'" :value="item.value" :ref="item.id"></form-textarea>
|
||||
<form-select v-if="item.controller == 'Select'" :value="item.value" :ref="item.id"></form-select>
|
||||
<form-checkbox v-if="item.controller == 'Checkbox'" :value="item.value" :ref="item.id"></form-checkbox>
|
||||
<form-radio v-if="item.controller == 'Radio'" :value="item.value" :ref="item.id"></form-radio>
|
||||
<form-img v-if="item.controller == 'Img'" :value="item.value" :ref="item.id"></form-img>
|
||||
<form-date v-if="item.controller == 'Date'" :value="item.value" :ref="item.id"></form-date>
|
||||
<form-date-limit v-if="item.controller == 'Datelimit'" :value="item.value" :ref="item.id"></form-date-limit>
|
||||
<form-time v-if="item.controller == 'Time'" :value="item.value" :ref="item.id"></form-time>
|
||||
<form-time-limit v-if="item.controller == 'Timelimit'" :value="item.value" :ref="item.id"></form-time-limit>
|
||||
<form-city v-if="item.controller == 'City'" :value="item.value" :ref="item.id"></form-city>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="edit-attribute" v-if="editData">
|
||||
<form-text-edit v-if="editData.controller == 'Text'" :value="editData"></form-text-edit>
|
||||
<form-textarea-edit v-if="editData.controller == 'Textarea'" :value="editData"></form-textarea-edit>
|
||||
<form-select-edit v-if="editData.controller == 'Select'" :value="editData"></form-select-edit>
|
||||
<form-checkbox-edit v-if="editData.controller == 'Checkbox'" :value="editData"></form-checkbox-edit>
|
||||
<form-radio-edit v-if="editData.controller == 'Radio'" :value="editData"></form-radio-edit>
|
||||
<form-img-edit v-if="editData.controller == 'Img'" :value="editData"></form-img-edit>
|
||||
<form-date-edit v-if="editData.controller == 'Date'" :value="editData"></form-date-edit>
|
||||
<form-date-limit-edit v-if="editData.controller == 'Datelimit'" :value="editData"></form-date-limit-edit>
|
||||
<form-time-edit v-if="editData.controller == 'Time'" :value="editData"></form-time-edit>
|
||||
<form-time-limit-edit v-if="editData.controller == 'Timelimit'" :value="editData"></form-time-limit-edit>
|
||||
<form-city-edit v-if="editData.controller == 'City'" :value="editData"></form-city-edit>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="custom-save">
|
||||
<button class="layui-btn save">保存</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script src="STATIC_JS/vue.js"></script>
|
||||
<script src="STATIC_EXT/diyview/js/components.js"></script>
|
||||
<script src="STATIC_EXT/diyview/js/async_load_css.js"></script>
|
||||
<script src="STATIC_EXT/diyview/js/ddsort.js"></script>
|
||||
<script src="FORM_JS/form.js"></script>
|
||||
<script>
|
||||
var formComponents = JSON.parse('{:json_encode($component)}'),
|
||||
repeat_flag = false;
|
||||
|
||||
$(function() {
|
||||
var height = $(window).height();
|
||||
var commonHeight = height - 214;
|
||||
$(".component-list nav").css("height", (commonHeight + 20) + "px");
|
||||
$(".preview-wrap .preview-restore-wrap .div-wrap").css("height", (commonHeight) + "px");
|
||||
$(".edit-attribute .attr-wrap").css("height", (commonHeight) + "px");
|
||||
$(".edit-attribute-placeholder").css("height", (height - 214) + "px");
|
||||
$(".preview-block").css("min-height", (commonHeight - 120) + "px");
|
||||
|
||||
$("body").off("mousemove", ".component-list ul li").on("mousemove", ".component-list ul li", function() {
|
||||
var icon_selected = $(this).find("img").attr("data-icon-selected");
|
||||
$(this).find("img").attr("src", icon_selected);
|
||||
}).on("mouseout", ".component-list ul li", function() {
|
||||
var icon = $(this).find("img").attr("data-icon");
|
||||
$(this).find("img").attr("src", icon);
|
||||
});
|
||||
|
||||
$('.save').click(function() {
|
||||
var form_name = $('[name="form_name"]').val();
|
||||
|
||||
if (!/[\S]+/.test(form_name)) {
|
||||
layer.msg('请输入表单标题', {
|
||||
icon: 5
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!vue._data.list.length) {
|
||||
layer.msg('您尚未选择任何组件', {
|
||||
icon: 5
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
// 组件内验证
|
||||
if (!vue.verify()) return;
|
||||
|
||||
if (repeat_flag) return;
|
||||
repeat_flag = true;
|
||||
|
||||
$.ajax({
|
||||
type: "post",
|
||||
url: {notempty name = "$info"}ns.url("form://shop/form/editform"),{else /} ns.url("form://shop/form/addform"), {/notempty}
|
||||
data: {
|
||||
{notempty name = "$info"}id: {$info.id},{/notempty}
|
||||
form_name: form_name,
|
||||
form_type: '{$form_type.type}',
|
||||
json_data: JSON.stringify(vue._data.list)
|
||||
},
|
||||
dataType: "JSON",
|
||||
success: function(res) {
|
||||
layer.msg(res.message);
|
||||
if (res.code == 0) {
|
||||
location.hash = ns.hash("form://shop/form/lists");
|
||||
} else {
|
||||
repeat_flag = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
})
|
||||
})
|
||||
|
||||
{notempty name = "$info"}
|
||||
setTimeout(function() {
|
||||
vue._data.list = JSON.parse('{:html_entity_decode($info.json_data)}');
|
||||
}, 300);
|
||||
{/notempty}
|
||||
</script>
|
||||
251
addon/form/shop/view/form/formdata.html
Executable file
@@ -0,0 +1,251 @@
|
||||
<style>
|
||||
.table-btn {justify-content: center;}
|
||||
.layui-layout-admin .screen{margin-bottom: 15px;}
|
||||
.layui-layout-admin .layui-form-item .layui-input-inline{background-color: #fff;}
|
||||
.layui-layout-admin .table-tab .layui-tab-title{margin-bottom: 15px;}
|
||||
.form-img .form-img-wrap {width: 25px;height: 25px;margin: 0 10px 10px 0;border: 1px solid #EAEAEA;display: flex;align-items: center;justify-items: center}
|
||||
.form-img-wrap img {max-width: 100%;max-height: 100%;height: auto;width: 100%}
|
||||
.layui-layer-content .layui-form-label {width: 100px}
|
||||
.layui-layer-content .layui-form-label + .layui-input-block {margin-left: 100px}
|
||||
.layui-table .form-data-wrap {max-height: 50px;overflow: hidden;}
|
||||
.layui-table .layui-form-item {margin-bottom: 0}
|
||||
.layui-table .layui-form-label {width: auto;height: 25px;line-height: 25px;}
|
||||
.layui-table .layui-form-label + .layui-input-block {margin-left: 0; height: 25px;line-height: 25px;min-height: unset;}
|
||||
</style>
|
||||
|
||||
<div class="screen layui-collapse" lay-filter="selection_panel">
|
||||
<div class="layui-colla-item">
|
||||
<form class="layui-colla-content layui-form layui-show">
|
||||
<div class="layui-form-item">
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">用户昵称:</label>
|
||||
<div class="layui-input-inline">
|
||||
<input type="text" name="nickname" placeholder="请输入用户昵称" autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">创建时间:</label>
|
||||
<div class="layui-input-inline">
|
||||
<input type="text" class="layui-input" name="start_time" placeholder="开始时间" id="start_time" readonly>
|
||||
<i class=" iconrili iconfont calendar"></i>
|
||||
</div>
|
||||
<div class="layui-form-mid">-</div>
|
||||
<div class="layui-input-inline">
|
||||
<input type="text" class="layui-input" name="end_time" placeholder="结束时间" id="end_time" readonly>
|
||||
<i class=" iconrili iconfont calendar"></i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row">
|
||||
<button class="layui-btn" lay-filter="search" lay-submit>筛选</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- 列表 -->
|
||||
<table id="formdata_list" lay-filter="formdata_list"></table>
|
||||
|
||||
<input type="hidden" value="" id="param" />
|
||||
|
||||
<!-- 状态 -->
|
||||
<script type="text/html" id="status">
|
||||
{{# if(d.status == 1){ }}
|
||||
<span style="color: green;">正常</span>
|
||||
{{# }else if(d.status == -1){ }}
|
||||
<span style="color: gray;">冻结</span>
|
||||
{{# } }}
|
||||
</script>
|
||||
|
||||
<!-- 用户信息 -->
|
||||
<script type="text/html" id="userdetail">
|
||||
<div class='table-title'>
|
||||
<div class='title-pic'>
|
||||
<img layer-src src="{{ns.img(d.headimg)}}" onerror="this.src = '{:img('public/static/img/default_img/head.png')}' ">
|
||||
</div>
|
||||
<div class='title-content'>
|
||||
<p class="layui-elip">{{d.nickname}}</p>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<!-- 工具栏操作 -->
|
||||
<script type="text/html" id="operation">
|
||||
<div class="table-btn">
|
||||
<a class="layui-btn" lay-event="see">查看</a>
|
||||
<a class="layui-btn" lay-event="delete">删除</a>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="formData">
|
||||
<div class="form-data-wrap">
|
||||
{{# d.form_data.forEach(function(item){ }}
|
||||
<div class="layui-form-item">
|
||||
<label class="layui-form-label">{{ item.value.title }}:</label>
|
||||
<div class="layui-input-block">
|
||||
{{# if(item.controller == 'Img'){ }}
|
||||
<div class="form-img">
|
||||
{{# item.img_lists.forEach(function(img){ }}
|
||||
<div class="form-img-wrap">
|
||||
<img src="{{ ns.img(img) }}" layer-src>
|
||||
</div>
|
||||
{{# }) }}
|
||||
</div>
|
||||
{{# } else { }}
|
||||
{{ item.val }}
|
||||
{{# } }}
|
||||
</div>
|
||||
</div>
|
||||
{{# }) }}
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script>
|
||||
var repeat_flag = false;
|
||||
layui.use(['form', 'laydate', 'laytpl'], function() {
|
||||
var table,
|
||||
form = layui.form,
|
||||
laydate = layui.laydate,
|
||||
laytpl = layui.laytpl;
|
||||
|
||||
form.render();
|
||||
|
||||
//渲染时间
|
||||
laydate.render({
|
||||
elem: '#start_time',
|
||||
type: 'datetime',
|
||||
max: 0
|
||||
});
|
||||
|
||||
laydate.render({
|
||||
elem: '#end_time',
|
||||
type: 'datetime',
|
||||
max: 0
|
||||
});
|
||||
|
||||
table = new Table({
|
||||
elem: '#formdata_list',
|
||||
url: ns.url("form://shop/form/formdata"),
|
||||
where: {
|
||||
form_id: "{$form_id}"
|
||||
},
|
||||
cols: [[
|
||||
{
|
||||
field: 'userdetail',
|
||||
title: '会员信息',
|
||||
width: '25%',
|
||||
unresize: 'false',
|
||||
templet: '#userdetail'
|
||||
},
|
||||
{
|
||||
field: '',
|
||||
title: '表单信息',
|
||||
width: '25%',
|
||||
unresize: 'false',
|
||||
templet: '#formData'
|
||||
},
|
||||
{
|
||||
field: '',
|
||||
title: '来源订单',
|
||||
width: '20%',
|
||||
unresize: 'false',
|
||||
templet: function(data) {
|
||||
if(data.scene == 'order'){
|
||||
return '<a href="'+ ns.href("shop/order/detail", {order_id:data.order_info.order_id}) +'" target="_blank" class="text-color">'+ data.order_info.order_no +'</a>';
|
||||
}else if(data.scene == 'goods'){
|
||||
return '<a href="'+ ns.href("shop/order/detail", {order_id:data.order_goods_info.order_id}) +'" target="_blank" class="text-color">'+ data.order_goods_info.order_no +'</a>';
|
||||
}else{
|
||||
return '';
|
||||
}
|
||||
}
|
||||
},
|
||||
{
|
||||
field: 'create_time',
|
||||
title: '创建时间',
|
||||
unresize: 'false',
|
||||
width: '20%',
|
||||
align: 'center',
|
||||
templet: function(data) {
|
||||
return ns.time_to_date(data.create_time);
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '操作',
|
||||
unresize: 'false',
|
||||
align: 'right',
|
||||
templet: '#operation'
|
||||
}
|
||||
]]
|
||||
});
|
||||
|
||||
table.tool(function(obj) {
|
||||
var data = obj.data;
|
||||
|
||||
switch (obj.event) {
|
||||
case 'see':
|
||||
laytpl($('#formData').html()).render(data, function(string){
|
||||
layer.open({
|
||||
title: '查看信息',
|
||||
area: "400px",
|
||||
type: 1,
|
||||
content: string,
|
||||
btn: ['确认']
|
||||
})
|
||||
});
|
||||
break;
|
||||
case 'delete': //删除
|
||||
del(data.id)
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
/**
|
||||
* 搜索功能
|
||||
*/
|
||||
form.on('submit(search)', function(data) {
|
||||
if ($('#start_time').val() != '' && $('#end_time').val() != '' && (new Date($('#end_time').val()).getTime() <= new Date($('#start_time').val()).getTime() )) {
|
||||
layer.msg('结束时间不能小于开始时间');
|
||||
return false;
|
||||
}
|
||||
|
||||
table.reload({
|
||||
page: {
|
||||
curr: 1
|
||||
},
|
||||
where: data.field
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
function del(id){
|
||||
var del_flag = false; //防重复标识
|
||||
|
||||
layer.confirm('确定要删除吗?', function (index) {
|
||||
if (del_flag) return;
|
||||
del_flag = true;
|
||||
layer.close(index);
|
||||
$.ajax({
|
||||
url: ns.url("form://shop/form/deleteFormData"),
|
||||
data: {id:id},
|
||||
dataType: 'JSON',
|
||||
type: 'POST',
|
||||
success: function(res) {
|
||||
layer.msg(res.message);
|
||||
del_flag = false;
|
||||
if (res.code == 0) {
|
||||
listenerHash(); // 刷新页面
|
||||
layer.closeAll();
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function fun(callback) {
|
||||
var param = $("#param").val();
|
||||
callback(param);
|
||||
}
|
||||
</script>
|
||||
285
addon/form/shop/view/form/lists.html
Executable file
@@ -0,0 +1,285 @@
|
||||
<style>
|
||||
.layui-table-box {overflow: inherit;}
|
||||
.layui-table-header {overflow: inherit;}
|
||||
.layui-table-header .layui-table-cell {overflow: inherit;}
|
||||
.select-form-type {display: flex;}
|
||||
.select-form-type .type-item {border: 2px solid #eee;cursor: pointer;width: 300px;text-align: center;margin: 0 15px 15px 0;border-radius: 10px;overflow: hidden}
|
||||
.select-form-type .type-item .preview {width: 100%;height: auto;}
|
||||
.select-form-type .type-item .title {line-height: 35px;font-weight: bold}
|
||||
.select-form-type .selected {border-color: var(--base-color)}
|
||||
.body-content {padding-top: 15px!important;}
|
||||
.layui-layout-admin .layui-form-item .layui-input-inline{background-color: #fff;}
|
||||
.layui-layout-admin .table-tab .layui-tab-title{margin-bottom: 15px;}
|
||||
.layui-layout-admin .screen{margin-bottom: 15px;}
|
||||
</style>
|
||||
|
||||
<div class="single-filter-box">
|
||||
<button class="layui-btn" onclick="clickAdd()">添加表单</button>
|
||||
</div>
|
||||
|
||||
<div class="screen layui-collapse" lay-filter="selection_panel">
|
||||
<div class="layui-colla-item">
|
||||
<form class="layui-colla-content layui-form layui-show">
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">表单名称:</label>
|
||||
<div class="layui-input-inline">
|
||||
<input type="text" name="form_name" placeholder="请输入表单名称" autocomplete="off" class="layui-input">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">是否启用:</label>
|
||||
<div class="layui-input-inline">
|
||||
<select name="is_use">
|
||||
<option value="">全部</option>
|
||||
<option value="1">已启用</option>
|
||||
<option value="0">未启用</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="layui-inline">
|
||||
<label class="layui-form-label">表单类型:</label>
|
||||
<div class="layui-input-inline">
|
||||
<select name="form_type">
|
||||
<option value="">请选择表单类型</option>
|
||||
{foreach name="form_type" item="vo"}
|
||||
<option value="{$vo['type']}">{$vo['name']}</option>
|
||||
{/foreach}
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="form-row">
|
||||
<button class="layui-btn" lay-filter="search" lay-submit>筛选</button>
|
||||
<button type="reset" class="layui-btn layui-btn-primary">重置</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<table id="form_list" lay-filter="form_list"></table>
|
||||
|
||||
<script type="text/html" id="operation">
|
||||
<div class="table-btn">
|
||||
{{# if(d.is_use==1 && d.form_type == 'custom'){ }}
|
||||
<a class="layui-btn" lay-event="promote">推广</a>
|
||||
{{# } }}
|
||||
<a class="layui-btn" lay-event="edit">编辑</a>
|
||||
<a class="layui-btn" lay-event="data">数据</a>
|
||||
{{# if(d.is_use==0){ }}
|
||||
<a class="layui-btn" lay-event="start">启用</a>
|
||||
{{# } }}
|
||||
{{# if(d.is_use==1){ }}
|
||||
<a class="layui-btn" lay-event="stop">禁用</a>
|
||||
{{# } }}
|
||||
<a class="layui-btn" lay-event="del">删除</a>
|
||||
<a class="layui-btn" lay-event="export">导出</a>
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/html" id="selectFromType">
|
||||
<div class="select-form-type">
|
||||
{foreach name="form_type" item="v" key="k" index="index"}
|
||||
<div class="type-item {if $index eq 1}selected{/if}" form-type="{$k}">
|
||||
<img src="{:img($v.preview_img)}" alt="" class="preview">
|
||||
<div class="title">{$v.name}</div>
|
||||
</div>
|
||||
{/foreach}
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<!-- 推广 -->
|
||||
{include file="app/shop/view/component/promote_show.html"}
|
||||
|
||||
<script>
|
||||
var table,laytpl,repeat_flag = false, formType = {:json_encode($form_type)};
|
||||
layui.use(['form', 'laytpl'], function() {
|
||||
laytpl = layui.laytpl;
|
||||
form = layui.form;
|
||||
|
||||
table = new Table({
|
||||
elem: '#form_list',
|
||||
url: ns.url("form://shop/form/lists"),
|
||||
cols: [
|
||||
[{
|
||||
field: 'form_name',
|
||||
title: '表单名称',
|
||||
unresize: 'false',
|
||||
width: '30%',
|
||||
}, {
|
||||
field: 'level_name',
|
||||
title: '表单类型',
|
||||
unresize: 'false',
|
||||
width: '15%',
|
||||
templet: function (data) {
|
||||
return formType[data.form_type] ? formType[data.form_type].name : '';
|
||||
}
|
||||
},{
|
||||
title: '状态',
|
||||
unresize: 'false',
|
||||
width: '15%',
|
||||
templet: function(data) {
|
||||
return data.is_use == 1 ? '<span class="text-color">已启用</span>' : '<span>未启用</span>'
|
||||
}
|
||||
},
|
||||
{
|
||||
title: '创建时间',
|
||||
unresize: 'false',
|
||||
width: '20%',
|
||||
templet: function(data) {
|
||||
return ns.time_to_date(data.create_time);
|
||||
}
|
||||
},{
|
||||
title: '操作',
|
||||
toolbar: '#operation',
|
||||
unresize: 'false',
|
||||
align:'right'
|
||||
}]
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
/**
|
||||
* 监听工具栏操作
|
||||
*/
|
||||
table.tool(function(obj) {
|
||||
var data = obj.data;
|
||||
|
||||
switch (obj.event) {
|
||||
case 'del': //删除
|
||||
del(data.id);
|
||||
break;
|
||||
case 'start': //启用
|
||||
start_status(data.id,1,data.form_type);
|
||||
break;
|
||||
case 'stop': //停用
|
||||
stop_status(data.id,0);
|
||||
break;
|
||||
case 'edit': //编辑
|
||||
location.hash = ns.hash("form://shop/form/editform", {"id": data.id});
|
||||
break;
|
||||
case 'data': //更多
|
||||
location.hash = ns.hash("form://shop/form/formdata", {form_id: data.id});
|
||||
break;
|
||||
case 'promote':
|
||||
promote(data);
|
||||
break;
|
||||
case 'export':
|
||||
window.open(ns.url("form://shop/form/exportform", {request_mode: 'download',id: data.id}))
|
||||
break;
|
||||
}
|
||||
});
|
||||
|
||||
form.on('submit(search)', function(data) {
|
||||
table.reload({
|
||||
page: {
|
||||
curr: 1
|
||||
},
|
||||
where: data.field
|
||||
});
|
||||
return false;
|
||||
});
|
||||
});
|
||||
|
||||
function promote(data){
|
||||
new PromoteShow({
|
||||
url:ns.url("form://shop/form/promote"),
|
||||
param:{form_id:data.id},
|
||||
})
|
||||
}
|
||||
|
||||
function clickAdd() {
|
||||
layer.open({
|
||||
type: 1,
|
||||
title: '添加表单',
|
||||
content: $('#selectFromType').html(),
|
||||
area: ['960px', '660px'],
|
||||
btn: ['确定', '取消'],
|
||||
success: function () {
|
||||
$('.select-form-type .type-item').click(function () {
|
||||
$(this).addClass('selected').siblings().removeClass('selected');
|
||||
})
|
||||
},
|
||||
yes: function(index, layero) {
|
||||
var type = $('.select-form-type .type-item.selected').attr('form-type');
|
||||
location.hash = ns.hash('form://shop/form/addform?form_type=' + type);
|
||||
layer.close(index);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 启用
|
||||
*/
|
||||
function start_status(id,is_use,form_type){
|
||||
var use_flag = false; //防重复标识
|
||||
|
||||
layer.confirm('确定要启用吗?', function (index) {
|
||||
if (use_flag) return;
|
||||
use_flag = true;
|
||||
layer.close(index);
|
||||
$.ajax({
|
||||
url: ns.url("form://shop/form/editIsUse"),
|
||||
data: {id:id,is_use:is_use,form_type:form_type},
|
||||
dataType: 'JSON',
|
||||
type: 'POST',
|
||||
success: function(res) {
|
||||
layer.msg(res.message);
|
||||
use_flag = false;
|
||||
if (res.code == 0) {
|
||||
listenerHash(); // 刷新页面
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 停用
|
||||
*/
|
||||
function stop_status(id,is_use){
|
||||
var stop_flag = false; //防重复标识
|
||||
|
||||
layer.confirm('确定要禁用吗?', function (index) {
|
||||
if (stop_flag) return;
|
||||
stop_flag = true;
|
||||
layer.close(index);
|
||||
$.ajax({
|
||||
url: ns.url("form://shop/form/editIsUse"),
|
||||
data: {id:id,is_use:is_use},
|
||||
dataType: 'JSON',
|
||||
type: 'POST',
|
||||
success: function(res) {
|
||||
layer.msg(res.message);
|
||||
stop_flag = false;
|
||||
if (res.code == 0) {
|
||||
listenerHash(); // 刷新页面
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
function del(id){
|
||||
var del_flag = false; //防重复标识
|
||||
|
||||
layer.confirm('确定要删除吗?', function (index) {
|
||||
if (del_flag) return;
|
||||
del_flag = true;
|
||||
layer.close(index);
|
||||
$.ajax({
|
||||
url: ns.url("form://shop/form/deleteForm"),
|
||||
data: {id:id},
|
||||
dataType: 'JSON',
|
||||
type: 'POST',
|
||||
success: function(res) {
|
||||
layer.msg(res.message);
|
||||
del_flag = false;
|
||||
if (res.code == 0) {
|
||||
listenerHash(); // 刷新页面
|
||||
}
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
</script>
|
||||
320
addon/form/shop/view/public/css/form.css
Executable file
@@ -0,0 +1,320 @@
|
||||
.layui-layout-admin .layui-body .body-content {
|
||||
padding: 0;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
}
|
||||
|
||||
.order-wrap .head-img {
|
||||
width: 100%;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.draggable-element {
|
||||
position: relative;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.draggable-element:hover .del {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.form-gorup {
|
||||
padding: 15px;
|
||||
background: #fff;
|
||||
border-bottom: 1px solid #eee;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.form-gorup .label {
|
||||
font-size: 14px;
|
||||
color: #666;
|
||||
width: 80px;
|
||||
min-width: 80px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-right: 10px;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.form-gorup .input {
|
||||
flex: 1;
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.form-gorup .textarea {
|
||||
flex: 1;
|
||||
border: none;
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
cursor: move;
|
||||
}
|
||||
|
||||
.form-gorup .input::placeholder,
|
||||
.form-gorup .textarea::placeholder {
|
||||
color: #ddd;
|
||||
font-size: 14px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.form-gorup>i {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.form-gorup .more {
|
||||
flex: 1;
|
||||
font-size: 14px;
|
||||
text-align: right;
|
||||
color: #999
|
||||
}
|
||||
|
||||
.edit-attribute .options-wrap .option-item {
|
||||
position: relative;
|
||||
margin-bottom: 15px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.edit-attribute .option-item input {
|
||||
padding-right: 34px;
|
||||
}
|
||||
|
||||
.edit-attribute .option-item .icontrash {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 0;
|
||||
width: 34px;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
/* 多行文本 */
|
||||
.form-gorup .checkbox-list .textarea::placeholder {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.form-gorup .checkbox-list>.textarea {
|
||||
margin-top: 10px;
|
||||
width: 100%;
|
||||
height: 40px;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.add-item-btn-box {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.add-item-btn-box .add-item-btn {
|
||||
width: 48%;
|
||||
height: 34px;
|
||||
line-height: 34px;
|
||||
text-align: center;
|
||||
border: 1px dashed #999;
|
||||
border-radius: 2px;
|
||||
box-sizing: border-box;
|
||||
font-size: 12px;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.add-items-box {
|
||||
position: absolute;
|
||||
top: 40px;
|
||||
left: 0;
|
||||
z-index: 9;
|
||||
width: 100%;
|
||||
padding: 15px;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 0 5px rgba(0, 0, 0, .3);
|
||||
}
|
||||
|
||||
.add-items-title {
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
.add-items-desc {
|
||||
font-size: 12px;
|
||||
line-height: 20px;
|
||||
color: #909399;
|
||||
}
|
||||
|
||||
.add-items-btn {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* 多选框 */
|
||||
.form-gorup-block {
|
||||
display: block;
|
||||
}
|
||||
|
||||
.form-gorup-block label {
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.checkbox-list {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.checkbox-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 10px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.checkbox-item>i {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.checkbox-item .checkbox {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
line-height: 14px;
|
||||
text-align: center;
|
||||
border-radius: 2px;
|
||||
margin-right: 10px;
|
||||
border: 1px solid #E6E6E6;
|
||||
}
|
||||
|
||||
.checkbox-item .checkbox i {
|
||||
font-size: 15px;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.checkbox-item .checkbox-title {
|
||||
line-height: 20px;
|
||||
}
|
||||
|
||||
/* 单选框 */
|
||||
.checkbox-item .checkbox.radio {
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
/* 图片 */
|
||||
.img-box {
|
||||
display: inline-block;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
border: 1px solid #E6E6E6;
|
||||
box-sizing: border-box;
|
||||
margin-right: 10px;
|
||||
margin-top: 10px;
|
||||
line-height: 48px;
|
||||
text-align: center;
|
||||
border-radius: 1px;
|
||||
vertical-align: top;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.img-box img {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.img-box .close {
|
||||
background-color: #999;
|
||||
position: absolute;
|
||||
top: -7px;
|
||||
right: -7px;
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
border-radius: 50%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.img-box .close i {
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.img-box i.iconadd_light {
|
||||
color: #999;
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
/* 日期 */
|
||||
.date-input {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.form-gorup .checkbox-list .input::placeholder {
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
/* 日期范围 */
|
||||
.form-gorup .interval {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.date-limit-box input {
|
||||
border: 0;
|
||||
text-align: left !important;
|
||||
}
|
||||
.date-limit-box.date input {
|
||||
width: 75px;
|
||||
}
|
||||
.date-limit-box.time input {
|
||||
width: 40px;
|
||||
}
|
||||
|
||||
.date-limit-form .layui-form-label {
|
||||
width: 100%;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.date-limit-form .layui-form-label + .layui-input-block {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
/* 时间 */
|
||||
.laydate-time-list>li:nth-child(3) {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.layui-laydate-list.laydate-time-list>li {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
.laydate-time-list ol li {
|
||||
padding-left: 55px !important;
|
||||
}
|
||||
|
||||
.layui-form-item {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.edit-attribute .attr-wrap .restore-wrap .attr-title {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.layui-checkbox-disbaled, .layui-checkbox-disbaled i {
|
||||
border-color: #d2d2d2 !important;
|
||||
}
|
||||
|
||||
.layui-checkbox-disbaled[lay-skin=primary] span {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
[form-type="order"]{
|
||||
margin-top: 10px;
|
||||
}
|
||||
[form-type="order"] .draggable-element {
|
||||
padding: 0 12px;
|
||||
}
|
||||
BIN
addon/form/shop/view/public/img/head/custom.png
Executable file
|
After Width: | Height: | Size: 62 KiB |
BIN
addon/form/shop/view/public/img/head/goods.png
Executable file
|
After Width: | Height: | Size: 134 KiB |
BIN
addon/form/shop/view/public/img/head/order.png
Executable file
|
After Width: | Height: | Size: 99 KiB |
BIN
addon/form/shop/view/public/img/icon/checkbox.png
Executable file
|
After Width: | Height: | Size: 1.2 KiB |
BIN
addon/form/shop/view/public/img/icon/checkbox_selected.png
Executable file
|
After Width: | Height: | Size: 3.0 KiB |
BIN
addon/form/shop/view/public/img/icon/city.png
Executable file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
addon/form/shop/view/public/img/icon/city_selected.png
Executable file
|
After Width: | Height: | Size: 3.3 KiB |
BIN
addon/form/shop/view/public/img/icon/date.png
Executable file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
addon/form/shop/view/public/img/icon/date_limit.png
Executable file
|
After Width: | Height: | Size: 1.4 KiB |
BIN
addon/form/shop/view/public/img/icon/date_limit_selected.png
Executable file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
addon/form/shop/view/public/img/icon/date_selected.png
Executable file
|
After Width: | Height: | Size: 3.1 KiB |
BIN
addon/form/shop/view/public/img/icon/id_card.png
Executable file
|
After Width: | Height: | Size: 1.4 KiB |
BIN
addon/form/shop/view/public/img/icon/id_card_selected.png
Executable file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
addon/form/shop/view/public/img/icon/img.png
Executable file
|
After Width: | Height: | Size: 1.4 KiB |
BIN
addon/form/shop/view/public/img/icon/img_selected.png
Executable file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
addon/form/shop/view/public/img/icon/many_line_text.png
Executable file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
addon/form/shop/view/public/img/icon/many_line_text_selected.png
Executable file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
addon/form/shop/view/public/img/icon/mobile.png
Executable file
|
After Width: | Height: | Size: 1.7 KiB |
BIN
addon/form/shop/view/public/img/icon/mobile_selected.png
Executable file
|
After Width: | Height: | Size: 1.7 KiB |
BIN
addon/form/shop/view/public/img/icon/on_line_text.png
Executable file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
addon/form/shop/view/public/img/icon/on_line_text_selected.png
Executable file
|
After Width: | Height: | Size: 3.1 KiB |
BIN
addon/form/shop/view/public/img/icon/radio.png
Executable file
|
After Width: | Height: | Size: 1.6 KiB |
BIN
addon/form/shop/view/public/img/icon/radio_selected.png
Executable file
|
After Width: | Height: | Size: 3.4 KiB |
BIN
addon/form/shop/view/public/img/icon/select.png
Executable file
|
After Width: | Height: | Size: 1.2 KiB |
BIN
addon/form/shop/view/public/img/icon/select_selected.png
Executable file
|
After Width: | Height: | Size: 3.0 KiB |
BIN
addon/form/shop/view/public/img/icon/time.png
Executable file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
addon/form/shop/view/public/img/icon/time_limit.png
Executable file
|
After Width: | Height: | Size: 1.6 KiB |
BIN
addon/form/shop/view/public/img/icon/time_limit_selected.png
Executable file
|
After Width: | Height: | Size: 3.4 KiB |
BIN
addon/form/shop/view/public/img/icon/time_selected.png
Executable file
|
After Width: | Height: | Size: 3.3 KiB |
BIN
addon/form/shop/view/public/img/order_info.png
Executable file
|
After Width: | Height: | Size: 41 KiB |
BIN
addon/form/shop/view/public/img/preview/custom.png
Executable file
|
After Width: | Height: | Size: 88 KiB |
BIN
addon/form/shop/view/public/img/preview/goods.png
Executable file
|
After Width: | Height: | Size: 33 KiB |
BIN
addon/form/shop/view/public/img/preview/order.png
Executable file
|
After Width: | Height: | Size: 115 KiB |