新增input、select清除操作

feat/task1-c-wallet
gongfuxiang 2022-10-30 22:35:38 +08:00
parent c33472b0fd
commit 41c8b1619a
10 changed files with 247 additions and 17 deletions

View File

@ -151,7 +151,7 @@
<p>3. 当设置的商品类型不在系统设置的站点类型包含的时候,商品加入购物车功能将失效</p>
</div>
<select name="site_type" class="am-radius chosen-select am-margin-top-xs" data-placeholder="可选择..." data-validation-message="请选择商品类型">
<option value="-1">可选择...</option>
<option value="">可选择...</option>
{{if !empty($common_site_type_list)}}
{{foreach $common_site_type_list as $v}}
<option value="{{$v.value}}" {{if isset($data['site_type']) and $v['value'] eq $data['site_type']}}selected{{/if}}>{{$v.name}}</option>

View File

@ -1247,7 +1247,7 @@ class GoodsService
[
'checked_type' => 'in',
'key_name' => 'site_type',
'checked_data' => array_merge([-1], array_column(MyConst('common_site_type_list'), 'value')),
'checked_data' => array_merge(array_column(MyConst('common_site_type_list'), 'value')),
'is_checked' => 2,
'error_msg' => '商品类型数据值范围有误',
],
@ -1345,7 +1345,7 @@ class GoodsService
'is_exist_many_spec' => empty($specifications['data']['title']) ? 0 : 1,
'spec_base' => empty($specifications_base['data']) ? '' : json_encode($specifications_base['data'], JSON_UNESCAPED_UNICODE),
'fictitious_goods_value' => $fictitious_goods_value,
'site_type' => isset($params['site_type']) ? $params['site_type'] : -1,
'site_type' => (isset($params['site_type']) && $params['site_type'] != '') ? $params['site_type'] : -1,
];
// 是否存在赠送积分

View File

@ -151,6 +151,9 @@ ul {margin-top:0;}
/**
*
*/
table.am-table .am-btn {
padding: 0.4em 1em;
}
table.am-table .am-btn-default {
border: 1px solid #444;
background: #fff;
@ -206,6 +209,16 @@ table.am-table .am-btn-danger:hover {
color: #fff;
}
/**
*
*/
table.am-table .am-dropdown.am-active .am-selected-btn.am-btn-default.am-dropdown-toggle,
.am-selected > .am-selected-btn.am-btn-default:hover {
background: #fff !important;
color: #666 !important;
border-color: #ddd !important;
}
/**
* 线
*/

View File

@ -177,6 +177,12 @@ form.am-form-pure .business-form-block {
padding-right: 0;
}
}
/**
*
*/
form.am-form .am-form-group.am-form-icon {
padding: 0 !important;
}
/**
*
@ -588,6 +594,12 @@ iframe { border: 0; }
.business-form-block {
padding: 10px 5px !important;
}
/**
*
*/
.am-modal .am-form-group.am-form-icon {
padding: 0 !important;
}
/**
* H5
@ -1705,4 +1717,61 @@ form.am-form-popup-fixed .am-form-popup-submit {
::-webkit-scrollbar-resizer,
::-webkit-scrollbar-resizer:vertical {
background-color: #ff6e00;
}
/**
*
*/
a.input-clearout-submit {
position: fixed !important;
left: 0px;
top: 0px;
z-index: 2;
display: none !important;
text-decoration: none !important;
}
a.input-clearout-submit > i {
margin: 0 !important;
line-height: 11px !important;
display: block;
border: 1px solid #dedede;
border-radius: 50px;
padding: 0px 2.37px 1px 2.37px;
font-size: 12px;
color: #cccccc;
}
.input-clearout-element {
padding-right: 25px !important;
box-sizing: border-box;
}
a.input-clearout-submit:hover,
.chosen-container-single > .chosen-single:hover + a.input-clearout-submit,
.am-selected > .am-selected-btn:hover + a.input-clearout-submit,
select:hover + a.input-clearout-submit,
textarea:hover + a.input-clearout-submit,
input[type="text"]:hover + a.input-clearout-submit,
input[type="password"]:hover + a.input-clearout-submit,
input[type="datetime"]:hover + a.input-clearout-submit,
input[type="datetime-local"]:hover + a.input-clearout-submit,
input[type="date"]:hover + a.input-clearout-submit,
input[type="month"]:hover + a.input-clearout-submit,
input[type="time"]:hover + a.input-clearout-submit,
input[type="week"]:hover + a.input-clearout-submit,
input[type="number"]:hover + a.input-clearout-submit,
input[type="email"]:hover + a.input-clearout-submit,
input[type="url"]:hover + a.input-clearout-submit,
input[type="search"]:hover + a.input-clearout-submit,
input[type="tel"]:hover + a.input-clearout-submit,
input[type="color"]:hover + a.input-clearout-submit {
display: block !important;
}
a.input-clearout-submit:hover > i,
a.input-clearout-submit:focus > i {
color: #7b7b7b;
border-color: #999;
}
.chosen-container-single > .chosen-single.input-clearout-element > .chosen-single-icon,
.am-selected > .am-selected-btn.input-clearout-element > .am-selected-icon {
display: none;
}

