diff --git a/rc-busness/ajax/getData.js b/rc-busness/ajax/getData.js index b1cfa7e2..ae29c734 100644 --- a/rc-busness/ajax/getData.js +++ b/rc-busness/ajax/getData.js @@ -31,13 +31,13 @@ export const courselist = (offset, courseId, type, sort, selectScreen = []) => { courseId, selectScreenStr } - return fetch( '/api/courselist', data) + return fetch('/api/courselist', data) } /** * 获取课程详情 */ export const getDetail = (id) => { - fetch( '/api/courseDetail/index/' + id) + fetch('/api/courseDetail/index/' + id) } /** @@ -56,44 +56,40 @@ export const getleckCourse = (name, offset) => { * 加入购物车 */ -export const postCourseId = (productCode,buyCount,memberId, mobile,productImg,productName,productPrice,specifications) => { +export const postCourseId = (productCode, buyCount, memberId, mobile, productImg, productName, productPrice, specifications) => { var data = { - buyCount:buyCount, + buyCount: buyCount, memberId: memberId, - mobile:mobile, - productCode:productCode, + mobile: mobile, + productCode: productCode, productImg: productImg, - productName:productName, - productPrice:productPrice, - specifications:specifications + productName: productName, + productPrice: productPrice, + specifications: specifications } - return fetch('/insertCartProductInfo', data,'POST') + return fetch('/insertCartProductInfo', data, 'POST') } /** * 是否存在购物车 */ - export const isexistCart = (id, pet,address) => { +export const isexistCart = (id) => { var data = { - memberId: id, + } - return fetch('getCartProductInfo?memberId='+id,data,'POST') + return fetch('getCartProductInfo', data, 'POST') } /** * 删除购物车 */ export const deleteCart = (memberId, productCode) => { - var data = { - memberId: memberId, - productCode:productCode - } - return fetch('cancelCartProductInfo',data,'POST') + return fetch('cancelCartProductInfo?memberId=' + memberId, productCode, 'POST') } /** * 购物车批量提交 */ export const mostAddClass = (id) => { - return fetch('/api/mostAddClass/', {id}) + return fetch('/api/mostAddClass/', { id }) } /** * 删除购物车 @@ -109,67 +105,68 @@ export const mostAddClass = (id) => { /** * 发送验证码 */ - export const sendMsg = (mobile, pet,address) => { +export const sendMsg = (mobile, pet, address) => { var data = { - phoneNumber:mobile, + phoneNumber: mobile, } - return fetch('sendMsg', data, 'POST' ) + return fetch('sendMsg', data, 'POST') } /** * 发送验证码数据 */ - export const vadatnmsg = (msgNum,hash,tamp) => { +export const vadatnmsg = (msgNum, hash, tamp) => { var data = { - msgNum:msgNum, - tamp:tamp, - hash:hash + msgNum: msgNum, + tamp: tamp, + hash: hash } - return fetch('validateNum', data, 'POST' ) + return fetch('validateNum', data, 'POST') } /** * 筛选标签 */ - export const userstype = (stype, pet,address) => { +export const userstype = (stype, pet, address) => { var data = { - petType:0, + petType: 0, } - return fetch('productSearchTag/query?petType=' + 0, data, 'POST' ) + return fetch('productSearchTag/query?petType=' + 0, data, 'POST') } /** * 登录 */ -export const userLongin = (mobile, pet,address) => { +export const userLongin = (mobile, pet, address) => { var data = { - id:'', - mobile:mobile, + id: '', + mobile: mobile, } - return fetch('member?type=get', data, 'POST' ) + return fetch('member?type=get', data, 'POST') } - //注册 -export const useredit = (mobile, pet,address) => { +//注册 +export const useredit = (mobile, pet, address) => { var data = { - mobile:mobile, - memberName:'', - realName:'', - gender:'', - email:'', - openId:'', - unionId:'', - birthday:'', - provinceId:'', - cityId:'', - districtId:'', - storeCode:'', - remark:'', - memberMark:'', - remark:'' + mobile: mobile, + memberName: '', + realName: '', + gender: '', + email: '', + openId: '', + unionId: '', + birthday: '', + provinceId: '', + cityId: '', + districtId: '', + storeCode: '', + remark: '', + memberMark: '', + + remark: '' } - return fetch('member?type=add', data, 'POST' ) + return fetch('member?type=add', data, 'POST') } - //查询标品全部信息 +//查询标品全部信息 // export const userquery = (mobile, pet,address) => { // var data = { // channelId:"15", @@ -183,10 +180,10 @@ export const userquery = (stype) => { console.log(stype); var data = { - goodsName:stype + goodsName: stype } - return fetch('goods?goodsName='+stype, data, 'POST' ) + return fetch('goods?goodsName=' + stype, data, 'POST') } //商品全部信息 export const userque = (stype) => { @@ -194,59 +191,60 @@ export const userque = (stype) => { console.log(stype); var data = { } - return fetch('goods', data, 'POST' ) + return fetch('goods', data, 'POST') } //标品全部信息 -export const biaomessage = (stype,name) => { - console.log(stype); - if(stype.length>1){ - console.log("========"); - let list={}; - stype.map(item=>{ - console.log(item); - list=item - }) - var str = "?"; - for(var key in list){ - str = str + key + "=" + list[key] + "&"; - } - stype = str.substr(0,str.length-1); - var data = { - page:1, - row:10 - } - return fetch('product/query'+stype, data, 'POST' ) - }else{ - console.log('-=='); - return fetch('product/query?petType='+stype,data, 'POST' ) - - } - - +export const biaomessage = (stype,name,curPage,curRow) => { + if(!curPage) + curPage=1; + if(!curRow) + curRow=10; + let queryTail='&page='+curPage+'&rows='+curRow; + if(stype.length>1){ + let list={}; + stype.map(item=>{ + console.log(item); + list=item + }) + var str = "?"; + for(var key in list){ + str = str + key + "=" + list[key] + "&"; + } + stype = str.substr(0,str.length-1); + return fetch('product/query'+stype+queryTail, '', 'POST' ) + }else{ + return fetch('product/query?petType='+stype+queryTail, '', 'POST' ) + } } -export const searchchanpin = (stype) => { +export const searchchanpin = (stype,usertype,curPage,curRow) => { + + console.log(stype,usertype); + + if(!curPage) + curPage=1; + if(!curRow) + curRow=10; + let queryTail='&page='+curPage+'&rows='+curRow; console.log(stype); - let list={}; - stype.map(item=>{ + let list = {}; + stype.map(item => { console.log(item); list=item }) - var str = "?"; + var str = "&"; for(var key in list){ - - str = str + key + "=" + list[key] + "&"; - } - str = str.substr(0,str.length-1); - var data = { - page:1, - row:10 + str = str + key + "=" + list[key] + "&"; } - - return fetch('product/query'+ str, data, 'POST' ) + str = str.substr(0, str.length - 1); + var data = { + page: 1, + row: 10 + } + return fetch('product/query?petType='+usertype+str+queryTail, data, 'POST' ) } @@ -261,19 +259,19 @@ export const searchchanpin = (stype) => { //查询订单 -export const userindent = (phoneNumber,orderNumber,) => { - var data = { - phoneNumber:'18112621098', - orderNumber:orderNumber, +export const userindent = (phoneNumber, orderNumber,) => { + var data = { + phoneNumber: '18112621098', + orderNumber: orderNumber, } - return fetch('orderMaster/?type=query', data, 'POST' ) + return fetch('orderMaster/?type=query', data, 'POST') } //查询订单详情 export const userin = (orderNumber,) => { - var data = { - orderNumber:orderNumber, + var data = { + orderNumber: orderNumber, } - return fetch('orderMaster/?type=query', data, 'POST' ) + return fetch('orderMaster/?type=query', data, 'POST') } @@ -281,31 +279,37 @@ export const userin = (orderNumber,) => { //取消订单 export const canceldanhao = (orderNumber) => { var data = { - - orderNumber:orderNumber, + + orderNumber: orderNumber, } - return fetch('cancelOrder/', data, 'POST' ) + return fetch('cancelOrder/', data, 'POST') } export const biaomessa = (stype) => { console.log(stype); var data = { - name:stype, - page:1, - row:10 + name: stype, + page: 1, + row: 10 } - return fetch('product/query', data, 'POST' ) + return fetch('product/query', data, 'POST') } -export const biaome = (stype) => { +export const biaome = (usertype,stype,curPage,rows) => { + if(!curPage) + curPage=1; + if(!rows) + rows=10; + let queryTail='&page='+curPage+'&rows='+rows; + let username='&name='+stype console.log(stype); var data = { - name:stype, - rows:10, - page:1, + name: stype, + rows: 10, + page: 1, } - return fetch('product/query?name='+stype,data, 'POST' ) + return fetch('product/query?petType='+usertype+username+queryTail,data, 'POST' ) } @@ -314,9 +318,9 @@ export const biaome = (stype) => { export const memberAccount = (stype) => { console.log(stype); var data = { - memberId:stype + memberId: stype } - return fetch('memberAccount?type=history', data, 'POST' ) + return fetch('memberAccount?type=history', data, 'POST') } @@ -324,20 +328,20 @@ export const memberAccount = (stype) => { export const ordermaster = (stype) => { console.log(stype); var data = { - - memberId:'223782' + + memberId: '223782' } - return fetch('memberAccount', data, 'POST' ) + return fetch('memberAccount', data, 'POST') } //微信支付 export const payOrderWX = (stype) => { console.log(stype); var data = { - - memberId:'223782' + + memberId: '223782' } - return fetch('memberAccount', data, 'POST' ) + return fetch('memberAccount', data, 'POST') } @@ -346,9 +350,9 @@ export const payOrderWX = (stype) => { export const insercar = (stype) => { console.log(stype); var data = { - petType:stype + petType: stype } - return fetch('product/insertCartProductInfo', data, 'POST' ) + return fetch('product/insertCartProductInfo', data, 'POST') } @@ -356,25 +360,25 @@ export const insercar = (stype) => { //查询猫狗商品信息 -export const catquery = (productCode,type) => { +export const catquery = (productCode, type) => { console.log(productCode); var data = { - - petType:0 + + petType: 0 } - return fetch('h5/product/query', data, 'POST' ) + return fetch('h5/product/query', data, 'POST') } //查询猫狗商品信息 -export const dogquery = (productCode,type) => { +export const dogquery = (productCode, type) => { console.log(productCode); var data = { - - petType:1, - pet_type:0 + + petType: 1, + pet_type: 0 } - return fetch('h5/product/query', data, 'POST' ) + return fetch('h5/product/query', data, 'POST') } @@ -385,11 +389,11 @@ export const dogquery = (productCode,type) => { export const oncequery = (productCode) => { var data = { - - productCode:productCode + + productCode: productCode } - return fetch( "goodsByProductCode?productCode="+productCode, data, 'POST' ) + return fetch("goodsByProductCode?productCode=" + productCode, data, 'POST') } @@ -397,163 +401,173 @@ export const oncequery = (productCode) => { export const goodsmessage = (productCode) => { var data = { - productCode:productCode + productCode: productCode } - return fetch( "productMaster/query?productCode="+productCode, data, 'POST' ) + return fetch("productMaster/query?productCode=" + productCode, data, 'POST') } - //优惠券的插入 - export const inserdiscount = (mobile,couponId) => { - var data = { - mobile:mobile, - couponId:couponId - } - return fetch('coupon?type=fetch', data, 'POST' ) +//优惠券的插入 +export const inserdiscount = (mobile, couponId) => { + var data = { + mobile: mobile, + couponId: couponId } + return fetch('coupon?type=fetch', data, 'POST') +} - //优惠券的查询 - export const getdiscount = (memberId,channelSecurity,mobile) => { - var data = { - memberId:memberId, - mobile:mobile - } - return fetch('memberAddress?type=getAll', data, 'POST' ) - } - - //可用的优惠券 - export const alldiscount = (memberId,channelSecurity,mobile) => { - var data = { - memberId:memberId, - } - return fetch('couponConfig?type=getAll', data, 'POST' ) - } - - - //用户领取的优惠券 - export const getdraw = (mobile,states) => { - var data = { - mobile:mobile, - status:states - } - return fetch('coupon?type=getAll', data, 'POST' ) - } - - - //微信支付 - export const generateOrderWX = (list) => { - var data = [{ - - - }] - return fetch('generateOrderWX', list, 'POST' ) +//优惠券的查询 +export const getdiscount = (memberId, channelSecurity, mobile) => { + var data = { + memberId: memberId, + mobile: mobile } - //用户所有的优惠券 - export const allConfig = (memberId,channelSecurity,mobile) => { - var data = { - } - return fetch('couponConfig?type=getAll', data, 'POST' ) - } - + return fetch('memberAddress?type=getAll', data, 'POST') +} - //用户领取优惠券 - export const getConfig = (memberId,couponId) => { - var data = { - memberId:memberId, - couponId:couponId, - } - return fetch('coupon?type=fetch', data, 'POST' ) - } - - - //用户下的优惠券 - export const userConfig = (memberId,couponId) => { - var data = { - memberId:memberId, - couponId:couponId, - } - return fetch('coupon?type=fetch', data, 'POST' ) - } - - - - - //用户订单的查询 - // export const customerorders = (memberId,channelSecurity,mobile) => { - // var data = { - // productName:'幼猫全价粮', - // buyCount:'2', - // productId:'210352', - // payAmount:'517', - // memberId:'844350', - // phoneNumber:'18112621098', - // } - // return fetch('generateOrderWX', data, 'POST' ) - // } - - - //地址的查询 - export const selectaddress = (memberId, pet,address) => { - var data = { - memberId:memberId, - } - return fetch('memberAddress?type=getAll', data, 'POST' ) +//可用的优惠券 +export const alldiscount = (memberId, channelSecurity, mobile) => { + var data = { + memberId: memberId, } + return fetch('couponConfig?type=getAll', data, 'POST') +} - //地址的添加 //id/详细地址/ 收货人姓名/收货人电话号码/省份id/城市id/区域编码 - export const editaddress = (memberId, detailAddress,recipient,tel,provinceId,cityId,districtId) => { - var data = { - memberId:844350, - provinceId:25, - cityId:36, - districtId:418, - detailAddress:'古美路1455弄46号302', - recipient:'蒋缘缘2', - recipientPhone:'13671516167', - zipCode:'214423', - default:false, - } - return fetch('memberAddress?type=add', data, 'POST' ) +//用户领取的优惠券 +export const getdraw = (mobile, states) => { + var data = { + mobile: mobile, + status: states } + return fetch('coupon?type=getAll', data, 'POST') +} - //删除 - export const editdelete = (memberId,ids) => { - var data = { - memberId:memberId, - ids:ids, - } - return fetch('memberAddress?type=delete', data, 'POST' ) - } - //地址的编辑 - export const editupdate = (mobile, pet,address) => { - var data = { - - memberId:'3242', - id:'620111', - provinceId:'', - cityId:'', - districtId:'', - detailAddress:'江西省萍乡市', - recipient:'刘佳敏', - recipientPhone:'13407998521', - zipCode:'', - isDefault:'', - } - return fetch('memberAddress?type=update', data, 'POST' ) - } +//微信支付 +export const generateOrderWX = (list) => { + return fetch('generateOrderWX', list, 'POST') +} +//微信支付返回 +export const updateOrderWX = (data) => { + return fetch('updateOrderWX', data, 'POST') +} +//支付宝支付 +export const generateOrderAlipay = (list) => { + return fetch('generateOrderAlipay', list, 'POST') +} + +//用户所有的优惠券 +export const allConfig = (memberId, channelSecurity, mobile) => { + var data = { + } + return fetch('couponConfig?type=getAll', data, 'POST') +} + + +//用户领取优惠券 +export const getConfig = (memberId, couponId) => { + var data = { + memberId: memberId, + couponId: couponId, + } + return fetch('coupon?type=fetch', data, 'POST') +} + + +//用户下的优惠券 +export const userConfig = (memberId, couponId) => { + var data = { + memberId: memberId, + couponId: couponId, + } + return fetch('coupon?type=fetch', data, 'POST') +} + + + + +//用户订单的查询 +// export const customerorders = (memberId,channelSecurity,mobile) => { +// var data = { +// productName:'幼猫全价粮', +// buyCount:'2', +// productId:'210352', +// payAmount:'517', +// memberId:'844350', +// phoneNumber:'18112621098', +// } +// return fetch('generateOrderWX', data, 'POST' ) +// } + +//地址的查询 +export const memberAddress = (type, data) => { + return fetch('memberAddress?type=' + type, data, 'POST') +} + + +//地址的查询 +export const selectaddress = (memberId, pet, address) => { + var data = { + memberId: memberId, + } + return fetch('memberAddress?type=getAll', data, 'POST') +} + + +//地址的添加 //id/详细地址/ 收货人姓名/收货人电话号码/省份id/城市id/区域编码 +export const editaddress = (memberId, detailAddress, recipient, tel, provinceId, cityId, districtId) => { + var data = { + memberId: 844350, + provinceId: 25, + cityId: 36, + districtId: 418, + detailAddress: '古美路1455弄46号302', + recipient: '蒋缘缘2', + recipientPhone: '13671516167', + zipCode: '214423', + default: false, + } + return fetch('memberAddress?type=add', data, 'POST') +} + +//删除 +export const editdelete = (memberId, ids) => { + var data = { + memberId: memberId, + ids: ids, + } + return fetch('memberAddress?type=delete', data, 'POST') +} + +//地址的编辑 +export const editupdate = (mobile, pet, address) => { + var data = { + + memberId: '3242', + id: '620111', + provinceId: '', + cityId: '', + districtId: '', + detailAddress: '江西省萍乡市', + recipient: '刘佳敏', + recipientPhone: '13407998521', + zipCode: '', + isDefault: '', + } + return fetch('memberAddress?type=update', data, 'POST') +} //修改密码 -export const userchange = (id, pet,address) => { +export const userchange = (id, pet, address) => { var data = { - id:id, + id: id, } - return fetch('member?type=update', data, 'POST' ) + return fetch('member?type=update', data, 'POST') } diff --git a/rc-busness/assets/css/discount.less b/rc-busness/assets/css/discount.less index 9b580ef7..0179576e 100644 --- a/rc-busness/assets/css/discount.less +++ b/rc-busness/assets/css/discount.less @@ -1,8 +1,6 @@ @media screen and (max-width:768px){ .allmain{ - .rc-top{ - margin-top: 2.5rem; - } + } .active { @@ -29,7 +27,7 @@ display: block; margin-left: 32px; font-weight: bold; - + cursor: pointer; } span:first-child { margin-left: 0; @@ -134,7 +132,7 @@ margin-top: 8px; } .rc-footer { display: flex; - align-items:flex-end + align-items:flex-end; span { width: 72px; height: 25px; @@ -154,11 +152,11 @@ margin-top: 8px; } @media screen and (min-width: 769px){ - +.online{ + margin-top: 30px; +} .allmain{ - .rc-top{ - margin-top: 1.5rem; - } + .rs-dis{ display: flex; flex-flow: wrap; @@ -166,6 +164,7 @@ margin-top: 8px; } } + .active { font-size: 14px; color: #E2001A; @@ -192,6 +191,7 @@ margin-top: 8px; margin-left: 40px; font-size: 16px; font-weight: bold; + cursor: pointer; } span:first-child { @@ -275,6 +275,7 @@ margin-top: 8px; justify-content: end; padding-right: 17px; margin-bottom: 8px; + float: right; } .ts-standard-btn{ diff --git a/rc-busness/assets/css/global.less b/rc-busness/assets/css/global.less index 08663b1b..c0f8706f 100644 --- a/rc-busness/assets/css/global.less +++ b/rc-busness/assets/css/global.less @@ -1,10 +1,69 @@ /*Body*/ -html,body{height:100%;} body{ font-family: DINPro,'PingFang SC',miui,'Hiragino Sans GB','Microsoft Yahei',sans-serif; line-height: 1.5; color: #666; } +.fade-enter, +.fade-leave-active { + opacity: 0; +} + +.ts-mask{ + width:100%; + height:100%; + position: fixed; + top:0; + left:0; + display:flex; + flex-direction: column; + justify-content: center; + align-items: center; + z-index:99; + + .ts-mask-bg{ + background-color:#000; + opacity:.6; + width:100%; + height:100%; + z-index:0; + position:absolute; + left:0; + top:0; + } +} +.userloding { + background: url(../image/onloading.png) center center no-repeat; + width: 3.12rem; + background-size: contain; + height: 3.12rem; + animation: rolling 4s infinite; + -webkit-animation:rolling 4s infinite; +} + +@keyframe rolling +{ + from{ + transform: rotateZ(0deg); + } + to{ + transform: rotate(360deg); + } +} +@-webkit-keyframes rolling +{ + from{ + transform: rotateZ(0deg); + } + to{ + transform: rotate(360deg); + } +} + +.fade-enter-active, +.fade-leave-active { + transition: opacity 0.5s; +} //用户光点 .rc-screen-reader{ width: 0.81rem; @@ -39,8 +98,7 @@ img, picture { flex-wrap: wrap; justify-content: space-evenly; &:after{ - content:""; - width:154px; + } li{ border: 1px solid #D7D7D7; @@ -130,13 +188,14 @@ img, picture { height: 100%; background: #333333; opacity: 0.6; - position: absolute; + position: fixed; bottom: 0; width: 100%; z-index: 8; } .ts-scrollable-container{ display: flex; + align-items: center; h2{ margin:0; display: flex; @@ -151,12 +210,9 @@ img, picture { flex-wrap: nowrap; text-align: center; width: 86%; - &::-webkit-scrollbar{ - display:none; - } li{ border-radius: 100px; - flex-shrink: 0; + flex-shrink:0; } } .active{ @@ -191,13 +247,12 @@ img, picture { right: 0; top: 30%; background: #FFFFFF; - box-shadow: 0px 0px .62rem rgba(0, 0, 0, 0.16); + box-shadow: 0 0 10px rgba(0, 0, 0, 0.16); border-radius: .25rem; z-index:3; ul{ width: 60px; height: 181px; - box-shadow: 0px 0px 6px rgb(0 0 0 / 10%); background-color: white; display: flex; flex-direction: column; @@ -236,7 +291,6 @@ img, picture { max-width: 460px; margin-left: auto!important; margin-right: auto!important; - box-shadow:unset; } .ts-standard-input{ @@ -286,9 +340,7 @@ img, picture { margin-top: 90px; } .rc-list__header { - background: none; - padding: .5rem 0; - border-bottom: none; + } .ts-right-arr { border-bottom:1px solid #E1001A; @@ -341,12 +393,16 @@ img, picture { } .ts-scrollable{ li{ - width: 4.125rem; + // width: 4.125rem; + padding: 0 0.62rem; height: 1.625rem; margin-left: .5rem; font-size:.75rem; line-height: 1.375rem; } + &::-webkit-scrollbar{ + display:none; + } } } @@ -364,24 +420,37 @@ img, picture { font-size:16px; } .rc-top{ - margin-top: 150px; + margin-top: 124px; } .ts-product-list{ text-align: left; display:block; li{ max-width:20rem; - margin-right:.9rem; - margin-left:.9rem; + min-width:18.75rem; + width:22.8vw; + //margin-right:.875rem; + margin-left:2vw; + padding-left:1px; + padding-right:1px; + box-sizing: border-box; .rc-column{ span{ font-size:1.875rem; height: 5.2rem; } } + &:nth-child(4n+1){ + margin-left:0; + } + &:nth-child(4n){ + //margin-right:0; + } } img{ - width:20rem; + width:100%; + max-width:320px; + min-width:160px; } } .ts-right-arr { @@ -486,17 +555,40 @@ img, picture { } h2{ font-size:20px; + padding-bottom:1rem; } .ts-scrollable { + padding-bottom:1rem; + scrollbar-width: thin; li { - margin-left: 40px; + margin-left: 30px; width: 8.125rem; height: 2.5rem; - line-height: 40px; + //line-height: 40px; font-size: .875rem; + padding:.375rem; } + + &::-webkit-scrollbar{ + height: 6px; + width:50%; + background:transparent; + } + &::-webkit-scrollbar-thumb{ + background-color:#d7d7d7; + border-radius:10px; + width:50%; + } + &::-webkit-scrollbar-track{ + //background-color:#ddd; + background-color:transparent; + } + &::-webkit-scrollbar-button{ + background:unset; + } + /* */ } } @@ -513,4 +605,15 @@ img, picture { .rc-xl-down { display: none!important; } +} +@media screen and (min-width: 769px) and (max-width: 1370px) +{ + .ts-product-list { + display:flex; + //justify-content: space-between; + li{ + //margin-left:0; + //margin-right:0; + } + } } \ No newline at end of file diff --git a/rc-busness/assets/css/index.less b/rc-busness/assets/css/index.less index 89728579..4463c181 100644 --- a/rc-busness/assets/css/index.less +++ b/rc-busness/assets/css/index.less @@ -5,17 +5,95 @@ /deep/.van-swipe__indicator--active{ background-color: #E1001A; } + +.ts-carousel-indicator{ + /deep/.swiper-pagination-bullet{ + margin-left:.5rem; + } + /deep/.swiper-pagination-bullet-active{ + background:#E2001A; + } + &.center{ + width:100%; + text-align: center; + } +} +.ts-position-identifier{ + +} +.ul-zhuan,.ul-dog{ + li{ + background: unset; + img{ + border-radius: 50%; + } + &.active { + img{ + border: 3px solid #E2001A; + } + color: #E2001A; + + } + &.unactive { + color: #444444; + img{ + border: 3px solid #D7D7D7; + } + } + } +} + +.uservideo{ + overflow: hidden; + video{ + height:100%; + width:auto; + } +} +.ul-dog{ + width: 100%; + display: flex; + justify-content: center; + flex-wrap: wrap; + flex-direction: row; + + span{ + margin-top: .5rem; + display: block; + } + img{ + width: 9.5rem; + height: auto; + display: block; + } + li{ + cursor: pointer; + font-size: 16px; + text-align: center; + margin-top:3rem; + margin-left:3rem; + } +} @media screen and (max-width:768px){ .ul-dog{ - display: none; + justify-content: space-evenly; + img{ + width:4rem; + height:auto; + } + li{ + margin-top:1.875rem; + } } - .searchBara{ - position: fixed; + .ts-banner-swiper-container{ + margin-bottom:2.5rem; + } + .searchBara{ width: 100%; position: fixed; - top:66px; + top:3.75rem; background: white; - z-index: 9999; + z-index: 60; overflow-x: auto; white-space: nowrap; overflow-y:hidden; @@ -24,26 +102,22 @@ display: block; } img{ - width: 0.64rem; - height: 0.64rem; + width: 4rem; + height: 4rem; display: block; } li{ display: inline-block; margin-left: 0.20rem; - width: 0.64rem; text-align: center; - height: 0.64rem; - background: #F6F6F6; border-radius: 50%; opacity: 1; } - } - - .rc-login{ - width: 92%; - margin:0 auto; - } + } + .rc-login{ + width: 92%; + margin:0 auto; + } .userunlogin{ width: 100%; height: 0.60rem; @@ -73,9 +147,6 @@ } } - .van-swipe{ - z-index: 2; - } .rc-usermessage{ span{ font-size: 1rem; @@ -91,13 +162,14 @@ height: auto; object-fit: cover; } - + + .van-swipe{ + z-index: 2; + } .van-swipe-item { color: #fff; - height: 26.31rem; width: 100%; font-size: 0.20px; - line-height: 1.50rem; text-align: center; position: relative; } @@ -145,12 +217,10 @@ .uservideo{ width: 100%; height:auto; - max-height: 15.68rem; display: block; - overflow:hidden; video{ - width:100%; - height:100%; + max-width:100%; + max-height:100%; } } } @@ -166,7 +236,7 @@ width: 100%; display: flex; flex-direction: column; - justify-content: center; + justify-content: flex-start; align-items: center; } img{ @@ -183,6 +253,7 @@ margin-top: 1.25rem; } p{ + color: #666666; font-size: .875rem; text-overflow: -o-ellipsis-lastline; overflow: hidden; @@ -261,12 +332,7 @@ li{ display: inline-block; margin-left: 1.25rem; - width: 4rem; text-align: center; - height: 4rem; - background: #F6F6F6; - border-radius: 50%; - opacity: 1; } } @@ -280,22 +346,21 @@ } } - .active { - font-size: 0.14rem; - border: 1px solid red; - color: red; - - } - .unactive { - font-size: 0.14rem; - color: #444444; - border: 1px solid #D7D7D7; - } - // .usermain{ // display: none; // } - +} +.active { + font-size: 0.14rem; + img{ + border-width: 1px; + } +} +.unactive { + font-size: 0.14rem; + img{ + border-width: 1px; + } } @@ -304,20 +369,26 @@ .rc-selection{ display: none; } - .sw-center{ - display: none; - } -.useraimg{ -width: 100%; -// height: 29.31rem; -object-fit: cover; -} + .sw-center{ + display: none; + } + .useraimg{ + width: 100%; + // height: 29.31rem; + object-fit: cover; + } + .ts-banner-swiper-container{ + position:relative; + .ts-carousel-indicator{ + position:absolute; + bottom:.4rem; + } + } .van-swipe-item { color: #fff; height: 100%; width: 100%; font-size: 1.25rem; - line-height: 9.375rem; text-align: center; @@ -331,15 +402,12 @@ object-fit: cover; #xxxFullScreen { background-color: white; // margin-top: 100px; - #swiper1 { - width: 100%; + #swiper1,#swiper2 { overflow: hidden; margin-top: 2.31rem; - - h2{ - padding-bottom: 5rem; - } - + } + h2{ + padding-bottom: 5rem; } .swiper-container2 { @@ -348,10 +416,10 @@ object-fit: cover; // overflow: visible !important; position: relative; } -#swiper1 .swiper-container .swiper-wrapper .swiper-slide { - width: 100%; - //height: 6.18rem; -} + #swiper1 .swiper-container .swiper-wrapper .swiper-slide { + width: 100%; + //height: 6.18rem; + } /* 上一张 */ #swiper1 .swiper-container .swiper-wrapper .swiper-slide-prev { @@ -414,35 +482,33 @@ object-fit: cover; margin-top: 1rem; } } -.uservideo{ -width: 35rem; -height: 31.6rem; -display: block; -border: 1px solid red; - -} -.userleft{ -position: absolute; -top: 50%; -left:0; -margin-top: -.72rem; -img{ - width: .69rem; - height: 1.38rem; - display: block; -} -} -.userright{ -position: absolute; -top: 50%; -right:0; -margin-top: -.72rem; -img{ - width: .69rem; - height: 1.375rem; - display: block; -} -} + .uservideo{ + width: 35rem; + height: 31.6rem; + display: block; + } + .userleft{ + position: absolute; + top: 50%; + left:0; + margin-top: -.72rem; + img{ + width: .69rem; + height: 1.38rem; + display: block; + } + } + .userright{ + position: absolute; + top: 50%; + right:0; + margin-top: -.72rem; + img{ + width: .69rem; + height: 1.375rem; + display: block; + } + } } } @@ -486,7 +552,7 @@ img{ .rc-ma { .rc-margin-y--xl{ - //margin-bottom: 1.88rem; + margin-bottom: 1.88rem; } // padding:60px 0; @@ -497,23 +563,22 @@ img{ flex-wrap: wrap; flex-direction: row; span{ - margin-top: 2.5rem; + margin-top: 1vw; display: block; } img{ - width: 9.5rem; - height: 9.5rem; + width:100%; + height: auto; + object-fit: contain; display: block; } li{ + width: 10vw; + max-width:11rem; cursor: pointer; font-size: 16px; - width: 9.875rem; text-align: center; - height: 9.875rem; - background: #F6F6F6; - border-radius: 50%; - margin-left:1.25rem; + overflow:hidden; } } @@ -528,35 +593,7 @@ img{ } .usermain{ - margin-top: 2.5rem; - padding-bottom: 2.82rem; - .ul-dog{ - width: 100%; - display: flex; - justify-content: center; - flex-wrap: wrap; - flex-direction: row; - - span{ - margin-top: 2.5rem; - display: block; - } - img{ - width: 9.5rem; - height: 9.5rem; - display: block; - } - li{ - cursor: pointer; - font-size: 16px; - width: 9.875rem; - text-align: center; - height: 9.875rem; - background: #F6F6F6; - border-radius: 50%; - margin-left:3rem; - } - } + } .rc-main{ width: 100%; @@ -596,17 +633,18 @@ margin-left: 2.5rem; } } } -.active { - font-size: 1rem; - border: 3px solid red; - color: red; - -} -.unactive { - font-size: 1rem; - color: #444444; - border: 1px solid #D7D7D7; -} + .active { + font-size: 1rem; + img{ + border-width: 3px; + } + } + .unactive { + font-size: 1rem; + img{ + border-width: 1px; + } + } .rc-maa{ ul{ width: 100%; @@ -638,15 +676,12 @@ border-radius: 50%; } - .userselection { - font-size: 0.16rem; - -color: #E2001A; - -} + .userselection { + font-size: 0.16rem; + color: #E2001A; + } .unselection { font-size: 0.16rem; - } .rc-usermessage{ span{ @@ -656,3 +691,14 @@ color: #E2001A; } } } + +@media screen and (min-width:600px) and (max-width:768px) +{ + .ul-zhuan{ + display: flex; + justify-content: space-evenly; + li{ + margin-left:0; + } + } +} \ No newline at end of file diff --git a/rc-busness/assets/css/integral.less b/rc-busness/assets/css/integral.less index 6f85a29b..e461175d 100644 --- a/rc-busness/assets/css/integral.less +++ b/rc-busness/assets/css/integral.less @@ -1,21 +1,13 @@ -.rc-usermain{ - width:100%; - padding-bottom:2.8rem; - ol{ - overflow-x:hidden; - overflow-y:auto; - } -} @media screen and (max-width:768px){ .rc-button{ - width: 100%; - height: 80px; - background: #FFFFFF; - box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); - display: flex; - align-items: center; - justify-content: center; - margin-top: 12px; + width: 100%; + height: 80px; + background: #FFFFFF; +box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); + display: flex; + align-items: center; + justify-content: center; + margin-top: 12px; .rc-order{ width: 164px; @@ -35,8 +27,12 @@ span{ } } .rc-usermain{ + width: 92%; + margin: 0 auto; + ul{ - height: 4.375rem; + height: 70px; + display: block; border-bottom: 1px solid #D8D8D8; display: flex; align-items: center; @@ -47,15 +43,17 @@ span{ li{ float: left; width: 30%; - position:relative; - padding-right:.625rem; + + } li:after{ - content:"|"; - color: #707070; - position:absolute; - top:0; - right:0; + // height: 2px; + // border: 1px solid red; + // display: block; + content:"|"; + color: #707070; + margin-left: 5px; + } li:last-child:after{ content:""; @@ -64,29 +62,31 @@ span{ } ol{ - margin-top:1rem; - max-height:70vh; li{ font-style: normal; - height: 2rem; + display: block; + height: 32px; + margin-top: 16px; display: flex; + // justify-content: space-between; align-items: center; - font-size: .875rem; + color: #666666; + font-size: 14px; text-align: center; i{ - font-style: normal; - display: block; - width: 40%; + font-style: normal; + display: block; + width: 40%; } span{ - font-style: normal; - display: block; - width: 36%; + font-style: normal; + display: block; + width: 36%; } em{ - font-style: normal; - display: block; - width: 23%; + font-style: normal; + display: block; + width: 23%; } @@ -130,13 +130,16 @@ span{ } } .rc-usermain{ + width: 92%; + margin: 0 auto; margin-top: 60px; + ul{ height: 64px; - background: #F6F6F6; - border: 1px solid #D7D7D7; - opacity: 1; - border-radius: 3px 3px 0px 0px; +background: #F6F6F6; +border: 1px solid #D7D7D7; +opacity: 1; +border-radius: 3px 3px 0px 0px; display: block; display: flex; align-items: center; @@ -147,20 +150,21 @@ span{ li{ float: left; width: 42%; + + } } ol{ - max-height:37.5rem; li{ font-style: normal; display: block; height: 48px; + margin-top: 16px; display: flex; border: 1px solid #D7D7D7; - border-top:0; - //justify-content: space-between; + // justify-content: space-between; align-items: center; color: #666666; font-size: 14px; diff --git a/rc-busness/assets/css/login.less b/rc-busness/assets/css/login.less index ff06a645..f166c777 100644 --- a/rc-busness/assets/css/login.less +++ b/rc-busness/assets/css/login.less @@ -1,9 +1,9 @@ .container{ + min-height:100vh; height:100%; - display:flex; + background-color:#f6f6f6; + display: flex; flex-direction: column; - align-items: center; - //background-color:#f6f6f6; } .ts-max-width--460{ border-radius: 3px; @@ -141,7 +141,7 @@ } } // /* 最小768px最大1920 *pc端/ -@media screen and (min-width: 769px) { +@media screen and (min-width: 768px) and (max-width: 1920px) { .usecheck{ display: flex; text-align: left; diff --git a/rc-busness/assets/css/mypersonal.less b/rc-busness/assets/css/mypersonal.less index c6b24d05..7ce18230 100644 --- a/rc-busness/assets/css/mypersonal.less +++ b/rc-busness/assets/css/mypersonal.less @@ -8,9 +8,6 @@ ul li ol li em strong i { .rc-center{ overflow:hidden; } -.r-block{ - border-radius:.25rem; -} //手机端 @media screen and (max-width: 768px) { .ts-mypersonal{ @@ -253,7 +250,6 @@ ul li ol li em strong i { width: 440px; height: 652px; } - .ts-mypersonal{ margin-left:0; .rc-column{ @@ -261,7 +257,6 @@ ul li ol li em strong i { padding-right:0; } } - .online{ margin:40px auto; } @@ -387,16 +382,16 @@ ul li ol li em strong i { background: #008900; } .ts-point-tag{ - background:url("../image/img-pointBg.png") no-repeat center top; - background-size:contain; - height:2.375rem; - width:3.625rem; - text-align:center; - position:absolute; + background:url("../image/img-pointBg.png") no-repeat center top; + background-size:contain; + height:2.375rem; + width:3.625rem; + text-align:center; + position:absolute; font-size:.875rem; line-height:2rem; - left:0; - top:-2.6rem; + left:0; + top:-2.6rem; } } .rc-value{ diff --git a/rc-busness/assets/css/product-list.less b/rc-busness/assets/css/product-list.less index 9e4fc65b..cf1e3bef 100644 --- a/rc-busness/assets/css/product-list.less +++ b/rc-busness/assets/css/product-list.less @@ -11,14 +11,36 @@ ul li ol li em strong i { .usersearch { margin: 0 auto; overflow: hidden; + } //rc-main end } + //手机端 @media screen and (max-width: 768px) { + + + .usercontentshow{ position: relative; + .userrccat{ + width: 32%; + height: 34px; + background: #ffffff; + border-radius: 100px; + display: flex; + align-items: center; + justify-content: center; + margin-left: 0; + font-size: 12px; + margin-right: 0.2rem; + img { + width: 24px; + height: 16px; + } + border: 2px solid #d7d7d7; + } } .online{height:.08rem;} .rc-mubu{ @@ -93,6 +115,25 @@ ul li ol li em strong i { height: 16px; } } + .userrccat{ + width: 32%; + height: 34px; + background: #ffffff; + border-radius: 100px; + display: flex; + align-items: center; + justify-content: center; + margin-left: 0; + font-size: 14px; + span { + margin-left: 3px; + } + img { + width: 24px; + height: 16px; + } + border: 2px solid #E2001A; + } } } @@ -230,10 +271,69 @@ ul li ol li em strong i { } } */ + .ts-scrollable{ + .useractive{ + width: 126px; + height: 36px; + border: 2px solid #E1001A; + border-radius: 100px; + } + .userunactive{ + width: 126px; + height: 36px; + background: #FFFFFF; + border: 2px solid #D7D7D7; + opacity: 1; + border-radius: 100px; + display: flex; + align-items: center; + justify-content: center; + font-size: 0.14rem; + img{ + width: 24px; + height: 16px; + display: block; + max-width: 100%; + } + + } + } + } //pc端 @media screen and (min-width: 768px){ + .userrccat{ + width: 327px; + height: 48px; + border-radius: 30px; + background: #ffffff; + border-radius: 100px; + display: flex; + align-items: center; + justify-content: center; + font-size: 14px; + margin-left: 16px; + + img { + width: 24px; + height: 16px; + } + border: 2px solid #d7d7d7; + } + .usersearch { + margin: 0 auto; + overflow: hidden; + margin-top: 2.6rem; + } + .online{ + width:100%; + &.bold{ + height:0.5rem; + margin-top: 5rem; + background:#f6f6f6; + } + } /deep/.el-dialog { width: 920px; height: 570px; @@ -441,4 +541,20 @@ border-radius: 30px; } } */ +.ts-scrollable-container{ + overflow-y: hidden; + overflow-x: clip; + width: 100%; + h2{ + display: flex; + align-items: center; + width: 4%; + } + .ts-scrollable{ + overflow-y: hidden; + overflow-x: clip; + width: 100%; + } + } + } \ No newline at end of file diff --git a/rc-busness/assets/css/search.less b/rc-busness/assets/css/search.less index 9fcef91a..27cce00e 100644 --- a/rc-busness/assets/css/search.less +++ b/rc-busness/assets/css/search.less @@ -1,67 +1,323 @@ .rc-top{ - position: relative; + position: relative; +} + +/deep/ .el-drawer{ + height: 60%; +} +ul li ol li em strong i { + list-style: none; + font-style: normal; + +} +.rc-main { + position: relative; + margin-top: 5.25rem; + + .usersearch { + width: 100%; + margin: 0 auto; + overflow: hidden; + margin-top: 20px; + .rc-padding--md{ + padding: 0; + } + } + .active{ + border: 2px solid #E2001A; + color: #E2001A; + cursor: pointer; + + } + .unactive{ + border: 2px solid #d7d7d7; + color:#999999; + cursor: pointer; + + } +} +//手机端 +@media screen and (max-width: 768px) { + .rc-button + { + display: flex; + justify-content: center; + font-size: 14px; + width: 100%; + box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); + height: 80px; + align-items: center; + span + { + width: 160px; + height: 48px; + border: 2px solid #E2001A; + border-radius: 30px; + display: flex; + align-items: center; + justify-content: center; + color: #E2001A; + } + em{ + font-style: normal; + width: 164px; + height: 48px; + background: #E2001A; + cursor: pointer; + border-radius: 30px; + display: flex; + align-items: center; + justify-content: center; + color: #FFFFFF; + margin-left: 40px; + } } - /deep/ .el-drawer{ - height: 60%; + .active{ + border: 2px solid #E2001A; + color: #E2001A; + cursor: pointer; + } - ul li ol li em strong i { - list-style: none; - font-style: normal; + .unactive{ + border: 2px solid #d7d7d7; + color:#999999; + cursor: pointer; + + } +//搜索 +.usersearch { + + .form-search{ + .ts-standard-btn{ + display: none; + } + } +strong{ + font-size: 18px; + color: #333333; + display: block; + font-weight: bold; +} +} +.rc-max-width--xl{ +/deep/ .van-search__content { + width: 7rem; + height: 2rem; + border: 1px solid #d7d7d7; + border-radius: 12.5rem; + background: white; +} +/deep/.van-search{ + padding: 0; +} +.rc-search { + width: 4.31rem; + height: 2rem; + background: #e1001a; + border-radius: 2rem; + text-align: center; + color: white; + font-size:0.87rem ; +} +.rc-title { + width: 100%; + display: flex; + align-items: center; + justify-content: space-between; + margin: 0 auto; + color: #333333; + margin-top: 1.5rem; + h2{ + font-size: 18px; + font-weight: bold; + } + span { + font-size: 14px; + color: #666666; + border-bottom: 1px solid #666666; + display: block; + } +} +// 热门搜索 +.rc-variety { + ul { + display: flex; + align-items: center; + flex-wrap: nowrap; + overflow: hidden; + width: 100%; } - .rc-main { - .usersearch { - width: 100%; - margin: 0 auto; - overflow: hidden; + ul li { + width: 80px; + height: 32px; + background: #ffffff; + border: 1px solid #d7d7d7; + border-radius: 100px; + text-align: center; + font-size: 14px; + float: left; + line-height: 32px; + margin-left: 5px; + } + li:first-child{ + margin-left: 0; + } +} +// 我想搜 +.usercontentshow{ + position: relative; + .rc-productcat { + display: flex; + align-items: center; + flex-wrap: nowrap; + margin-top: 1rem; + ol{ + display: flex; + align-items: center; + flex-flow: row; + .ts-standard-btn{ + width: 7.87rem; + height: 2.25rem; +background: #FFFFFF; +border-radius: 6.25rem; +background: none; +display: flex; +align-items: center; +justify-content: center; +margin-left: 1rem; +color: #999999; +img { +width: 1.5rem; +height: 1rem; +} +span { +margin-left: 0.18rem; +} + } } - .active{ - border: 2px solid #E2001A; - color: #E2001A; - cursor: pointer; +//筛选 + .userselect{ + display: flex; + align-items: center; + justify-content: center; + color: #666666; + font-size: 0.87rem; + margin-left: 0.94rem; + margin-top: 0; + img{ + width: 1rem; + height: 1rem; + } + span{ + display: block; + margin-left: 0.5rem; + display: block; + } } - .unactive{ - border: 2px solid #d7d7d7; - color:#999999; - cursor: pointer; - + + } + .ts-scrollable-container{ + margin-top: 0.93rem; + } + +} +.usersearch{ + .rc-column{ + strong{ + font-size: 0.875rem; + font-weight: normal; + } + } + .rc-padding--md{ + padding: 0; + } + h2{ + margin-left: 0; + } +} + + + +.rc-prefecture{ + display: flex; + h2{ + font-size: 16px; +color: #333333; +margin-left: 12px; + } + ol{ + display: flex; + align-items: center; + flex-wrap: nowrap; + font-size: 12px; + text-align: center; + width: 80%; + overflow-x: auto; +white-space: nowrap; + } + li{ + display: inline-block; + text-align: center; + display: flex; + align-items: center; +height: 26px; +background: #FFFFFF; +border: 1px solid #D7D7D7; +padding: 0 5px 0 5px; +border-radius: 100px; + + } +} + +.rc-bottom{ + position: fixed; + background: white; + bottom: 0; + left: 0; + z-index: 9; + ol li{ + background: none; + width: 7.87rem; + height: 2.25rem; + background: #FFFFFF; + border-radius: 6.25rem; + background: none; + display: flex; + align-items: center; + justify-content: center; + margin-left: 1rem; + } + +} + +.rc-bottoma{ + margin-bottom:2rem; + } + + .rc-footer{ + display: flex; + align-items: center; + justify-content: space-evenly; + width: 100%; + padding: 0 0.5rem; + box-sizing: border-box; + span{ + width: 1.55rem; + height: 0.48rem; + border: 2px solid #E1001A; + display: flex; + align-items: center; + justify-content: center; + font-size: 0.14rem; + color: #E1001A; + border-radius: 0.30rem; } - } - //手机端 -@media screen and (max-width: 768px) { - .usercontentshow{ - position: relative; - } - .rc-bottom{ - position: relative; - background: white; - z-index: 9; - .rc-bottoma{ - margin-bottom:2rem; - } - .rc-footer{ - display: flex; - align-items: center; - justify-content: space-evenly; - width: 100%; - padding: 0 0.5rem; - box-sizing: border-box; - span{ - width: 1.55rem; - height: 0.48rem; - border: 2px solid #E1001A; - display: flex; - align-items: center; - justify-content: center; - font-size: 0.14rem; - color: #E1001A; - border-radius: 0.30rem; - } - em{ - width: 1.55rem; - margin-left: 0.25rem; + em{ + width: 1.55rem; + margin-left: 0.25rem; height: 0.48rem; background: #E2001A; border-radius: 0.30rem; @@ -72,17 +328,27 @@ font-style: normal; justify-content: center; list-style: none; - } - } - .rc-cat{ - margin-top: 0.24rem; } - + } + .rc-cat{ + margin-top: 0.24rem; + } - .rc-productcat { + .rc-product { + h2 { + font-size: 18px; + color: #333333; + font-weight: bold; + } + .ts-scrollable{ + margin-top: 1rem; + } + + .rc-productcat { display: flex; align-items: center; flex-wrap: nowrap; + margin-top: 1rem; .rc-cat { width: 32%; height: 0.34rem; @@ -104,491 +370,336 @@ } } - + } } - /deep/ .van-search__content { - width: 2.50rem; - height: 0.32rem; - border: 1px solid #d7d7d7; - border-radius: 2rem; - background: white; +} +//pc端 +@media screen and (min-width: 768px){ + + /deep/.el-dialog__header { + padding: 0; + margin: 0; + } + + + + .ts-scrollable-container{ + // overflow-y: hidden; + // overflow-x: clip; + // margin-top: 0; + h2{ + display: flex; + align-items: center; + width: 6%; + } + .ts-scrollable{ + // overflow-y: hidden; + // overflow-x: clip; + // width: 100%; } - .rc-search { - width: 0.69rem; - height: 0.32rem; - background: #e1001a; - border-radius: 2rem; - text-align: center; - color: white; } - .rc-title { - width: 100%; + +strong{ + font-size: 26px; + color: #333333; + display: block; +} +.ts-scrollable{} +.active{ +border: 2px solid #E2001A; +color: #E2001A; +cursor: pointer; + +} +.unactive{ +border: 2px solid #d7d7d7; +color:#999999; +cursor: pointer; + +} +.rc-main { + margin-top: 7.25rem; + +} +.ts-scrollable-container{ + margin-top: 40px; +} +/deep/.el-dialog { + width: 920px; + background: #FFFFFF; + } + /deep/.van-search__action{ + display: block; + } + .rc-search { + width: 4.31rem; + height: 2rem; + background: #e1001a; + border-radius: 2rem; + text-align: center; + color: white; + font-size:0.87rem ; + } + .rc-productcat { + display: flex; + align-items: center; + flex-wrap: nowrap; + justify-content: space-between; + margin-top: 32px; + ol{ display: flex; align-items: center; - justify-content: space-between; - margin: 0 auto; - color: #333333; - margin-top: 12px; - h2 { - font-size: 18px; - color: #333333; - margin-left: 12px; + flex-flow: row; + .ts-standard-btn{ + width: 237px; + height: 48px; +background: #FFFFFF; +border-radius: 30px; +background: none; +display: flex; +align-items: center; +justify-content: center; +margin-left: 40px; +img { +width: 24px; +height: 24px; +} +span { +margin-left: 8px; +} } - span { - font-size: 14px; - color: #666666; - border-bottom: 1px solid #666666; + } +//筛选 + .userselect{ + display: flex; + align-items: center; + justify-content: center; + color: #666666; + font-size: 0.87rem; + margin-left: 0.94rem; + margin-top: 0; + img{ + width: 1rem; + height: 1rem; + } + span{ display: block; - margin-right: 8px; + margin-left: 0.5rem; + display: block; + } } - .rc-variety { - ul { + } + .rc-title { + width: 100%; + display: flex; + align-items: center; + justify-content: space-between; + margin: 0 auto; + color: #333333; + margin-top: 12px; + h2 { + font-size: 18px; + color: #333333; + margin-left: 12px; + } + span { + font-size: 14px; + color: #666666; + border-bottom: 1px solid #666666; + display: block; + margin-right: 8px; + } + .rc-change{ + display: none; + } + } + + .rc-button + { + display: flex; + justify-content: center; + font-size: 16px; + width: 100%; + margin-top: 35px; + + span + { + width: 160px; + height: 48px; + border: 2px solid #E2001A; + border-radius: 30px; + display: flex; + align-items: center; + justify-content: center; + color: #E2001A; + cursor: pointer; + } + em{ + font-style: normal; + width: 164px; + height: 48px; + background: #E2001A; + cursor: pointer; + border-radius: 30px; + display: flex; + align-items: center; + justify-content: center; + color: #FFFFFF; + margin-left: 40px; + } + } + +.rc-bottom{ + .rc-productcat { + display: flex; + align-items: center; + flex-wrap: nowrap; + .rc-cat { + width: 237px; +height: 48px; +border-radius: 30px; + background: #ffffff; + display: flex; + align-items: center; + justify-content: center; + margin-left: 16px; + font-size: 14px; + span { + margin-left: 3px; + } + + img { + width: 24px; + height: 16px; + } + + } + } + + + +} + .form-search { + width: 100%; + display: flex; + align-items: center; + .ts-standard-btn{ + + } + .rc-search{ + display: none; + } + + } + /deep/.van-search__content--square{ + background: white; + } + .van-search__content--square{ display: flex; align-items: center; - flex-wrap: nowrap; - overflow: hidden; - width: 100%; - - } - ul li { - width: 80px; - height: 32px; - background: #ffffff; - border: 1px solid #d7d7d7; - border-radius: 100px; - text-align: center; - font-size: 14px; - float: left; - line-height: 32px; - margin-left: 11px; - } - } - .rc-product { - h2 { - font-size: 18px; - color: #333333; - margin-left: 12px; - } - } - .rc-productcat { + justify-content: center; + background: white; + border: 1px solid #D7D7D7; + height: 80px; + width: 1200px; + border-radius: 200px; + } + /deep/.van-field__left-icon + { + display: flex; + align-items: center; + justify-content: center; + } + /deep/.van-field__body + { + } + + + .rc-variety { + margin-top: 30px; + ul { display: flex; align-items: center; flex-wrap: nowrap; - .rc-cat { - width: 32%; - height: 34px; - background: #ffffff; - border-radius: 100px; - display: flex; - align-items: center; - justify-content: center; - margin-left: 16px; - font-size: 14px; - span { - margin-left: 3px; - } - - img { - width: 24px; - height: 16px; - } - - } + overflow: hidden; + width: 100%; + + } - - .rc-productright { - display: flex; - align-items: center; - img { - width: 24px; - height: 20px; - margin-left: 15px; - } - span { - font-size: 14px; - color: #666666; - margin-left: 8px; - } - } - - .rc-prefecture{ - display: flex; - h2{ - font-size: 16px; - color: #333333; - margin-left: 12px; - } - ol{ - display: flex; - align-items: center; - flex-wrap: nowrap; - font-size: 12px; - text-align: center; - width: 80%; - overflow-x: auto; - white-space: nowrap; - } - li{ - display: inline-block; - text-align: center; - display: flex; - align-items: center; -height: 26px; -background: #FFFFFF; -border: 1px solid #D7D7D7; -padding: 0 5px 0 5px; -border-radius: 100px; - - } - } - .rc-contair{ - margin-top: 24px; - .rc-rccontair{ - height:1.6rem;display:flex;align-items: center; - width: 100% - - } - ul{ - text-align: center; - align-items: center; - flex-wrap: nowrap; - li{ - - width: 43%; - margin-top: 16px; - background: #FFFFFF; - border: 1px solid #D7D7D7; - margin-left: 15px; - display: inline-flex; - flex-direction: column; - border-radius: 3px; - - } - - img{ - width: 100%; - display: flex; - margin: 0 auto; - height: 100% - ; - } - i{ - font-style: normal; - font-size: 18px; - margin-top: 8px; - color: #666666; - display: block; - - } - } - span{ - font-size: 0.16rem; - color: #666666; - text-overflow: -o-ellipsis-lastline; - overflow: hidden; - text-overflow: ellipsis; - display: -webkit-box; - -webkit-line-clamp: 2; - line-clamp: 2; - -webkit-box-orient: vertical; - word-break: break-all; - white-space: normal; - margin-top: 0.15rem; - height: 0.25rem; - } - strong{ - width: 130px; - height: 40px; - border: 2px solid #E2001A; - display: flex; - align-items: center; - justify-content: center; + ul li { + width: 130px; + height: 40px; + background: #ffffff; + border: 2px solid #D7D7D7; border-radius: 30px; - margin: 0 auto; + text-align: center; font-size: 14px; - margin-bottom: 0.32rem; - margin-top: 20px; - color: #E2001A; -margin-top: 20px; - } - .rc-click{ - max-height: 1.9rem; - min-height: 1.9rem; - } + display: flex; + align-items: center; + justify-content: center; + margin-left: 32px; + } + li:first-child{ + margin-left: 0; } } - //pc端 -@media screen and (min-width: 768px) and (max-width: 1920px) { - /deep/.el-dialog { - width: 920px; - height: 570px; - background: #FFFFFF; + .rc-product { + h2 { + font-size: 18px; + color: #333333; + margin-left: 12px; } - .rc-button{ - display: flex; - justify-content: center; - font-size: 16px; - width: 100%; - padding: 40px 0 40px 0; - span{ - width: 160px; - height: 48px; - border: 2px solid #E2001A; - border-radius: 30px; + } + .rc-productcat { display: flex; align-items: center; - justify-content: center; - color: #E2001A; - cursor: pointer; - } - em{ - font-style: normal; - width: 164px; - height: 48px; - background: #E2001A; - cursor: pointer; - border-radius: 30px; + flex-wrap: nowrap; + .rc-cat { + width: 327px; + height: 48px; + border-radius: 30px; + background: #ffffff; + border-radius: 100px; + display: flex; + align-items: center; + justify-content: center; + font-size: 14px; + &:last-child{ + margin-left: 16px; + } + span { + margin-left: 0px; + } + img { + width: 24px; + height: 16px; + } + + } + } + + .rc-productright { display: flex; align-items: center; - justify-content: center; - color: #FFFFFF; - margin-left: 40px; - } - } - .rc-bottom{ - .rc-cat{ - margin-top: 24px; - } - .rc-productcat { - display: flex; - align-items: center; - flex-wrap: nowrap; - .rc-cat { - width: 237px; - height: 48px; - border-radius: 30px; - background: #ffffff; - display: flex; - align-items: center; - justify-content: center; - margin-left: 16px; - font-size: 14px; - span { - margin-left: 3px; - } - - img { - width: 24px; - height: 16px; - } - - } - } - - - + img { + width: 24px; + height: 20px; + margin-left: 15px; } - .form-search { - display: none; + span { + font-size: 14px; + color: #666666; + margin-left: 8px; + } + } + .rc-max-width--xl{ + .rc-column { + i{ + font-size: 22px; } - .rc-title { - width: 100%; - display: flex; - align-items: center; - justify-content: space-between; - margin: 0 auto; - color: #333333; - margin-top: 12px; - h2 { - font-size: 18px; - color: #333333; - margin-left: 12px; - } - span { - font-size: 14px; - color: #666666; - border-bottom: 1px solid #666666; - display: block; - margin-right: 8px; - } - .rc-change{ - display: none; - } - } - - .rc-variety { - margin-top: 30px; - ul { - display: flex; - align-items: center; - flex-wrap: nowrap; - overflow: hidden; - width: 100%; - - - } - ul li { - width: 80px; - height: 32px; - background: #ffffff; - border: 1px solid #d7d7d7; - border-radius: 100px; - text-align: center; - font-size: 14px; - // color: #999999; - float: left; - line-height: 32px; - margin-left: 11px; - } - } - .rc-product { - margin-top: 30px; - h2 { - font-size: 18px; - color: #333333; - margin-left: 12px; - } - } - .rc-productcat { - display: flex; - align-items: center; - flex-wrap: nowrap; - .rc-cat { - width: 237px; - height: 48px; - border-radius: 30px; - background: #ffffff; - - border-radius: 100px; - display: flex; - align-items: center; - justify-content: center; - margin-left: 16px; - font-size: 14px; - span { - margin-left: 3px; - } - - img { - width: 24px; - height: 16px; - } - - } - } - - .rc-productright { - display: flex; - align-items: center; - img { - width: 24px; - height: 20px; - margin-left: 15px; - } - span { - font-size: 14px; - color: #666666; - margin-left: 8px; - } - } - - .rc-prefecture{ - display: flex; - margin-top: 47px; - h2{ - font-size: 20px; - color: #333333; - margin-left: 12px; - } - ol{ - display: flex; - align-items: center; - flex-wrap: nowrap; - font-size: 12px; - text-align: center; - width: 80%; - } - li{ - width: 130px; - height: 40px; - border: 2px solid #D7D7D7; - opacity: 1; - border-radius: 30px; - background: #FFFFFF; - line-height: 40px; - float: left; - margin-left: 40px; - color: #999999; - } - } - - .rc-contair{ - margin-top: 40px; - ul{ - text-align: center; - align-items: center; - flex-wrap: nowrap; - width: 100%; - overflow: hidden; - li{ - float: left; - width: 21%; - margin-top: 16px; - height: 560px; - background: #FFFFFF; - border: 1px solid #D7D7D7; - margin-left: 40px; - border-radius: 3px; - } - - img{ - width: 85px; - display: flex; - margin: 0 auto; - height: 114px - ; - } - i{ - font-style: normal; - font-size: 22px; - margin-top: 8px; - color: #666666; - display: block; - - } - } - span{ - overflow:hidden; - text-overflow:ellipsis; - -webkit-box-orient:vertical; - -webkit-line-clamp:2; - display: flex; - font-size: 30px; - color: #E2001A; - margin-top: 8px; - width: 256px; - text-align: center; - margin: 0 auto; - } - strong{ - width: 134px; - height: 40px; - border: 2px solid #E2001A; - display: flex; - align-items: center; - justify-content: center; - border-radius: 30px; - margin: 0 auto; - font-size: 14px; - color: #E2001A; - margin-top: 8px; - } - - .rc-rccontair{ - height:320px;display:flex;align-items: center - } - } - } \ No newline at end of file + } + } + } \ No newline at end of file diff --git a/rc-busness/assets/css/settlement.less b/rc-busness/assets/css/settlement.less index 99e0c647..12826929 100644 --- a/rc-busness/assets/css/settlement.less +++ b/rc-busness/assets/css/settlement.less @@ -41,7 +41,8 @@ color: #333333; } } .rc-main { - + width: 92%; + margin: 0 auto; .rc-userbottom{ display: none; } @@ -303,6 +304,8 @@ color: #333333; @media screen and (min-width: 768px) and (max-width: 1920px) { .rc-main { + width: 92%; + margin: 0 auto; .rc-userbottomm{ display: none; } diff --git a/rc-busness/assets/image/onloading.png b/rc-busness/assets/image/onloading.png new file mode 100644 index 00000000..e55f1645 Binary files /dev/null and b/rc-busness/assets/image/onloading.png differ diff --git a/rc-busness/assets/style/default.less b/rc-busness/assets/style/default.less new file mode 100644 index 00000000..530384c0 --- /dev/null +++ b/rc-busness/assets/style/default.less @@ -0,0 +1,78 @@ +* { + margin: 0; + padding: 0; +} + +html { + line-height: 160%; +} + +.rc_contline { + border-bottom: 3px solid #f6f6f6; + height: 0px; + margin: 0; + clear: both; +} + +.page_modules { + padding-top: 100px; +} + +.cont_modules { + margin: 0 auto; + max-width: 1400px; +} + +.inline_right { + display: flex; + justify-content: space-between; + width: 100%; +} + +.inline_mid { + display: flex; + justify-content: space-around; + width: 100%; +} + +.inline_left { + display: flex; + justify-content: space-evenly; + width: 100%; + +} + +.li_inline { + li { + display: inline-block; + vertical-align: middle; + } + +} + +.color_red { + color: #E2001A; +} + +.tc { + text-align: center; +} + +.tr { + text-align: right; +} +.el-dialog{ + width: 90%; + max-width: 440px; +} +#tns2-iw{ height: 90px;} +.rc-carousel:not(.rc-carousel--loaded){visibility:visible!important} +@media screen and (max-width: 768px) { + .el-message-box{ + width: 300px; + } + .el-dialog{ + width: 90%; + } + } + \ No newline at end of file diff --git a/rc-busness/components/header.vue b/rc-busness/components/header.vue index 14ef436a..3c121957 100644 --- a/rc-busness/components/header.vue +++ b/rc-busness/components/header.vue @@ -58,11 +58,6 @@ --> - - - translations.feature.headerbar.pin - - @@ -75,16 +70,16 @@
@@ -94,49 +89,49 @@
  • - 猫 + 猫
  • - 犬 + 犬
  • - 定制营养方案 + 定制营养方案
    • +