index.vue 22 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851
  1. <template>
  2. <view>
  3. <view class='shoppingCart copy-data'>
  4. <view class='nav acea-row row-between-wrapper'>
  5. <view>订单号:<text class='num'>{{ list.order_id }}</text></view>
  6. <view v-if="lets != 1" class='administrate acea-row row-center-wrapper' @click="switchs">切换</view>
  7. </view>
  8. <view class="content">
  9. <view class="list_top">共<span class="bluefont">{{ list.total_num }}</span>件<span class="garyfont">(已核销 {{ list.writeoff_count }} 件)</span>
  10. </view>
  11. <view class='list'>
  12. <view>
  13. <block v-for="(item,index) in list.cart_info" :key="index">
  14. <view v-if="item.is_writeoff == 1" class='item acea-row row-between-wrapper writeoff'>
  15. <div class="xuan q" type="checkbox" v-model="checkModel" :value="item.id">
  16. <view class="iconfont icon-duihao dui"></view>
  17. </div>
  18. <view class='picTxt acea-row row-between-wrapper'>
  19. <view class='pictrue'>
  20. <image :src="item.cart_info.productInfo.attrInfo?item.cart_info.productInfo.attrInfo.image:item.cart_info.productInfo.image" mode=""></image>
  21. </view>
  22. <view class='text'>
  23. <view class="title">
  24. <view class='line1 top' :class="item.attrStatus?'':'reColor'">
  25. {{ item.cart_info.productInfo.store_name }}
  26. </view>
  27. <view v-if="item.is_writeoff == 1" class="txt">已核销{{parseInt(lists.cart_info[index].cart_num-lists.cart_info[index].surplus_num)}}件</view>
  28. </view>
  29. <view class='infor line1'>
  30. 属性:{{ item.cart_info.productInfo.attrInfo.suk }}</view>
  31. <view class='money he'>
  32. <view>¥{{ item.cart_info.productInfo.attrInfo?item.cart_info.productInfo.attrInfo.price:item.cart_info.productInfo.price }}</view>
  33. <view v-if="item.is_writeoff == 1" class="txt">
  34. <view class='carnum acea-row row-center-wrapper'>
  35. <view class="reduce">-</view>
  36. <view class='num0'>0</view>
  37. <view class="plus">+</view>
  38. </view>
  39. </view>
  40. </view>
  41. </view>
  42. </view>
  43. </view>
  44. <view v-else class='item acea-row row-between-wrapper'>
  45. <!-- <input type="checkbox" v-model="checkModel" :value="item.id" :value="(item.id).toString()" :checked="item.checked" color="#007AFF"/> -->
  46. <div class="xuan" :class="item.checked?'q':''" type="checkbox" v-model="checkModel" :value="item.id" @click="dan(item.cart_id,index)">
  47. <view :class="item.checked?'iconfont icon-duihao dui':''"></view>
  48. </div>
  49. <view class='picTxt acea-row row-between-wrapper'>
  50. <view class='pictrue'>
  51. <image :src="item.cart_info.productInfo.attrInfo?item.cart_info.productInfo.attrInfo.image:item.cart_info.productInfo.image" mode=""></image>
  52. </view>
  53. <view class='text'>
  54. <view class="title">
  55. <view class='line1 top' :class="item.attrStatus?'':'reColor'">
  56. {{ item.cart_info.productInfo.store_name }}
  57. </view>
  58. <view v-if="item.is_writeoff == 1" class="txt">已核销</view>
  59. <view v-if="item.is_writeoff == 0 && lists.cart_info[index].surplus_num == lists.cart_info[index].cart_num" class="txt bluecol">未核销</view>
  60. <view v-if="item.is_writeoff == 0 && lists.cart_info[index].surplus_num != lists.cart_info[index].cart_num" class="txt orangcol">已核销{{parseInt(lists.cart_info[index].cart_num-lists.cart_info[index].surplus_num)}}件</view>
  61. </view>
  62. <!-- <view class='line1' :class="item.attrStatus?'':'reColor'">
  63. {{ item.cart_info.productInfo.store_name }}
  64. </view> -->
  65. <view class='infor line1'>
  66. 属性:{{ item.cart_info.productInfo.attrInfo.suk }}</view>
  67. <view class='money he'>
  68. <view>¥{{ item.cart_info.productInfo.attrInfo?item.cart_info.productInfo.attrInfo.price:item.cart_info.productInfo.price }}</view>
  69. <view v-if="item.is_writeoff == 1" class="txt">
  70. <view class='carnum acea-row row-center-wrapper'>
  71. <view class="reduce">-</view>
  72. <view class='num0'>0</view>
  73. <view class="plus">+</view>
  74. </view>
  75. </view>
  76. <view v-else class="txt">
  77. <view class='carnum acea-row row-center-wrapper'>
  78. <view v-if="item.surplus_num == 1" class="reduce bggary">-</view>
  79. <view v-else class="reduce" @click.stop='subCart(item,index)'>-</view>
  80. <!-- <view class='nums'>{{parseInt(item.surplus_num)}}</view> -->
  81. <input class="nums" type="number" v-model="item.surplus_num"
  82. data-name="surplus_num"
  83. @input="bindCode($event,item,index)"></input>
  84. <view v-if="item.surplus_num == parseInt(item.surplus_num)+parseInt(nums[index].num)" class="plus bggary">+</view>
  85. <view v-else class="plus" @click.stop='addCart(item,index)'>+</view>
  86. </view>
  87. </view>
  88. </view>
  89. </view>
  90. </view>
  91. </view>
  92. </block>
  93. </view>
  94. </view>
  95. </view>
  96. <view class='footer acea-row row-between-wrapper'>
  97. <view>
  98. <view style="display: flex;" @change="checkboxAllChange">
  99. <!-- <input type="checkbox" @click="checkboxAllChange" v-model="isAllSelect"> -->
  100. <div class="xuan" :class="checked?'q':''" @click="checkAll" v-model="checked">
  101. <view class="iconfont icon-duihao dui"></view>
  102. </div>
  103. <text class='checkAll'>全选</text>
  104. </view>
  105. </view>
  106. <view>
  107. <button class='money' type="primary" @click="verification">立即核销</button>
  108. </view>
  109. </view>
  110. </view>
  111. <view v-if="box">
  112. <view class="box">
  113. <view class="small_box">
  114. <image src="../../../static/decorate.png" mode=""></image>
  115. <view class="content">
  116. <view class="font">核销成功</view>
  117. <view v-if="list.total_num == parseInt(list.writeoff_count)+writeOffNum" class="small_font">当前订单已完成核销</view>
  118. <view v-else class="small_font">当前订单仍有未核销商品</view>
  119. </view>
  120. <view v-if="lets == 1 && list.total_num == parseInt(list.writeoff_count)+writeOffNum" class="btn" @click="ok(1)">好的</view>
  121. <view v-if="list.total_num != parseInt(list.writeoff_count)+writeOffNum" class="btn" @click="ok(0)">继续核销其他商品</view>
  122. <navigator v-if="lets > 1 && list.total_num == parseInt(list.writeoff_count)+writeOffNum" :url='"/pages/admin/store/scanning/index?code="+attr.code' open-type="redirect" hover-class='none' class="btn">核销其他订单</navigator>
  123. <navigator v-if="lets > 1 && list.total_num != parseInt(list.writeoff_count)+writeOffNum" :url='"/pages/admin/store/scanning/index?code="+attr.code' hover-class='none' open-type="redirect" class="btn_no">返回列表</navigator>
  124. <navigator v-if="(lets > 1 && list.total_num == parseInt(list.writeoff_count)+writeOffNum)||(lets==1&&list.total_num != parseInt(list.writeoff_count)+writeOffNum)" url="/pages/admin/store/index" hover-class='none' open-type="redirect" class="btn_no">返回首页</navigator>
  125. </view>
  126. </view>
  127. </view>
  128. <writeOffSwitching ref="writeOff" :attr="attr" :isShow='1' :iSplus='1' :iScart='1' @dataId = "onDataId" @myevent="onMyEvent" id='product-window'></writeOffSwitching>
  129. </view>
  130. </template>
  131. <script>
  132. import writeOffSwitching from '../../../components/writeOffSwitching/index.vue';
  133. import { orderCartInfo, orderWriteoff } from '@/api/admin'
  134. export default {
  135. components: {
  136. writeOffSwitching
  137. },
  138. data() {
  139. return {
  140. nums:[],
  141. newList:[],
  142. reduce_show:-1,
  143. plus_show:-1,
  144. ids: [],//选定需要核销的id
  145. lets: 0, //判断订单的数量
  146. listlet: 0, //判断订单商品的数量
  147. attr: { //切换组件传值
  148. cartAttr: false,
  149. id: [],
  150. code: '',
  151. type: 0
  152. },
  153. id: 0, //订单ID
  154. list: [],
  155. lists: [],
  156. lengt: 0,
  157. box: false,
  158. checked: false,
  159. checkModel: [],
  160. isAllSelect: false,
  161. data:[{id:'1',value:'aaa'},{id:'2',value:'bbb'},{id:'3',value:'ccc'}],
  162. writeOffNum:0 //每次核销商品数量
  163. };
  164. },
  165. watch:{
  166.   checkModel(){
  167.     if(this.lengt==this.checkModel.length){
  168.       this.checked=true;
  169.     }else{
  170.       this.checked=false;
  171.     }
  172.   }
  173. },
  174. onLoad: function(options) {
  175. this.id = options.id
  176. this.attr.code = options.code
  177. this.lets = options.let
  178. this.getList(this.id)
  179. },
  180. onShow: function() {
  181. },
  182. methods: {
  183. bindCode: function(e,item,index) {
  184. let value = e.target.value
  185. if(item.surplus_num == '' || item.surplus_num == undefined || item.surplus_num<1){
  186. this.list.cart_info[index].surplus_num = 1;
  187. }
  188. if(value>=item.cart_num){
  189. this.$nextTick(function(){
  190. this.list.cart_info[index].surplus_num = item.cart_num;
  191. })
  192. }
  193. this.$nextTick(function(){
  194. this.nums[index].num = parseInt(item.surplus_num) - parseInt(item.cart_num)
  195. })
  196. },
  197. //处理每一条数据的最大值
  198. num(){
  199. for (let index = 0; index < this.lists.cart_info.length; index++) {
  200. this.nums.push({ num: 0 });
  201. }
  202. },
  203. subCart(item,index){
  204. if(item.surplus_num == 1) {
  205. this.reduce_show = index;
  206. }else{
  207. this.nums[index].num --
  208. item.surplus_num--
  209. }
  210. },
  211. addCart(item,index){
  212. if(item.surplus_num == item.surplus_num+this.nums[index].num) {
  213. this.plus_show = index;
  214. }
  215. else{
  216. item.surplus_num++
  217. this.nums[index].num ++
  218. }
  219. },
  220. checkAll(){
  221. var items = this.list.cart_info,
  222. data = [];
  223.     if(this.checked){
  224.       this.checkModel=[];
  225. for (var i = 0, lenI = this.list.cart_info.length; i < lenI; ++i) {
  226. const item = items[i]
  227. this.$set(item,'checked',false)
  228. }
  229.     }else{
  230. this.checkModel=[];
  231. for (var i = 0, lenI = this.list.cart_info.length; i < lenI; ++i) {
  232. const item = items[i]
  233. this.$set(item,'checked',true)
  234. if(item.is_writeoff == 1){
  235. this.checkModel =this.checkModel.filter(item => item != item.cart_id)
  236. }else{
  237. this.checkModel.push(item.cart_id)
  238. }
  239. }
  240. this.lengt = this.checkModel.length
  241.     }
  242.   },
  243. dan(id,index){
  244. if(this.checkModel.indexOf(id) == -1){
  245. this.$set(this.list.cart_info[index],'checked',true)
  246. this.checkModel.push(id)
  247. }
  248. else{
  249. this.$set(this.list.cart_info[index],'checked',false)
  250. this.checkModel =this.checkModel.filter(item => item != id)
  251. }
  252. },
  253. getList:function(id) {
  254. orderCartInfo(1,{oid:id}).then(res=>{
  255. this.list = res.data
  256. this.lists = JSON.parse(JSON.stringify(res.data))
  257. this.listlet = res.data.cart_info.length
  258. this.$set(this.attr, 'id',this.list.id);
  259. this.checkAll()
  260. this.num()
  261. })
  262. },
  263. onDataId: function(id) {
  264. this.nums.forEach((item)=>{
  265. item.num = 0
  266. })
  267. this.id = id;
  268. this.getList(id);
  269. },
  270. switchs(){
  271. this.attr.cartAttr = true;
  272. this.$refs.writeOff.getList(1)
  273. },
  274. onMyEvent(){
  275. this.attr.cartAttr = false;
  276. },
  277. verification(){
  278. let that = this
  279. let obj = {};
  280. // 将数组转化为对象
  281. for (let key in this.checkModel) {
  282. obj[key] = this.checkModel[key];
  283. };
  284. let newObj = Object.keys(obj).map(val => ({
  285. cart_id: obj[val],
  286. }));
  287. //处理列表内对应的核销数的数值
  288. for(var i =0 ;i<newObj.length;i++){
  289. for(var j = 0; j< this.list.cart_info.length;j++){
  290. if(newObj[i].cart_id == this.list.cart_info[j].cart_id){
  291. newObj[i].cart_num= this.list.cart_info[j].surplus_num;
  292. }
  293. }
  294. }
  295. this.newList = newObj
  296. if(that.checkModel.length == 0){
  297. that.$util.Tips({
  298. title: '请选择商品'
  299. });
  300. }else{
  301. uni.showLoading({
  302. title: '加载中',
  303. });
  304. let num = 0;
  305. newObj.forEach((item)=>{
  306. num = num+ parseInt(item.cart_num)
  307. })
  308. this.writeOffNum = num;
  309. setTimeout(function () {
  310. orderWriteoff(1,{oid:that.id,cart_ids:that.newList}).then(res=>{
  311. uni.hideLoading();
  312. that.box = true
  313. }).catch(err=>{
  314. that.$util.Tips({
  315. title: err
  316. });
  317. uni.hideLoading();
  318. })
  319. }, 1000);
  320. }
  321. },
  322. // 所有订单核销完成
  323. ok(type){
  324. this.box = false
  325. this.nums.forEach((item)=>{
  326. item.num = 0
  327. })
  328. this.getList(this.id)
  329. if(type){
  330. uni.redirectTo({
  331. url:'/pages/admin/store/index'
  332. })
  333. }
  334. // this.$router.go(0);
  335. }
  336. }
  337. }
  338. </script>
  339. <style scoped lang="scss">
  340. /deep/checkbox .uni-checkbox-input.uni-checkbox-input-checked{
  341. border: 1px solid #007aff !important;
  342. background-color: #007aff !important;
  343. }
  344. .bggary{
  345. background-color: #dfdfdf;
  346. }
  347. .page-footer {
  348. position: fixed;
  349. bottom: 0;
  350. z-index: 30;
  351. display: flex;
  352. align-items: center;
  353. justify-content: space-around;
  354. width: 100%;
  355. height: calc(98upx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
  356. height: calc(98upx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
  357. box-sizing: border-box;
  358. border-top: solid 1upx #F3F3F3;
  359. background-color: #fff;
  360. box-shadow: 0px 0px 17upx 1upx rgba(206, 206, 206, 0.32);
  361. padding-bottom: constant(safe-area-inset-bottom); ///兼容 IOS<11.2/
  362. padding-bottom: env(safe-area-inset-bottom); ///兼容 IOS>11.2/
  363. .foot-item {
  364. display: flex;
  365. width: max-content;
  366. align-items: center;
  367. justify-content: center;
  368. flex-direction: column;
  369. position: relative;
  370. .count-num {
  371. position: absolute;
  372. display: flex;
  373. justify-content: center;
  374. align-items: center;
  375. width: 40upx;
  376. height: 40upx;
  377. top: 0upx;
  378. right: -15upx;
  379. color: #fff;
  380. font-size: 20upx;
  381. background-color: #FD502F;
  382. border-radius: 50%;
  383. padding: 4upx;
  384. }
  385. }
  386. .foot-item image {
  387. height: 50upx;
  388. width: 50upx;
  389. text-align: center;
  390. margin: 0 auto;
  391. }
  392. .foot-item .txt {
  393. font-size: 24upx;
  394. &.active {}
  395. }
  396. }
  397. .shoppingCart {
  398. /* #ifdef H5 */
  399. // padding-bottom: 0;
  400. // padding-bottom: constant(safe-area-inset-bottom);
  401. // padding-bottom: env(safe-area-inset-bottom);
  402. /* #endif */
  403. }
  404. .shoppingCart .labelNav {
  405. height: 76upx;
  406. padding: 0 30upx;
  407. font-size: 22upx;
  408. color: #8c8c8c;
  409. position: fixed;
  410. left: 0;
  411. width: 100%;
  412. box-sizing: border-box;
  413. background-color: #f5f5f5;
  414. z-index: 5;
  415. top: 0;
  416. }
  417. .shoppingCart .labelNav .item .iconfont {
  418. font-size: 25upx;
  419. margin-right: 10upx;
  420. }
  421. .shoppingCart .nav {
  422. // width: 100%;
  423. background-color: #fff;
  424. margin: 20upx 28upx;
  425. padding: 30upx 24upx;
  426. font-size: 28upx;
  427. color: #282828;
  428. z-index: 5;
  429. border-radius: 12upx;
  430. }
  431. .shoppingCart .nav .num {
  432. margin-left: 12upx;
  433. }
  434. .shoppingCart .nav .administrate {
  435. font-size: 26upx;
  436. color: #282828;
  437. width: 110upx;
  438. height: 46upx;
  439. border-radius: 24upx;
  440. border: 1px solid #CCCCCC;
  441. }
  442. .shoppingCart .noCart {
  443. margin-top: 171upx;
  444. background-color: #fff;
  445. padding-top: 0.1upx;
  446. }
  447. .shoppingCart .noCart .pictrue {
  448. width: 414upx;
  449. height: 336upx;
  450. margin: 78upx auto 56upx auto;
  451. }
  452. .shoppingCart .noCart .pictrue image {
  453. width: 100%;
  454. height: 100%;
  455. }
  456. .shoppingCart .list {
  457. // margin: 20upx 28upx;
  458. }
  459. .shoppingCart .list .item {
  460. padding: 25upx 30upx;
  461. background-color: #fff;
  462. // margin-bottom: 15upx;
  463. }
  464. .shoppingCart .list .item .picTxt {
  465. // width: 627upx;
  466. position: relative;
  467. }
  468. .shoppingCart .list .item .picTxt .pictrue {
  469. width: 132upx;
  470. height: 132upx;
  471. }
  472. .shoppingCart .list .item .picTxt .pictrue image {
  473. width: 100%;
  474. height: 100%;
  475. border-radius: 6upx;
  476. }
  477. .shoppingCart .list .item .picTxt .text {
  478. width: 420upx;
  479. font-size: 28upx;
  480. color: #282828;
  481. margin-left: 20upx;
  482. }
  483. .shoppingCart .list .item .picTxt .text .reColor {
  484. color: #999;
  485. width: 80%;
  486. }
  487. .shoppingCart .list .item .picTxt .text .title {
  488. display: flex;
  489. justify-content: space-between;
  490. font-size: 20upx;
  491. font-weight: 600;
  492. .bluecol{
  493. color: #1890FF;
  494. }
  495. .orangcol{
  496. color: #FF7E00;
  497. }
  498. .graycol{
  499. color: #CCCCCC;
  500. }
  501. }
  502. .shoppingCart .list .item .picTxt .text .title .top {
  503. width: 70%;
  504. white-space: nowrap;
  505. overflow: hidden;
  506. text-overflow: ellipsis;
  507. white-space: nowrap;
  508. font-size: 28upx;
  509. font-weight: 400;
  510. }
  511. .shoppingCart .list .item .picTxt .text .reElection {
  512. margin-top: 20upx;
  513. }
  514. .shoppingCart .list .item .picTxt .text .reElection .title {
  515. font-size: 24upx;
  516. }
  517. .shoppingCart .list .item .picTxt .text .reElection .reBnt {
  518. width: 120upx;
  519. height: 46upx;
  520. border-radius: 23upx;
  521. font-size: 26upx;
  522. }
  523. .shoppingCart .list .item .picTxt .text .infor {
  524. font-size: 24upx;
  525. color: #868686;
  526. margin-top: 8upx;
  527. }
  528. .shoppingCart .list .item .picTxt .text .money {
  529. font-size: 30upx;
  530. color: #282828;
  531. margin-top: 20upx;
  532. font-weight: 600;
  533. font-family: PingFangSC-Semibold, PingFang SC;
  534. }
  535. .shoppingCart .list .item .picTxt .carnum {
  536. height: 47upx;
  537. position: absolute;
  538. bottom: 7upx;
  539. right: 0;
  540. }
  541. .shoppingCart .list .item .picTxt .carnum view {
  542. border: 1upx solid #a4a4a4;
  543. width: 66upx;
  544. text-align: center;
  545. height: 100%;
  546. line-height: 40upx;
  547. font-size: 28upx;
  548. color: #a4a4a4;
  549. }
  550. .shoppingCart .list .item .picTxt .carnum .reduce {
  551. border-right: 0;
  552. border-radius: 30upx 0 0 30upx;
  553. }
  554. .shoppingCart .list .item .picTxt .carnum .reduce.on {
  555. border-color: #e3e3e3;
  556. color: #dedede;
  557. }
  558. .shoppingCart .list .item .picTxt .carnum .plus {
  559. border-left: 0;
  560. border-radius: 0 30upx 30upx 0;
  561. }
  562. .shoppingCart .list .item .picTxt .carnum .num {
  563. color: #282828;
  564. }
  565. .shoppingCart .list .item .picTxt .carnum .num0 {
  566. color: #a4a4a4;
  567. }
  568. .shoppingCart .list .item .picTxt .carnum .nums {
  569. color: #282828;
  570. width: 66rpx;
  571. text-align: center;
  572. height: 40rpx;
  573. border: 1rpx solid #a4a4a4;
  574. }
  575. .shoppingCart .invalidGoods {
  576. background-color: #fff;
  577. }
  578. .shoppingCart .invalidGoods .goodsNav {
  579. width: 100%;
  580. height: 66upx;
  581. padding: 0 30upx;
  582. box-sizing: border-box;
  583. font-size: 28upx;
  584. color: #282828;
  585. }
  586. .shoppingCart .invalidGoods .goodsNav .iconfont {
  587. color: #424242;
  588. font-size: 28upx;
  589. margin-right: 17upx;
  590. }
  591. .shoppingCart .invalidGoods .goodsNav .del {
  592. font-size: 26upx;
  593. color: #999;
  594. }
  595. .shoppingCart .invalidGoods .goodsNav .del .icon-shanchu1 {
  596. color: #999;
  597. font-size: 33upx;
  598. vertical-align: -2upx;
  599. margin-right: 8upx;
  600. }
  601. .shoppingCart .invalidGoods .goodsList .item {
  602. padding: 20upx 30upx;
  603. border-top: 1upx solid #f5f5f5;
  604. }
  605. .shoppingCart .invalidGoods .goodsList .item .invalid {
  606. font-size: 22upx;
  607. color: #fff;
  608. width: 70upx;
  609. height: 36upx;
  610. background-color: #aaa;
  611. border-radius: 3upx;
  612. text-align: center;
  613. line-height: 36upx;
  614. }
  615. .shoppingCart .invalidGoods .goodsList .item .pictrue {
  616. width: 140upx;
  617. height: 140upx;
  618. }
  619. .shoppingCart .invalidGoods .goodsList .item .pictrue image {
  620. width: 100%;
  621. height: 100%;
  622. border-radius: 6upx;
  623. }
  624. .shoppingCart .invalidGoods .goodsList .item .text {
  625. width: 433upx;
  626. font-size: 28upx;
  627. color: #999;
  628. height: 140upx;
  629. }
  630. .shoppingCart .invalidGoods .goodsList .item .text .name {
  631. width: 100%;
  632. }
  633. .shoppingCart .invalidGoods .goodsList .item .text .infor {
  634. font-size: 24upx;
  635. }
  636. .shoppingCart .invalidGoods .goodsList .item .text .end {
  637. font-size: 26upx;
  638. color: #bbb;
  639. }
  640. .shoppingCart .footer {
  641. // z-index: 999;
  642. width: 100%;
  643. height: 100upx;
  644. background-color: #fafafa;
  645. position: fixed;
  646. padding: 0 30upx;
  647. box-sizing: border-box;
  648. border-top: 1upx solid #eee;
  649. bottom: 0upx;
  650. }
  651. .shoppingCart .footer.on {
  652. // #ifndef H5
  653. bottom: 0upx;
  654. // #endif
  655. }
  656. .shoppingCart .footer .checkAll {
  657. font-size: 28upx;
  658. color: #282828;
  659. margin-left: 16upx;
  660. }
  661. // .shoppingCart .footer checkbox .wx-checkbox-input{background-color:#fafafa;}
  662. .shoppingCart .footer .money {
  663. font-size: 30upx;
  664. width: 214upx;
  665. height: 70upx;
  666. background: #1890FF;
  667. border-radius: 50upx;
  668. font-weight: 400;
  669. color: #FFFFFF;
  670. line-height: 70upx;
  671. }
  672. .shoppingCart .footer .placeOrder {
  673. color: #fff;
  674. font-size: 30upx;
  675. width: 226upx;
  676. height: 70upx;
  677. border-radius: 50upx;
  678. text-align: center;
  679. line-height: 70upx;
  680. margin-left: 22upx;
  681. }
  682. .shoppingCart .footer .button .bnt {
  683. font-size: 28upx;
  684. color: #999;
  685. border-radius: 50upx;
  686. border: 1px solid #999;
  687. width: 160upx;
  688. height: 60upx;
  689. text-align: center;
  690. line-height: 60upx;
  691. }
  692. .shoppingCart .footer .button form~form {
  693. margin-left: 17upx;
  694. }
  695. .uni-p-b-96 {
  696. height: 96upx;
  697. }
  698. </style>
  699. <style scoped lang="scss">
  700. .writeoff{
  701. opacity: 0.6;
  702. }
  703. .he{
  704. display: flex;
  705. justify-content: space-between;
  706. .txt{
  707. font-size: 22upx;
  708. }
  709. }
  710. .xuan{
  711. width: 40upx;
  712. height: 40upx;
  713. border: 2upx solid #CCCCCC;
  714. border-radius: 30upx;
  715. }
  716. .noxuan{
  717. cursor: not-allowed;
  718. }
  719. .q{background-color: #4276F6;line-height: 40upx;color: #FFF; font-size:24upx;text-align: center;}
  720. .dui{line-height: 40upx;color: #FFF; font-size:24upx;text-align: center;}
  721. .box{
  722. position: fixed;
  723. top: 0;
  724. bottom: 0;
  725. width: 100%;
  726. height: 100%;
  727. z-index: 10;
  728. background-color: #78797a;
  729. .small_box{
  730. padding-bottom: 46upx;
  731. width: 480upx;
  732. background: #FFFFFF;
  733. border-radius: 12upx;
  734. margin-top: 360upx;
  735. margin-left: 136upx;
  736. image{width: 100%;height: 228upx;}
  737. .content{
  738. // height: 200upx;
  739. text-align: center;
  740. .font{
  741. margin-top: 52upx;
  742. margin-bottom: 8upx;
  743. font-size: 36upx;
  744. font-weight: 600;
  745. color: #333333;
  746. }
  747. .small_font{
  748. font-size: 28upx;
  749. font-weight: 400;
  750. color: #666666;
  751. margin-bottom: 50upx;
  752. }
  753. }
  754. .btn{
  755. width: 398upx;
  756. margin: 0 auto;
  757. text-align: center;
  758. height: 80upx;
  759. line-height: 80upx;
  760. font-size: 30upx;
  761. color: #FFFFFF;
  762. background: linear-gradient(270deg, #4276F6 0%, #00ACF8 100%);
  763. border-radius: 20px;
  764. }
  765. .btn_no{
  766. color: #999999;
  767. margin-top: 28upx;
  768. text-align: center;
  769. font-size: 30upx;
  770. }
  771. }
  772. }
  773. .shoppingCart .content{
  774. margin: 20upx 28upx;
  775. border-radius: 12upx;
  776. margin-bottom: 200upx;
  777. .list_top{
  778. background-color: #FFFFFF;
  779. font-size: 28upx;
  780. color: #333333;
  781. height: 90upx;
  782. line-height: 90upx;
  783. padding-left: 24upx;
  784. border-bottom: 2upx solid #EEEEEE;
  785. .bluefont{color: #1890FF;display: inline-block;margin: 0upx 10upx;}
  786. .garyfont{color: #999999;}
  787. }
  788. }
  789. </style>