View File

@ -2640,6 +2640,87 @@ function DataPrintHandle(is_pdf = 0)
}
}
/**
* 输入框清除按钮处理
* @author Devil
* @blog http://gong.gg/
* @version 1.0.0
* @date 2022-10-30
* @desc description
* @param {[object]} e [当前元素对象]
*/
function InputClearOutHandle(e)
{
var value = '';
// input/textarea、排除非下拉搜索的input
if((e.is('input') || e.is('textarea')) && !e.parent().hasClass('chosen-search') && !e.parent().hasClass('search-field') && !e.parent().hasClass('am-selected-search'))
{
var status = e.attr('data-is-clearout');
if(status == undefined || parseInt(status) == 1)
{
value = e.val();
}
}
// 插件下拉选择组件
if(e.parents('.chosen-container').length > 0 && !e.is('input'))
{
var status = e.parents('.chosen-container').prev().attr('data-is-clearout');
if(status == undefined || parseInt(status) == 1)
{
value = e.parents('.chosen-container').prev().val();
}
}
// 框架下拉选择组件
if(e.parents('.am-selected').length > 0 && !e.is('input'))
{
var status = e.parents('.am-selected').prev().attr('data-is-clearout');
if(status == undefined || parseInt(status) == 1)
{
value = e.parents('.am-selected').prev().val();
}
}
// 值不为空或undefined
if(value !== '' && value !== undefined && value !== null)
{
if(
((e.is('input') || e.is('textarea')) && e.attr('disabled') != 'disabled' && e.attr('readonly') != 'readonly') ||
(e.parents('.chosen-container').length > 0 && !e.is('input')) ||
(e.parents('.am-selected').length > 0 && !e.is('input'))
)
{
// 添加清除按钮
if(!e.next().is('a.input-clearout-submit'))
{
e.after('<a href="javascript:;" class="input-clearout-submit"><i>&times;</i></a>');
}
// 清除按钮位置处理
var top = e.offset().top-$(window).scrollTop();
var left = e.offset().left;
var width = e.innerWidth();
var height = e.innerHeight();
// 存在弹窗则减去弹窗的外边距
if(e.parents('.am-popup').length > 0)
{
var offset = e.parents('.am-popup').offset();
top -= offset.top;
left -= offset.left;
}
// 设置位置
e.next().css({'left':(left+width-23)+'px', 'top':(top+1)+'px', 'padding': (((height-14)/2)-0.1)+'px 5px'});
e.addClass('input-clearout-element');
return false;
}
} else {
// 无数据、存在清除按钮则移除
if(e.next().is('a.input-clearout-submit'))
{
e.next().remove();
e.removeClass('input-clearout-element');
}
}
}
// 公共数据操作
$(function()
@ -3914,4 +3995,63 @@ $(function()
$(this).addClass('selected').siblings('li').removeClass('selected');
}
});
// 输入数据框添加清除按钮 - 鼠标进入事件
$(document).on('mouseenter', 'select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"]', function()
{
InputClearOutHandle($(this));
});
// 输入数据框添加清除按钮 - 输入事件
$(document).on('keyup', 'select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"]', function()
{
InputClearOutHandle($(this));
});
// 下拉选择组件
$(document).on('mouseenter', '.chosen-container .chosen-single, .am-selected .am-selected-btn', function()
{
InputClearOutHandle($(this));
});
$(document).on('mouseleave', '.chosen-container .chosen-single, .am-selected .am-selected-btn', function()
{
$(this).removeClass('input-clearout-element');
});
// 鼠标进入清除按钮 - 增加元素class
$(document).on('mouseenter', 'a.input-clearout-submit', function()
{
$(this).prev().addClass('input-clearout-element');
});
// 鼠标移开清除按钮 - 移除元素class
$(document).on('mouseleave', 'a.input-clearout-submit', function()
{
$(this).prev().removeClass('input-clearout-element');
});
// 输入数据框清除
$(document).on('click', 'a.input-clearout-submit', function()
{
// 文本框则清空数据
if($(this).prev().is('input') || $(this).prev().is('textarea'))
{
$(this).prev().val('');
}
// 插件下拉选择组件
if($(this).parents('.chosen-container').length > 0)
{
var $select = $(this).parents('.chosen-container').prev();
$select.val('');
$select.trigger('chosen:updated');
$select.trigger('change');
}
// 框架下拉选择组件
if($(this).parents('.am-selected').length > 0)
{
var $select = $(this).parents('.am-selected');
$select.prev().val('');
$select.find('.am-selected-btn .am-selected-status').text($select.prev().attr('placeholder') || $select.data('placeholder'));
$select.find('.am-selected-list li.am-checked').removeClass('am-checked');
}
// 移除class
$(this).prev().removeClass('input-clearout-element');
// 删除清除按钮
$(this).remove();
});
});

