index2.vue 28 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323
  1. <template>
  2. <view class="pages" :style="{'min-height':h+'px','padding-top':(mt)+'px'}">
  3. <c-nav-bar title="商品管理"></c-nav-bar>
  4. <view class="tb">
  5. <view class="tabs">
  6. <view v-for="(item,index) in tabList" :key="index" @tap="changeTab1(index)">
  7. <text :class="index==current?'active':''">{{item.name}}</text>
  8. <text v-if="index==current">({{roomType.length}})</text>
  9. </view>
  10. </view>
  11. </view>
  12. <!-- 房型数量 -->
  13. <view class="">
  14. <view class="typeNum">
  15. <view class="left" style="font-size: 24rpx; color: #777;" @click="areaShowed()">
  16. <text :class="areaShow==true?'active':''" style="margin-right: 20rpx;">上架时间</text>
  17. <u-icon name="arrow-down-fill" bold='true' v-if="areaShow==false" size="20" labelPos="left"
  18. labelSize="26"></u-icon>
  19. <u-icon name="arrow-up-fill" bold='true' v-else color="#007a68" labelColor='#007a68' size="20"
  20. labelPos="left" labelSize="26"></u-icon>
  21. </view>
  22. <view class="right" @click="showList">
  23. <view class="image">
  24. <image src="https://i.ringzle.com/file/20240313/f3d301b3bc4544ffaf5a0d96a761dd00.png" mode="">
  25. </image>
  26. </view>
  27. <view class="text">
  28. 批量操作
  29. </view>
  30. </view>
  31. </view>
  32. <!-- 区域筛选 -->
  33. <view class="contented" :style="{'height':(h-mt)+'px'}" v-show="areaShow">
  34. <view class="custom_popup">
  35. <view class="types">
  36. <view class="pricequjian" style="height: 240rpx;">
  37. <view class="jiage" v-for="(item, index) in list1" :key="index"
  38. @click="clickareaShow(item, index)">
  39. <view class="contentpeice">
  40. <view class="title" :class="{'Doublactive': areaShowIndex == index}">
  41. {{item.name}}
  42. </view>
  43. <view class="image" v-if="areaShowIndex == index">
  44. <image
  45. src="https://i.ringzle.com/file/20240316/16dd69efb40242de83da8207539ec73e.png"
  46. mode=""></image>
  47. </view>
  48. </view>
  49. </view>
  50. </view>
  51. </view>
  52. </view>
  53. </view>
  54. </view>
  55. <!-- 房型选择 -->
  56. <!-- <view class="type" v-for="(item,index) in roomType" :key="index">
  57. <view class="left" v-if="Selected==true">
  58. <view class="image">
  59. <image @tap="selectPerson(item,index)"
  60. :src="selectedTags.includes(item)?'https://i.ringzle.com/file/20240228/c741a340e19642c59473e6f4a6d2f4be.png':'https://i.ringzle.com/file/20231027/db588133d67548fc82dfb0d128eac9a8.png'">
  61. </image>
  62. </view>
  63. </view>
  64. <view style="width: 100%;">
  65. <view class="right">
  66. <view class="right-left">
  67. <image :src="item.coverImg" mode=""></image>
  68. </view>
  69. <view class="right-right">
  70. <view class="top">
  71. <text style="font-size: 30rpx; color: #333;">{{item.name||item.goodsName}}</text>
  72. </view>
  73. <view class="under">
  74. <view style="font-size: 24rpx; color: #777;">销量:{{item.salesVolume||item.soldNum}}</view>
  75. <view style="font-size: 36rpx; color: #FF4141; font-weight: Bold; margin-top: 16rpx;">
  76. ¥{{item.discountPrice||item.normalPrice}}</view>
  77. </view>
  78. </view>
  79. </view>
  80. <view class="type-btn">
  81. <view class="type-btn-left">
  82. </view>
  83. <view class="type-btn-right">
  84. <view class="" @click="shanchu(item,index)">
  85. 删除
  86. </view>
  87. <view class="" @click="gaijia(item,index)">
  88. 改价格
  89. </view>
  90. <view v-if="canyinmeishi" class="" @click="xiajia(item,index)">
  91. {{fromData.status==0?'下架':'上架'}}
  92. </view>
  93. <view v-if="!canyinmeishi" class="" @click="xiajia1(item,index)">
  94. {{fromData.status==0?'上架':'下架'}}
  95. </view>
  96. </view>
  97. </view>
  98. </view>
  99. </view> -->
  100. <!-- 房型选择 -->
  101. <view class="type" v-for="item,index in roomType" :key="index">
  102. <view class="left" v-if="Selected==true">
  103. <view class="image">
  104. <image @tap="selectPerson(item,index)"
  105. :src="selectedTags.includes(item)?'https://i.ringzle.com/file/20240228/c741a340e19642c59473e6f4a6d2f4be.png':'https://i.ringzle.com/file/20231027/db588133d67548fc82dfb0d128eac9a8.png'">
  106. </image>
  107. </view>
  108. </view>
  109. <!-- <view @click="goEditTypeInfo(item.houseBaseId)" style="width: 100%;"> -->
  110. <view style="width: 100%;">
  111. <view class="right">
  112. <view class="right-left">
  113. <image :src="item.cover" mode=""></image>
  114. </view>
  115. <view class="right-right">
  116. <view class="top">
  117. <text style="font-size: 30rpx; color: #333;">{{item.comboName}}</text>
  118. </view>
  119. <view class="under">
  120. <view style="font-size: 24rpx; color: #777;">销量:{{item.saleNums}}</view>
  121. <view style="font-size: 36rpx; color: #FF4141; font-weight: Bold; margin-top: 16rpx;">
  122. ¥{{item.price}}</view>
  123. </view>
  124. </view>
  125. </view>
  126. <view class="type-btn">
  127. <view class="type-btn-left">
  128. </view>
  129. <view class="type-btn-right">
  130. <view class="" @click="del(item)">
  131. 删除
  132. </view>
  133. <view @click="gaijia(item,index)">
  134. 改价格
  135. </view>
  136. <view class="" @click="Undered(item)" v-if="item.status==1">
  137. 下架
  138. </view>
  139. <view class="" @click="Undered(item)" v-else>
  140. 上架
  141. </view>
  142. </view>
  143. </view>
  144. </view>
  145. </view>
  146. <!-- 批量按钮 -->
  147. <view class="btn-btn" v-if="Selected==true">
  148. <view class="bottom-btn">
  149. <view class="left">
  150. <view class="image">
  151. <image
  152. :src="selectedTags.length>0?'https://i.ringzle.com/file/20240228/c741a340e19642c59473e6f4a6d2f4be.png':'https://i.ringzle.com/file/20231027/db588133d67548fc82dfb0d128eac9a8.png'">
  153. </image>
  154. </view>
  155. <view class="text">
  156. 已选:{{selectedTags.length}}
  157. </view>
  158. </view>
  159. <view class="right">
  160. <view v-if="canyinmeishi" class="right-btn" @click="piliangxiajia">
  161. {{fromData.status==0?'批量下架':'批量上架'}}
  162. </view>
  163. <view v-if="!canyinmeishi" class="right-btn" @click="piliangxiajia">
  164. {{fromData.status==0?'批量上架':'批量下架'}}
  165. </view>
  166. <view class="right-btn" @click="piliangshanchu">
  167. 批量删除
  168. </view>
  169. </view>
  170. </view>
  171. </view>
  172. <!-- 新增按钮 -->
  173. <view class="btn-btn" @click="addType()" v-else>
  174. <view class="btn">
  175. 添加商品
  176. </view>
  177. </view>
  178. <!-- 改价弹出框 -->
  179. <u-popup :show="showPricing" @close="closegaijia" @open="opengaijia" :round="10">
  180. <view class="gaijiadiv">
  181. <view class="toubu">
  182. 改价格
  183. <view class="toubux" @click="closegaijia">
  184. <u-icon name="close" color="#000000" size="40"></u-icon>
  185. </view>
  186. </view>
  187. <view class="jiainput">
  188. <u--input type='number' v-model="newprice" placeholder="请输入价格" border="surround"
  189. clearable></u--input>
  190. </view>
  191. <view class="queding">
  192. <view class="queding1" @click="closegaijia">
  193. 取消
  194. </view>
  195. <view class="queding2" @click="quedingjiae">
  196. 确定
  197. </view>
  198. </view>
  199. </view>
  200. </u-popup>
  201. <u-popup :show="showPricing" @close="close" :round="30">
  202. <view class="pop-pop">
  203. <view class="hander-one">
  204. <view class="image">
  205. <image src="https://i.ringzle.com/file/20240317/fdb4de4c4413429bb5a98b3f6c2bd856.png" mode="">
  206. </image>
  207. </view>
  208. <view class="text">
  209. <view class="text1">
  210. 删除选中的商品
  211. </view>
  212. <view class="text2">
  213. 删除后的商品不可在前台继续售卖,是否继续
  214. </view>
  215. </view>
  216. </view>
  217. <view class="hander-two">
  218. <view class="pop-btn-del" @click="showPricing=false">
  219. 取消
  220. </view>
  221. <view class="pop-btn-add" @click="GoOndel()">
  222. 继续提交
  223. </view>
  224. </view>
  225. </view>
  226. </u-popup>
  227. <u-popup :show="showPricingUnder" @close="close" :round="30">
  228. <view class="pop-pop">
  229. <view class="hander-one">
  230. <view class="image">
  231. <image src="https://i.ringzle.com/file/20240317/fdb4de4c4413429bb5a98b3f6c2bd856.png" mode="">
  232. </image>
  233. </view>
  234. <view class="text">
  235. <view class="text1" v-if="Shelves==false">
  236. 下架选中的商品
  237. </view>
  238. <view class="text1" v-else>
  239. 上架选中的商品
  240. </view>
  241. <view class="text2" v-if="Shelves==false">
  242. 下架后商品不可在前台继续售卖,是否继续?
  243. </view>
  244. <view class="text2" v-else>
  245. 确定上架售卖吗?是否继续?
  246. </view>
  247. </view>
  248. </view>
  249. <view class="hander-two">
  250. <view class="pop-btn-del" @click="showPricingUnder=false">
  251. 取消
  252. </view>
  253. <view class="pop-btn-add" @click="GoOnUnder()">
  254. 继续提交
  255. </view>
  256. </view>
  257. </view>
  258. </u-popup>
  259. <view class="mainContain">
  260. <!-- <view class="nodata" v-if='dataList.length==0'>
  261. <NoData></NoData>
  262. </view> -->
  263. </view>
  264. <u-toast ref="uToast"></u-toast>
  265. </view>
  266. </template>
  267. <script>
  268. import TopTabs from '@/components/TopTabs/topTabs.vue';
  269. // import NoData from '../../components/NoData/index.vue';
  270. export default {
  271. components: {
  272. TopTabs,
  273. // NoData
  274. },
  275. data() {
  276. return {
  277. h: uni.getSystemInfoSync().windowHeight,
  278. mt: uni.getSystemInfoSync().statusBarHeight + 44,
  279. newprice: '',
  280. lsdata: {},
  281. canyinmeishi: false,
  282. xiajiashow: false,
  283. xiajiashow1: false,
  284. shanchushow: false,
  285. tabList: [],
  286. homestayId: uni.getStorageSync('homestayId') || 0,
  287. roomType: [],
  288. selectedTags: [],
  289. mytotal: 0,
  290. isSelect: false,
  291. Selected: false,
  292. showPricing: false,
  293. areaShow: false,
  294. list1: [{
  295. name: '创建时间',
  296. id: 1,
  297. },
  298. {
  299. name: '价格从高到低',
  300. id: 2,
  301. },
  302. {
  303. name: '价格从低到高',
  304. id: 4,
  305. },
  306. {
  307. name: '销量从高到低',
  308. id: 2,
  309. },
  310. ],
  311. areaShowIndex: null,
  312. current: 0,
  313. tabList: [{
  314. name: '出售中'
  315. },
  316. {
  317. name: '待上架'
  318. },
  319. ],
  320. homestayId: uni.getStorageSync('homestayId') || 0,
  321. roomType: [],
  322. isSelect: false,
  323. Selected: false,
  324. showPricing: false,
  325. showPricingUnder: false,
  326. Shelves: false,
  327. areaShow: false,
  328. areaShowIndex: null,
  329. fromData: {
  330. homestayId: uni.getStorageSync('homestayId'),
  331. limit: 10,
  332. page: 1,
  333. order: '',
  334. orderField: "",
  335. status: 1
  336. },
  337. ids: [],
  338. obj: {}
  339. }
  340. },
  341. onLoad(option) {
  342. this.canyinmeishi = true;
  343. this.tabList = [{
  344. name: '出售中',
  345. id: 0
  346. },
  347. {
  348. name: '待上架',
  349. id: 1
  350. },
  351. ]
  352. this.getRepast(); //获取商品列表(餐饮美食)
  353. },
  354. methods: {
  355. // 添加商品
  356. addType() {
  357. uni.navigateTo({
  358. url: '/pages/HotelMerchandise/addCommodity'
  359. })
  360. },
  361. getHousekeeping() {
  362. this.$api.get('/sys/dict/type/all').then(res => {
  363. let alldata = res.data.data.find((p) => p.dictType == 'food_type').dataList;
  364. console.log('alldata', alldata)
  365. })
  366. },
  367. piliangxiajia() {
  368. if (this.selectedTags.length == 0) {
  369. // this.$refs.uToast.show({
  370. // type: 'success',
  371. // title: '',
  372. // message: "请选择数据",
  373. // iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
  374. // })
  375. let namesArray = this.selectedTags.map(obj => obj.id);
  376. let postdata = {
  377. discountPrice: 0,
  378. id: namesArray,
  379. status: this.fromData.status == 1 ? 0 : 1,
  380. };
  381. this.$api.post('/merchant/hotel/repast/batchPutAway', postdata).then(res => {
  382. console.log(res);
  383. if (res.data.code == 0) {
  384. this.getRepast()
  385. this.showPricingUnder = false
  386. this.ids = []
  387. } else this.$showToast(res.data.msg);
  388. })
  389. } else {
  390. let namesArray = this.selectedTags.map(obj => obj.id);
  391. let postdata = {
  392. discountPrice: 0,
  393. id: namesArray,
  394. status: this.fromData.status == 1 ? 0 : 1,
  395. };
  396. this.$api.post('/scenic/goods/batchUpDownFrame', postdata).then(res => {
  397. this.$refs.uToast.show({
  398. type: 'success',
  399. title: '',
  400. message: "成功",
  401. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
  402. })
  403. this.selectedTags = [];
  404. this.Selected = false;
  405. this.getRepast(); //获取商品列表
  406. })
  407. }
  408. },
  409. piliangshanchu() {
  410. if (uni.getStorageSync('merchantType') == 4) {
  411. if (this.selectedTags.length == 0) {
  412. this.$refs.uToast.show({
  413. type: 'success',
  414. title: '',
  415. message: "请选择数据",
  416. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
  417. })
  418. } else {
  419. let namesArray = this.selectedTags.map(obj => obj.id);
  420. //status: this.fromData.status,
  421. // this.$api.del('/api/merchant/food/delProduct', namesArray).then(res => {
  422. // this.$refs.uToast.show({
  423. // type: 'success',
  424. // title: '',
  425. // message: "成功",
  426. // iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
  427. // })
  428. // this.selectedTags = [];
  429. // this.Selected = false;
  430. // this.getRepast(); //获取商品列表
  431. // })
  432. this.$api.del('/merchant/hotel/repast', namesArray).then(res => {
  433. console.log(res);
  434. if (res.data.code == 0) {
  435. this.getRepast()
  436. this.showPricing = false
  437. this.selectedTags = [];
  438. } else this.$showToast(res.data.msg);
  439. })
  440. }
  441. } else {
  442. if (this.selectedTags.length == 0) {
  443. this.$refs.uToast.show({
  444. type: 'success',
  445. title: '',
  446. message: "请选择数据",
  447. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
  448. })
  449. } else {
  450. let namesArray = this.selectedTags.map(obj => obj.id);
  451. //status: this.fromData.status,
  452. this.$api.del('/scenic/goods', namesArray).then(res => {
  453. this.$refs.uToast.show({
  454. type: 'success',
  455. title: '',
  456. message: "成功",
  457. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
  458. })
  459. this.selectedTags = [];
  460. this.Selected = false;
  461. this.yujialedata(); //获取商品列表(渔家乐)
  462. })
  463. }
  464. }
  465. },
  466. shanchu(e, i) {
  467. //console.log('111111111111111111', e, i)
  468. this.lsdata = e;
  469. this.shanchushow = true;
  470. },
  471. quedingshanchu() {
  472. if (uni.getStorageSync('merchantType') == 4) {
  473. //(餐饮美食)
  474. let postdata = [this.lsdata.id];
  475. //status: this.fromData.status,
  476. console.log('postdata', postdata)
  477. this.$api.del('/api/merchant/food/delProduct', postdata).then(res => {
  478. this.$refs.uToast.show({
  479. type: 'success',
  480. title: '',
  481. message: "成功",
  482. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
  483. })
  484. this.quxiaoshanchu();
  485. this.getRepast(); //获取商品列表
  486. })
  487. } else {
  488. //(渔家乐)
  489. let postdata = [this.lsdata.id];
  490. //status: this.fromData.status,
  491. console.log('postdata', postdata)
  492. this.$api.del('/scenic/goods', postdata).then(res => {
  493. this.$refs.uToast.show({
  494. type: 'success',
  495. title: '',
  496. message: "成功",
  497. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
  498. })
  499. this.quxiaoshanchu();
  500. this.yujialedata(); //获取商品列表(渔家乐)
  501. })
  502. }
  503. },
  504. quxiaoshanchu() {
  505. // console.log('quxiaoxiajia',this.lsdata)
  506. this.lsdata = {};
  507. this.shanchushow = false;
  508. },
  509. gaijia(e, i) {
  510. console.log('111111111111111111', e, i)
  511. this.showPricing = true;
  512. this.lsdata = e;
  513. },
  514. closegaijia() {
  515. this.showPricing = false;
  516. this.newprice = '';
  517. this.lsdata = {};
  518. },
  519. quedingjiae() {
  520. let postdata = {
  521. discountPrice: this.newprice,
  522. ids: [this.lsdata.id],
  523. status: this.fromData.status,
  524. };
  525. //console.log('postdata', postdata)
  526. this.$api.post('/api/merchant/food/updateDiscountPrice', postdata).then(res => {
  527. this.$refs.uToast.show({
  528. type: 'success',
  529. title: '',
  530. message: "成功",
  531. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
  532. })
  533. this.closegaijia();
  534. this.getRepast(); //获取商品列表
  535. })
  536. },
  537. opengaijia() {},
  538. xiajia1(e, i) {
  539. console.log('111111111111111111', e, i)
  540. this.lsdata = e;
  541. this.xiajiashow1 = true;
  542. },
  543. xiajia(e, i) {
  544. console.log('111111111111111111', e, i)
  545. this.lsdata = e;
  546. this.xiajiashow = true;
  547. },
  548. quedingxiajia() {
  549. //获取商品列表(餐饮美食)
  550. let postdata = {
  551. discountPrice: this.lsdata.discountPrice,
  552. ids: [this.lsdata.id],
  553. status: this.fromData.status,
  554. };
  555. this.$api.post('/api/merchant/food/updateStatus', postdata).then(res => {
  556. this.$refs.uToast.show({
  557. type: 'success',
  558. title: '',
  559. message: "下架成功",
  560. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/default.png'
  561. })
  562. this.quxiaoxiajia();
  563. this.getRepast(); //获取商品列表
  564. })
  565. },
  566. quxiaoxiajia() {
  567. // console.log('quxiaoxiajia',this.lsdata)
  568. this.lsdata = {};
  569. this.xiajiashow = false;
  570. this.xiajiashow1 = false;
  571. },
  572. selectPerson(e, i) {
  573. if (this.selectedTags.includes(e)) {
  574. this.selectedTags = this.selectedTags.filter(t => t !== e);
  575. } else {
  576. this.selectedTags.push(e);
  577. }
  578. console.log(' this.selectedTags', this.selectedTags)
  579. },
  580. yujialedata() {
  581. this.$api.get('/scenic/goods/page', this.fromData).then(res => {
  582. console.log(res.data.data.list);
  583. this.roomType = res.data.data.list;
  584. this.mytotal = res.data.data.total;
  585. })
  586. },
  587. getRepast() {
  588. this.Shelves = false
  589. this.$api.get('/merchant/hotel/repast/page', this.fromData).then(res => {
  590. console.log(res.data.data.list);
  591. this.roomType = res.data.data.list;
  592. this.mytotal = res.data.data.total;
  593. })
  594. },
  595. // 区域筛选
  596. clickareaShow(e, i) {
  597. this.areaShowIndex = i;
  598. this.areaShow = false;
  599. this.fromData.sortType = e.id;
  600. this.fromData.page = 1;
  601. this.getRepast();
  602. },
  603. // 上架时间
  604. areaShowed() {
  605. console.log(123);
  606. this.areaShow = !this.areaShow
  607. },
  608. changeTab1(index) {
  609. console.log(index);
  610. this.current = index;
  611. if (index == 0) {
  612. this.fromData.status = 1
  613. this.getRepast()
  614. } else {
  615. this.fromData.status = 0
  616. this.getRepast()
  617. }
  618. },
  619. // 批量显示
  620. showList() {
  621. this.Selected = !this.Selected
  622. },
  623. }
  624. }
  625. </script>
  626. <style lang="scss" scoped>
  627. .queding {
  628. width: 750rpx;
  629. height: 140rpx;
  630. display: flex;
  631. justify-content: space-around;
  632. align-items: center;
  633. .queding1 {
  634. width: 330rpx;
  635. height: 88rpx;
  636. background: #F0F2F5;
  637. border-radius: 44rpx;
  638. font-family: PingFangSC, PingFang SC;
  639. font-weight: 400;
  640. font-size: 32rpx;
  641. color: #333333;
  642. line-height: 88rpx;
  643. text-align: center;
  644. font-style: normal;
  645. }
  646. .queding2 {
  647. width: 330rpx;
  648. height: 88rpx;
  649. background: #007A69;
  650. border-radius: 44rpx;
  651. font-family: PingFangSC, PingFang SC;
  652. font-weight: 400;
  653. font-size: 32rpx;
  654. color: #FFFFFF;
  655. line-height: 88rpx;
  656. text-align: center;
  657. font-style: normal;
  658. }
  659. }
  660. .jiainput {
  661. width: 690rpx;
  662. height: 100rpx;
  663. margin: 0 auto;
  664. }
  665. .gaijiadiv {
  666. width: 750rpx;
  667. height: 950rpx;
  668. .toubu {
  669. width: 750rpx;
  670. height: 110rpx;
  671. font-family: PingFang-SC, PingFang-SC;
  672. font-weight: bold;
  673. font-size: 36rpx;
  674. color: #333333;
  675. line-height: 110rpx;
  676. text-align: center;
  677. font-style: normal;
  678. position: relative;
  679. .toubux {
  680. position: absolute;
  681. top: 33rpx;
  682. right: 30rpx;
  683. }
  684. }
  685. }
  686. .Doublactive {
  687. // background-color: #F0F7F6 !important;
  688. color: #007A69 !important;
  689. // border: 1px solid #007A69 !important;
  690. }
  691. .contented {
  692. width: 100%;
  693. padding: 0 24rpx;
  694. box-sizing: border-box;
  695. position: relative;
  696. }
  697. .custom_popup {
  698. width: 100%;
  699. height: 100%;
  700. background: rgba(0, 0, 0, .4);
  701. top: 0;
  702. left: 0;
  703. position: absolute;
  704. z-index: 999;
  705. .types {
  706. width: 100%;
  707. padding: 30rpx 30rpx 56rpx;
  708. box-sizing: border-box;
  709. background: #FFFFFF;
  710. .pricequjian {
  711. width: 100%;
  712. .contentpeice {
  713. width: 100%;
  714. display: flex;
  715. justify-content: space-between;
  716. margin: 15rpx 0;
  717. .title {
  718. font-weight: Regular;
  719. font-size: 28rpx;
  720. color: #333333;
  721. }
  722. .image {
  723. width: 28rpx;
  724. height: 20rpx;
  725. image {
  726. width: 100%;
  727. height: 100%;
  728. }
  729. }
  730. }
  731. }
  732. }
  733. }
  734. .pages {
  735. background: #F5F8FA;
  736. box-sizing: border-box;
  737. .tb {
  738. width: 100%;
  739. top: 0;
  740. left: 0;
  741. z-index: 999;
  742. .searchBoxParent {
  743. width: 100%;
  744. background: #fff;
  745. padding: 20rpx 24rpx 6rpx;
  746. box-sizing: border-box;
  747. .searchBox {
  748. width: 100%;
  749. background-color: #fff;
  750. }
  751. }
  752. .tabs {
  753. background: #fff;
  754. padding: 26rpx 0;
  755. display: flex;
  756. align-items: center;
  757. width: 100%;
  758. &>view {
  759. width: 25%;
  760. font-size: 28rpx;
  761. font-family: PingFangSC-Regular, PingFang SC;
  762. font-weight: 400;
  763. color: black;
  764. line-height: 40rpx;
  765. position: relative;
  766. text-align: center;
  767. }
  768. .active {
  769. font-size: 32rpx;
  770. font-family: PingFang-SC-Bold, PingFang-SC;
  771. font-weight: bold;
  772. color: black;
  773. line-height: 45rpx;
  774. }
  775. .active::after {
  776. position: absolute;
  777. content: '';
  778. width: 50rpx;
  779. height: 8rpx;
  780. background: #007A69;
  781. bottom: -26rpx;
  782. left: 60%;
  783. margin-left: -42rpx;
  784. }
  785. }
  786. }
  787. .green {}
  788. .mainContain {
  789. display: flex;
  790. flex-direction: column;
  791. padding: 0 20rpx;
  792. .nodata {
  793. background: white;
  794. }
  795. .card {
  796. background: #fff;
  797. border-radius: 16rpx;
  798. margin: 20rpx 0;
  799. padding: 20rpx;
  800. .header {
  801. display: flex;
  802. justify-content: space-between;
  803. border-bottom: 1px #f3f3f3 solid;
  804. padding: 20rpx;
  805. .red {
  806. color: indianred;
  807. }
  808. .green {
  809. color: #999999;
  810. }
  811. .blue {
  812. color: #1372FF;
  813. }
  814. .grey {
  815. color: #4C5F76;
  816. }
  817. .orange {
  818. color: #FF9100;
  819. }
  820. }
  821. .mainContent {
  822. // border-bottom: 1px #f3f3f3 solid;
  823. display: flex;
  824. padding: 20rpx 0;
  825. // justify-content: space-evenly;
  826. .image {
  827. background-repeat: no-repeat;
  828. background-size: cover;
  829. width: 198rpx;
  830. height: 180rpx;
  831. border-radius: 16rpx;
  832. }
  833. .middle {
  834. padding-top: 16rpx;
  835. color: #777777;
  836. // display: flex;
  837. // flex-direction: column;
  838. // justify-content: space-between;
  839. margin-left: 25rpx;
  840. width: 100%;
  841. .title {
  842. font-weight: 700;
  843. font-size: 32rpx;
  844. color: black;
  845. }
  846. .info {
  847. padding-top: 30rpx;
  848. color: #777777;
  849. // display: flex;
  850. // flex-direction: column;
  851. &>span {
  852. margin-top: 10rpx;
  853. }
  854. }
  855. }
  856. .price {
  857. color: red;
  858. text-align: center;
  859. height: 100%;
  860. align-items: center;
  861. align-self: center;
  862. font-size: 29rpx;
  863. font-weight: 700;
  864. }
  865. }
  866. .bottom {
  867. // padding: 30rpx 20rpx;
  868. display: flex;
  869. justify-content: flex-end;
  870. .detail {
  871. // border: 1rpx solid darkgrey;
  872. border-radius: 16rpx;
  873. color: darkgrey;
  874. padding: 13rpx 34rpx;
  875. background-color: #F6F6F6;
  876. font-size: 26rpx;
  877. color: #333333;
  878. font-weight: Regular;
  879. }
  880. .del {
  881. border-radius: 16rpx;
  882. color: darkgrey;
  883. padding: 13rpx 34rpx;
  884. background-color: #007A69;
  885. font-size: 26rpx;
  886. color: #fff;
  887. font-weight: Regular;
  888. }
  889. }
  890. }
  891. }
  892. }
  893. .u-input__content {
  894. margin-top: 22rpx !important;
  895. }
  896. .uicon-arrow-right,
  897. .uicon-close-circle-fill {
  898. margin-top: 32rpx !important;
  899. margin-right: 20rpx !important;
  900. }
  901. .pop-pop {
  902. height: 65vh;
  903. padding: 46rpx 20rpx 0;
  904. .hander-one {
  905. display: flex;
  906. justify-content: space-between;
  907. .text {
  908. font-size: 36rpx;
  909. color: #333333;
  910. font-weight: bold;
  911. }
  912. .del {}
  913. }
  914. .hander-two {
  915. display: flex;
  916. align-items: center;
  917. margin: 30rpx 0;
  918. .hander-two-text {
  919. font-size: 30rpx;
  920. color: #333333;
  921. font-weight: Regular;
  922. }
  923. .hander-two-image {
  924. display: flex;
  925. align-items: center;
  926. .image {
  927. margin: 0 10rpx;
  928. width: 30rpx;
  929. height: 30rpx;
  930. image {
  931. width: 100%;
  932. height: 100%;
  933. }
  934. }
  935. }
  936. }
  937. .hander-three {
  938. display: flex;
  939. border: 1rpx solid #CCCCCC;
  940. border-radius: 16rpx;
  941. justify-content: space-between;
  942. height: 102rpx;
  943. line-height: 102rpx;
  944. .hander-three-text {
  945. width: 200rpx;
  946. text-align: left;
  947. display: flex;
  948. justify-content: space-between;
  949. margin: 0 20rpx;
  950. }
  951. .hander-three-input {
  952. width: 55%;
  953. }
  954. .hander-three-icon {
  955. height: 102rpx;
  956. line-height: 102rpx;
  957. }
  958. }
  959. .hander-four {
  960. margin-top: 30rpx;
  961. display: flex;
  962. border-radius: 16rpx;
  963. justify-content: space-between;
  964. border: 1rpx solid #CCCCCC;
  965. height: 102rpx;
  966. line-height: 102rpx;
  967. .hander-three-text {
  968. width: 200rpx;
  969. text-align: center;
  970. display: flex;
  971. justify-content: space-between;
  972. margin: 0 20rpx;
  973. }
  974. .hander-three-input {
  975. width: 55%;
  976. }
  977. .hander-three-icon {
  978. height: 102rpx;
  979. line-height: 102rpx;
  980. }
  981. }
  982. }
  983. .page {
  984. background: #F3F4F4;
  985. padding-bottom: 260rpx;
  986. box-sizing: border-box;
  987. overflow-y: auto;
  988. overflow-x: auto;
  989. }
  990. .typeNum {
  991. // width: 100%;
  992. height: 73rpx;
  993. display: flex;
  994. justify-content: space-between;
  995. padding: 23rpx 24rpx;
  996. align-items: center;
  997. .left {
  998. display: flex;
  999. align-items: center;
  1000. .active {
  1001. color: #007A69;
  1002. }
  1003. }
  1004. .right {
  1005. display: flex;
  1006. align-items: center;
  1007. .image {
  1008. margin: 0 10rpx;
  1009. width: 30rpx;
  1010. height: 30rpx;
  1011. image {
  1012. width: 100%;
  1013. height: 100%;
  1014. }
  1015. }
  1016. .text {
  1017. font-size: 28rpx;
  1018. font-weight: Regular;
  1019. color: #333333;
  1020. }
  1021. }
  1022. }
  1023. .type {
  1024. margin: 0 auto;
  1025. border-radius: 10rpx 10rpx 10rpx 10rpx;
  1026. width: 86%;
  1027. // height: 114rpx;
  1028. background-color: #fff;
  1029. padding: 30rpx;
  1030. margin-bottom: 20rpx;
  1031. display: flex;
  1032. .left {
  1033. height: 114rpx;
  1034. line-height: 200rpx;
  1035. margin-right: 20rpx;
  1036. .image {
  1037. margin: 0 10rpx;
  1038. width: 30rpx;
  1039. height: 30rpx;
  1040. image {
  1041. width: 100%;
  1042. height: 100%;
  1043. }
  1044. }
  1045. }
  1046. .right {
  1047. width: 100%;
  1048. display: flex;
  1049. .right-left {
  1050. width: 172rpx;
  1051. height: 172rpx;
  1052. border-radius: 16rpx;
  1053. margin-right: 22rpx;
  1054. image {
  1055. width: 100%;
  1056. height: 100%;
  1057. border-radius: 16rpx;
  1058. }
  1059. }
  1060. .right-right {}
  1061. }
  1062. .type-btn {
  1063. width: 100%;
  1064. display: flex;
  1065. justify-content: space-between;
  1066. .type-btn-left {
  1067. width: 50rpx;
  1068. }
  1069. .type-btn-right {
  1070. display: flex;
  1071. view {
  1072. padding: 15rpx 23rpx;
  1073. background-color: #F6F6F6;
  1074. font-size: 24rpx;
  1075. color: #333;
  1076. font-weight: Regular;
  1077. margin-right: 20rpx;
  1078. border-radius: 50rpx;
  1079. }
  1080. }
  1081. }
  1082. }
  1083. .top {
  1084. display: flex;
  1085. justify-content: space-between;
  1086. }
  1087. .under {
  1088. margin-top: 20rpx;
  1089. // display: flex;
  1090. // justify-content: space-between;
  1091. }
  1092. .btn-btn {
  1093. width: 100%;
  1094. height: 136rpx;
  1095. background-color: #fff;
  1096. position: fixed;
  1097. bottom: 0;
  1098. padding: 30rpx 0 0;
  1099. // margin: 0 auto;
  1100. z-index: 9;
  1101. // margin-top: 30rpx;
  1102. // margin-left: 30rpx;
  1103. .bottom-btn {
  1104. display: flex;
  1105. justify-content: space-between;
  1106. margin: 0 24rpx;
  1107. .left {
  1108. width: 25%;
  1109. display: flex;
  1110. align-items: center;
  1111. .image {
  1112. width: 38rpx;
  1113. height: 38rpx;
  1114. margin: 0 10rpx;
  1115. image {
  1116. width: 100%;
  1117. height: 100%;
  1118. }
  1119. }
  1120. }
  1121. .right {
  1122. width: 75%;
  1123. display: flex;
  1124. justify-content: space-evenly;
  1125. .right-btn {
  1126. width: 148rpx;
  1127. height: 80rpx;
  1128. line-height: 80rpx;
  1129. background-color: #1372FF;
  1130. border-radius: 16rpx;
  1131. font-size: 26rpx;
  1132. color: #fff;
  1133. font-weight: Regular;
  1134. text-align: center;
  1135. }
  1136. }
  1137. }
  1138. }
  1139. .btn {
  1140. margin: 0 auto;
  1141. width: 690rpx;
  1142. height: 96rpx;
  1143. background-color: #1372FF;
  1144. color: #fff;
  1145. display: flex;
  1146. justify-content: center;
  1147. align-items: center;
  1148. font-size: 34rpx;
  1149. border-radius: 48rpx;
  1150. }
  1151. </style>