nc-member-detail.vue 43 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764765766767768769770771772773774775776777778779780781782783784785786787788789790791792793794795796797798799800801802803804805806807808809810811812813814815816817818819820821822823824825826827828829830831832833834835836837838839840841842843844845846847848849850851852853854855856857858859860861862863864865866867868869870871872873874875876877878879880881882883884885886887888889890891892893894895896897898899900901902903904905906907908909910911912913914915916917918919920921922923924925926927928929930931932933934935936937938939940941942943944945946947948949950951952953954955956957958959960961962963964965966967968969970971972973974975976977978979980981982983984985986987988989990991992993994995996997998999100010011002100310041005100610071008100910101011101210131014101510161017101810191020102110221023102410251026102710281029103010311032103310341035103610371038103910401041104210431044104510461047104810491050105110521053105410551056105710581059106010611062106310641065106610671068106910701071107210731074107510761077107810791080108110821083108410851086108710881089109010911092109310941095109610971098109911001101110211031104110511061107110811091110111111121113111411151116111711181119112011211122112311241125112611271128112911301131113211331134113511361137113811391140114111421143114411451146114711481149115011511152115311541155115611571158115911601161116211631164116511661167116811691170117111721173117411751176117711781179118011811182118311841185118611871188118911901191119211931194119511961197119811991200120112021203120412051206120712081209121012111212121312141215121612171218121912201221122212231224122512261227122812291230123112321233123412351236123712381239124012411242124312441245124612471248124912501251125212531254125512561257125812591260126112621263126412651266126712681269127012711272127312741275127612771278127912801281128212831284128512861287128812891290129112921293129412951296129712981299130013011302130313041305130613071308130913101311131213131314131513161317131813191320132113221323132413251326132713281329133013311332133313341335133613371338133913401341134213431344134513461347134813491350135113521353135413551356135713581359136013611362136313641365136613671368136913701371137213731374137513761377137813791380138113821383138413851386138713881389139013911392139313941395139613971398139914001401140214031404140514061407140814091410141114121413141414151416141714181419142014211422142314241425142614271428142914301431143214331434143514361437143814391440144114421443144414451446144714481449145014511452145314541455145614571458145914601461146214631464146514661467146814691470147114721473147414751476147714781479148014811482148314841485148614871488148914901491149214931494149514961497149814991500150115021503150415051506150715081509151015111512151315141515151615171518151915201521152215231524152515261527152815291530153115321533153415351536153715381539154015411542154315441545154615471548154915501551155215531554155515561557155815591560156115621563156415651566156715681569157015711572157315741575157615771578157915801581158215831584158515861587158815891590159115921593159415951596159715981599160016011602160316041605160616071608160916101611161216131614161516161617161816191620162116221623162416251626162716281629163016311632163316341635163616371638163916401641164216431644164516461647164816491650165116521653165416551656165716581659166016611662166316641665
  1. <template>
  2. <view class="member-detail-wrap">
  3. <view class="member-head">会员详情</view>
  4. <view class="member-content">
  5. <view class="content-block">
  6. <view class="item-img">
  7. <image mode="aspectFill" v-if="memberInfo && memberInfo.headimg" :src="$util.img(memberInfo.headimg)" @error="headError(memberInfo)"></image>
  8. <image mode="aspectFill" v-else :src="$util.img(defaultImg.head)"></image>
  9. </view>
  10. <view class="item-content">
  11. <view class="item-title">
  12. <view class="item-title-text">{{ memberInfo && memberInfo.nickname ? memberInfo.nickname : '' }}</view>
  13. <view class="item-label" v-if="memberInfo && memberInfo.member_level && memberInfo.member_level_name != 'undefined'">
  14. {{ memberInfo.member_level_name }}
  15. </view>
  16. </view>
  17. <view class="info-list">
  18. <view class="info-item">手机:{{ memberInfo && memberInfo.mobile ? memberInfo.mobile : '' }}</view>
  19. <view class="info-item" v-if="memberInfo && memberInfo.sex == 0">性别:未知</view>
  20. <view class="info-item" v-if="memberInfo && memberInfo.sex == 1">性别:男</view>
  21. <view class="info-item" v-if="memberInfo && memberInfo.sex == 2">性别:女</view>
  22. <view class="info-item">生日:{{ memberInfo && memberInfo.birthday ? memberInfo.birthday : '' }}</view>
  23. <view class="info-item" v-if="memberInfo && memberInfo.member_time">成为会员:{{ $util.timeFormat(memberInfo.member_time) }}</view>
  24. </view>
  25. </view>
  26. </view>
  27. <view class="content-block account">
  28. <view class="content-data-item">
  29. <view class="data-item-title">积分</view>
  30. <view class="data-item-value">{{ memberInfo && memberInfo.point ? parseInt(memberInfo.point) : '0' }}</view>
  31. <view class="data-item-action" @click="memberAction('point_list')">查看</view>
  32. </view>
  33. <view class="content-data-item">
  34. <view class="data-item-title">储值余额(元)</view>
  35. <view class="data-item-value">{{ memberInfo && memberInfo.balance ? memberInfo.balance : '0.00' }}</view>
  36. <view class="data-item-action" @click="memberAction('balance_list')">查看</view>
  37. <!-- <view class="data-item-action" v-if="memberInfo && memberInfo.balance > 0" @click="refundBalance">退储值</view> -->
  38. </view>
  39. <view class="content-data-item">
  40. <view class="data-item-title">现金余额(元)</view>
  41. <view class="data-item-value">{{ memberInfo && memberInfo.balance_money ? memberInfo.balance_money : '0.00' }}</view>
  42. </view>
  43. <view class="content-data-item">
  44. <view class="data-item-title">成长值</view>
  45. <view class="data-item-value">{{ memberInfo && memberInfo.growth ? memberInfo.growth : '0' }}</view>
  46. <view class="data-item-action" @click="memberAction('growth_list')">查看</view>
  47. </view>
  48. <view class="content-data-item">
  49. <view class="data-item-title">优惠券(张)</view>
  50. <view class="data-item-value">{{ memberInfo && memberInfo.coupon_num ? memberInfo.coupon_num : '0' }}</view>
  51. <view class="data-item-action" @click="memberAction('couponlist')">查看</view>
  52. </view>
  53. <view class="content-data-item">
  54. <view class="data-item-title">卡包</view>
  55. <view class="data-item-value">{{ memberInfo && memberInfo.card_num ? memberInfo.card_num : '0' }}</view>
  56. <view class="data-item-action" @click="memberAction('cardlist')">查看</view>
  57. </view>
  58. </view>
  59. <view class="content-block action">
  60. <view class="content-data-item">
  61. <view class="data-item-icon">
  62. <image mode="aspectFit" @click="memberAction('memberinfo')" :src="$util.img('public/uniapp/cashier/icon-member-info.png')"></image>
  63. </view>
  64. <view class="data-item-value">会员信息</view>
  65. </view>
  66. <view class="content-data-item" @click="memberAction('point')">
  67. <view class="data-item-icon"><image mode="aspectFit" :src="$util.img('public/uniapp/cashier/icon-member-point.png')"></image></view>
  68. <view class="data-item-value">积分调整</view>
  69. </view>
  70. <view class="content-data-item" @click="memberAction('balance')">
  71. <view class="data-item-icon"><image mode="aspectFit" :src="$util.img('public/uniapp/cashier/icon-member-balance.png')"></image></view>
  72. <view class="data-item-value">余额充值</view>
  73. </view>
  74. <view class="content-data-item" @click="memberAction('sendCoupon')">
  75. <view class="data-item-icon"><image mode="aspectFit" :src="$util.img('public/uniapp/cashier/icon-member-coupon.png')"></image></view>
  76. <view class="data-item-value">送优惠券</view>
  77. </view>
  78. <view class="content-data-item" @click="memberAction('growth')">
  79. <view class="data-item-icon"><image mode="aspectFit" :src="$util.img('public/uniapp/cashier/icon-member-growth.png')"></image></view>
  80. <view class="data-item-value">成长值调整</view>
  81. </view>
  82. <view class="content-data-item" @click="memberAction('applyMember')" v-if="memberInfo && !memberInfo.is_member">
  83. <view class="data-item-icon"><image mode="aspectFit" :src="$util.img('public/uniapp/cashier/icon-member-apply.png')"></image></view>
  84. <view class="data-item-value">办理会员</view>
  85. </view>
  86. </view>
  87. </view>
  88. <!-- 会员详情 -->
  89. <uni-popup ref="memberInfoPop">
  90. <view class="pop-box memberInfo-box">
  91. <view class="pop-header">
  92. <view class="pop-header-text">会员详情</view>
  93. <view class="pop-header-close" @click="popClose('memberinfo')"><i class="iconguanbi1 iconfont"></i></view>
  94. </view>
  95. <scroll-view scroll-y="true" class="common-scrollbar pop-content">
  96. <view class="form-content" v-if="memberInfo">
  97. <view class="form-item">
  98. <view class="form-label">
  99. <text class="required"></text>
  100. 昵称:
  101. </view>
  102. <view class="form-inline"><input class="form-input" placeholder="请输入会员昵称" v-model="memberInfo.nickname" /></view>
  103. </view>
  104. <view class="form-item">
  105. <view class="form-label">
  106. <text class="required"></text>
  107. 手机号:
  108. </view>
  109. <view class="form-inline"><input class="form-input " placeholder="请输入手机号" v-model="memberInfo.mobile" /></view>
  110. </view>
  111. <view class="form-item">
  112. <view class="form-label">
  113. <text class="required"></text>
  114. 会员等级:
  115. </view>
  116. <view class="form-inline">
  117. <select-lay
  118. :zindex="10"
  119. :value="memberInfo.member_level"
  120. name="names"
  121. placeholder="请选择会员等级"
  122. :options="memberLevelList"
  123. @selectitem="selectMemberLevel"
  124. ></select-lay>
  125. </view>
  126. </view>
  127. <view class="form-item">
  128. <view class="form-label">
  129. <text class="required"></text>
  130. 性别:
  131. </view>
  132. <view class="form-inline"><uni-data-checkbox v-model="memberInfo.sex" selectedColor="#8558FA" :localdata="sex"></uni-data-checkbox></view>
  133. </view>
  134. <view class="form-item">
  135. <view class="form-label">
  136. <text class="required"></text>
  137. 生日:
  138. </view>
  139. <view class="form-inline"><uni-datetime-picker :end="endTime" v-model="memberInfo.birthday" type="date" :clearIcon="false" /></view>
  140. </view>
  141. <view class="form-item">
  142. <view class="form-label">
  143. <text class="required"></text>
  144. 注册时间:
  145. </view>
  146. <view class="form-inline">{{ memberInfo && memberInfo.reg_time ? $util.timeFormat(memberInfo.reg_time) : '--' }}</view>
  147. </view>
  148. <view class="form-item">
  149. <view class="form-label">
  150. <text class="required"></text>
  151. 最后访问时间:
  152. </view>
  153. <view class="form-inline">{{ memberInfo && memberInfo.last_login_time ? $util.timeFormat(memberInfo.last_login_time) : '--' }}</view>
  154. </view>
  155. </view>
  156. </scroll-view>
  157. <view class="pop-bottom"><button class="primary-btn" @click="saveMemberInfo">确定</button></view>
  158. </view>
  159. </uni-popup>
  160. <!-- 积分调整 -->
  161. <uni-popup ref="pointPop">
  162. <view class="pop-box pointPop-box">
  163. <view class="pop-header">
  164. <view class="pop-header-text">调整积分</view>
  165. <view class="pop-header-close" @click="popClose('point')"><i class="iconguanbi1 iconfont"></i></view>
  166. </view>
  167. <scroll-view scroll-y="true" class="common-scrollbar pop-content">
  168. <view class="form-content">
  169. <view class="form-item">
  170. <view class="form-label">
  171. <text class="required"></text>
  172. 当前积分:
  173. </view>
  174. <view class="form-inline">{{ memberInfo && memberInfo.point ? memberInfo.point : '0' }}</view>
  175. </view>
  176. <view class="form-item">
  177. <view class="form-label">
  178. <text class="required"></text>
  179. 调整数额:
  180. </view>
  181. <view class="form-inline">
  182. <input class="form-input" type="number" placeholder="请输入调整数额" v-model="pointData.num" />
  183. <view class="word-aux">调整数额与当前积分数相加不能小于0</view>
  184. </view>
  185. </view>
  186. <view class="form-item">
  187. <view class="form-label">
  188. <text class="required"></text>
  189. 备注:
  190. </view>
  191. <view class="form-inline"><textarea class="form-textarea" v-model="pointData.desc"></textarea></view>
  192. </view>
  193. </view>
  194. </scroll-view>
  195. <view class="pop-bottom"><button class="primary-btn" @click="savePoint">确定</button></view>
  196. </view>
  197. </uni-popup>
  198. <!-- 发放优惠券 -->
  199. <uni-popup ref="sendCouponPop">
  200. <view class="pop-box sendCoupon-box">
  201. <view class="pop-header">
  202. <view class="pop-header-text">送优惠券</view>
  203. <view class="pop-header-close" @click="popClose('sendCoupon')"><i class="iconguanbi1 iconfont"></i></view>
  204. </view>
  205. <view class="common-scrollbar sendCoupon-content">
  206. <view class="coupon-table-head">
  207. <view class="coupon-table-th">优惠券名称</view>
  208. <view class="coupon-table-th">金额</view>
  209. <view class="coupon-table-th">有效期</view>
  210. <view class="coupon-table-th">发放数量</view>
  211. </view>
  212. <scroll-view class="coupon-table-body" @scrolltolower="getCouponList()" scroll-y="true">
  213. <view class="coupon-table-tr" v-for="(item, index) in sendCoupon.list" :key="index">
  214. <view class="coupon-table-td">{{ item.coupon_name }}</view>
  215. <view class="coupon-table-td">{{ item.money }}</view>
  216. <view class="coupon-table-td">{{ item.validity_name }}</view>
  217. <view class="coupon-table-td">
  218. <view class="item-num">
  219. <view class="num-dec" v-on:click="dec(item)">-</view>
  220. <input class="table-input" type="text" v-model="item.num" />
  221. <view class="num-inc" v-on:click="inc(item)">+</view>
  222. </view>
  223. </view>
  224. </view>
  225. <view class="empty" v-if="!sendCoupon.list.length">
  226. <view class="iconfont iconwushuju"></view>
  227. <view>暂无数据</view>
  228. </view>
  229. </scroll-view>
  230. </view>
  231. <view class="pop-bottom ">
  232. <button :class="[sendCoupon.list.length ? 'primary-btn' : 'default-btn']" @click="sendCouponFn">
  233. {{ sendCoupon.list.length ? '发放优惠券' : '暂无优惠券' }}
  234. </button>
  235. </view>
  236. </view>
  237. </uni-popup>
  238. <!-- 余额调整 -->
  239. <uni-popup ref="balancePop">
  240. <view class="pop-box pointPop-box">
  241. <view class="pop-header">
  242. <view class="pop-header-text">调整余额</view>
  243. <view class="pop-header-close" @click="popClose('balance')"><i class="iconguanbi1 iconfont"></i></view>
  244. </view>
  245. <scroll-view scroll-y="true" class="common-scrollbar pop-content">
  246. <view class="form-content">
  247. <view class="form-item">
  248. <view class="form-label">
  249. <text class="required"></text>
  250. 当前余额:
  251. </view>
  252. <view class="form-inline">{{ memberInfo && memberInfo.balance ? memberInfo.balance : '0.00' }}</view>
  253. </view>
  254. <view class="form-item">
  255. <view class="form-label">
  256. <text class="required"></text>
  257. 调整数额:
  258. </view>
  259. <view class="form-inline">
  260. <input class="form-input" type="number" placeholder="请输入调整数额" v-model="balanceData.num" />
  261. <view class="word-aux">调整数额与当前储值余额相加不能小于0</view>
  262. </view>
  263. </view>
  264. <view class="form-item">
  265. <view class="form-label">
  266. <text class="required"></text>
  267. 备注:
  268. </view>
  269. <view class="form-inline"><textarea class="form-textarea" v-model="balanceData.desc"></textarea></view>
  270. </view>
  271. </view>
  272. </scroll-view>
  273. <view class="pop-bottom"><button class="primary-btn" @click="saveBalance">确定</button></view>
  274. </view>
  275. </uni-popup>
  276. <!-- 成长值调整 -->
  277. <uni-popup ref="growthPop">
  278. <view class="pop-box pointPop-box">
  279. <view class="pop-header">
  280. <view class="pop-header-text">调整成长值</view>
  281. <view class="pop-header-close" @click="popClose('growth')"><i class="iconguanbi1 iconfont"></i></view>
  282. </view>
  283. <scroll-view scroll-y="true" class="common-scrollbar pop-content">
  284. <view class="form-content">
  285. <view class="form-item">
  286. <view class="form-label">
  287. <text class="required"></text>
  288. 当前成长值:
  289. </view>
  290. <view class="form-inline">{{ memberInfo && memberInfo.growth ? memberInfo.growth : '0' }}</view>
  291. </view>
  292. <view class="form-item">
  293. <view class="form-label">
  294. <text class="required"></text>
  295. 调整数额:
  296. </view>
  297. <view class="form-inline">
  298. <input class="form-input" type="number" placeholder="请输入调整数额" v-model="growthData.num" />
  299. <view class="word-aux">调整数额与当前成长值相加不能小于0</view>
  300. </view>
  301. </view>
  302. <view class="form-item">
  303. <view class="form-label">
  304. <text class="required"></text>
  305. 备注:
  306. </view>
  307. <view class="form-inline"><textarea class="form-textarea" v-model="growthData.desc"></textarea></view>
  308. </view>
  309. </view>
  310. </scroll-view>
  311. <view class="pop-bottom"><button class="primary-btn" @click="saveGrowth">确定</button></view>
  312. </view>
  313. </uni-popup>
  314. <!-- 办理会员 -->
  315. <uni-popup ref="applyMemberPop">
  316. <view class="pop-box applyMemberPop-box">
  317. <view class="pop-header">
  318. <view class="pop-header-text">办理会员</view>
  319. <view class="pop-header-close" @click="popClose('applyMember')"><i class="iconguanbi1 iconfont"></i></view>
  320. </view>
  321. <view class="common-scrollbar pop-content">
  322. <view class="form-content">
  323. <view class="form-item">
  324. <view class="form-label">
  325. <text class="required"></text>
  326. 会员等级:
  327. </view>
  328. <view class="form-inline">
  329. <select-lay
  330. :zindex="10"
  331. :value="applyMember.level_id"
  332. name="names"
  333. placeholder="请选择会员等级"
  334. :options="memberLevelList"
  335. @selectitem="selectMemberLevel"
  336. ></select-lay>
  337. </view>
  338. </view>
  339. <view class="form-item">
  340. <view class="form-label">
  341. <text class="required"></text>
  342. 会员卡号:
  343. </view>
  344. <view class="form-inline">
  345. <input class="form-input" type="text" placeholder="请输入会员卡号" v-model="applyMember.member_code" />
  346. <view class="word-aux">会员卡号为会员唯一编号,若不设置将会自动生成</view>
  347. </view>
  348. </view>
  349. </view>
  350. </view>
  351. <view class="pop-bottom"><button class="primary-btn" @click="saveApplyMember">确定</button></view>
  352. </view>
  353. </uni-popup>
  354. <!-- 优惠券列表 -->
  355. <uni-popup ref="couponlistPop">
  356. <view class="pop-box couponlistPop-box">
  357. <view class="pop-header">
  358. <view class="pop-header-text">优惠券</view>
  359. <view class="pop-header-close" @click="popClose('couponlist')"><i class="iconguanbi1 iconfont"></i></view>
  360. </view>
  361. <scroll-view scroll-y="true" class="common-scrollbar pop-content">
  362. <dataTable url="/cashier/storeapi/member/coupon" :cols="couponcols" ref="table" :option="option" :pagesize="pagesize"></dataTable>
  363. </scroll-view>
  364. </view>
  365. </uni-popup>
  366. <uni-popup ref="refundBalance">
  367. <view class="pop-box refund-balance-box">
  368. <view class="pop-header">
  369. <view class="pop-header-text">退储值</view>
  370. <view class="pop-header-close" @click="$refs.refundBalance.close()"><i class="iconguanbi1 iconfont"></i></view>
  371. </view>
  372. <view class="pop-content" v-if="refundData">
  373. <view class="info-item">
  374. <view class="title">账户可用储值:</view>
  375. <view class="data">¥{{ $util.moneyFormat(parseFloat(refundData.member_account.balance) + parseFloat(refundData.member_account.balance_money)) }}</view>
  376. </view>
  377. <view class="info-item">
  378. <view class="title">实充储值:</view>
  379. <view class="data">¥{{ refundData.refund_total_balance | moneyFormat }}</view>
  380. </view>
  381. <view class="info-item">
  382. <view class="title">已使用储值:</view>
  383. <view class="data">¥{{ refundData.use_total_balance | moneyFormat }}</view>
  384. </view>
  385. <view class="info-item">
  386. <view class="title">可退储值金额:</view>
  387. <view class="data">¥{{ refundData.can_refund_balance | moneyFormat }}</view>
  388. </view>
  389. <view class="info-item">
  390. <view class="title">退还金额:</view>
  391. <view class="data"><input type="number" value="" v-model="refundData.refund_balance" /></view>
  392. </view>
  393. <view class="info-item">
  394. <view class="title">退款方式:</view>
  395. <view class="data refund-type">
  396. <view
  397. class="value-item"
  398. :class="{ active: index == refundTransferType }"
  399. @click="refundTransferType = index"
  400. v-for="(item, index) in refundTransferTypeList"
  401. :key="index"
  402. >
  403. {{ item.name }}
  404. </view>
  405. </view>
  406. </view>
  407. </view>
  408. <view class="pop-bottom">
  409. <button class="primary-btn" @click="confirmRefundBalance">确定</button>
  410. <button class="default-btn" @click="$refs.refundBalance.close()">取消</button>
  411. </view>
  412. </view>
  413. </uni-popup>
  414. <!-- 积分列表 -->
  415. <uni-popup ref="pointListPop">
  416. <view class="pop-box couponlistPop-box">
  417. <view class="pop-header">
  418. <view class="pop-header-text">积分</view>
  419. <view class="pop-header-close" @click="popClose('point_list')"><i class="iconguanbi1 iconfont"></i></view>
  420. </view>
  421. <scroll-view scroll-y="true" class="common-scrollbar pop-content">
  422. <dataTable url="/cashier/storeapi/member/memberaccountlist" :cols="pointCols" ref="table" :option="option" :pagesize="pagesize"></dataTable>
  423. </scroll-view>
  424. </view>
  425. </uni-popup>
  426. <!-- 余额列表 -->
  427. <uni-popup ref="balanceListPop">
  428. <view class="pop-box couponlistPop-box">
  429. <view class="pop-header">
  430. <view class="pop-header-text">余额</view>
  431. <view class="pop-header-close" @click="popClose('balance_list')"><i class="iconguanbi1 iconfont"></i></view>
  432. </view>
  433. <scroll-view scroll-y="true" class="common-scrollbar pop-content">
  434. <dataTable url="/cashier/storeapi/member/memberaccountlist" :cols="balanceCols" ref="table" :option="option" :pagesize="pagesize"></dataTable>
  435. </scroll-view>
  436. </view>
  437. </uni-popup>
  438. <!-- 成长值列表 -->
  439. <uni-popup ref="growthListPop">
  440. <view class="pop-box couponlistPop-box">
  441. <view class="pop-header">
  442. <view class="pop-header-text">成长值</view>
  443. <view class="pop-header-close" @click="popClose('growth_list')"><i class="iconguanbi1 iconfont"></i></view>
  444. </view>
  445. <scroll-view scroll-y="true" class="common-scrollbar pop-content">
  446. <dataTable url="/cashier/storeapi/member/memberaccountlist" :cols="growthCols" ref="table" :option="option" :pagesize="pagesize"></dataTable>
  447. </scroll-view>
  448. </view>
  449. </uni-popup>
  450. <!-- 卡项 -->
  451. <nc-member-card ref="memberCard" :option="option"></nc-member-card>
  452. </view>
  453. </template>
  454. <script>
  455. import dataTable from '@/components/uni-data-table/uni-data-table.vue';
  456. export default {
  457. components: {
  458. dataTable
  459. },
  460. props: {
  461. memberId: {
  462. type: Number,
  463. default: 0
  464. }
  465. },
  466. data() {
  467. return {
  468. memberList: [],
  469. pagesize: 8,
  470. endTime: '',
  471. sex: [
  472. {
  473. text: '未知',
  474. value: 0
  475. },
  476. {
  477. text: '男',
  478. value: 1
  479. },
  480. {
  481. text: '女',
  482. value: 2
  483. }
  484. ],
  485. pointData: {
  486. num: 0,
  487. desc: ''
  488. },
  489. growthData: {
  490. num: 0,
  491. desc: ''
  492. },
  493. balanceData: {
  494. num: 0,
  495. desc: ''
  496. },
  497. couponcols: [
  498. {
  499. width: 15,
  500. title: '优惠券名称',
  501. align: 'left',
  502. field: 'coupon_name'
  503. },
  504. {
  505. width: 10,
  506. title: '类型',
  507. align: 'left',
  508. templet: function(data) {
  509. if (data.type == 'reward') return '满减';
  510. if (data.type == 'discount') return '折扣';
  511. }
  512. },
  513. {
  514. width: 20,
  515. title: '优惠金额',
  516. align: 'left',
  517. templet: function(data) {
  518. if (data.type == 'reward') {
  519. var html = `满${data.at_least}元减${data.money}`;
  520. return `<view title="${html}">${html}</view>`;
  521. }
  522. if (data.type == 'discount') {
  523. var text = '满' + data.at_least + '元打' + data.discount + '折';
  524. if (data.discount_limit) text += '(最多抵扣' + data.discount_limit + '元)';
  525. return '<view title="' + text + '">' + text + '</view>';
  526. }
  527. }
  528. },
  529. {
  530. width: 20,
  531. title: '有效期',
  532. align: 'center',
  533. templet: data => {
  534. if (data.end_time) return this.$util.timeFormat(data.end_time);
  535. else return '长期有效';
  536. }
  537. },
  538. {
  539. width: 15,
  540. title: '状态',
  541. align: 'center',
  542. return: data => {
  543. if (data.state == 1) return '未使用';
  544. if (data.state == 2) return '已使用';
  545. if (data.state == 3) return '已过期';
  546. }
  547. },
  548. {
  549. width: 20,
  550. title: '领取时间',
  551. align: 'right',
  552. templet: data => {
  553. return this.$util.timeFormat(data.fetch_time);
  554. }
  555. }
  556. ],
  557. pointCols: [
  558. {
  559. width: 20,
  560. title: '积分',
  561. align: 'left',
  562. field: 'account_data'
  563. },
  564. {
  565. width: 25,
  566. title: '发生方式',
  567. align: 'left',
  568. field: 'type_name'
  569. },
  570. {
  571. width: 25,
  572. title: '发生时间',
  573. align: 'left',
  574. templet: data => {
  575. var html = this.$util.timeFormat(data.create_time);
  576. return html;
  577. }
  578. },
  579. {
  580. width: 30,
  581. title: '备注',
  582. align: 'left',
  583. field: 'remark'
  584. }
  585. ],
  586. balanceCols: [
  587. {
  588. width: 10,
  589. title: '账户类型',
  590. align: 'left',
  591. field: 'account_type_name'
  592. },
  593. {
  594. width: 15,
  595. title: '余额',
  596. align: 'left',
  597. field: 'account_data'
  598. },
  599. {
  600. width: 20,
  601. title: '发生方式',
  602. align: 'left',
  603. field: 'type_name'
  604. },
  605. {
  606. width: 25,
  607. title: '发生时间',
  608. align: 'left',
  609. templet: data => {
  610. var html = this.$util.timeFormat(data.create_time);
  611. return html;
  612. }
  613. },
  614. {
  615. width: 30,
  616. title: '备注',
  617. align: 'left',
  618. field: 'remark'
  619. }
  620. ],
  621. growthCols: [
  622. {
  623. width: 20,
  624. title: '成长值',
  625. align: 'left',
  626. field: 'account_data'
  627. },
  628. {
  629. width: 25,
  630. title: '发生方式',
  631. align: 'left',
  632. field: 'type_name'
  633. },
  634. {
  635. width: 25,
  636. title: '发生时间',
  637. align: 'left',
  638. templet: data => {
  639. var html = this.$util.timeFormat(data.create_time);
  640. return html;
  641. }
  642. },
  643. {
  644. width: 30,
  645. title: '备注',
  646. align: 'left',
  647. field: 'remark'
  648. }
  649. ],
  650. option: {},
  651. addMemberData: {
  652. mobile: '',
  653. nickname: '',
  654. sex: 0,
  655. birthday: ''
  656. },
  657. refundTransferTypeList: {},
  658. refundTransferType: '',
  659. refundData: null,
  660. isRepeat: false,
  661. sendCoupon: {
  662. list: [],
  663. page: 1
  664. },
  665. memberLevelList: [],
  666. applyMember: {
  667. level_id: '',
  668. member_level_name: '',
  669. member_code: ''
  670. }
  671. };
  672. },
  673. created() {
  674. this.getMemberInfo();
  675. this.getMemberLevel();
  676. let date = new Date();
  677. var y = date.getFullYear();
  678. var m = date.getMonth() + 1;
  679. var d = date.getDate();
  680. this.endTime = y + '-' + m + '-' + d;
  681. },
  682. watch: {
  683. memberId: function() {
  684. this.getMemberInfo();
  685. }
  686. },
  687. methods: {
  688. getMemberInfo() {
  689. this.$api.sendRequest({
  690. url: '/cashier/storeapi/member/info',
  691. data: {
  692. member_id: this.memberId
  693. },
  694. success: res => {
  695. if (res.code >= 0) {
  696. res.data.birthday = res.data.birthday > 0 ? this.$util.timeFormat(res.data.birthday, 'y-m-d') : '';
  697. this.$store.commit('setMemberInfo', res.data);
  698. }
  699. }
  700. });
  701. },
  702. getMemberLevel() {
  703. this.memberLevelList = [];
  704. this.$api.sendRequest({
  705. url: '/cashier/storeapi/memberlevel/lists',
  706. success: res => {
  707. if (res.code == 0 && res.data) {
  708. for (let i in res.data) {
  709. this.memberLevelList.push({
  710. label: res.data[i]['level_name'],
  711. value: res.data[i]['level_id'].toString(),
  712. disabled: false
  713. });
  714. }
  715. }
  716. }
  717. });
  718. },
  719. selectMemberLevel(index, item) {
  720. if (index >= 0) {
  721. this.applyMember.level_id = item.value;
  722. this.memberInfo.member_level = item.value;
  723. this.applyMember.member_level_name = item.label;
  724. } else {
  725. this.applyMember.level_id = '';
  726. this.memberInfo.level_id = '';
  727. this.applyMember.member_level_name = '';
  728. }
  729. this.$forceUpdate();
  730. },
  731. verify() {
  732. if (!this.addMemberData.mobile) {
  733. this.$util.showToast({
  734. title: '请输入客户手机号'
  735. });
  736. return false;
  737. }
  738. if (!/^1(3|4|5|6|7|8|9)\d{9}$/.test(this.addMemberData.mobile)) {
  739. this.$util.showToast({
  740. title: '请输入正确的手机号码'
  741. });
  742. return false;
  743. }
  744. return true;
  745. },
  746. // 客户操作
  747. memberAction(type) {
  748. switch (type) {
  749. case 'memberinfo':
  750. this.$refs.memberInfoPop.open('center');
  751. break;
  752. case 'point':
  753. this.$refs.pointPop.open('center');
  754. break;
  755. case 'balance':
  756. this.$api.sendRequest({
  757. url: '/cashier/storeapi/member/info',
  758. data: {
  759. member_id: this.memberId
  760. },
  761. success: res => {
  762. if (res.code >= 0) {
  763. this.$store.commit('setMemberInfo', res.data);
  764. }
  765. if (getCurrentPages()[0].route == 'pages/recharge/index') this.$root.type = 'topUp';
  766. else this.$util.redirectTo('/pages/recharge/index');
  767. }
  768. });
  769. break;
  770. case 'sendCoupon':
  771. this.getCouponList();
  772. this.$refs.sendCouponPop.open('center');
  773. break;
  774. case 'growth':
  775. this.$refs.growthPop.open('center');
  776. break;
  777. case 'couponlist':
  778. this.option = {
  779. member_id: this.memberId
  780. };
  781. this.$refs.couponlistPop.open('center');
  782. break;
  783. case 'cardlist':
  784. this.option = {
  785. member_id: this.memberId
  786. };
  787. this.$refs.memberCard.open('center');
  788. break;
  789. case 'point_list':
  790. // 积分列表
  791. this.option = {
  792. member_id: this.memberId,
  793. account_type: 'point'
  794. };
  795. this.$refs.pointListPop.open();
  796. break;
  797. case 'balance_list':
  798. // 余额列表
  799. this.option = {
  800. member_id: this.memberId,
  801. account_type: 'balance'
  802. };
  803. this.$refs.balanceListPop.open();
  804. break;
  805. case 'growth_list':
  806. // 成长值列表
  807. this.option = {
  808. member_id: this.memberId,
  809. account_type: 'growth'
  810. };
  811. this.$refs.growthListPop.open();
  812. break;
  813. case 'applyMember':
  814. this.$refs.applyMemberPop.open();
  815. break;
  816. }
  817. },
  818. popClose(type) {
  819. switch (type) {
  820. case 'memberinfo':
  821. this.$refs.memberInfoPop.close();
  822. break;
  823. case 'point':
  824. this.$refs.pointPop.close();
  825. break;
  826. case 'balance':
  827. this.$refs.balancePop.close();
  828. break;
  829. case 'sendCoupon':
  830. this.$refs.sendCouponPop.close();
  831. break;
  832. case 'growth':
  833. this.$refs.growthPop.close();
  834. break;
  835. case 'couponlist':
  836. this.$refs.couponlistPop.close();
  837. break;
  838. case 'cardlist':
  839. this.$refs.cardlistPop.close();
  840. break;
  841. case 'point_list':
  842. // 积分列表
  843. this.$refs.pointListPop.close();
  844. break;
  845. case 'balance_list':
  846. // 余额列表
  847. this.$refs.balanceListPop.close();
  848. break;
  849. case 'growth_list':
  850. // 成长值列表
  851. this.$refs.growthListPop.close();
  852. break;
  853. case 'applyMember':
  854. // 办理会员
  855. this.$refs.applyMemberPop.close();
  856. break;
  857. }
  858. },
  859. //获取发放优惠券列表
  860. getCouponList() {
  861. let data = {
  862. page: this.sendCoupon.page,
  863. page_size: 7
  864. };
  865. this.$api.sendRequest({
  866. url: '/cashier/storeapi/coupon/couponTypeList',
  867. data: data,
  868. success: res => {
  869. if (res.code >= 0) {
  870. if (this.sendCoupon.page == 1) this.sendCoupon.list = [];
  871. if (res.data.list && res.data.list.length) {
  872. res.data.list.forEach((item, index) => {
  873. if (item.validity_type == 0) item.validity_name = '失效日期:' + this.$util.timeFormat(item.end_time);
  874. else if (item.validity_type == 1) item.validity_name = '领取后,' + item.fixed_term + '天有效';
  875. else item.validity_name = '长期有效';
  876. item.num = 0;
  877. });
  878. }
  879. this.sendCoupon.list = this.sendCoupon.list.concat(res.data.list);
  880. if (res.data.page_count >= this.sendCoupon.page) this.sendCoupon.page++;
  881. }
  882. }
  883. });
  884. },
  885. // 发放数量
  886. dec: function(item) {
  887. if (item.num > 0) {
  888. item.num = item.num - 1;
  889. }
  890. },
  891. inc: function(item) {
  892. item.num = item.num + 1;
  893. },
  894. // 发放优惠券
  895. sendCouponFn() {
  896. if (!this.sendCoupon.list || !this.sendCoupon.list.length) return false;
  897. let data = {};
  898. data.member_id = this.memberInfo.member_id;
  899. data.coupon_data = '';
  900. let couponDataArr = [];
  901. this.sendCoupon.list.forEach((item, index) => {
  902. if (item.num > 0) {
  903. let obj = {};
  904. obj.coupon_type_id = item.coupon_type_id;
  905. obj.num = item.num;
  906. couponDataArr.push(obj);
  907. }
  908. });
  909. if (couponDataArr.length <= 0) return false;
  910. data.coupon_data = JSON.stringify(couponDataArr);
  911. this.$api.sendRequest({
  912. url: '/cashier/storeapi/member/sendCoupon',
  913. data: data,
  914. success: res => {
  915. this.$util.showToast({
  916. title: res.message
  917. });
  918. if (res.code >= 0) {
  919. this.sendCoupon.page = 1;
  920. this.sendCoupon.list = [];
  921. this.getMemberInfo();
  922. this.$refs.sendCouponPop.close();
  923. }
  924. }
  925. });
  926. },
  927. //修改客户信息
  928. saveMemberInfo() {
  929. this.$api.sendRequest({
  930. url: '/cashier/storeapi/member/editmember',
  931. data: {
  932. nickname: this.memberInfo.nickname,
  933. sex: this.memberInfo.sex,
  934. birthday: this.memberInfo.birthday,
  935. member_id: this.memberInfo.member_id,
  936. mobile: this.memberInfo.mobile,
  937. level_id: this.memberInfo.member_level
  938. },
  939. success: res => {
  940. this.$util.showToast({
  941. title: res.message
  942. });
  943. if (res.code >= 0) {
  944. this.getMemberInfo();
  945. this.popClose('memberinfo');
  946. }
  947. }
  948. });
  949. },
  950. // 调整积分
  951. savePoint() {
  952. this.$api.sendRequest({
  953. url: '/cashier/storeapi/member/modifypoint',
  954. data: {
  955. member_id: this.memberInfo.member_id,
  956. adjust_num: this.pointData.num,
  957. remark: this.pointData.desc
  958. },
  959. success: res => {
  960. this.$util.showToast({
  961. title: res.message
  962. });
  963. if (res.code >= 0) {
  964. this.pointData.num = 0;
  965. this.pointData.desc = '';
  966. this.getMemberInfo();
  967. this.popClose('point');
  968. }
  969. }
  970. });
  971. },
  972. // 调整余额
  973. saveBalance() {
  974. this.$api.sendRequest({
  975. url: '/cashier/storeapi/member/modifybalance',
  976. data: {
  977. member_id: this.memberInfo.member_id,
  978. adjust_num: this.balanceData.num,
  979. remark: this.balanceData.desc
  980. },
  981. success: res => {
  982. this.$util.showToast({
  983. title: res.message
  984. });
  985. if (res.code >= 0) {
  986. this.balanceData.num = 0;
  987. this.balanceData.desc = '';
  988. this.getMemberInfo();
  989. this.popClose('balance');
  990. }
  991. }
  992. });
  993. },
  994. // 调整成长值
  995. saveGrowth() {
  996. this.$api.sendRequest({
  997. url: '/cashier/storeapi/member/modifygrowth',
  998. data: {
  999. member_id: this.memberInfo.member_id,
  1000. adjust_num: this.growthData.num,
  1001. remark: this.growthData.desc
  1002. },
  1003. success: res => {
  1004. this.$util.showToast({
  1005. title: res.message
  1006. });
  1007. if (res.code >= 0) {
  1008. this.growthData.num = 0;
  1009. this.growthData.desc = '';
  1010. this.getMemberInfo();
  1011. this.popClose('growth');
  1012. }
  1013. }
  1014. });
  1015. },
  1016. // 办理会员卡
  1017. saveApplyMember() {
  1018. if (!this.applyMember.level_id) {
  1019. this.$util.showToast({
  1020. title: '请选择会员卡等级'
  1021. });
  1022. return false;
  1023. }
  1024. this.$api.sendRequest({
  1025. url: '/cashier/storeapi/member/handleMember',
  1026. data: {
  1027. member_id: this.memberInfo.member_id,
  1028. level_id: this.applyMember.level_id,
  1029. member_code: this.applyMember.member_code
  1030. },
  1031. success: res => {
  1032. this.$util.showToast({
  1033. title: res.message
  1034. });
  1035. if (res.code >= 0) {
  1036. this.$root.page = 1;
  1037. this.$root.search_text = 1;
  1038. this.$root.getMemberList();
  1039. this.popClose('applyMember');
  1040. }
  1041. }
  1042. });
  1043. },
  1044. refundBalance() {
  1045. this.$api.sendRequest({
  1046. url: '/cashier/storeapi/cashierorderrefund/getMemberBalanceRefundData',
  1047. data: {
  1048. member_id: this.memberInfo.member_id
  1049. },
  1050. success: res => {
  1051. if (res.code == 0) {
  1052. this.refundData = res.data;
  1053. this.refundData.refund_balance = this.$util.moneyFormat(res.data.can_refund_balance);
  1054. this.refundTransferTypeList = res.data.refund_transfer_type_list;
  1055. this.refundTransferType = Object.keys(res.data.refund_transfer_type_list)[0];
  1056. this.$refs.refundBalance.open();
  1057. } else {
  1058. this.$util.showToast({
  1059. title: res.message
  1060. });
  1061. }
  1062. }
  1063. });
  1064. },
  1065. confirmRefundBalance() {
  1066. if (isNaN(parseFloat(this.refundData.refund_balance))) {
  1067. this.$util.showToast({
  1068. title: '退还金额格式错误'
  1069. });
  1070. return;
  1071. }
  1072. if (parseFloat(this.refundData.refund_balance) > parseFloat(this.refundData.can_refund_balance)) {
  1073. this.$util.showToast({
  1074. title: '退还金额超出最大可退金额'
  1075. });
  1076. return;
  1077. }
  1078. if (this.refundData.refund_balance <= 0) {
  1079. this.$util.showToast({
  1080. title: '退还金额不能小于等于0'
  1081. });
  1082. return;
  1083. }
  1084. if (this.isRepeat) return;
  1085. this.isRepeat = true;
  1086. this.$api.sendRequest({
  1087. url: '/cashier/storeapi/cashierorderrefund/memberRefundBalance',
  1088. data: {
  1089. refund_balance: this.$util.moneyFormat(this.refundData.refund_balance),
  1090. member_id: this.memberInfo.member_id,
  1091. refund_transfer_type: this.refundTransferType
  1092. },
  1093. success: res => {
  1094. if (res.code == 0) {
  1095. this.$util.showToast({
  1096. title: '储值退还成功'
  1097. });
  1098. this.getMemberInfo();
  1099. this.$refs.refundBalance.close();
  1100. } else {
  1101. this.$util.showToast({
  1102. title: res.message
  1103. });
  1104. }
  1105. this.isRepeat = true;
  1106. }
  1107. });
  1108. },
  1109. headError(item) {
  1110. item.headimg = this.defaultImg.head;
  1111. }
  1112. }
  1113. };
  1114. </script>
  1115. <style lang="scss">
  1116. .member-detail-wrap {
  1117. width: 100%;
  1118. border-left: 0;
  1119. .member-head {
  1120. height: 0.66rem;
  1121. line-height: 0.66rem;
  1122. box-sizing: border-box;
  1123. border-bottom: 0.01rem solid #e6e6e6;
  1124. font-size: 0.14rem;
  1125. }
  1126. .member-content {
  1127. padding: 0.15rem;
  1128. width: 100%;
  1129. height: calc(100vh - 0.8rem);
  1130. box-sizing: border-box;
  1131. .content-block {
  1132. width: 100%;
  1133. box-sizing: border-box;
  1134. display: flex;
  1135. align-items: center;
  1136. .item-img {
  1137. width: 0.7rem;
  1138. height: 0.7rem;
  1139. border-radius: 50%;
  1140. box-sizing: border-box;
  1141. image {
  1142. width: 100%;
  1143. height: 100%;
  1144. border-radius: 50%;
  1145. }
  1146. }
  1147. .item-content {
  1148. padding-left: 0.15rem;
  1149. width: calc(100% - 0.7rem);
  1150. box-sizing: border-box;
  1151. .item-title {
  1152. width: 100%;
  1153. font-size: 0.16rem;
  1154. align-items: center;
  1155. display: flex;
  1156. .item-label {
  1157. border: 0.01rem solid $primary-color;
  1158. color: $primary-color;
  1159. background-color: #fff;
  1160. border-radius: 0.02rem;
  1161. width: fit-content;
  1162. padding: 0.01rem 0.05rem;
  1163. margin-left: 0.15rem;
  1164. }
  1165. .item-title-text {
  1166. overflow: hidden;
  1167. text-overflow: ellipsis;
  1168. white-space: nowrap;
  1169. max-width: 50%;
  1170. font-size: 0.16rem;
  1171. }
  1172. }
  1173. .info-list {
  1174. margin-top: 0.15rem;
  1175. display: flex;
  1176. justify-content: space-between;
  1177. .info-item {
  1178. font-size: 0.14rem;
  1179. margin-right: 0.2rem;
  1180. }
  1181. }
  1182. }
  1183. }
  1184. .content-block.account {
  1185. border: 0.01rem solid #e6e6e6;
  1186. background-color: #ffffff;
  1187. padding: 0.25rem 0;
  1188. display: flex;
  1189. justify-content: space-around;
  1190. margin-top: 0.2rem;
  1191. border-radius: 0.03rem;
  1192. align-items: baseline;
  1193. .content-data-item {
  1194. .data-item-title {
  1195. }
  1196. .data-item-value {
  1197. font-size: 0.26rem;
  1198. margin-top: 0.1rem;
  1199. }
  1200. .data-item-action {
  1201. margin-top: 0.1rem;
  1202. color: $primary-color;
  1203. cursor: pointer;
  1204. float: left;
  1205. &:nth-child(2n) {
  1206. margin-left: 0.1rem;
  1207. }
  1208. }
  1209. }
  1210. }
  1211. .content-block.assets {
  1212. display: flex;
  1213. justify-content: space-around;
  1214. margin-top: 0.2rem;
  1215. .content-data-left {
  1216. background-color: #ffffff;
  1217. padding: 0.25rem 0;
  1218. border-radius: 0.03rem;
  1219. width: calc(50% - 0.075rem);
  1220. margin-right: 0.15rem;
  1221. display: flex;
  1222. justify-content: space-around;
  1223. height: 1rem;
  1224. .content-data-item {
  1225. .data-item-title {
  1226. }
  1227. .data-item-value {
  1228. font-size: 0.26rem;
  1229. margin-top: 0.1rem;
  1230. }
  1231. .data-item-action {
  1232. margin-top: 0.15rem;
  1233. color: $primary-color;
  1234. cursor: pointer;
  1235. }
  1236. }
  1237. }
  1238. .content-data-right {
  1239. background-color: #ffffff;
  1240. padding: 0.25rem 0;
  1241. border-radius: 0.03rem;
  1242. width: calc(50% - 0.075rem);
  1243. display: flex;
  1244. justify-content: space-around;
  1245. height: 1rem;
  1246. .content-data-item {
  1247. .data-item-title {
  1248. }
  1249. .data-item-value {
  1250. font-size: 0.26rem;
  1251. margin-top: 0.1rem;
  1252. }
  1253. .data-item-action {
  1254. margin-top: 0.15rem;
  1255. color: $primary-color;
  1256. }
  1257. }
  1258. }
  1259. }
  1260. .content-block.action {
  1261. display: flex;
  1262. justify-content: flex-start;
  1263. margin-top: 0.2rem;
  1264. .content-data-item {
  1265. border: 0.01rem solid #e6e6e6;
  1266. width: calc(100% / 6);
  1267. background-color: #ffffff;
  1268. display: flex;
  1269. padding: 0.15rem 0;
  1270. border-radius: 0.03rem;
  1271. align-items: center;
  1272. text-align: center;
  1273. flex-direction: column;
  1274. margin-right: 0.15rem;
  1275. cursor: pointer;
  1276. .data-item-icon {
  1277. width: 0.55rem;
  1278. height: 0.55rem;
  1279. image {
  1280. width: 100%;
  1281. height: 100%;
  1282. }
  1283. }
  1284. .data-item-value {
  1285. margin-top: 0.1rem;
  1286. }
  1287. &:last-child {
  1288. margin-right: 0;
  1289. }
  1290. }
  1291. }
  1292. }
  1293. }
  1294. // pop弹框
  1295. .pop-box {
  1296. background: #ffffff;
  1297. width: 8rem;
  1298. height: 7rem;
  1299. .pop-header {
  1300. padding: 0 0.15rem 0 0.2rem;
  1301. height: 0.5rem;
  1302. line-height: 0.5rem;
  1303. border-bottom: 0.01rem solid #f0f0f0;
  1304. font-size: 0.14rem;
  1305. color: #333;
  1306. overflow: hidden;
  1307. border-radius: 0.02rem 0.2rem 0 0;
  1308. box-sizing: border-box;
  1309. display: flex;
  1310. justify-content: space-between;
  1311. .pop-header-text {
  1312. }
  1313. .pop-header-close {
  1314. cursor: pointer;
  1315. i {
  1316. font-size: 0.18rem;
  1317. }
  1318. }
  1319. }
  1320. .pop-content {
  1321. height: calc(100% - 1rem);
  1322. overflow-y: scroll;
  1323. padding: 0.1rem 0.2rem;
  1324. box-sizing: border-box;
  1325. }
  1326. .pop-bottom {
  1327. button {
  1328. width: 95%;
  1329. }
  1330. }
  1331. }
  1332. //表单
  1333. .form-content {
  1334. display: flex;
  1335. flex-direction: column;
  1336. align-items: center;
  1337. .form-item {
  1338. margin-bottom: 0.1rem;
  1339. display: flex;
  1340. &:last-of-type {
  1341. margin-bottom: 0;
  1342. }
  1343. .form-label {
  1344. width: 1.2rem;
  1345. text-align: right;
  1346. padding-right: 0.1rem;
  1347. box-sizing: border-box;
  1348. height: 0.32rem;
  1349. line-height: 0.32rem;
  1350. .required {
  1351. color: red;
  1352. margin-right: 0.03rem;
  1353. }
  1354. }
  1355. .form-inline {
  1356. width: 2.4rem;
  1357. line-height: 0.32rem;
  1358. margin-right: 0.1rem;
  1359. box-sizing: border-box;
  1360. .form-input {
  1361. border-width: 0.01rem;
  1362. border-style: solid;
  1363. background-color: #fff;
  1364. color: rgba(0, 0, 0, 0.85);
  1365. border-radius: 0.02rem;
  1366. padding-left: 0.1rem;
  1367. height: 0.32rem;
  1368. line-height: 0.32rem;
  1369. font-size: 0.14rem;
  1370. border-color: #e6e6e6;
  1371. border-radius: 0.02rem;
  1372. }
  1373. .form-textarea {
  1374. border-width: 0.01rem;
  1375. border-style: solid;
  1376. background-color: #fff;
  1377. color: rgba(0, 0, 0, 0.85);
  1378. border-radius: 0.02rem;
  1379. padding-left: 0.1rem;
  1380. line-height: 0.32rem;
  1381. font-size: 0.14rem;
  1382. border-color: #e6e6e6;
  1383. width: 100%;
  1384. }
  1385. .word-aux {
  1386. color: #999;
  1387. font-size: 0.12rem;
  1388. line-height: 1.5;
  1389. margin-top: 0.05rem;
  1390. }
  1391. }
  1392. .search-wrap {
  1393. position: relative;
  1394. i {
  1395. position: absolute;
  1396. top: 50%;
  1397. right: 0.1rem;
  1398. transform: translateY(-50%);
  1399. border-left: 0.01rem solid #e6e6e6;
  1400. line-height: 0.3rem;
  1401. padding-left: 0.1rem;
  1402. cursor: pointer;
  1403. }
  1404. }
  1405. }
  1406. }
  1407. .memberInfo-box {
  1408. width: 7.5rem;
  1409. height: 4.21rem;
  1410. }
  1411. .pointPop-box {
  1412. width: 7rem;
  1413. height: 3.94rem;
  1414. }
  1415. .balancePop-box {
  1416. width: 6rem;
  1417. height: 4.2rem;
  1418. }
  1419. .couponlistPop-box {
  1420. width: 10rem;
  1421. height: 5.7rem;
  1422. .pop-content {
  1423. height: calc(100% - 0.5rem);
  1424. }
  1425. /deep/ .tpage {
  1426. position: absolute;
  1427. right: 0;
  1428. bottom: 0;
  1429. }
  1430. }
  1431. .applyMemberPop-box {
  1432. width: 6rem;
  1433. height: 3.38rem;
  1434. .pop-content {
  1435. overflow: initial;
  1436. }
  1437. }
  1438. .cardlistPop-box {
  1439. width: 10rem;
  1440. height: 5.7rem;
  1441. .pop-content {
  1442. height: calc(100% - 0.5rem);
  1443. }
  1444. /deep/ .tpage {
  1445. position: absolute;
  1446. right: 0;
  1447. bottom: 0;
  1448. }
  1449. }
  1450. .sendCoupon-box {
  1451. width: 9rem;
  1452. height: 5.06rem;
  1453. .sendCoupon-content {
  1454. padding: 0.1rem 0.2rem;
  1455. .coupon-table-head {
  1456. display: flex;
  1457. background: #f7f8fa;
  1458. }
  1459. .coupon-table-body {
  1460. height: 3.2rem;
  1461. .coupon-table-tr {
  1462. display: flex;
  1463. border-bottom: 0.01rem solid #e6e6e6;
  1464. }
  1465. .table-input {
  1466. height: 0.3rem;
  1467. line-height: 0.3rem;
  1468. border: 0.01rem solid #e6e6e6;
  1469. padding: 0 0.1rem;
  1470. text-align: center;
  1471. }
  1472. .item-num {
  1473. display: flex;
  1474. align-items: center;
  1475. margin-left: 0.1rem;
  1476. .num-dec {
  1477. width: 0.6rem;
  1478. height: 0.25rem;
  1479. background: #e6e6e6;
  1480. border: 0.01rem solid #e6e6e6;
  1481. border-radius: 30%;
  1482. text-align: center;
  1483. line-height: 0.23rem;
  1484. font-size: 0.25rem;
  1485. margin-right: 0.1rem;
  1486. cursor: pointer;
  1487. transition: 0.3s;
  1488. }
  1489. .num-inc {
  1490. width: 0.6rem;
  1491. height: 0.25rem;
  1492. background: $primary-color;
  1493. border: 0.01rem solid #e6e6e6;
  1494. border-radius: 30%;
  1495. text-align: center;
  1496. line-height: 0.23rem;
  1497. font-size: 0.25rem;
  1498. margin-left: 0.1rem;
  1499. cursor: pointer;
  1500. transition: 0.3s;
  1501. color: #fff;
  1502. }
  1503. }
  1504. .coupon-table-td:nth-child(4) {
  1505. padding: 0 0.05rem;
  1506. }
  1507. }
  1508. .coupon-table-td,
  1509. .coupon-table-th {
  1510. padding: 0 0.1rem;
  1511. display: flex;
  1512. align-items: center;
  1513. height: 0.5rem;
  1514. &:nth-child(1) {
  1515. flex-basis: 30%;
  1516. }
  1517. &:nth-child(2) {
  1518. flex-basis: 20%;
  1519. }
  1520. &:nth-child(3) {
  1521. flex-basis: 30%;
  1522. }
  1523. &:nth-child(4) {
  1524. justify-content: flex-end;
  1525. flex-basis: 20%;
  1526. text-align: right;
  1527. }
  1528. }
  1529. }
  1530. .pop-bottom {
  1531. margin-top: 0.12rem;
  1532. }
  1533. .empty {
  1534. display: flex;
  1535. align-items: center;
  1536. justify-content: center;
  1537. height: 0.5rem;
  1538. border-bottom: 0.01rem solid #e6e6e6;
  1539. color: #909399;
  1540. .iconfont {
  1541. font-size: 0.25rem;
  1542. margin: 0.05rem;
  1543. }
  1544. }
  1545. }
  1546. </style>