View File

@ -588,7 +588,7 @@ This file is generated by `grunt build`, do not edit it by hand.
if (this.is_multiple) {
this.container.html('<ul class="chosen-choices"><li class="search-field"><input type="text" value="' + this.default_text + '" class="default" autocomplete="off" style="width:25px;" /></li></ul><div class="chosen-drop"><ul class="chosen-results"></ul></div>');
} else {
this.container.html('<a class="chosen-single chosen-default" tabindex="-1"><span>' + this.default_text + '</span><div><b></b></div></a><div class="chosen-drop"><div class="chosen-search"><input type="text" autocomplete="off" /></div><ul class="chosen-results"></ul></div>');
this.container.html('<a class="chosen-single chosen-default" tabindex="-1"><span>' + this.default_text + '</span><div class="chosen-single-icon"><b></b></div></a><div class="chosen-drop"><div class="chosen-search"><input type="text" autocomplete="off" /></div><ul class="chosen-results"></ul></div>');
}
this.form_field_jq.hide().after(this.container);
this.dropdown = this.container.find('div.chosen-drop').first();

View File

@ -3032,7 +3032,7 @@ fieldset[disabled] .am-checkbox-inline {
border-radius: 0 0 0 0;
}
.am-nav-tabs > li > a:hover {
border-color: #eeeeee #eeeeee rgba(0,0,0,.06);
border-color: #eeeeee #eeeeee #f7f7f7;
}
.am-nav-tabs > li.am-active > a,
.am-nav-tabs > li.am-active > a:hover,

View File

@ -10855,6 +10855,7 @@ return /******/ (function(modules) { // webpackBootstrap
this.init();
};
var placeholder = '点击选择...';
Selected.DEFAULTS = {
btnWidth: null,
btnSize: null,
@ -10862,12 +10863,12 @@ return /******/ (function(modules) { // webpackBootstrap
dropUp: 0,
maxHeight: null,
maxChecked: null,
placeholder: '点击选择...',
placeholder: placeholder,
selectedClass: 'am-checked',
disabledClass: 'am-disabled',
searchBox: false,
tpl: '<div class="am-selected am-dropdown ' +
'<%= dropUp ? \'am-dropdown-up\': \'\' %>" id="<%= id %>" data-am-dropdown>' +
'<%= dropUp ? \'am-dropdown-up\': \'\' %>" id="<%= id %>" data-am-dropdown data-placeholder="'+placeholder+'">' +
' <button type="button" class="am-selected-btn am-btn am-dropdown-toggle">' +
' <span class="am-selected-status am-fl"></span>' +
' <i class="am-selected-icon am-icon-caret-' +
@ -10878,7 +10879,7 @@ return /******/ (function(modules) { // webpackBootstrap
'<span class="am-icon-chevron-left">返回</span></h2>' +
' <% if (searchBox) { %>' +
' <div class="am-selected-search">' +
' <input autocomplete="off" class="am-form-field am-input-sm" />' +
' <div class="am-form-group am-form-icon am-form-feedback"><input autocomplete="off" class="am-form-field am-input-sm" /><i class="am-icon-search"></i></div>' +
' </div>' +
' <% } %>' +
' <ul class="am-selected-list">' +

File diff suppressed because one or more lines are too long

View File

@ -637,6 +637,9 @@ ul.am-dropdown-content > .am-active > a:focus,
/**
*
*/
table.am-table .am-btn {
padding: 0.4em 1em;
}
table.am-table .am-btn-default {
border: 1px solid #666;
background: #fff;
@ -727,6 +730,18 @@ table.am-table .am-btn-danger:hover, table.am-table .am-btn-danger:active, table
border-color: #f00;
}
/**
*
*/
table.am-table .am-dropdown.am-active .am-selected-btn.am-btn-default.am-dropdown-toggle,
.am-selected > .am-selected-btn.am-btn-default,
.am-selected > .am-selected-btn.am-btn-default:hover {
background: #fff !important;
color: #666 !important;
border-color: #ccc !important;
border-radius: 2px;
}
/**
*
*/
@ -735,14 +750,6 @@ table.am-table .am-btn-danger:hover, table.am-table .am-btn-danger:active, table
color: #409eff !important;
}
/**
*
*/
.am-selected-btn.am-btn-default {
border: 1px solid #ccc !important;
border-radius: 2px;
}
/**
* tabs
*/