onAcrossTap(acrossTable,crossOptAudit,statusColumnName,tips,statusColumnValue){ if(crossOptAudit=='是'&&this.detail.sfsh!='是') { layer.msg('请审核通过后再操作', { time: 2000, icon: 3 }); return } localStorage.setItem('crossTable',`huiyishiyuyue`); localStorage.setItem('crossObj', JSON.stringify(this.detail)); localStorage.setItem('statusColumnName',statusColumnName); localStorage.setItem('statusColumnValue',statusColumnValue); localStorage.setItem('tips',tips); if(statusColumnName!=''&&!statusColumnName.startsWith("[")) { var obj = JSON.parse(localStorage.getItem('crossObj')); for (var o in obj){ if(o==statusColumnName && obj[o]==statusColumnValue){ layer.msg(tips, { time: 2000, icon: 5 }); return } } } jump(`../${acrossTable}/add.html?corss=true`); }, } }) layui.use(['layer', 'form', 'element', 'carousel', 'http', 'jquery', 'laypage'], function() { var layer = layui.layer; var element = layui.element; var form = layui.form; var carousel = layui.carousel; var http = layui.http; var jquery = layui.jquery; var laypage = layui.laypage; var limit = 10; // 数据ID var id = http.getParam('id'); vue.detail.id = id; vue.baseurl = http.baseurl; // 商品信息 http.request(`${vue.detailTable}/detail/` + id, 'get', {}, function(res) { // 详情信息 vue.detail = res.data // var swiperItemHtml = ''; // for (let item of vue.swiperList) { // swiperItemHtml += // '<div>' + // '<img class="swiper-item" style="width: 100%;height: 100%;object-fit:cover;" src="' + item + '">' + // '</div>'; // } // jquery('#swiper-item').html(swiperItemHtml); // 轮播图 vue.$nextTick(() => { carousel.render({ elem: '#swiper', width: '400px', height: '400px', arrow: 'hover', anim: 'default', autoplay: 'true', interval: '3000', indicator: 'inside' });
时间: 2023-11-26 15:06:23 浏览: 247
这段代码使用了 layui 的 layer、form、element、carousel、http、jquery 和 laypage 模块,并且定义了一个 limit 变量。首先获取页面 URL 中的参数 id,然后根据 id 向后端发送请求获取商品信息,并将其赋值给 vue 实例中的 detail 数据项。接着,使用 vue 实例中的数据项 swiperList 构造轮播图的 HTML,并使用 layui 的 carousel 模块渲染轮播图。最后,使用 layui 的 form 模块监听表单提交事件,并且调用 onAcrossTap 方法进行跨表计算,其中包括判断是否需要审核、提示信息等。同时,此处还使用了 vue 的 $nextTick 方法来确保渲染完成后才进行操作,以避免出现渲染不完全的问题。
相关问题
function pageList() { var param = { page: 1, limit: limit } if (jquery('#bianhao').val()) { param['bianhao'] = jquery('#bianhao').val() ? '%' + jquery('#bianhao').val() + '%' : ''; } if (jquery('#weizhi').val()) { param['weizhi'] = jquery('#weizhi').val() ? '%' + jquery('#weizhi').val() + '%' : ''; } if (jquery('#huiyizhuti').val()) { param['huiyizhuti'] = jquery('#huiyizhuti').val() ? '%' + jquery('#huiyizhuti').val() + '%' : ''; } param['sfsh'] = '是';
这段代码是一个用于查询数据的函数。首先构造查询参数 param,包括分页信息和查询条件。其中,如果输入框中有值,则将其加入查询参数中,并使用 % 符号作为通配符。接着,将查询参数中的 sfsh 属性设置为 '是',表示只查询审核通过的数据。最后,使用 http 模块向后端发送请求,获取满足条件的数据,并将其赋值给 vue 实例中的 dataList 数据项。
http.request('config/list', 'get', { page: 1, limit: 5 }, function(res) { if (res.data.list.length > 0) { let swiperList = []; res.data.list.forEach(element => { if (element.value != null) { swiperList.push({ img: http.baseurl+element.value }); } }); vue.swiperList = swiperList; vue.$nextTick(() => { carousel.render({ elem: '#test1', width: '100%', height: '420px', arrow: 'hover', anim: 'default', autoplay: 'true', interval: '3000', indicator: 'inside' }); }) // vue.$nextTick(()=>{ // window.xznSlide(); // }); } }); // 分页列表 pageList(); // 搜索按钮 jquery('#btn-search').click(function(e) { pageList(); }); function pageList() { var param = { page: 1, limit: limit } if (jquery('#bianhao').val()) { param['bianhao'] = jquery('#bianhao').val() ? '%' + jquery('#bianhao').val() + '%' : ''; } if (jquery('#weizhi').val()) { param['weizhi'] = jquery('#weizhi').val() ? '%' + jquery('#weizhi').val() + '%' : ''; } if (jquery('#huiyizhuti').val()) { param['huiyizhuti'] = jquery('#huiyizhuti').val() ? '%' + jquery('#huiyizhuti').val() + '%' : ''; } param['sfsh'] = '是'; // 获取列表数据 http.request('huiyishiyuyue/list', 'get', param, function(res) { vue.dataList = res.data.list // 分页 laypage.render({ elem: 'pager', count: res.data.total, limit: limit, groups: 5, layout: ["prev","page","next"], theme: '#0099CC', jump: function(obj, first) { param.page = obj.curr; //首次不执行 if (!first) { http.request('huiyishiyuyue/list', 'get', param, function(res) { vue.dataList = res.data.list
这段代码是用于前端页面的数据请求和渲染的,其中包含了向服务器请求数据、进行数据处理和分页等功能。具体来说,它做了以下几件事情:
1. 向服务器请求配置列表数据,将其中的图片地址提取出来,并使用swiper进行轮播展示。
2. 分页列表数据,可以根据输入的关键词进行搜索过滤。
3. 渲染数据到页面上,使用laypage分页组件进行分页展示。
如果您有更具体的问题需要帮助解答,可以再提出来哦。
阅读全文