Compare commits
414 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
5e4d228ac2 | ||
|
|
f2491124d1 | ||
|
|
ef7d3d7a1a | ||
|
|
ea7ce1636e | ||
|
|
a2de4ccb2e | ||
|
|
0a1182f1e6 | ||
|
|
47a77ff046 | ||
|
|
1923061d78 | ||
|
|
8ed1d92f80 | ||
|
|
7c330ebeb1 | ||
|
|
6e872f0287 | ||
|
|
7cdb8d5456 | ||
|
|
c106423742 | ||
|
|
108bb6c901 | ||
|
|
e45a1db2f9 | ||
|
|
9e630bb2ba | ||
|
|
c03778676c | ||
|
|
c970309802 | ||
|
|
5227e0ae13 | ||
|
|
cf193f4eab | ||
|
|
708ae53fe2 | ||
|
|
aed57177dd | ||
|
|
e916a03ff8 | ||
|
|
859d60c0bf | ||
|
|
1eeaf38638 | ||
|
|
ca09bbe3fc | ||
|
|
57b42bdc66 | ||
|
|
88c31d157e | ||
|
|
c738274423 | ||
|
|
1c62ee6efe | ||
|
|
4fcb24607d | ||
|
|
52ce1e795c | ||
|
|
39c4593d9e | ||
|
|
6ae288cf01 | ||
|
|
bab54570fe | ||
|
|
2551c76d97 | ||
|
|
e3a5583802 | ||
|
|
b03adc1b1f | ||
|
|
6e9d725f6d | ||
|
|
92559ca9e7 | ||
|
|
3bfa99f578 | ||
|
|
30b85163b7 | ||
|
|
ef528a2952 | ||
|
|
907e9d35a7 | ||
|
|
d003e5da70 | ||
|
|
19530988ce | ||
|
|
4e9baebcf5 | ||
|
|
3a1cbfe8bb | ||
|
|
c16b37c8bc | ||
|
|
0c6703f04d | ||
|
|
3471caf00a | ||
|
|
ad28e70a07 | ||
|
|
47315963f1 | ||
|
|
fb8fa9e787 | ||
|
|
223fa7ca05 | ||
|
|
b568c242e3 | ||
|
|
e4283e1c53 | ||
|
|
25f9cc1095 | ||
|
|
85729e3761 | ||
|
|
fa0a0cb1d8 | ||
|
|
e7ee256b80 | ||
|
|
36190438f0 | ||
|
|
ce629a1fb6 | ||
|
|
f989d1ef4e | ||
|
|
99455dee58 | ||
|
|
c7bd7223bc | ||
|
|
8166f90f0f | ||
|
|
8b2587daa7 | ||
|
|
82e047c797 | ||
|
|
3cefb40ccb | ||
|
|
8bba4a1e48 | ||
|
|
a12f317aa8 | ||
|
|
1d133af38d | ||
|
|
9cab354cbb | ||
|
|
c0385414ca | ||
|
|
4f7846dc4e | ||
|
|
01beac9265 | ||
|
|
77ad146e24 | ||
|
|
6c1c47de1d | ||
|
|
b3cac070df | ||
|
|
daf1b20f67 | ||
|
|
2316fb8d11 | ||
|
|
43159335f8 | ||
|
|
0e56c2038d | ||
|
|
0840740e2c | ||
|
|
e2404f0f3b | ||
|
|
5e9a258cc8 | ||
|
|
8cfc420085 | ||
|
|
83593bd015 | ||
|
|
c1cdf97edb | ||
|
|
eca8370c70 | ||
|
|
54502b331f | ||
|
|
0ec5955ea0 | ||
|
|
b70a9bf0c0 | ||
|
|
fb20cb32da | ||
|
|
a314373e64 | ||
|
|
4976b87c4e | ||
|
|
3b9e54375a | ||
|
|
8b15cfb0b1 | ||
|
|
ff02cce191 | ||
|
|
83beb81a3b | ||
|
|
de89249d3e | ||
|
|
77732e766a | ||
|
|
21c91cfcf1 | ||
|
|
ebaf5e34d8 | ||
|
|
94e389ab23 | ||
|
|
7ba94c7fe1 | ||
|
|
c47394a162 | ||
|
|
bf8afdc0f4 | ||
|
|
3df17ed33f | ||
|
|
dc6d3b3743 | ||
|
|
6e626f6e11 | ||
|
|
d20da31f2c | ||
|
|
2182cd012a | ||
|
|
71c629cb06 | ||
|
|
185d675abf | ||
|
|
6221b59b21 | ||
|
|
07f320ca2f | ||
|
|
9908b83b18 | ||
|
|
9ce1c966eb | ||
|
|
c81eff58d3 | ||
|
|
92b61a203f | ||
|
|
b1f9c0adf2 | ||
|
|
c5d75a3570 | ||
|
|
42c64920b1 | ||
|
|
77e7d095a7 | ||
|
|
560199944d | ||
|
|
21ae217369 | ||
|
|
4565297fe6 | ||
|
|
118e68b8ac | ||
|
|
a03f908e96 | ||
|
|
0b6dcf17d1 | ||
|
|
5136f8b3dd | ||
|
|
286295393d | ||
|
|
195ea35798 | ||
|
|
053279f60d | ||
|
|
9bfb7e8b69 | ||
|
|
c82f8a6de3 | ||
|
|
749147cfad | ||
|
|
4429227665 | ||
|
|
3ec0e9d997 | ||
|
|
904046f02c | ||
|
|
5a29215b80 | ||
|
|
508a00d103 | ||
|
|
5385d10bc8 | ||
|
|
08b4a04791 | ||
|
|
218cee2aef | ||
|
|
63b22f4c86 | ||
|
|
709a3f71fd | ||
|
|
f7589e42ab | ||
|
|
0e7008862e | ||
|
|
7e88ee930b | ||
|
|
e935f2a3e3 | ||
|
|
9d442a2aa1 | ||
|
|
eed6ba43d9 | ||
|
|
b2c286f0f5 | ||
|
|
2aae5a4bff | ||
|
|
c88c1865e7 | ||
|
|
7152e339e5 | ||
|
|
46143beb83 | ||
|
|
2c66eaae2b | ||
|
|
b8c74ac84c | ||
|
|
cb210916eb | ||
|
|
f968f3d20d | ||
|
|
4ef2496221 | ||
|
|
b2b56178a2 | ||
|
|
525838468c | ||
|
|
ef92bcfe3a | ||
|
|
ed72c2ffc2 | ||
|
|
9f94c2013a | ||
|
|
8666254ffe | ||
|
|
e13fc57ae7 | ||
|
|
c6cf90fb4e | ||
|
|
fff086a3a1 | ||
|
|
b7a2a5af6d | ||
|
|
1786dfeee2 | ||
|
|
2c32088f4c | ||
|
|
71f61461ce | ||
|
|
54be87efea | ||
|
|
76fc55fdd0 | ||
|
|
5d5a845523 | ||
|
|
4f915a32b6 | ||
|
|
78df54d153 | ||
|
|
24554a0768 | ||
|
|
ffe03fd785 | ||
|
|
4b635735ae | ||
|
|
79c1e2c5bb | ||
|
|
cf9f9fb7dd | ||
|
|
2bcefc1306 | ||
|
|
39547b542c | ||
|
|
8c9246faa4 | ||
|
|
74b180f6d3 | ||
|
|
ac26690e78 | ||
|
|
d642e00844 | ||
|
|
7bbb657379 | ||
|
|
00a56473f1 | ||
|
|
e138275c0a | ||
|
|
9e7a1b3ee3 | ||
|
|
c5e06ad1f2 | ||
|
|
128ad892d1 | ||
|
|
552b4c605d | ||
|
|
8b33dbe8d7 | ||
|
|
8a43335b75 | ||
|
|
a4d17102f1 | ||
|
|
d02d0adb39 | ||
|
|
c86cecf4f0 | ||
|
|
7bc5d67efc | ||
|
|
d058d7d6e8 | ||
|
|
914fa0a324 | ||
|
|
4389911436 | ||
|
|
841d48e2a7 | ||
|
|
b6c16e7048 | ||
|
|
9fce33ca18 | ||
|
|
6a653198c3 | ||
|
|
2c8e34008f | ||
|
|
6feb650f06 | ||
|
|
873764b59e | ||
|
|
36ef331b94 | ||
|
|
308619fbdd | ||
|
|
6dec218e81 | ||
|
|
f9717eb7ac | ||
|
|
cb10bd97a0 | ||
|
|
430894eb69 | ||
|
|
34cb3b4a29 | ||
|
|
b89f81e5d6 | ||
|
|
604bdcaf77 | ||
|
|
a46cd8ee97 | ||
|
|
7e14569479 | ||
|
|
3c296ea011 | ||
|
|
8529641145 | ||
|
|
b133502062 | ||
|
|
5470253626 | ||
|
|
6b697f9ecd | ||
|
|
44558d9072 | ||
|
|
8dbd5429f0 | ||
|
|
3c83179579 | ||
|
|
bf70527c58 | ||
|
|
26a539662e | ||
|
|
48f2bd82a1 | ||
|
|
73c2654cc5 | ||
|
|
49dfd644a2 | ||
|
|
09ce16dc95 | ||
|
|
5b58d1de5e | ||
|
|
775b339c17 | ||
|
|
1ef8dd26cf | ||
|
|
b36be16f38 | ||
|
|
1c765f37cf | ||
|
|
724922dddc | ||
|
|
9dece4dd2c | ||
|
|
4a628acd37 | ||
|
|
5c3501f08d | ||
|
|
ad09b38ed5 | ||
|
|
c60a54b8f9 | ||
|
|
056386e8e9 | ||
|
|
8ad79b8728 | ||
|
|
a78374910f | ||
|
|
4318e8d0da | ||
|
|
4ace1a9cca | ||
|
|
7ded1c564e | ||
|
|
28d68bdca6 | ||
|
|
9181befdf9 | ||
|
|
87b3cbe344 | ||
|
|
8b0ca5ba7e | ||
|
|
b30be8efb2 | ||
|
|
2213f0d0ce | ||
|
|
0883a967b6 | ||
|
|
c8e8685586 | ||
|
|
73ce45aff9 | ||
|
|
e954cf4d92 | ||
|
|
d1a974f6b0 | ||
|
|
39f7f1ed38 | ||
|
|
5380cf9ba9 | ||
|
|
6e9ca81b58 | ||
|
|
531ed5b2dd | ||
|
|
ebc79da0fc | ||
|
|
1cbafbce25 | ||
|
|
816d842a57 | ||
|
|
e5c25895a0 | ||
|
|
1abc7a5a52 | ||
|
|
170244cc9c | ||
|
|
3498de4529 | ||
|
|
16b0d457fc | ||
|
|
87b6ddbaa6 | ||
|
|
2f6e50cc1c | ||
|
|
aa196918bf | ||
|
|
5958353383 | ||
|
|
f37f633f51 | ||
|
|
8c286610ba | ||
|
|
d2540733dc | ||
|
|
ab56bdfcad | ||
|
|
803eae5c7d | ||
|
|
6b3892e17d | ||
|
|
500afcc33f | ||
|
|
64c61d5365 | ||
|
|
bf58711c88 | ||
|
|
48b3e3246c | ||
|
|
8f629db5ab | ||
|
|
1ca94d289a | ||
|
|
3159c325e3 | ||
|
|
b51040c73e | ||
|
|
f4ddeaa5c5 | ||
|
|
8599708af3 | ||
|
|
72fb11d3d3 | ||
|
|
7d0b3c6908 | ||
|
|
f7a9bff2ba | ||
|
|
4fd419fcfe | ||
|
|
f72c28d770 | ||
|
|
7c775f7692 | ||
|
|
ac0404adaa | ||
|
|
40ccbf3edb | ||
|
|
2aa7b67b7a | ||
|
|
4700bc995a | ||
|
|
7052fa7420 | ||
|
|
08c62e5c9c | ||
|
|
32b29f45e7 | ||
|
|
49d023cef0 | ||
|
|
674c2352ef | ||
|
|
96156508b5 | ||
|
|
802f13e6e5 | ||
|
|
5d24dda4c1 | ||
|
|
2207d11c7c | ||
|
|
495096c779 | ||
|
|
9375ba9e31 | ||
|
|
42a24d854b | ||
|
|
cc31b6232f | ||
|
|
092873592d | ||
|
|
70757e8adf | ||
|
|
b1fb019b01 | ||
|
|
ed4f78bf6a | ||
|
|
826ba41866 | ||
|
|
4886b53847 | ||
|
|
56d6401cda | ||
|
|
36794613cd | ||
|
|
cfd2529caf | ||
|
|
f0628c5995 | ||
|
|
4780ae5b18 | ||
|
|
5a93abb946 | ||
|
|
d371fd0146 | ||
|
|
c850a27cca | ||
|
|
a97ed0c3f6 | ||
|
|
3c65de9912 | ||
|
|
c6e1cc060a | ||
|
|
9df377677b | ||
|
|
69caf86c7e | ||
|
|
c86d863f1d | ||
|
|
c130597e95 | ||
|
|
5d16a7a80e | ||
|
|
bad9f9109c | ||
|
|
7e33598b8e | ||
|
|
83f145767e | ||
|
|
8ea3843d61 | ||
|
|
29cc6002cd | ||
|
|
db33b34f18 | ||
|
|
73acb0bc09 | ||
|
|
94ab061cc8 | ||
|
|
4f243afb63 | ||
|
|
efd3ed26df | ||
|
|
e7d1664673 | ||
|
|
7b7310ed75 | ||
|
|
c8649caf1a | ||
|
|
aaa2deef85 | ||
|
|
b0ed6635e5 | ||
|
|
0dc3124bba | ||
|
|
1135c1fbc3 | ||
|
|
779f6e4fa1 | ||
|
|
f4bf4dc060 | ||
|
|
84d3dd247d | ||
|
|
61c44af5a0 | ||
|
|
e8b7a85140 | ||
|
|
aa4dbc1bbd | ||
|
|
3881370b6e | ||
|
|
0fa93d545e | ||
|
|
a92c213b64 | ||
|
|
fcc9a9f8c5 | ||
|
|
0ffd0f0c29 | ||
|
|
3afad96b8f | ||
|
|
d9e1a4a491 | ||
|
|
2e4246e63b | ||
|
|
235d582ae2 | ||
|
|
c34e2ad6ad | ||
|
|
78b8a002e9 | ||
|
|
29091739d4 | ||
|
|
aa05ee1165 | ||
|
|
2446c28b20 | ||
|
|
8378182730 | ||
|
|
d84250ab88 | ||
|
|
5218388eff | ||
|
|
984bc4b635 | ||
|
|
acc9a0b88a | ||
|
|
a31c7a5ad0 | ||
|
|
f0882793e4 | ||
|
|
053e5ce062 | ||
|
|
34ef7e555a | ||
|
|
34165127f0 | ||
|
|
4d347df505 | ||
|
|
830154371a | ||
|
|
69c2c4c5c2 | ||
|
|
a5d067943d | ||
|
|
1e190e3a88 | ||
|
|
b042bd6052 | ||
|
|
3861881996 | ||
|
|
405bb4a216 | ||
|
|
c382f015f4 | ||
|
|
c083a58f30 | ||
|
|
a78d637468 | ||
|
|
0cb32caa3e | ||
|
|
8095aa0d8e | ||
|
|
60117f51b3 | ||
|
|
b51a5e6deb | ||
|
|
b9869053c2 | ||
|
|
f1753babbe | ||
|
|
05f8defe56 | ||
|
|
af115c45cc | ||
|
|
532fc8b2dd |
143
LICENSE
@@ -1,5 +1,5 @@
|
|||||||
GNU GENERAL PUBLIC LICENSE
|
GNU AFFERO GENERAL PUBLIC LICENSE
|
||||||
Version 3, 29 June 2007
|
Version 3, 19 November 2007
|
||||||
|
|
||||||
Copyright (C) 2007 Free Software Foundation, Inc. <http://fsf.org/>
|
Copyright (C) 2007 Free Software Foundation, Inc. <http://fsf.org/>
|
||||||
Everyone is permitted to copy and distribute verbatim copies
|
Everyone is permitted to copy and distribute verbatim copies
|
||||||
@@ -7,17 +7,15 @@
|
|||||||
|
|
||||||
Preamble
|
Preamble
|
||||||
|
|
||||||
The GNU General Public License is a free, copyleft license for
|
The GNU Affero General Public License is a free, copyleft license for
|
||||||
software and other kinds of works.
|
software and other kinds of works, specifically designed to ensure
|
||||||
|
cooperation with the community in the case of network server software.
|
||||||
|
|
||||||
The licenses for most software and other practical works are designed
|
The licenses for most software and other practical works are designed
|
||||||
to take away your freedom to share and change the works. By contrast,
|
to take away your freedom to share and change the works. By contrast,
|
||||||
the GNU General Public License is intended to guarantee your freedom to
|
our General Public Licenses are intended to guarantee your freedom to
|
||||||
share and change all versions of a program--to make sure it remains free
|
share and change all versions of a program--to make sure it remains free
|
||||||
software for all its users. We, the Free Software Foundation, use the
|
software for all its users.
|
||||||
GNU General Public License for most of our software; it applies also to
|
|
||||||
any other work released this way by its authors. You can apply it to
|
|
||||||
your programs, too.
|
|
||||||
|
|
||||||
When we speak of free software, we are referring to freedom, not
|
When we speak of free software, we are referring to freedom, not
|
||||||
price. Our General Public Licenses are designed to make sure that you
|
price. Our General Public Licenses are designed to make sure that you
|
||||||
@@ -26,44 +24,34 @@ them if you wish), that you receive source code or can get it if you
|
|||||||
want it, that you can change the software or use pieces of it in new
|
want it, that you can change the software or use pieces of it in new
|
||||||
free programs, and that you know you can do these things.
|
free programs, and that you know you can do these things.
|
||||||
|
|
||||||
To protect your rights, we need to prevent others from denying you
|
Developers that use our General Public Licenses protect your rights
|
||||||
these rights or asking you to surrender the rights. Therefore, you have
|
with two steps: (1) assert copyright on the software, and (2) offer
|
||||||
certain responsibilities if you distribute copies of the software, or if
|
you this License which gives you legal permission to copy, distribute
|
||||||
you modify it: responsibilities to respect the freedom of others.
|
and/or modify the software.
|
||||||
|
|
||||||
For example, if you distribute copies of such a program, whether
|
A secondary benefit of defending all users' freedom is that
|
||||||
gratis or for a fee, you must pass on to the recipients the same
|
improvements made in alternate versions of the program, if they
|
||||||
freedoms that you received. You must make sure that they, too, receive
|
receive widespread use, become available for other developers to
|
||||||
or can get the source code. And you must show them these terms so they
|
incorporate. Many developers of free software are heartened and
|
||||||
know their rights.
|
encouraged by the resulting cooperation. However, in the case of
|
||||||
|
software used on network servers, this result may fail to come about.
|
||||||
|
The GNU General Public License permits making a modified version and
|
||||||
|
letting the public access it on a server without ever releasing its
|
||||||
|
source code to the public.
|
||||||
|
|
||||||
Developers that use the GNU GPL protect your rights with two steps:
|
The GNU Affero General Public License is designed specifically to
|
||||||
(1) assert copyright on the software, and (2) offer you this License
|
ensure that, in such cases, the modified source code becomes available
|
||||||
giving you legal permission to copy, distribute and/or modify it.
|
to the community. It requires the operator of a network server to
|
||||||
|
provide the source code of the modified version running there to the
|
||||||
|
users of that server. Therefore, public use of a modified version, on
|
||||||
|
a publicly accessible server, gives the public access to the source
|
||||||
|
code of the modified version.
|
||||||
|
|
||||||
For the developers' and authors' protection, the GPL clearly explains
|
An older license, called the Affero General Public License and
|
||||||
that there is no warranty for this free software. For both users' and
|
published by Affero, was designed to accomplish similar goals. This is
|
||||||
authors' sake, the GPL requires that modified versions be marked as
|
a different license, not a version of the Affero GPL, but Affero has
|
||||||
changed, so that their problems will not be attributed erroneously to
|
released a new version of the Affero GPL which permits relicensing under
|
||||||
authors of previous versions.
|
this license.
|
||||||
|
|
||||||
Some devices are designed to deny users access to install or run
|
|
||||||
modified versions of the software inside them, although the manufacturer
|
|
||||||
can do so. This is fundamentally incompatible with the aim of
|
|
||||||
protecting users' freedom to change the software. The systematic
|
|
||||||
pattern of such abuse occurs in the area of products for individuals to
|
|
||||||
use, which is precisely where it is most unacceptable. Therefore, we
|
|
||||||
have designed this version of the GPL to prohibit the practice for those
|
|
||||||
products. If such problems arise substantially in other domains, we
|
|
||||||
stand ready to extend this provision to those domains in future versions
|
|
||||||
of the GPL, as needed to protect the freedom of users.
|
|
||||||
|
|
||||||
Finally, every program is threatened constantly by software patents.
|
|
||||||
States should not allow patents to restrict development and use of
|
|
||||||
software on general-purpose computers, but in those that do, we wish to
|
|
||||||
avoid the special danger that patents applied to a free program could
|
|
||||||
make it effectively proprietary. To prevent this, the GPL assures that
|
|
||||||
patents cannot be used to render the program non-free.
|
|
||||||
|
|
||||||
The precise terms and conditions for copying, distribution and
|
The precise terms and conditions for copying, distribution and
|
||||||
modification follow.
|
modification follow.
|
||||||
@@ -72,7 +60,7 @@ modification follow.
|
|||||||
|
|
||||||
0. Definitions.
|
0. Definitions.
|
||||||
|
|
||||||
"This License" refers to version 3 of the GNU General Public License.
|
"This License" refers to version 3 of the GNU Affero General Public License.
|
||||||
|
|
||||||
"Copyright" also means copyright-like laws that apply to other kinds of
|
"Copyright" also means copyright-like laws that apply to other kinds of
|
||||||
works, such as semiconductor masks.
|
works, such as semiconductor masks.
|
||||||
@@ -549,35 +537,45 @@ to collect a royalty for further conveying from those to whom you convey
|
|||||||
the Program, the only way you could satisfy both those terms and this
|
the Program, the only way you could satisfy both those terms and this
|
||||||
License would be to refrain entirely from conveying the Program.
|
License would be to refrain entirely from conveying the Program.
|
||||||
|
|
||||||
13. Use with the GNU Affero General Public License.
|
13. Remote Network Interaction; Use with the GNU General Public License.
|
||||||
|
|
||||||
|
Notwithstanding any other provision of this License, if you modify the
|
||||||
|
Program, your modified version must prominently offer all users
|
||||||
|
interacting with it remotely through a computer network (if your version
|
||||||
|
supports such interaction) an opportunity to receive the Corresponding
|
||||||
|
Source of your version by providing access to the Corresponding Source
|
||||||
|
from a network server at no charge, through some standard or customary
|
||||||
|
means of facilitating copying of software. This Corresponding Source
|
||||||
|
shall include the Corresponding Source for any work covered by version 3
|
||||||
|
of the GNU General Public License that is incorporated pursuant to the
|
||||||
|
following paragraph.
|
||||||
|
|
||||||
Notwithstanding any other provision of this License, you have
|
Notwithstanding any other provision of this License, you have
|
||||||
permission to link or combine any covered work with a work licensed
|
permission to link or combine any covered work with a work licensed
|
||||||
under version 3 of the GNU Affero General Public License into a single
|
under version 3 of the GNU General Public License into a single
|
||||||
combined work, and to convey the resulting work. The terms of this
|
combined work, and to convey the resulting work. The terms of this
|
||||||
License will continue to apply to the part which is the covered work,
|
License will continue to apply to the part which is the covered work,
|
||||||
but the special requirements of the GNU Affero General Public License,
|
but the work with which it is combined will remain governed by version
|
||||||
section 13, concerning interaction through a network will apply to the
|
3 of the GNU General Public License.
|
||||||
combination as such.
|
|
||||||
|
|
||||||
14. Revised Versions of this License.
|
14. Revised Versions of this License.
|
||||||
|
|
||||||
The Free Software Foundation may publish revised and/or new versions of
|
The Free Software Foundation may publish revised and/or new versions of
|
||||||
the GNU General Public License from time to time. Such new versions will
|
the GNU Affero General Public License from time to time. Such new versions
|
||||||
be similar in spirit to the present version, but may differ in detail to
|
will be similar in spirit to the present version, but may differ in detail to
|
||||||
address new problems or concerns.
|
address new problems or concerns.
|
||||||
|
|
||||||
Each version is given a distinguishing version number. If the
|
Each version is given a distinguishing version number. If the
|
||||||
Program specifies that a certain numbered version of the GNU General
|
Program specifies that a certain numbered version of the GNU Affero General
|
||||||
Public License "or any later version" applies to it, you have the
|
Public License "or any later version" applies to it, you have the
|
||||||
option of following the terms and conditions either of that numbered
|
option of following the terms and conditions either of that numbered
|
||||||
version or of any later version published by the Free Software
|
version or of any later version published by the Free Software
|
||||||
Foundation. If the Program does not specify a version number of the
|
Foundation. If the Program does not specify a version number of the
|
||||||
GNU General Public License, you may choose any version ever published
|
GNU Affero General Public License, you may choose any version ever published
|
||||||
by the Free Software Foundation.
|
by the Free Software Foundation.
|
||||||
|
|
||||||
If the Program specifies that a proxy can decide which future
|
If the Program specifies that a proxy can decide which future
|
||||||
versions of the GNU General Public License can be used, that proxy's
|
versions of the GNU Affero General Public License can be used, that proxy's
|
||||||
public statement of acceptance of a version permanently authorizes you
|
public statement of acceptance of a version permanently authorizes you
|
||||||
to choose that version for the Program.
|
to choose that version for the Program.
|
||||||
|
|
||||||
@@ -635,40 +633,29 @@ the "copyright" line and a pointer to where the full notice is found.
|
|||||||
Copyright (C) <year> <name of author>
|
Copyright (C) <year> <name of author>
|
||||||
|
|
||||||
This program is free software: you can redistribute it and/or modify
|
This program is free software: you can redistribute it and/or modify
|
||||||
it under the terms of the GNU General Public License as published by
|
it under the terms of the GNU Affero General Public License as published
|
||||||
the Free Software Foundation, either version 3 of the License, or
|
by the Free Software Foundation, either version 3 of the License, or
|
||||||
(at your option) any later version.
|
(at your option) any later version.
|
||||||
|
|
||||||
This program is distributed in the hope that it will be useful,
|
This program is distributed in the hope that it will be useful,
|
||||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||||
GNU General Public License for more details.
|
GNU Affero General Public License for more details.
|
||||||
|
|
||||||
You should have received a copy of the GNU General Public License
|
You should have received a copy of the GNU Affero General Public License
|
||||||
along with this program. If not, see <http://www.gnu.org/licenses/>.
|
along with this program. If not, see <http://www.gnu.org/licenses/>.
|
||||||
|
|
||||||
Also add information on how to contact you by electronic and paper mail.
|
Also add information on how to contact you by electronic and paper mail.
|
||||||
|
|
||||||
If the program does terminal interaction, make it output a short
|
If your software can interact with users remotely through a computer
|
||||||
notice like this when it starts in an interactive mode:
|
network, you should also make sure that it provides a way for users to
|
||||||
|
get its source. For example, if your program is a web application, its
|
||||||
<program> Copyright (C) <year> <name of author>
|
interface could display a "Source" link that leads users to an archive
|
||||||
This program comes with ABSOLUTELY NO WARRANTY; for details type `show w'.
|
of the code. There are many ways you could offer source, and different
|
||||||
This is free software, and you are welcome to redistribute it
|
solutions will be better for different programs; see section 13 for the
|
||||||
under certain conditions; type `show c' for details.
|
specific requirements.
|
||||||
|
|
||||||
The hypothetical commands `show w' and `show c' should show the appropriate
|
|
||||||
parts of the General Public License. Of course, your program's commands
|
|
||||||
might be different; for a GUI interface, you would use an "about box".
|
|
||||||
|
|
||||||
You should also get your employer (if you work as a programmer) or school,
|
You should also get your employer (if you work as a programmer) or school,
|
||||||
if any, to sign a "copyright disclaimer" for the program, if necessary.
|
if any, to sign a "copyright disclaimer" for the program, if necessary.
|
||||||
For more information on this, and how to apply and follow the GNU GPL, see
|
For more information on this, and how to apply and follow the GNU AGPL, see
|
||||||
<http://www.gnu.org/licenses/>.
|
<http://www.gnu.org/licenses/>.
|
||||||
|
|
||||||
The GNU General Public License does not permit incorporating your program
|
|
||||||
into proprietary programs. If your program is a subroutine library, you
|
|
||||||
may consider it more useful to permit linking proprietary applications with
|
|
||||||
the library. If this is what you want to do, use the GNU Lesser General
|
|
||||||
Public License instead of this License. But first, please read
|
|
||||||
<http://www.gnu.org/philosophy/why-not-lgpl.html>.
|
|
||||||
|
|||||||
108
README.md
@@ -2,27 +2,88 @@
|
|||||||
|
|
||||||
#### 欢迎交流需求,交流业务,交流技术(基础问题自行解决,其他问题先看文档后提问)
|
#### 欢迎交流需求,交流业务,交流技术(基础问题自行解决,其他问题先看文档后提问)
|
||||||
|
|
||||||
|
#### 不用削尖脑袋往老群里加,老群活跃度较低,很多潜水党,新群相对而言活跃一些 :tw-1f606: :tw-1f606: :tw-1f606: :tw-1f606: :tw-1f606: :tw-1f606:
|
||||||
|
|
||||||
|
#### PS: **演示站点所有环境均部署master分支。如果有演示站点问题,可以反馈,如果演示站点没问题本地运行有问题,需自行处理**
|
||||||
|
|
||||||
##### 交流 qq 1群 961316482(已满)
|
##### 交流 qq 1群 961316482(已满)
|
||||||
<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=BAhURE3DG2YWhQk6kRxVapbLykqMoPS8&jump_from=webapi"><img border="0" src="https://pub.idqqimg.com/wpa/images/group.png" alt="Lilishop交流群" title="Lilishop交流群">点击快捷加群</a>
|
|
||||||
|
|
||||||
##### 交流 qq 2群 875294241(已满)
|
##### 交流 qq 2群 875294241(已满)
|
||||||
|
##### 交流 qq 3群 263785057(已满)
|
||||||
<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=_lrekOvr5k2p5uTn5GRidI-chKEmpCX3&jump_from=webapi"><img border="0" src="https://pub.idqqimg.com/wpa/images/group.png" alt="Lilishop交流群2群" title="Lilishop交流群2群">点击快捷加群</a>
|
##### 交流 qq 4群 674617534 (已满)
|
||||||
|
##### 交流 qq 5群 594675235
|
||||||
|
|
||||||
##### 交流 qq 3群 263785057
|
|
||||||
|
|
||||||
<a target="_blank" href="https://qm.qq.com/cgi-bin/qm/qr?k=VUogkDvaso4zLTFH8nxFPDRKq0EthUn1&jump_from=webapi"><img border="0" src="//pub.idqqimg.com/wpa/images/group.png" alt="Lilishop交流群3群" title="Lilishop交流群3群">点击快捷加群</a>
|
|
||||||
|
|
||||||
|
|
||||||
##### 体验 公众号/小程序/APP 体验,扫描二维码
|
##### 体验 公众号/小程序/APP 体验,扫描二维码
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
[](https://gitee.com/beijing_hongye_huicheng/lilishop/stargazers)
|
[](https://gitee.com/beijing_hongye_huicheng/lilishop/stargazers)
|
||||||

|

|
||||||
|
|
||||||
|
## 如何在本地环境运行lilishop-ui部署视频
|
||||||
|
https://www.bilibili.com/video/BV1B28EeJEnP/
|
||||||
|
|
||||||
|
## 如何在服务器上部署lilishop-ui
|
||||||
|
https://www.bilibili.com/video/BV1WD87eoE9F/
|
||||||
|
|
||||||
|
|
||||||
|
## 开发项目
|
||||||
|
|
||||||
|
#### 安装Node.js
|
||||||
|
保证`node`版本`14`,推荐 14.17.0
|
||||||
|
|
||||||
|
可以使用 `yarn` 或者 `npm` 进行安装
|
||||||
|
|
||||||
|
#### yarn 安装/启动
|
||||||
|
```
|
||||||
|
// 如果没有 yarn 安装yarn
|
||||||
|
npm install yarn -g
|
||||||
|
|
||||||
|
// 切换源
|
||||||
|
yarn config set registry https://registry.npmmirror.com
|
||||||
|
|
||||||
|
// 以buyer项目为例
|
||||||
|
cd buyer
|
||||||
|
|
||||||
|
yarn install
|
||||||
|
|
||||||
|
yarn dev
|
||||||
|
```
|
||||||
|
|
||||||
|
#### npm 安装/启动
|
||||||
|
```
|
||||||
|
npm config set registry https://registry.npmmirror.com
|
||||||
|
|
||||||
|
// 以buyer项目为例
|
||||||
|
cd buyer
|
||||||
|
|
||||||
|
npm run install
|
||||||
|
|
||||||
|
npm run dev
|
||||||
|
```
|
||||||
|
|
||||||
|
#### FAQ
|
||||||
|
|
||||||
|
##### npmmirror镜像源报错 451 Unavailable For Legal Reasons
|
||||||
|
```
|
||||||
|
//切换其他的镜像源
|
||||||
|
|
||||||
|
// npm
|
||||||
|
npm config set registry http://mirrors.cloud.tencent.com/npm/
|
||||||
|
|
||||||
|
// yarn
|
||||||
|
yarn config set registry http://mirrors.cloud.tencent.com/npm/
|
||||||
|
```
|
||||||
|
|
||||||
|
##### 安装不上去
|
||||||
|
|
||||||
|
可以按照这个思路排查一下
|
||||||
|
|
||||||
|
```
|
||||||
|
1. 看下Node.js 是否是14.17.0
|
||||||
|
2. 项目目录下是否有 package-lock.json 或者 .npmrc 或者 .yarnrc 设置了镜像源, 如果有可以删除重新install
|
||||||
|
3. 切换当前 npm 或者 yarn 镜像源重试
|
||||||
|
```
|
||||||
|
|
||||||
|
|
||||||
### 商城介绍
|
### 商城介绍
|
||||||
**官网**:https://pickmall.cn
|
**官网**:https://pickmall.cn
|
||||||
@@ -60,7 +121,7 @@ PS:手机验证码为 ‘111111’
|
|||||||
|
|
||||||
**商城 小程序/公众号/APP**:扫描二维码
|
**商城 小程序/公众号/APP**:扫描二维码
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
### 快速本地部署
|
### 快速本地部署
|
||||||
|
|
||||||
@@ -79,24 +140,24 @@ PS:手机验证码为 ‘111111’
|
|||||||
|
|
||||||
#### 平台管理端功能
|
#### 平台管理端功能
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
#### 卖家功能
|
#### 卖家功能
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
|
|
||||||
### 商城前端功能展示
|
### 商城前端功能展示
|
||||||
|
|
||||||
#### 商城移动端
|
#### 商城移动端
|
||||||
|
|
||||||
<img src="https://pickmall.cn/assets/imgs/other/app.gif" alt="移动端功能展示" style="zoom:50%;" />
|
<img src="https://static.pickmall.cn/images/other/app.gif" alt="移动端功能展示" style="zoom:50%;" />
|
||||||
|
|
||||||
#### 平台管理端
|
#### 平台管理端
|
||||||
|
|
||||||

|

|
||||||
|
|
||||||
|
|
||||||
### 技术选型
|
### 技术选型
|
||||||
@@ -166,6 +227,15 @@ PS:手机验证码为 ‘111111’
|
|||||||
|
|
||||||
### 交流群
|
### 交流群
|
||||||
|
|
||||||
##### 官方qq 1群 961316482(已满)
|
##### 交流 qq 1群 961316482(已满)
|
||||||
##### 官方qq 2群 875294241(已满)
|
##### 交流 qq 2群 875294241(已满)
|
||||||
##### 官网qq 3群 263785057
|
##### 交流 qq 3群 263785057(已满)
|
||||||
|
##### 交流 qq 4群 674617534(已满)
|
||||||
|
##### 交流 qq 5群 594675235
|
||||||
|
|
||||||
|
### 附录
|
||||||
|
有人有自己的学习视频、学习记录文档、希望宣传关联开源项目等均可以私聊仓库所有者。
|
||||||
|
|
||||||
|
类似:
|
||||||
|
|
||||||
|
清晨敲代码同学的分析: https://blog.csdn.net/vaevaevae233/category_12103567.html
|
||||||
1
build.sh
@@ -1,7 +1,6 @@
|
|||||||
#代码目录
|
#代码目录
|
||||||
code_path=$PWD
|
code_path=$PWD
|
||||||
|
|
||||||
git checkout master
|
|
||||||
git pull
|
git pull
|
||||||
|
|
||||||
cd ${code_path}/manager
|
cd ${code_path}/manager
|
||||||
|
|||||||
@@ -1,5 +0,0 @@
|
|||||||
# 默认依赖包指定淘宝源
|
|
||||||
registry=https://registry.npm.taobao.org/
|
|
||||||
sass_binary_site=https://npm.taobao.org/mirrors/node-sass/
|
|
||||||
phantomjs_cdnurl=https://npm.taobao.org/mirrors/phantomjs/
|
|
||||||
electron_mirror=https://npm.taobao.org/mirrors/electron/
|
|
||||||
@@ -1,5 +0,0 @@
|
|||||||
registry "https://registry.npmmirror.com"
|
|
||||||
sass_binary_site "https://npmmirror.com/mirrors/node-sass"
|
|
||||||
phantomjs_cdnurl "https://npmmirror.com/mirrors/phantomjs"
|
|
||||||
electron_mirror "https://npmmirror.com/mirrors/electron"
|
|
||||||
|
|
||||||
11355
buyer/package-lock.json
generated
@@ -10,11 +10,13 @@
|
|||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@amap/amap-jsapi-loader": "0.0.7",
|
"@amap/amap-jsapi-loader": "0.0.7",
|
||||||
"axios": "^0.19.2",
|
"axios": "^0.19.2",
|
||||||
|
"dplayer": "^1.27.1",
|
||||||
"js-cookie": "^2.2.1",
|
"js-cookie": "^2.2.1",
|
||||||
"less": "^2.7.0",
|
"less": "^2.7.0",
|
||||||
"less-loader": "^5.0.0",
|
"less-loader": "^5.0.0",
|
||||||
"mv-count-down": "^0.1.15",
|
"mv-count-down": "^0.1.15",
|
||||||
"node-sass": "^4.14.1",
|
"node-sass": "^4.14.1",
|
||||||
|
"postcss-loader": "^7.0.1",
|
||||||
"psl": "^1.8.0",
|
"psl": "^1.8.0",
|
||||||
"qs": "^6.9.4",
|
"qs": "^6.9.4",
|
||||||
"sass-loader": "^7.3.1",
|
"sass-loader": "^7.3.1",
|
||||||
|
|||||||
@@ -3,15 +3,15 @@ var BASE = {
|
|||||||
* @description api请求基础路径
|
* @description api请求基础路径
|
||||||
*/
|
*/
|
||||||
API_DEV: {
|
API_DEV: {
|
||||||
common: "http://localhost:8890",
|
common: "https://common-api.pickmall.cn",
|
||||||
buyer: "http://localhost:8888",
|
buyer: "https://buyer-api.pickmall.cn",
|
||||||
seller: "http://localhost:8889",
|
seller: "https://store-api.pickmall.cn",
|
||||||
manager: "http://localhost:8887"
|
manager: "https://admin-api.pickmall.cn"
|
||||||
},
|
},
|
||||||
API_PROD: {
|
API_PROD: {
|
||||||
common: "http://192.168.2.110:8890",
|
common: "https://common-api.pickmall.cn",
|
||||||
buyer: "http://192.168.2.110:8888",
|
buyer: "https://buyer-api.pickmall.cn",
|
||||||
seller: "http://192.168.2.110:8889",
|
seller: "https://store-api.pickmall.cn",
|
||||||
manager: "http://192.168.2.110:8887"
|
manager: "https://admin-api.pickmall.cn"
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -3,6 +3,7 @@
|
|||||||
<head>
|
<head>
|
||||||
<meta charset="utf-8">
|
<meta charset="utf-8">
|
||||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||||
|
<meta name='description' content='在线购物平台'>
|
||||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||||
<link rel="icon" href="<%= BASE_URL %>logo.ico">
|
<link rel="icon" href="<%= BASE_URL %>logo.ico">
|
||||||
<title><%= htmlWebpackPlugin.options.title %></title>
|
<title><%= htmlWebpackPlugin.options.title %></title>
|
||||||
|
|||||||
@@ -10,10 +10,12 @@ import { getBaseSite } from "@/api/common.js";
|
|||||||
export default {
|
export default {
|
||||||
name: "App",
|
name: "App",
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|
||||||
this.init();
|
this.init();
|
||||||
},
|
},
|
||||||
methods:{
|
methods:{
|
||||||
init(){
|
init(){
|
||||||
|
|
||||||
if(!storage.getItem("siteName")||!storage.getItem("logoImg")||!storage.getItem("sitelogo_expiration_time")) {
|
if(!storage.getItem("siteName")||!storage.getItem("logoImg")||!storage.getItem("sitelogo_expiration_time")) {
|
||||||
this.getSite();
|
this.getSite();
|
||||||
}else{
|
}else{
|
||||||
@@ -26,13 +28,14 @@ export default {
|
|||||||
//动态获取icon
|
//动态获取icon
|
||||||
let link =document.querySelector("link[rel*='icon']") ||document.createElement("link");
|
let link =document.querySelector("link[rel*='icon']") ||document.createElement("link");
|
||||||
link.type = "image/x-icon";
|
link.type = "image/x-icon";
|
||||||
link.href = storage.getItem("logoImg");
|
link.href = storage.getItem("siteIcon");
|
||||||
link.rel = "shortcut icon";
|
link.rel = "shortcut icon";
|
||||||
document.getElementsByTagName("head")[0].appendChild(link);
|
document.getElementsByTagName("head")[0].appendChild(link);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
|
|
||||||
getSite(){
|
getSite(){
|
||||||
//获取基本站点信息
|
//获取基本站点信息
|
||||||
getBaseSite().then((res) => {
|
getBaseSite().then((res) => {
|
||||||
@@ -45,12 +48,12 @@ export default {
|
|||||||
// 存放信息
|
// 存放信息
|
||||||
storage.setItem('siteName', data.siteName);
|
storage.setItem('siteName', data.siteName);
|
||||||
storage.setItem('logoImg', data.buyerSideLogo);
|
storage.setItem('logoImg', data.buyerSideLogo);
|
||||||
|
storage.setItem("siteIcon",data.buyerSideIcon);
|
||||||
window.document.title = data.siteName;
|
window.document.title = data.siteName;
|
||||||
//动态获取icon
|
//动态获取icon
|
||||||
let link =document.querySelector("link[rel*='icon']") ||document.createElement("link");
|
let link =document.querySelector("link[rel*='icon']") ||document.createElement("link");
|
||||||
link.type = "image/x-icon";
|
link.type = "image/x-icon";
|
||||||
link.href = data.buyerSideLogo;
|
link.href = data.buyerSideIcon;
|
||||||
link.rel = "shortcut icon";
|
link.rel = "shortcut icon";
|
||||||
document.getElementsByTagName("head")[0].appendChild(link);
|
document.getElementsByTagName("head")[0].appendChild(link);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -212,3 +212,52 @@ export function receiptSelect (params) {
|
|||||||
params
|
params
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取全部配送方式
|
||||||
|
*/
|
||||||
|
export function shippingMethodList(params) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/trade/carts/shippingMethodList`,
|
||||||
|
method: Method.GET,
|
||||||
|
needToken: true,
|
||||||
|
params: params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取全部配送方式
|
||||||
|
*/
|
||||||
|
export function storeAddressList(params) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/store/address/shippingMethodList`,
|
||||||
|
method: Method.GET,
|
||||||
|
needToken: true,
|
||||||
|
params: params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 设置自提地址ID
|
||||||
|
* @param addressId
|
||||||
|
*/
|
||||||
|
export function setStoreAddressId(storeAddressId,way) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/trade/carts/storeAddress?storeAddressId=${storeAddressId}&way=${way}`,
|
||||||
|
method: Method.GET,
|
||||||
|
needToken: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 提交配送方式
|
||||||
|
* @param params
|
||||||
|
*/
|
||||||
|
export function setShipMethod(params) {
|
||||||
|
return request({
|
||||||
|
url: "/buyer/trade/carts/shippingMethod",
|
||||||
|
method: Method.PUT,
|
||||||
|
needToken: true,
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|||||||
@@ -10,6 +10,19 @@ export function getVerifyImg (verificationEnums) {
|
|||||||
needToken: false
|
needToken: false
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
export function getImSetting(params) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/other/setting/get/IM_SETTING`,
|
||||||
|
method: Method.GET,
|
||||||
|
needToken: true,
|
||||||
|
params,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 验证码校验
|
* 验证码校验
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -1,5 +1,16 @@
|
|||||||
import request, { Method } from "@/plugins/request.js";
|
import request, { Method } from "@/plugins/request.js";
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取首页专题数据
|
||||||
|
*/
|
||||||
|
export function getTopicData(id) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/other/pageData/get/${id}`,
|
||||||
|
method: Method.GET,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
// 获取首页楼层装修数据
|
// 获取首页楼层装修数据
|
||||||
export function indexData(params) {
|
export function indexData(params) {
|
||||||
return request({
|
return request({
|
||||||
@@ -10,6 +21,15 @@ export function indexData(params) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 获取自动发券
|
||||||
|
export function getAutoCoup(){
|
||||||
|
return request({
|
||||||
|
url: "/buyer/promotion/coupon/activity",
|
||||||
|
method: Method.GET,
|
||||||
|
needToken: true,
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取店铺楼层数据
|
* 获取店铺楼层数据
|
||||||
*/
|
*/
|
||||||
|
|||||||
@@ -59,7 +59,7 @@ export function withdrawalApply (params) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// 收藏商品、店铺
|
// 收藏商品
|
||||||
export function collectGoods (type, id) {
|
export function collectGoods (type, id) {
|
||||||
return request({
|
return request({
|
||||||
url: `/buyer/member/collection/add/${type}/${id}`,
|
url: `/buyer/member/collection/add/${type}/${id}`,
|
||||||
@@ -68,7 +68,16 @@ export function collectGoods (type, id) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// 取消 收藏商品、店铺
|
// 收藏店铺
|
||||||
|
export function collectStore (type, id) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/member/storeCollection/add/${type}/${id}`,
|
||||||
|
method: Method.POST,
|
||||||
|
needToken: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 取消 收藏商品
|
||||||
export function cancelCollect (type, id) {
|
export function cancelCollect (type, id) {
|
||||||
return request({
|
return request({
|
||||||
url: `/buyer/member/collection/delete/${type}/${id}`,
|
url: `/buyer/member/collection/delete/${type}/${id}`,
|
||||||
@@ -77,7 +86,16 @@ export function cancelCollect (type, id) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// 查看是否收藏
|
// 取消 收藏店铺
|
||||||
|
export function cancelStoreCollect (type, id) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/member/storeCollection/delete/${type}/${id}`,
|
||||||
|
method: Method.DELETE,
|
||||||
|
needToken: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 查看是否收藏商品
|
||||||
export function isCollection (type, goodsId) {
|
export function isCollection (type, goodsId) {
|
||||||
return request({
|
return request({
|
||||||
url: `/buyer/member/collection/isCollection/${type}/${goodsId}`,
|
url: `/buyer/member/collection/isCollection/${type}/${goodsId}`,
|
||||||
@@ -86,7 +104,16 @@ export function isCollection (type, goodsId) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
// 会员收藏列表
|
// 查看是否收藏店铺
|
||||||
|
export function isStoreCollection (type, goodsId) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/member/storeCollection/isCollection/${type}/${goodsId}`,
|
||||||
|
method: Method.GET,
|
||||||
|
needToken: true
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
// 会员收藏商品列表
|
||||||
export function collectList (params) {
|
export function collectList (params) {
|
||||||
return request({
|
return request({
|
||||||
url: `/buyer/member/collection/${params.type}`,
|
url: `/buyer/member/collection/${params.type}`,
|
||||||
@@ -96,6 +123,16 @@ export function collectList (params) {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 会员收藏店铺列表
|
||||||
|
export function storeCollectList (params) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/member/storeCollection/${params.type}`,
|
||||||
|
method: Method.GET,
|
||||||
|
needToken: true,
|
||||||
|
params
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
// 单个商品评价
|
// 单个商品评价
|
||||||
export function goodsComment (params) {
|
export function goodsComment (params) {
|
||||||
return request({
|
return request({
|
||||||
@@ -490,3 +527,44 @@ export function getGoodsDistribution (distributionId) {
|
|||||||
needToken: true
|
needToken: true
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取会员发票抬头列表
|
||||||
|
*/
|
||||||
|
export function getMemberReceiptList (params) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/wallet/receipt`,
|
||||||
|
method: Method.GET,
|
||||||
|
needToken: true,
|
||||||
|
params
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 保存会员发票抬头
|
||||||
|
*/
|
||||||
|
export function setMemberReceiptList (params) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/wallet/receipt`,
|
||||||
|
method: Method.POST,
|
||||||
|
needToken: true,
|
||||||
|
data:params
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 保存会员发票抬头
|
||||||
|
*/
|
||||||
|
export function delMemberReceipt(id) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/wallet/receipt/${id}`,
|
||||||
|
method: Method.DELETE,
|
||||||
|
needToken: true,
|
||||||
|
params:{id},
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/x-www-form-urlencoded",
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -115,3 +115,21 @@ export function getLogisticsCompany () {
|
|||||||
params: { pageNumber: 1, pageSize: 200, disabled: 'OPEN' }
|
params: { pageNumber: 1, pageSize: 200, disabled: 'OPEN' }
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
//查询包裹列表
|
||||||
|
export const getPackage = (sn) => {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/order/order/getPackage/${sn}`,
|
||||||
|
method: Method.GET,
|
||||||
|
needToken: true,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
//查询物流
|
||||||
|
export const getTracesList = (sn, params) => {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/order/order/getTracesList/${sn}`,
|
||||||
|
method: Method.GET,
|
||||||
|
needToken: true,
|
||||||
|
})
|
||||||
|
};
|
||||||
|
|||||||
@@ -46,3 +46,17 @@ export function payCallback (params) {
|
|||||||
params
|
params
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 支付结果查询
|
||||||
|
* @param orderType 交易类型,可用值:TRADE,ORDER,RECHARGE
|
||||||
|
* @param sn 订单编号
|
||||||
|
*/
|
||||||
|
export function withdrawalSettingVO (params) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/wallet/wallet/withdrawalSettingVO`,
|
||||||
|
needToken: true,
|
||||||
|
method: Method.GET,
|
||||||
|
params
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|||||||
@@ -75,3 +75,15 @@ export function applyStatus () {
|
|||||||
method: Method.GET
|
method: Method.GET
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 获取自提点信息
|
||||||
|
* @param storeId
|
||||||
|
*/
|
||||||
|
export function getStoreAddress(storeId,params) {
|
||||||
|
return request({
|
||||||
|
url: `/buyer/store/address/page/${storeId}`,
|
||||||
|
method: Method.GET,
|
||||||
|
params
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|||||||
BIN
buyer/src/assets/iconfont/back.png
Normal file
|
After Width: | Height: | Size: 682 B |
BIN
buyer/src/assets/iconfont/carts.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |
BIN
buyer/src/assets/iconfont/collage.png
Normal file
|
After Width: | Height: | Size: 2.9 KiB |
BIN
buyer/src/assets/iconfont/consumer.png
Normal file
|
After Width: | Height: | Size: 2.0 KiB |
BIN
buyer/src/assets/iconfont/feedback.png
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
buyer/src/assets/iconfont/notice.png
Normal file
|
After Width: | Height: | Size: 1.6 KiB |
BIN
buyer/src/assets/iconfont/notification.png
Normal file
|
After Width: | Height: | Size: 2.1 KiB |
1
buyer/src/assets/iconfont/play.svg
Normal file
@@ -0,0 +1 @@
|
|||||||
|
<?xml version="1.0" encoding="UTF-8"?><svg width="24" height="24" viewBox="0 0 48 48" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M24 44C35.0457 44 44 35.0457 44 24C44 12.9543 35.0457 4 24 4C12.9543 4 4 12.9543 4 24C4 35.0457 12.9543 44 24 44Z" fill="none" stroke="#333" stroke-width="4" stroke-linejoin="round"/><path d="M20 24V17.0718L26 20.5359L32 24L26 27.4641L20 30.9282V24Z" fill="none" stroke="#333" stroke-width="4" stroke-linejoin="round"/></svg>
|
||||||
|
After Width: | Height: | Size: 468 B |
BIN
buyer/src/assets/iconfont/shop.png
Normal file
|
After Width: | Height: | Size: 2.3 KiB |
BIN
buyer/src/assets/iconfont/story.png
Normal file
|
After Width: | Height: | Size: 2.8 KiB |
BIN
buyer/src/assets/iconfont/support.png
Normal file
|
After Width: | Height: | Size: 3.2 KiB |
BIN
buyer/src/assets/iconfont/user.png
Normal file
|
After Width: | Height: | Size: 1.8 KiB |
BIN
buyer/src/assets/images/default.png
Normal file
|
After Width: | Height: | Size: 11 KiB |
@@ -10,20 +10,28 @@ $warning_color: #ff9900;
|
|||||||
$error_color: #ed3f14;
|
$error_color: #ed3f14;
|
||||||
$handle-btn-color: #438cde;
|
$handle-btn-color: #438cde;
|
||||||
|
|
||||||
$theme_color: #e4393c;
|
$theme_color: #F31947;
|
||||||
|
|
||||||
$border_color: #dddee1;
|
$border_color: #dddee1;
|
||||||
$title_color: #8c8c8c;
|
$title_color: #8c8c8c;
|
||||||
$light_title_color: #1c2438;
|
$light_title_color: #1c2438;
|
||||||
$light_content_color: #495060;
|
$light_content_color: #495060;
|
||||||
$light_sub_color: #80848f;
|
$light_sub_color: #80848f;
|
||||||
$light_background_color: #f8f8f9;
|
$light_background_color: #F5F5F7;
|
||||||
$light_white_background_color: #fff;
|
$light_white_background_color: #fff;
|
||||||
// 暗黑主题颜色
|
// 暗黑主题颜色
|
||||||
$dark_background_color: #141414;
|
$dark_background_color: #141414;
|
||||||
$dark_sub_background_color: #1d1d1d; //稍微浅一点的
|
$dark_sub_background_color: #1d1d1d; //稍微浅一点的
|
||||||
$dark_content_color: #d5d5d5;
|
$dark_content_color: #d5d5d5;
|
||||||
|
|
||||||
|
|
||||||
|
.wes-2 {
|
||||||
|
/* 适用于webkit内核和移动端 */
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
/***** 封装一些方法可用于 黑暗主题 ,明亮主题 *****/
|
/***** 封装一些方法可用于 黑暗主题 ,明亮主题 *****/
|
||||||
|
|
||||||
// 背景颜色
|
// 背景颜色
|
||||||
@@ -170,6 +178,19 @@ $dark_content_color: #d5d5d5;
|
|||||||
margin-right: 20px;
|
margin-right: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.mb_24 {
|
||||||
|
margin-bottom: 24px;
|
||||||
|
}
|
||||||
|
.mt_24 {
|
||||||
|
margin-top: 24px;
|
||||||
|
}
|
||||||
|
.ml_24 {
|
||||||
|
margin-left: 24px;
|
||||||
|
}
|
||||||
|
.mr_24 {
|
||||||
|
margin-right: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
.mb_10 {
|
.mb_10 {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
@@ -270,10 +291,24 @@ li {
|
|||||||
left: auto;
|
left: auto;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.flex{
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.flex-a-c{
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.flex-j-sb{
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.flex-j-c{
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.width_1200_auto {
|
||||||
|
width: 1184px;
|
||||||
|
margin: 0 auto;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@@ -1,6 +1,6 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div class="navbar" :class="{'small-search-box':useClass == 'fixed-show'}">
|
||||||
<div class="container">
|
<div class="container width_1200_auto flex flex-a-c">
|
||||||
<img
|
<img
|
||||||
:src="$store.state.logoImg"
|
:src="$store.state.logoImg"
|
||||||
v-if="showLogo"
|
v-if="showLogo"
|
||||||
@@ -8,6 +8,7 @@
|
|||||||
alt=""
|
alt=""
|
||||||
@click="$router.push('/')"
|
@click="$router.push('/')"
|
||||||
/>
|
/>
|
||||||
|
<div :class="{'small-search-box':useClass == 'fixed-show'}" class="search-box">
|
||||||
<i-input
|
<i-input
|
||||||
v-model="searchData"
|
v-model="searchData"
|
||||||
size="large"
|
size="large"
|
||||||
@@ -15,31 +16,37 @@
|
|||||||
placeholder="输入你想查找的商品"
|
placeholder="输入你想查找的商品"
|
||||||
@keyup.enter.native="search"
|
@keyup.enter.native="search"
|
||||||
>
|
>
|
||||||
<Button v-if="!store" slot="append" @click="search">搜索</Button>
|
|
||||||
</i-input>
|
<div class="search-icon" slot="append" @click="search">
|
||||||
<div v-if="store" class="btn-div">
|
<Icon type="ios-search" size="21"/>
|
||||||
<Button class="store-search" type="warning" @click="searchStore">搜本店</Button>
|
|
||||||
<Button class="store-search" type="primary" @click="search">搜全站</Button>
|
|
||||||
</div>
|
</div>
|
||||||
|
</i-input>
|
||||||
<template v-if="showTag">
|
<template v-if="showTag">
|
||||||
<div style="height:12px" v-if="promotionTags.length === 0"></div>
|
<div class="only-store" v-if="storeId" @click="research()">
|
||||||
<div v-else>
|
切换为{{!onlyStore ? '店铺内' : '平台'}}搜索
|
||||||
<Tag
|
|
||||||
|
</div>
|
||||||
|
<div v-if="promotionTags.length === 0"></div>
|
||||||
|
<div v-else class="history-list flex">
|
||||||
|
<div
|
||||||
v-for="(item, index) in promotionTags"
|
v-for="(item, index) in promotionTags"
|
||||||
:key="index"
|
:key="index"
|
||||||
class="mr_10"
|
class="mr_10"
|
||||||
>
|
>
|
||||||
<span class="hover-color" @click="selectTags(item)">{{ item }}</span>
|
<span class="history-item" @click="selectTags(item)">{{ item }}</span>
|
||||||
</Tag>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import storage from '@/plugins/storage.js'
|
import storage from '@/plugins/storage.js'
|
||||||
import {hotWords} from '@/api/goods.js'
|
import {hotWords} from '@/api/goods.js'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'search',
|
name: 'search',
|
||||||
props: {
|
props: {
|
||||||
@@ -51,18 +58,28 @@ export default {
|
|||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true
|
default: true
|
||||||
},
|
},
|
||||||
store: { // 是否为店铺页面
|
storeId: { // 是否为店铺页面
|
||||||
type: Boolean,
|
type: String,
|
||||||
default: false
|
default: ""
|
||||||
},
|
},
|
||||||
hover: {
|
hover: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
|
},
|
||||||
|
useClass:{
|
||||||
|
type:null,
|
||||||
|
default:''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
watch:{
|
||||||
|
storeId(val){
|
||||||
|
this.onlyStore = val ? true : false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
searchData: '' // 搜索内容
|
searchData: '', // 搜索内容
|
||||||
|
onlyStore:false,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
@@ -70,11 +87,23 @@ export default {
|
|||||||
this.searchData = item;
|
this.searchData = item;
|
||||||
this.search();
|
this.search();
|
||||||
},
|
},
|
||||||
|
research(){
|
||||||
|
this.onlyStore = !this.onlyStore
|
||||||
|
},
|
||||||
search () { // 全平台搜索商品
|
search () { // 全平台搜索商品
|
||||||
this.$router.push({
|
const url = this.$route.path;
|
||||||
|
if(url == '/goodsList'){
|
||||||
|
this.$emit('search', this.searchData)
|
||||||
|
}else{
|
||||||
|
const pushData = {
|
||||||
path:'/goodsList',
|
path:'/goodsList',
|
||||||
query: { keyword: this.searchData }
|
query: { keyword: this.searchData },
|
||||||
});
|
}
|
||||||
|
if(this.storeId && this.onlyStore) pushData.query.storeId = this.storeId
|
||||||
|
|
||||||
|
|
||||||
|
this.$router.push(pushData);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
searchStore() { // 店铺搜索商品
|
searchStore() { // 店铺搜索商品
|
||||||
this.$emit('search', this.searchData)
|
this.$emit('search', this.searchData)
|
||||||
@@ -91,6 +120,7 @@ export default {
|
|||||||
},
|
},
|
||||||
created() {
|
created() {
|
||||||
this.searchData = this.$route.query.keyword
|
this.searchData = this.$route.query.keyword
|
||||||
|
|
||||||
if (!this.hover) { // 首页顶部固定搜索栏不调用热词接口
|
if (!this.hover) { // 首页顶部固定搜索栏不调用热词接口
|
||||||
// 搜索热词每5分钟请求一次
|
// 搜索热词每5分钟请求一次
|
||||||
const reloadTime = storage.getItem('hotWordsReloadTime')
|
const reloadTime = storage.getItem('hotWordsReloadTime')
|
||||||
@@ -111,27 +141,70 @@ export default {
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.container {
|
.only-store{
|
||||||
margin: 30px auto;
|
text-align: right;
|
||||||
width: 460px;
|
color:$theme_color;
|
||||||
position: relative;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
.navbar {
|
||||||
|
height: 113px;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
.search-icon{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.small-search-box{
|
||||||
|
height: 60px;
|
||||||
|
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
.search {
|
.search {
|
||||||
|
width: 778.4px;
|
||||||
margin: 10px 0px 5px 0;
|
margin: 10px 0px 5px 0;
|
||||||
|
|
||||||
|
border-radius: 18.9px;
|
||||||
|
|
||||||
|
|
||||||
/deep/ .ivu-input.ivu-input-large {
|
/deep/ .ivu-input.ivu-input-large {
|
||||||
border: 2px solid $theme_color;
|
border: 1.4px solid $theme_color;
|
||||||
font-size: 12px;
|
box-sizing: border-box;
|
||||||
height: 34px;
|
border-radius: 19.6px;
|
||||||
|
position: relative;
|
||||||
|
padding-left: 26px;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: normal;
|
||||||
|
height: 37.8px;
|
||||||
|
color: #999;
|
||||||
&:focus {
|
&:focus {
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/deep/ .ivu-input-group-append {
|
/deep/ .ivu-input-group-append {
|
||||||
border: 1px solid $theme_color;
|
border-radius: 19.6px !important;
|
||||||
border-left: none;
|
cursor: pointer;
|
||||||
height: 30px;
|
box-sizing: border-box;
|
||||||
|
border: 1.4px solid $theme_color;
|
||||||
|
width: 67.2px;
|
||||||
|
height: 37.8px;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
top: 0;
|
||||||
|
z-index: 99;
|
||||||
background-color: $theme_color;
|
background-color: $theme_color;
|
||||||
color: #ffffff;
|
color: #ffffff;
|
||||||
|
|
||||||
button {
|
button {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
@@ -139,28 +212,46 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.search-box{
|
||||||
|
margin-left: 28px;
|
||||||
|
}
|
||||||
.logo-img {
|
.logo-img {
|
||||||
position: absolute;
|
|
||||||
left: -360px;
|
|
||||||
top: -9px;
|
|
||||||
max-width: 150px;
|
max-width: 150px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.store-search {
|
.store-search {
|
||||||
width: 55.6px;
|
width: 55.6px;
|
||||||
padding: 0 9px;
|
padding: 0 9px;
|
||||||
border-radius: 0;
|
border-radius: 0;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
|
|
||||||
&:nth-child(2) {
|
&:nth-child(2) {
|
||||||
width: 55px;
|
width: 55px;
|
||||||
margin-left: -2px;
|
margin-left: -2px;
|
||||||
border-radius: 3px;
|
border-radius: 3px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.btn-div {
|
.btn-div {
|
||||||
position: relative;
|
position: relative;
|
||||||
height: 0px;
|
height: 0px;
|
||||||
top: -38px;
|
top: -38px;
|
||||||
left: 352px;
|
left: 352px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.history-list {
|
||||||
|
|
||||||
|
margin-left: 28px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.history-item {
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 16px;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
margin-right: 17px;
|
||||||
|
color: #666666;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -12,12 +12,8 @@
|
|||||||
<i-input v-model="formData.name" style="width: 600px"></i-input>
|
<i-input v-model="formData.name" style="width: 600px"></i-input>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="收件地区" prop="address">
|
<FormItem label="收件地区" prop="address">
|
||||||
<i-input
|
{{ formData.address || '暂无地址' }}
|
||||||
v-model="formData.address"
|
<Button type="primary" style="margin-left: 10px;" size="small" @click="$refs.map.open()">选择</Button>
|
||||||
disabled
|
|
||||||
style="width: 600px"
|
|
||||||
></i-input>
|
|
||||||
<Button type="primary" size="small" @click="$refs.map.showMap = true">选择</Button>
|
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="详细地址" prop="detail">
|
<FormItem label="详细地址" prop="detail">
|
||||||
<i-input v-model="formData.detail" style="width: 600px"></i-input>
|
<i-input v-model="formData.detail" style="width: 600px"></i-input>
|
||||||
@@ -43,12 +39,12 @@
|
|||||||
<Button type="primary" class="mr_10" :loading="loading" @click="save">保存收货地址</Button>
|
<Button type="primary" class="mr_10" :loading="loading" @click="save">保存收货地址</Button>
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
<lili-map ref="map" @getAddress="getAddress"></lili-map>
|
<multipleMap ref="map" @callback="getAddress"></multipleMap>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import liliMap from '@/components/map';
|
import multipleMap from "@/components/map/multiple-map";
|
||||||
import {
|
import {
|
||||||
newMemberAddress,
|
newMemberAddress,
|
||||||
editMemberAddress,
|
editMemberAddress,
|
||||||
@@ -129,14 +125,24 @@ export default {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
getAddress (item) {
|
getAddress (val) {
|
||||||
// 获取地图选择信息
|
// 获取地图选择信息
|
||||||
this.mapMsg = item;
|
if(val.type === 'select'){
|
||||||
this.$set(this.formData, 'address', item.addr);
|
const paths = val.data.map(item => item.name).join(',')
|
||||||
this.$set(this.formData, 'consigneeAddressIdPath', item.addrId);
|
const ids = val.data.map(item => item.id).join(',')
|
||||||
this.$set(this.formData, 'detail', item.detail);
|
this.$set(this.formData,'address',paths)
|
||||||
this.formData.lat = item.position.lat;
|
this.$set(this.formData,'consigneeAddressIdPath',ids)
|
||||||
this.formData.lon = item.position.lng;
|
const coord = val.data[val.data.length - 1].center.split(',')
|
||||||
|
this.formData.lat = coord[1]
|
||||||
|
this.formData.lon = coord[0]
|
||||||
|
}else{
|
||||||
|
this.$set(this.formData, "address", val.data.addr);
|
||||||
|
this.$set(this.formData, "consigneeAddressIdPath", val.data.addrId);
|
||||||
|
this.$set(this.formData, "detail", val.data.address);
|
||||||
|
this.formData.lat = val.data.position.lat;
|
||||||
|
this.formData.lon = val.data.position.lng;
|
||||||
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
show () { // 地址模态框显示
|
show () { // 地址模态框显示
|
||||||
this.showAddr = true;
|
this.showAddr = true;
|
||||||
@@ -158,7 +164,7 @@ export default {
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
liliMap
|
multipleMap
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -24,7 +24,7 @@ export default {
|
|||||||
.advertising {
|
.advertising {
|
||||||
height: 80px;
|
height: 80px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: $theme_color;
|
|
||||||
text-align: center;
|
text-align: center;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|||||||
@@ -7,6 +7,7 @@
|
|||||||
alt=""
|
alt=""
|
||||||
/>
|
/>
|
||||||
<p v-if="_Title">{{ _Title }}</p>
|
<p v-if="_Title">{{ _Title }}</p>
|
||||||
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|||||||
119
buyer/src/components/fixed/index.vue
Normal file
@@ -0,0 +1,119 @@
|
|||||||
|
<template>
|
||||||
|
<div class="shadow-box">
|
||||||
|
<div class="shadow-item flex flex-a-c flex-j-c" v-for="(item,index) in iconList" @click="handleClickIcon(item)" :key="index">
|
||||||
|
<img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
|
||||||
|
<div class="shadow-label">{{item.label}}</div>
|
||||||
|
<div class="line" v-if="iconList.length-1 !=index"></div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "fixed-index",
|
||||||
|
data(){
|
||||||
|
return{
|
||||||
|
iconList:[
|
||||||
|
{
|
||||||
|
icon:"user",
|
||||||
|
label:"会员中心",
|
||||||
|
path:"/home"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon:"carts",
|
||||||
|
label:"购物车",
|
||||||
|
path:"/cart"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon:"notification",
|
||||||
|
label:"消息",
|
||||||
|
path:"/home/MsgList"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon:"collage",
|
||||||
|
label:"收藏",
|
||||||
|
path:"/home/Favorites"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon:"back",
|
||||||
|
label:"顶部",
|
||||||
|
path:"back"
|
||||||
|
},
|
||||||
|
],
|
||||||
|
isScrolling:false,
|
||||||
|
timeoutId:"",
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
const vm = this
|
||||||
|
// 添加滚轮事件监听器
|
||||||
|
window.addEventListener('wheel', function() {
|
||||||
|
if (vm.isScrolling) {
|
||||||
|
// 如果页面正在滚动,则取消定时器并设置 isScrolling 为 false
|
||||||
|
window.cancelAnimationFrame(vm.timeoutId);
|
||||||
|
vm.isScrolling = false;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
scrollToTop() {
|
||||||
|
const c = document.documentElement.scrollTop || document.body.scrollTop;
|
||||||
|
if (c > 0) {
|
||||||
|
this.timeoutId = window.requestAnimationFrame(this.scrollToTop);
|
||||||
|
window.scrollTo(0, c - c / 4);
|
||||||
|
this.isScrolling = true;
|
||||||
|
}else {
|
||||||
|
this.isScrolling = false;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
handleClickIcon(val){
|
||||||
|
if(val.path === 'back'){
|
||||||
|
this.scrollToTop()
|
||||||
|
}else{
|
||||||
|
this.$router.push(val.path)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.shadow-box{
|
||||||
|
width: 64px;
|
||||||
|
height: 354px;
|
||||||
|
border-radius: 10px;
|
||||||
|
opacity: 1;
|
||||||
|
|
||||||
|
background: #FFFFFF;
|
||||||
|
|
||||||
|
box-shadow: 0px 1px 10px 0px rgba(154, 154, 154, 0.5);
|
||||||
|
}
|
||||||
|
.shadow-label{
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
color: #666666;
|
||||||
|
}
|
||||||
|
.icon{
|
||||||
|
margin-top: 15px;
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
margin-bottom: 5px;
|
||||||
|
}
|
||||||
|
.shadow-item{
|
||||||
|
cursor: pointer;
|
||||||
|
flex-direction: column;
|
||||||
|
height: 70px;
|
||||||
|
>.line{
|
||||||
|
width: 34px;
|
||||||
|
height: 1px;
|
||||||
|
opacity: 1;
|
||||||
|
margin-top: 17px;
|
||||||
|
border: 0.7px solid #EAEAEA;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -3,20 +3,20 @@
|
|||||||
<footer class="footer">
|
<footer class="footer">
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
<div class="icon-row">
|
<div class="icon-row">
|
||||||
<div class="footer-icon">
|
<div class="footer-icon flex flex-a-c">
|
||||||
<h5 class="footer-icon-child"></h5>
|
<h5 class="footer-icon-child">多</h5>
|
||||||
<span class="footer-icon-text">品类齐全,轻松购物</span>
|
<span class="footer-icon-text">品类齐全,轻松购物</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="footer-icon">
|
<div class="footer-icon flex flex-a-c">
|
||||||
<h5 class="footer-icon-child footer-icon-child-2"></h5>
|
<h5 class="footer-icon-child footer-icon-child-2">快</h5>
|
||||||
<span class="footer-icon-text">多仓直发,极速配送</span>
|
<span class="footer-icon-text">多仓直发,极速配送</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="footer-icon">
|
<div class="footer-icon flex flex-a-c">
|
||||||
<h5 class="footer-icon-child footer-icon-child-3"></h5>
|
<h5 class="footer-icon-child footer-icon-child-3">好</h5>
|
||||||
<span class="footer-icon-text">正品行货,精致服务</span>
|
<span class="footer-icon-text">正品行货,精致服务</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="footer-icon">
|
<div class="footer-icon flex flex-a-c">
|
||||||
<h5 class="footer-icon-child footer-icon-child-4"></h5>
|
<h5 class="footer-icon-child footer-icon-child-4">省</h5>
|
||||||
<span class="footer-icon-text">天天低价,畅选无忧</span>
|
<span class="footer-icon-text">天天低价,畅选无忧</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -37,6 +37,11 @@
|
|||||||
</li>
|
</li>
|
||||||
|
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="information footer-bottmom">
|
||||||
<div class="icp">
|
<div class="icp">
|
||||||
<li v-if="config.icpCard">
|
<li v-if="config.icpCard">
|
||||||
<a :href='"https://tsm.miit.gov.cn/dxxzsp/xkz/xkzgl/resource/qiyesearch.jsp?num="+config.icpCard+"&type=xuke"' target="_blank">
|
<a :href='"https://tsm.miit.gov.cn/dxxzsp/xkz/xkzgl/resource/qiyesearch.jsp?num="+config.icpCard+"&type=xuke"' target="_blank">
|
||||||
@@ -49,15 +54,11 @@
|
|||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="information footer-bottmom">
|
|
||||||
|
|
||||||
<a class="flex " :href="config.company.href">
|
<a class="flex " :href="config.company.href">
|
||||||
<img class="zhizhao" src="@/assets/images/zhizhao.jpg" mode="" />{{config.company.name}}
|
<img class="zhizhao" src="@/assets/images/zhizhao.jpg" mode="" />{{config.company.name}}
|
||||||
</a>
|
</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
|
||||||
<div class="clearfix"></div>
|
<div class="clearfix"></div>
|
||||||
<div class="copyright">
|
<div class="copyright">
|
||||||
<p>Copyright © {{year}} {{config.title}}</p>
|
<p>Copyright © {{year}} {{config.title}}</p>
|
||||||
@@ -77,7 +78,7 @@ export default {
|
|||||||
guideArr: [
|
guideArr: [
|
||||||
// 导航链接
|
// 导航链接
|
||||||
["购物指南", "购物流程", "会员介绍", "生活旅行", "常见问题"],
|
["购物指南", "购物流程", "会员介绍", "生活旅行", "常见问题"],
|
||||||
["配送方式", "上门自提", "配送服务查询", "收取标准", "物流规则"],
|
["配送方式", "上门自提", "配送查询", "收取标准", "物流规则"],
|
||||||
["支付方式", "在线支付", "公司转账", "余额支付", "积分支付"],
|
["支付方式", "在线支付", "公司转账", "余额支付", "积分支付"],
|
||||||
["售后服务", "售后政策", "退款说明", "返修/退货", "取消订单"],
|
["售后服务", "售后政策", "退款说明", "返修/退货", "取消订单"],
|
||||||
],
|
],
|
||||||
@@ -101,40 +102,36 @@ export default {
|
|||||||
/*****************************底 部 开 始*****************************/
|
/*****************************底 部 开 始*****************************/
|
||||||
.footer {
|
.footer {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding-top: 30px;
|
height: 370px;
|
||||||
|
background: #FFFFFF;
|
||||||
@include background_color($light_background_color);
|
|
||||||
}
|
}
|
||||||
.icon-row {
|
.icon-row {
|
||||||
margin: 15px auto;
|
display: flex;
|
||||||
padding-top: 8px;
|
align-items: center;
|
||||||
width: 1000px;
|
justify-content: space-between;
|
||||||
height: 64px;
|
width: 1056px;
|
||||||
|
height: 71px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
.footer-icon {
|
.footer-icon {
|
||||||
margin-left: 17px;
|
|
||||||
margin-right: 17px;
|
|
||||||
float: left;
|
float: left;
|
||||||
}
|
}
|
||||||
.footer-icon-child {
|
.footer-icon-child {
|
||||||
margin-top: 10px;
|
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
position: absolute;
|
width: 36.4px;
|
||||||
width: 36px;
|
display: flex;
|
||||||
height: 42px;
|
align-items: center;
|
||||||
background-image: url("../../assets/images/footer/ico_service.png");
|
justify-content: center;
|
||||||
text-indent: -999px;
|
font-size: 18.2px;
|
||||||
}
|
font-weight: normal;
|
||||||
.footer-icon-child-2 {
|
color: #333;
|
||||||
background-position: 0 -43px;
|
height: 36.4px;
|
||||||
}
|
border: 1.4px solid #CECECE;
|
||||||
.footer-icon-child-3 {
|
border-radius: 50%;
|
||||||
background-position: 0 -86px;
|
|
||||||
}
|
|
||||||
.footer-icon-child-4 {
|
|
||||||
background-position: 0 -129px;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.icp {
|
.icp {
|
||||||
|
margin-right: 30px !important;
|
||||||
>*{
|
>*{
|
||||||
margin: 0 4px;
|
margin: 0 4px;
|
||||||
}
|
}
|
||||||
@@ -148,59 +145,69 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.footer-icon-text {
|
.footer-icon-text {
|
||||||
margin-left: 45px;
|
margin-left: 11px;
|
||||||
font-size: 18px;
|
font-size: 16px;
|
||||||
font-weight: bold;
|
|
||||||
line-height: 64px;
|
font-weight: normal;
|
||||||
|
|
||||||
|
text-align: center;
|
||||||
}
|
}
|
||||||
.service-intro {
|
.service-intro {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
border-top: 1px solid $border_color;
|
border-top: 1px solid $border_color;
|
||||||
}
|
}
|
||||||
.servece-type {
|
.servece-type {
|
||||||
margin: 15px auto;
|
width: 952px;
|
||||||
width: 800px;
|
margin: 22px auto 10px auto;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
|
||||||
|
|
||||||
|
}
|
||||||
|
.servece-type-info{
|
||||||
|
|
||||||
|
}
|
||||||
.servece-type-info ul {
|
.servece-type-info ul {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
}
|
}
|
||||||
.servece-type-info li {
|
.servece-type-info li {
|
||||||
font-size: 14px;
|
font-size: 12px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
line-height: 26px;
|
font-weight: normal;
|
||||||
}
|
line-height: 15px;
|
||||||
.servece-type-info li:hover{
|
text-align: center;
|
||||||
color:#b8b8be;
|
margin-bottom: 13px;
|
||||||
|
color: #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
.servece-type-info li:first-child {
|
.servece-type-info li:first-child {
|
||||||
font-size: 16px;
|
font-size: 14.82px;
|
||||||
line-height: 28px;
|
font-weight: normal;
|
||||||
font-weight: bold;
|
line-height: 18px;
|
||||||
}
|
|
||||||
.servece-type-info li:first-child:hover{
|
letter-spacing: 0px;
|
||||||
// font-size:15px;
|
margin-bottom: 17px;
|
||||||
// font-weight: bold;
|
color: #333333;
|
||||||
color:#b8b8be;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.friend-link {
|
.friend-link {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: flex-start;
|
align-items: flex-start;
|
||||||
justify-content: space-between;
|
justify-content: center;
|
||||||
width: 908px;
|
width: 908px;
|
||||||
padding: 10px 0;
|
padding: 10px 0;
|
||||||
margin: 0px auto;
|
margin: 0px auto;
|
||||||
border-top: 1px solid $border_color;
|
border-top: 1px solid $border_color;
|
||||||
}
|
}
|
||||||
.information {
|
.information {
|
||||||
|
margin-top: 23px;
|
||||||
|
margin-bottom: 21px;
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
justify-content: center;
|
||||||
> * {
|
|
||||||
margin: 2px 0;
|
|
||||||
}
|
}
|
||||||
|
a{
|
||||||
|
color: #3457FF;
|
||||||
}
|
}
|
||||||
.zhizhao {
|
.zhizhao {
|
||||||
width: 20px;
|
width: 20px;
|
||||||
@@ -213,35 +220,38 @@ export default {
|
|||||||
.friend-link-item li {
|
.friend-link-item li {
|
||||||
padding: 5px 0px;
|
padding: 5px 0px;
|
||||||
float: left;
|
float: left;
|
||||||
|
margin-right: 59px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 13px;
|
||||||
|
color: #333333;
|
||||||
}
|
}
|
||||||
|
|
||||||
.friend-link-item li:hover{
|
|
||||||
color:#b8b8be;
|
|
||||||
margin-top:-2px;
|
|
||||||
}
|
|
||||||
.footer-bottmom:hover{
|
|
||||||
margin-top:0 !important;
|
|
||||||
}
|
|
||||||
.footer-bottmom>a:hover{
|
|
||||||
color:#e4393c;
|
|
||||||
}
|
|
||||||
.link-item {
|
.link-item {
|
||||||
padding: 0px 8px;
|
padding: 0px 8px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
border-right: 1px solid $border_color;
|
|
||||||
}
|
}
|
||||||
.link-last-item {
|
.link-last-item {
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
.copyright {
|
.copyright {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
line-height: 30px;
|
cursor: pointer;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
height:25px;
|
||||||
|
opacity: 1;
|
||||||
|
margin-bottom: 12px;
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 13px;
|
||||||
|
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #959595;
|
||||||
}
|
}
|
||||||
.copyright a {
|
|
||||||
color: #232323;
|
|
||||||
font-size: 20px;
|
|
||||||
}
|
|
||||||
.footer-icon-text {
|
.footer-icon-text {
|
||||||
@include title_color($light_title_color);
|
@include title_color($light_title_color);
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -4,29 +4,21 @@
|
|||||||
<!-- 详情左侧展示数据、图片,收藏、举报 -->
|
<!-- 详情左侧展示数据、图片,收藏、举报 -->
|
||||||
<div class="item-detail-left">
|
<div class="item-detail-left">
|
||||||
<!-- 大图、放大镜 -->
|
<!-- 大图、放大镜 -->
|
||||||
<div class="item-detail-big-img">
|
<!-- <div id="dplayer"></div> -->
|
||||||
<pic-zoom :url="imgList[imgIndex].url" :scale="2"></pic-zoom>
|
<div class="item-detail-big-img" v-if="imgList[imgIndex]">
|
||||||
</div>
|
<pic-zoom :url="imgList[imgIndex].url || imgList[imgIndex]" :scale="2"></pic-zoom>
|
||||||
<div
|
|
||||||
v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'"
|
|
||||||
style="margin-top:10px;rgb(153, 149, 149);"
|
|
||||||
>
|
|
||||||
实物商品
|
|
||||||
</div>
|
|
||||||
<div
|
|
||||||
v-else-if="skuDetail.goodsType == 'VIRTUAL_GOODS'"
|
|
||||||
style="margin-top:10px;rgb(153, 149, 149);"
|
|
||||||
>
|
|
||||||
虚拟商品
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- <div id="dplayer"></div> -->
|
||||||
<div class="item-detail-img-row">
|
<div class="item-detail-img-row">
|
||||||
|
|
||||||
<div
|
<div
|
||||||
class="item-detail-img-small"
|
class="item-detail-img-small"
|
||||||
@mouseover="imgIndex = index"
|
@mouseover="imgIndex = index"
|
||||||
v-for="(item, index) in imgList"
|
v-for="(item, index) in imgList"
|
||||||
:key="index"
|
:key="index"
|
||||||
>
|
>
|
||||||
<img :src="item.url" />
|
<img :src="item.url || item"/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@@ -44,6 +36,18 @@
|
|||||||
<div class="item-detail-title">
|
<div class="item-detail-title">
|
||||||
<p>
|
<p>
|
||||||
{{ skuDetail.goodsName }}
|
{{ skuDetail.goodsName }}
|
||||||
|
<Tag
|
||||||
|
v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'"
|
||||||
|
style="margin-top:10px;rgb(153, 149, 149);"
|
||||||
|
>
|
||||||
|
实物商品
|
||||||
|
</Tag>
|
||||||
|
<Tag
|
||||||
|
v-else-if="skuDetail.goodsType == 'VIRTUAL_GOODS'"
|
||||||
|
style="margin-top:10px;rgb(153, 149, 149);"
|
||||||
|
>
|
||||||
|
虚拟商品
|
||||||
|
</Tag>
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="sell-point">
|
<div class="sell-point">
|
||||||
@@ -238,6 +242,7 @@
|
|||||||
:disabled="skuDetail.quantity === 0"
|
:disabled="skuDetail.quantity === 0"
|
||||||
v-model="count"
|
v-model="count"
|
||||||
:precision="0.1"
|
:precision="0.1"
|
||||||
|
@on-blur="changeCount"
|
||||||
></InputNumber>
|
></InputNumber>
|
||||||
<span class="inventory"> 库存{{ skuDetail.quantity }}</span>
|
<span class="inventory"> 库存{{ skuDetail.quantity }}</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -271,6 +276,7 @@
|
|||||||
class="add-buy-car"
|
class="add-buy-car"
|
||||||
v-if="$route.query.way !== 'POINT' && skuDetail.authFlag === 'PASS'"
|
v-if="$route.query.way !== 'POINT' && skuDetail.authFlag === 'PASS'"
|
||||||
>
|
>
|
||||||
|
|
||||||
<Button
|
<Button
|
||||||
type="error"
|
type="error"
|
||||||
v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'"
|
v-if="skuDetail.goodsType !== 'VIRTUAL_GOODS'"
|
||||||
@@ -286,9 +292,15 @@
|
|||||||
@click="buyNow"
|
@click="buyNow"
|
||||||
>立即购买</Button
|
>立即购买</Button
|
||||||
>
|
>
|
||||||
|
<Tooltip content="观看视频" v-if="skuDetail.goodsVideo">
|
||||||
|
<img class="view-video" @click="showGoodsVideo = true" :src="require('@/assets/iconfont/play.svg')" alt="">
|
||||||
|
</Tooltip>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<Modal title="浏览视频" v-model="showGoodsVideo">
|
||||||
|
<div id="dplayer"></div>
|
||||||
|
</Modal>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
@@ -296,6 +308,7 @@
|
|||||||
<script>
|
<script>
|
||||||
import Promotion from "./Promotion.vue";
|
import Promotion from "./Promotion.vue";
|
||||||
import PicZoom from "vue-piczoom"; // 图片放大
|
import PicZoom from "vue-piczoom"; // 图片放大
|
||||||
|
import DPlayer from "dplayer";
|
||||||
import {
|
import {
|
||||||
collectGoods,
|
collectGoods,
|
||||||
isCollection,
|
isCollection,
|
||||||
@@ -303,6 +316,7 @@ import {
|
|||||||
cancelCollect,
|
cancelCollect,
|
||||||
} from "@/api/member.js";
|
} from "@/api/member.js";
|
||||||
import { addCartGoods } from "@/api/cart.js";
|
import { addCartGoods } from "@/api/cart.js";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "ShowGoods",
|
name: "ShowGoods",
|
||||||
props: {
|
props: {
|
||||||
@@ -317,19 +331,30 @@ export default {
|
|||||||
handler(val) {
|
handler(val) {
|
||||||
this.skuDetail = val.data;
|
this.skuDetail = val.data;
|
||||||
this.wholesaleList = val.wholesaleList;
|
this.wholesaleList = val.wholesaleList;
|
||||||
|
if (this.wholesaleList && this.wholesaleList.length > 0) {
|
||||||
|
this.count = this.wholesaleList[0].num;
|
||||||
|
}
|
||||||
|
this.promotion();
|
||||||
this.swiperGoodsImg();
|
this.swiperGoodsImg();
|
||||||
},
|
},
|
||||||
deep: true,
|
deep: true,
|
||||||
immediate: true,
|
immediate: true,
|
||||||
},
|
},
|
||||||
|
showGoodsVideo(val){
|
||||||
|
if(val){
|
||||||
|
this.initVideo();
|
||||||
|
}
|
||||||
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
showGoodsVideo:false,
|
||||||
|
goodsVideo:"",
|
||||||
wholesaleList: [],
|
wholesaleList: [],
|
||||||
count: 1, // 商品数量
|
count: 1, // 商品数量
|
||||||
imgIndex: 0, // 展示图片下标
|
imgIndex: 0, // 展示图片下标
|
||||||
currentSelceted: [], // 当前商品sku
|
currentSelceted: [], // 当前商品sku
|
||||||
imgList: [{ url: "" }], // 商品图片列表
|
imgList: [], // 商品图片列表
|
||||||
skuDetail: {
|
skuDetail: {
|
||||||
specList: [],
|
specList: [],
|
||||||
}, // sku详情
|
}, // sku详情
|
||||||
@@ -364,6 +389,32 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 初始化video
|
||||||
|
initVideo(){
|
||||||
|
if(!this.goodsVideo ){
|
||||||
|
setTimeout(()=>{
|
||||||
|
this.goodsVideo = new DPlayer({
|
||||||
|
container: document.getElementById('dplayer'),
|
||||||
|
video: {
|
||||||
|
url:this.skuDetail.goodsVideo,
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},100)
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
changeCount(val) {
|
||||||
|
if (this.wholesaleList && this.wholesaleList.length > 0) {
|
||||||
|
if (this.count <= this.wholesaleList[0].num) {
|
||||||
|
this.$Message.warning("批发商品购买数量不能小于起批数量");
|
||||||
|
this.count = this.wholesaleList[0].num;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
select(index, value) {
|
select(index, value) {
|
||||||
// 选择规格
|
// 选择规格
|
||||||
this.$set(this.currentSelceted, index, value);
|
this.$set(this.currentSelceted, index, value);
|
||||||
@@ -512,6 +563,7 @@ export default {
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
promotion() {
|
promotion() {
|
||||||
|
this.promotionMap = {SECKILL: null, FULL_DISCOUNT: null, COUPON: []};
|
||||||
// 格式化促销活动,返回当前促销的对象
|
// 格式化促销活动,返回当前促销的对象
|
||||||
if (!this.detail.promotionMap) return false;
|
if (!this.detail.promotionMap) return false;
|
||||||
let keysArr = Object.keys(this.detail.promotionMap);
|
let keysArr = Object.keys(this.detail.promotionMap);
|
||||||
@@ -529,9 +581,13 @@ export default {
|
|||||||
swiperGoodsImg() {
|
swiperGoodsImg() {
|
||||||
this.skuDetail.specList.forEach((e) => {
|
this.skuDetail.specList.forEach((e) => {
|
||||||
if (e.specName === "images") {
|
if (e.specName === "images") {
|
||||||
this.imgList = e.specImage;
|
this.imgList = this.skuDetail.goodsGalleryList.filter(i => i.indexOf("\"url\":") === -1 && i.indexOf("\"status\":") === -1);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
if (!this.imgList) {
|
||||||
|
this.imgList = [this.skuDetail.original];
|
||||||
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
@@ -545,7 +601,7 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
this.formatSku(this.goodsSpecList);
|
this.formatSku(this.goodsSpecList);
|
||||||
this.promotion();
|
// this.promotion();
|
||||||
document.title = this.skuDetail.goodsName;
|
document.title = this.skuDetail.goodsName;
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
@@ -587,6 +643,7 @@ export default {
|
|||||||
|
|
||||||
.item-detail-left {
|
.item-detail-left {
|
||||||
width: 350px;
|
width: 350px;
|
||||||
|
|
||||||
margin-right: 30px;
|
margin-right: 30px;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -595,8 +652,14 @@ export default {
|
|||||||
height: 350px;
|
height: 350px;
|
||||||
box-shadow: 0px 0px 8px $border_color;
|
box-shadow: 0px 0px 8px $border_color;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
#dplayer{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
.item-detail-big-img img {
|
.item-detail-big-img img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
@@ -830,11 +893,14 @@ export default {
|
|||||||
|
|
||||||
.add-buy-car-box {
|
.add-buy-car-box {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
|
|
||||||
margin-top: 15px;
|
margin-top: 15px;
|
||||||
border-top: 1px dotted $border_color;
|
border-top: 1px dotted $border_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.add-buy-car {
|
.add-buy-car {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
margin-top: 15px;
|
margin-top: 15px;
|
||||||
> * {
|
> * {
|
||||||
margin: 0 4px;
|
margin: 0 4px;
|
||||||
@@ -857,5 +923,8 @@ export default {
|
|||||||
color: red;
|
color: red;
|
||||||
margin-bottom: 5px;
|
margin-bottom: 5px;
|
||||||
}
|
}
|
||||||
|
.view-video{
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
/******************商品图片及购买详情结束******************/
|
/******************商品图片及购买详情结束******************/
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -47,6 +47,7 @@
|
|||||||
<img :src="img" alt="">
|
<img :src="img" alt="">
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="preview-img" v-if="item.previewImg" @click.prevent="hidePreviewImg(item)">
|
<div class="preview-img" v-if="item.previewImg" @click.prevent="hidePreviewImg(item)">
|
||||||
<div>
|
<div>
|
||||||
<span @click.stop="rotatePreviewImg(0, item)"><Icon type="md-refresh" />左转</span>
|
<span @click.stop="rotatePreviewImg(0, item)"><Icon type="md-refresh" />左转</span>
|
||||||
@@ -58,6 +59,22 @@
|
|||||||
<span class="remarks-item">{{item.goodsName}}</span>
|
<span class="remarks-item">{{item.goodsName}}</span>
|
||||||
<span class="remarks-time">{{item.createTime}}</span>
|
<span class="remarks-time">{{item.createTime}}</span>
|
||||||
</p>
|
</p>
|
||||||
|
|
||||||
|
<!-- 商家回复 -->
|
||||||
|
<div class="reply" v-if="item.reply">
|
||||||
|
<p>商家回复</p>
|
||||||
|
<div>
|
||||||
|
<p class="remarks-content">{{ item.reply }}</p>
|
||||||
|
<div>
|
||||||
|
<div class="comment-img" v-if="item.replyImage">
|
||||||
|
<div v-for="(img, imgIndex) in item.replyImage.split(',')" @click="$previewImage(img)" :key="imgIndex">
|
||||||
|
<img :src="img" alt="">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="remarks-page">
|
<div class="remarks-page">
|
||||||
@@ -506,4 +523,10 @@ table{
|
|||||||
margin-left: 30px;
|
margin-left: 30px;
|
||||||
span{color:#999}
|
span{color:#999}
|
||||||
}
|
}
|
||||||
|
.reply{
|
||||||
|
>*{
|
||||||
|
margin: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,25 +1,32 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="box">
|
<div class="box">
|
||||||
<div class="nav">
|
<div class="nav width_1200_auto">
|
||||||
<ul class="location">
|
<ul class="location flex">
|
||||||
<li v-if="$route.path.includes('home')" style="margin-left:10px"><router-link to="/">首页</router-link></li>
|
<li v-if="$route.path.includes('home')" style="margin-left:10px">
|
||||||
</ul>
|
<router-link to="/">首页</router-link>
|
||||||
<ul class="detail">
|
</li>
|
||||||
|
<ul class="flex">
|
||||||
|
<li>Hi,欢迎来到{{ config.title }}</li>
|
||||||
<li class="first" v-show="!userInfo.username">
|
<li class="first" v-show="!userInfo.username">
|
||||||
<router-link :to="`/signUp`">
|
<router-link :to="`/signUp`" class="nav-item">
|
||||||
<span style="border:none">立即注册</span>
|
<span>立即注册</span>
|
||||||
</router-link>
|
</router-link>
|
||||||
</li>
|
</li>
|
||||||
<li v-show="!userInfo.username">
|
<li v-show="!userInfo.username">
|
||||||
<router-link :to="`/login?rePath=${$route.path}&query=${JSON.stringify($route.query)}`">
|
<router-link class="nav-item" :to="`/login?rePath=${$route.path}&query=${JSON.stringify($route.query)}`">
|
||||||
<span style="border:none">请登录</span>
|
<span>请登录</span>
|
||||||
</router-link>
|
</router-link>
|
||||||
</li>
|
</li>
|
||||||
|
</ul>
|
||||||
|
</ul>
|
||||||
|
<ul class="detail flex">
|
||||||
<li v-show="!!userInfo.username">
|
<li v-show="!!userInfo.username">
|
||||||
<div class="username-p">
|
<div class="username-p">
|
||||||
<div>
|
<div>
|
||||||
<Avatar class="person-icon" :src="userInfo.face" icon="person" size="small"/>
|
<Avatar class="person-icon" :src="userInfo.face" icon="person" size="small"/>
|
||||||
<span class="username">{{ userInfo.nickName? userInfo.nickName : userInfo.username | secrecyMobile }}</span>
|
<span class="username">{{
|
||||||
|
userInfo.nickName ? userInfo.nickName : userInfo.username | secrecyMobile
|
||||||
|
}}</span>
|
||||||
</div>
|
</div>
|
||||||
<transition name='fade'>
|
<transition name='fade'>
|
||||||
<ul class="drop-items">
|
<ul class="drop-items">
|
||||||
@@ -31,16 +38,15 @@
|
|||||||
</transition>
|
</transition>
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
<li @click="goUserCenter('/home/MyOrder')"><span class="nav-item hover-color">我的订单</span></li>
|
<li @click="goUserCenter('/home/MyOrder')"><span class="nav-item">我的订单</span></li>
|
||||||
<li @click="goUserCenter('/home/MyTracks')"><span class="nav-item hover-color">我的足迹</span></li>
|
<li @click="goUserCenter('/home/MyTracks')"><span class="nav-item">我的足迹</span></li>
|
||||||
<li @click="goUserCenter('/home/MsgList')"><span class="nav-item hover-color">我的消息</span></li>
|
<li @click="goUserCenter('/home/MsgList')"><span class="nav-item">我的消息</span></li>
|
||||||
<li v-if="$route.name !== 'Cart'" style="position:relative;">
|
<li v-if="$route.name !== 'Cart'" style="position:relative;">
|
||||||
<i class="cart-badge" v-show="Number(cartNum)">{{cartNum < 100 ? cartNum : '99'}}</i>
|
|
||||||
<Dropdown placement="bottom-start">
|
<Dropdown placement="bottom-start">
|
||||||
<router-link to="/cart" target="_blank">
|
<router-link to="/cart" target="_blank">
|
||||||
<span @mouseenter="getCartList">
|
<span class="nav-item" @mouseenter="getCartList">
|
||||||
<Icon size="18" type="ios-cart-outline"></Icon>
|
<Icon size="18" type="ios-cart-outline"></Icon>
|
||||||
购物车
|
购物车({{ cartNum < 100 ? cartNum : '99' }})
|
||||||
</span>
|
</span>
|
||||||
</router-link>
|
</router-link>
|
||||||
<DropdownMenu slot="list">
|
<DropdownMenu slot="list">
|
||||||
@@ -59,25 +65,23 @@
|
|||||||
<p class="hover-pointer goods-title ellipsis">{{ item.goodsSku.goodsName }}</p>
|
<p class="hover-pointer goods-title ellipsis">{{ item.goodsSku.goodsName }}</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="shopping-cart-detail">
|
<div class="shopping-cart-detail">
|
||||||
<p>
|
<div>
|
||||||
数量:
|
数量:
|
||||||
<span class="shopping-cart-text">{{ item.num }}</span>
|
<span class="shopping-cart-text">{{ item.num }}</span>
|
||||||
价钱:
|
|
||||||
<span class="shopping-cart-text">{{ item.purchasePrice | unitPrice('¥') }}</span>
|
</div>
|
||||||
</p>
|
<div class="shopping-price">
|
||||||
|
{{ item.purchasePrice | unitPrice('¥') }}
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="go-to-buy">
|
|
||||||
<Button type="error" size="small" @click="goToPay">去结账</Button>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</DropdownMenu>
|
</DropdownMenu>
|
||||||
</Dropdown>
|
</Dropdown>
|
||||||
</li>
|
</li>
|
||||||
<li>
|
|
||||||
<span class="nav-item" @click="shopEntry">店铺入驻</span>
|
|
||||||
</li>
|
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -87,6 +91,8 @@
|
|||||||
import storage from '@/plugins/storage.js';
|
import storage from '@/plugins/storage.js';
|
||||||
import {cartGoodsAll} from '@/api/cart.js';
|
import {cartGoodsAll} from '@/api/cart.js';
|
||||||
import {logout} from '@/api/account.js';
|
import {logout} from '@/api/account.js';
|
||||||
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'M-Header',
|
name: 'M-Header',
|
||||||
created() {
|
created() {
|
||||||
@@ -97,6 +103,7 @@ export default {
|
|||||||
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
config: require('@/config'),
|
||||||
userInfo: {}, // 用户信息
|
userInfo: {}, // 用户信息
|
||||||
shoppingCart: [] // 购物车
|
shoppingCart: [] // 购物车
|
||||||
};
|
};
|
||||||
@@ -152,18 +159,6 @@ export default {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
shopEntry () {
|
|
||||||
// 店铺入驻
|
|
||||||
if (storage.getItem('accessToken')) {
|
|
||||||
let routeUrl = this.$router.resolve({
|
|
||||||
path: '/shopEntry',
|
|
||||||
query: { id: 1 }
|
|
||||||
});
|
|
||||||
window.open(routeUrl.href, '_blank');
|
|
||||||
} else {
|
|
||||||
this.$router.push('login');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
getCartList() {
|
getCartList() {
|
||||||
// 获取购物车列表
|
// 获取购物车列表
|
||||||
if (this.userInfo.username) {
|
if (this.userInfo.username) {
|
||||||
@@ -179,106 +174,88 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
.shopping-cart-detail,
|
|
||||||
.shopping-cart-text,
|
|
||||||
.shopping-cart-info,
|
|
||||||
.nav a,
|
|
||||||
.location,
|
|
||||||
.first,
|
|
||||||
.username,
|
|
||||||
.shopping-cart-null span {
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
.box {
|
.box {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
font-size: 12px !important;
|
font-size: 12px !important;
|
||||||
// height: 35px;
|
height: 36px;
|
||||||
@include background_color($light_white_background_color);
|
background: #333;
|
||||||
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav {
|
.nav {
|
||||||
margin: 0 auto;
|
|
||||||
width: 1200px;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav ul {
|
.nav ul {
|
||||||
list-style: none;
|
list-style: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav li {
|
.nav li {
|
||||||
|
cursor: pointer;
|
||||||
float: left;
|
float: left;
|
||||||
font-size: 12px;
|
line-height: 36px;
|
||||||
line-height: 35px;
|
margin-right: 15px;
|
||||||
margin-right: 10px;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav a,
|
.nav a,
|
||||||
.nav-item {
|
.nav-item {
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: normal;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
padding-left: 14px;
|
|
||||||
border-left: 1px solid #ccc;
|
|
||||||
color: #999;
|
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.nav-item {
|
||||||
|
padding-left: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
.location a {
|
.location a {
|
||||||
border-left: none;
|
border-left: none;
|
||||||
}
|
}
|
||||||
.nav a:hover {
|
|
||||||
color: $theme_color;
|
|
||||||
}
|
|
||||||
|
|
||||||
.icon {
|
.icon {
|
||||||
color: gray;
|
color: gray;
|
||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
|
|
||||||
.first a:first-child {
|
|
||||||
padding-left: 3px;
|
|
||||||
border-left: none;
|
|
||||||
}
|
|
||||||
.city {
|
.city {
|
||||||
padding: 10px 15px;
|
padding: 10px 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.city-item {
|
.city-item {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.city-item:hover {
|
.city-item:hover {
|
||||||
color: $theme_color;
|
color: $theme_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.person-icon {
|
.person-icon {
|
||||||
color: $theme_color;
|
color: $theme_color;
|
||||||
background-color: #f0cdb2;
|
background-color: #f0cdb2;
|
||||||
}
|
}
|
||||||
|
|
||||||
.shopping-cart-list {
|
|
||||||
padding: 10px 15px;
|
|
||||||
box-sizing: border-box;
|
|
||||||
max-height: 300px;
|
|
||||||
overflow: scroll;
|
|
||||||
}
|
|
||||||
.shopping-cart-box {
|
|
||||||
margin: 8px 0px;
|
|
||||||
margin-top: 15px;
|
|
||||||
padding-bottom: 15px;
|
|
||||||
height: 40px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
border-bottom: 1px #ccc dotted;
|
|
||||||
}
|
|
||||||
.shopping-cart-box:first-child {
|
|
||||||
margin-top: 8px;
|
|
||||||
}
|
|
||||||
.shopping-cart-img {
|
.shopping-cart-img {
|
||||||
margin-right: 15px;
|
margin-right: 15px;
|
||||||
width: 40px;
|
width: 40px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.shopping-cart-img img {
|
.shopping-cart-img img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
}
|
}
|
||||||
|
|
||||||
.shopping-cart-info {
|
.shopping-cart-info {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
@@ -290,10 +267,7 @@ export default {
|
|||||||
line-height: 20px;
|
line-height: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.go-to-buy {
|
|
||||||
display: flex;
|
|
||||||
justify-content: flex-end;
|
|
||||||
}
|
|
||||||
.shopping-cart-null {
|
.shopping-cart-null {
|
||||||
padding: 15px;
|
padding: 15px;
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -301,22 +275,28 @@ export default {
|
|||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cart-null-icon {
|
.cart-null-icon {
|
||||||
font-size: 38px;
|
font-size: 38px;
|
||||||
margin-bottom: 15px;
|
margin-bottom: 15px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.shopping-cart-null span {
|
.shopping-cart-null span {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
line-height: 16px;
|
line-height: 16px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.username-p {
|
.username-p {
|
||||||
position: relative;
|
position: relative;
|
||||||
|
|
||||||
div {
|
div {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
> span {
|
> span {
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.drop-items {
|
.drop-items {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
display: none;
|
display: none;
|
||||||
@@ -338,9 +318,11 @@ export default {
|
|||||||
border-bottom: 1px solid rgb(207, 206, 206);
|
border-bottom: 1px solid rgb(207, 206, 206);
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|
||||||
&:last-child {
|
&:last-child {
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
color: $theme_color;
|
color: $theme_color;
|
||||||
@@ -367,6 +349,7 @@ export default {
|
|||||||
left: 0;
|
left: 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
.drop-items {
|
.drop-items {
|
||||||
display: block;
|
display: block;
|
||||||
@@ -382,11 +365,13 @@ export default {
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.my-page a {
|
.my-page a {
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.my-info {
|
.my-info {
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
@@ -394,15 +379,19 @@ export default {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.my-info:hover {
|
.my-info:hover {
|
||||||
box-shadow: 0px 0px 5px #ccc;
|
box-shadow: 0px 0px 5px #ccc;
|
||||||
}
|
}
|
||||||
|
|
||||||
.my-info i {
|
.my-info i {
|
||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.my-info p {
|
.my-info p {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sign-out {
|
.sign-out {
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
width: 50%;
|
width: 50%;
|
||||||
@@ -410,18 +399,23 @@ export default {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sign-out:hover {
|
.sign-out:hover {
|
||||||
box-shadow: 0px 0px 5px $border_color;
|
box-shadow: 0px 0px 5px $border_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sign-out i {
|
.sign-out i {
|
||||||
font-size: 28px;
|
font-size: 28px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sign-out p {
|
.sign-out p {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.goods-title:hover {
|
.goods-title:hover {
|
||||||
color: $theme_color;
|
color: $theme_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
.cart-badge {
|
.cart-badge {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: -8px;
|
right: -8px;
|
||||||
@@ -437,4 +431,34 @@ export default {
|
|||||||
z-index: 3;
|
z-index: 3;
|
||||||
top: 3px;
|
top: 3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.shopping-cart-box {
|
||||||
|
padding: 8px 0;
|
||||||
|
cursor: pointer;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
border-bottom: 1px #ccc dotted;
|
||||||
|
}
|
||||||
|
|
||||||
|
.shopping-cart-list {
|
||||||
|
padding: 10px 10px;
|
||||||
|
box-sizing: border-box;
|
||||||
|
max-height: 300px;
|
||||||
|
overflow-y: scroll;
|
||||||
|
color: #333;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.shopping-cart-detail {
|
||||||
|
color: #999;
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.shopping-price {
|
||||||
|
color: $theme_color;
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,62 +0,0 @@
|
|||||||
<template>
|
|
||||||
<div class="shop-box">
|
|
||||||
<div class="shop-container">
|
|
||||||
<div class="shop-title-content">
|
|
||||||
<img class="hover-pointer" @click="linkTo(`/merchant?id=${storeDetail.storeId}`)" :src="storeDetail.storeLogo" height="40" alt="">
|
|
||||||
<p><router-link :to="`/merchant?id=${storeDetail.storeId}`">{{ storeDetail.storeName }}</router-link></p>
|
|
||||||
<div class="ml_20" v-html="storeDetail.storeDesc"></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</template>
|
|
||||||
|
|
||||||
<script>
|
|
||||||
export default {
|
|
||||||
name: 'ShopHeader',
|
|
||||||
props: {
|
|
||||||
detail: {
|
|
||||||
type: Object,
|
|
||||||
default: null
|
|
||||||
}
|
|
||||||
},
|
|
||||||
computed: {
|
|
||||||
storeDetail () { // 店铺详情
|
|
||||||
return this.detail;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style scoped>
|
|
||||||
/* 店铺介绍 */
|
|
||||||
.shop-box {
|
|
||||||
width: 100%;
|
|
||||||
height: 50px;
|
|
||||||
background-color: #484848;
|
|
||||||
}
|
|
||||||
|
|
||||||
.shop-container {
|
|
||||||
width: 1200px;
|
|
||||||
height: 100%;
|
|
||||||
margin: 0px auto;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: row;
|
|
||||||
justify-content: space-between;
|
|
||||||
align-items: center;
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
.shop-title-content {
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.shop-title-content p {
|
|
||||||
font-size: 20px;
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
.shop-title-content a {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
@@ -1,13 +1,17 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="scroll-show">
|
<div class="scroll-show">
|
||||||
<div class="content clearfix">
|
<div class="content clearfix">
|
||||||
<cateNav class="cate" :hover="true" :showNavBar="false"></cateNav>
|
<cateNav class="cate" :hover="true" :showNavBar="false"
|
||||||
|
useClass="fixed-show"></cateNav>
|
||||||
<Search
|
<Search
|
||||||
class="search-con"
|
class="search-con"
|
||||||
:hover="true"
|
:hover="true"
|
||||||
|
ref="search"
|
||||||
:showLogo="false"
|
:showLogo="false"
|
||||||
:showTag="false"
|
:showTag="false"
|
||||||
|
useClass="fixed-show"
|
||||||
></Search>
|
></Search>
|
||||||
|
<div class="flex flex-a-c cart">
|
||||||
<Icon
|
<Icon
|
||||||
type="ios-cart-outline"
|
type="ios-cart-outline"
|
||||||
@click="goCartList"
|
@click="goCartList"
|
||||||
@@ -16,7 +20,8 @@
|
|||||||
/>
|
/>
|
||||||
<i class="cart-badge">{{ cartNum < 100 ? cartNum : "99" }}</i>
|
<i class="cart-badge">{{ cartNum < 100 ? cartNum : "99" }}</i>
|
||||||
</div>
|
</div>
|
||||||
<hr class="hr"/>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@@ -53,6 +58,7 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|
||||||
if (storage.getItem("userInfo")) {
|
if (storage.getItem("userInfo")) {
|
||||||
this.userInfo = JSON.parse(storage.getItem("userInfo"));
|
this.userInfo = JSON.parse(storage.getItem("userInfo"));
|
||||||
}
|
}
|
||||||
@@ -60,14 +66,11 @@ export default {
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.hr{
|
|
||||||
height:1px;
|
|
||||||
background:$theme_color;
|
|
||||||
}
|
|
||||||
.content {
|
.content {
|
||||||
width: 1200px;
|
width: 1200px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
margin: 10px auto;
|
margin: 0 auto;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
.cate {
|
.cate {
|
||||||
@@ -80,11 +83,14 @@ export default {
|
|||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
margin-top: -27px;
|
margin-top: -27px;
|
||||||
}
|
}
|
||||||
|
.cart{
|
||||||
|
height: 60px;
|
||||||
|
}
|
||||||
.cart-icon {
|
.cart-icon {
|
||||||
width: 30px;
|
width: 30px;
|
||||||
float: left;
|
float: left;
|
||||||
font-size: 25px;
|
font-size: 25px;
|
||||||
margin-top: 8px;
|
|
||||||
color: $theme_color;
|
color: $theme_color;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
position: relative;
|
position: relative;
|
||||||
@@ -106,6 +112,6 @@ export default {
|
|||||||
line-height: 17px;
|
line-height: 17px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
z-index: 5;
|
z-index: 5;
|
||||||
top: 3px;
|
top: 10px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -81,6 +81,27 @@
|
|||||||
<template v-if="element.type == 'recommend'">
|
<template v-if="element.type == 'recommend'">
|
||||||
<recommend :data="element" class="mb_20 width_1200_auto"></recommend>
|
<recommend :data="element" class="mb_20 width_1200_auto"></recommend>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
<!-- 一行三列 -->
|
||||||
|
<template v-if="element.type == 'oneRowThreeColumns'">
|
||||||
|
<oneRowThreeColumns :data="element" class="mb_20 width_1200_auto"></oneRowThreeColumns>
|
||||||
|
</template>
|
||||||
|
<!-- 商品模块 -->
|
||||||
|
<template v-if="element.type == 'goodsType'">
|
||||||
|
<goodsAndType :paramData="element" class="mb_20 width_1200_auto"></goodsAndType>
|
||||||
|
</template>
|
||||||
|
<!-- 商品模块 -->
|
||||||
|
<template v-if="element.type == 'onlyGoodsModel'">
|
||||||
|
<onlyGoodsModel :data="element" class="mb_20 width_1200_auto"></onlyGoodsModel>
|
||||||
|
</template>
|
||||||
|
<!-- 混合模块 -->
|
||||||
|
<template v-if="element.type == 'mixModel'">
|
||||||
|
<mixModel :data="element" class="mb_20 width_1200_auto"></mixModel>
|
||||||
|
</template>
|
||||||
|
<!-- 混合模块 -->
|
||||||
|
<template v-if="element.type == 'forYour'">
|
||||||
|
<forYour :data="element" class="mb_20 width_1200_auto"></forYour>
|
||||||
|
</template>
|
||||||
<!-- 新品排行 -->
|
<!-- 新品排行 -->
|
||||||
<template v-if="element.type == 'newGoodsSort'">
|
<template v-if="element.type == 'newGoodsSort'">
|
||||||
<new-goods-sort
|
<new-goods-sort
|
||||||
@@ -100,7 +121,7 @@
|
|||||||
<div style="width: 100%; text-align: center">
|
<div style="width: 100%; text-align: center">
|
||||||
<img
|
<img
|
||||||
width="1200"
|
width="1200"
|
||||||
class="hover-pointer mb_20"
|
class="hover-pointer mb_20 bannerAd"
|
||||||
@click="linkTo(element.options.url)"
|
@click="linkTo(element.options.url)"
|
||||||
:src="element.options.img"
|
:src="element.options.img"
|
||||||
alt=""
|
alt=""
|
||||||
@@ -126,6 +147,12 @@ import NewGoodsSort from "./modelList/NewGoodsSort.vue";
|
|||||||
import Recommend from "./modelList/Recommend.vue";
|
import Recommend from "./modelList/Recommend.vue";
|
||||||
import NotEnough from "./modelList/NotEnough.vue";
|
import NotEnough from "./modelList/NotEnough.vue";
|
||||||
import Seckill from "./modelList/Seckill.vue";
|
import Seckill from "./modelList/Seckill.vue";
|
||||||
|
import oneRowThreeColumns from "./modelList/oneRowThreeColumns.vue";
|
||||||
|
import goodsAndType from "./modelList/goodsAndType.vue";
|
||||||
|
import onlyGoodsModel from "./modelList/onlyGoodsModel.vue";
|
||||||
|
import mixModel from "./modelList/mixModel.vue";
|
||||||
|
import forYour from "./modelList/forYour.vue";
|
||||||
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "modelFormItem",
|
name: "modelFormItem",
|
||||||
@@ -139,6 +166,11 @@ export default {
|
|||||||
FirstPageAdvert,
|
FirstPageAdvert,
|
||||||
NotEnough,
|
NotEnough,
|
||||||
Seckill,
|
Seckill,
|
||||||
|
oneRowThreeColumns,
|
||||||
|
goodsAndType,
|
||||||
|
onlyGoodsModel,
|
||||||
|
mixModel,
|
||||||
|
forYour
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@@ -153,7 +185,11 @@ export default {
|
|||||||
position: relative;
|
position: relative;
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
}
|
}
|
||||||
|
.bannerAd{
|
||||||
|
width: 1183px;
|
||||||
|
height: 166.6px;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
/** 热门广告 */
|
/** 热门广告 */
|
||||||
.advert-list {
|
.advert-list {
|
||||||
background: $theme_color;
|
background: $theme_color;
|
||||||
@@ -198,9 +234,4 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.width_1200_auto {
|
|
||||||
width: 1200px;
|
|
||||||
margin: 0 auto;
|
|
||||||
background-color: #fff;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -5,14 +5,13 @@
|
|||||||
<div class="nav-side"></div>
|
<div class="nav-side"></div>
|
||||||
<div class="nav-content">
|
<div class="nav-content">
|
||||||
<!-- 轮播图 -->
|
<!-- 轮播图 -->
|
||||||
<Carousel autoplay>
|
<!-- autoplay autoplay-speed="10000"-->
|
||||||
|
<Carousel :height="333.9" autoplay :autoplay-speed="5000">
|
||||||
<CarouselItem v-for="(item, index) in data.options.list" :key="index">
|
<CarouselItem v-for="(item, index) in data.options.list" :key="index">
|
||||||
<div style="overflow: hidden">
|
<div class="swiper-img" >
|
||||||
<img
|
<img
|
||||||
:src="item.img"
|
:src="item.img"
|
||||||
width="790"
|
|
||||||
@click="linkTo(item.url)"
|
@click="linkTo(item.url)"
|
||||||
height="340"
|
|
||||||
class="hover-pointer"
|
class="hover-pointer"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -21,47 +20,66 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="nav-right">
|
<div class="nav-right">
|
||||||
<div class="person-msg">
|
<div class="person-msg">
|
||||||
<img :src="userInfo.face" v-if="userInfo.face" alt />
|
<div class="user-box" @click="entryControl({ path: 'home' })">
|
||||||
<Avatar icon="ios-person" class="mb_10" v-else size="80" />
|
<img class="user-face" :src="userInfo.face || defaultAvatar" alt />
|
||||||
<div>
|
<div class="welcome">
|
||||||
Hi, {{
|
Hi, {{
|
||||||
userInfo.nickName || `欢迎来到${config.title}` | secrecyMobile
|
userInfo.nickName || `欢迎来到${config.title}` | secrecyMobile
|
||||||
}}
|
}}
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
<div v-if="userInfo.id">
|
<div v-if="userInfo.id">
|
||||||
<Button class="btns" shape="circle" @click="$router.push('home')"
|
<div class="icon-list"></div>
|
||||||
>会员中心</Button
|
<!-- #TODO 后续增加 -->
|
||||||
|
<!-- <div class="icon-list flex flex-j-sb" >
|
||||||
|
<div class="icon-item" :key="index" @click="entryControl(item)" v-for="(item,index) in recentList">
|
||||||
|
<div class="value">
|
||||||
|
{{ item.value}}
|
||||||
|
</div>
|
||||||
|
<div class="label">
|
||||||
|
{{ item.label}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div> -->
|
||||||
|
</div>
|
||||||
|
<div v-else class="flex flex-a-c ">
|
||||||
|
<div class="btns" @click="$router.push('login')" shape="circle"
|
||||||
|
>登录</div
|
||||||
|
>
|
||||||
|
<div class="btns sign-up" @click="$router.push('signUp')" shape="circle"
|
||||||
|
>注册</div
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<div v-else>
|
|
||||||
<Button class="btns" @click="$router.push('login')" shape="circle"
|
<div class="gray-line"></div>
|
||||||
>请登录</Button
|
<div class="icon-list flex flex-j-sb" >
|
||||||
>
|
<div class="icon-item" @click="entryControl(item)" :key="index" v-for="(item, index) in entranceList">
|
||||||
</div>
|
<img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
|
||||||
</div>
|
|
||||||
<div class="shop-msg">
|
|
||||||
<div>
|
<div>
|
||||||
<span>常见问题</span>
|
{{ item.label }}
|
||||||
<ul class="article-list">
|
|
||||||
<li
|
|
||||||
class="ellipsis"
|
|
||||||
:alt="article.title"
|
|
||||||
v-for="(article, index) in articleList"
|
|
||||||
:key="index"
|
|
||||||
@click="goArticle(article.id)"
|
|
||||||
>
|
|
||||||
{{ article.title }}
|
|
||||||
</li>
|
|
||||||
</ul>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="icon-list flex flex-j-sb" >
|
||||||
|
<div class="icon-item" :key="index" @click="entryControl(item)" v-for="(item, index) in appendList">
|
||||||
|
<img class="icon" :src="require(`@/assets/iconfont/${item.icon}.png`)">
|
||||||
|
<div>
|
||||||
|
{{ item.label }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { articleList } from "@/api/common.js";
|
|
||||||
import storage from "@/plugins/storage";
|
import storage from "@/plugins/storage";
|
||||||
export default {
|
export default {
|
||||||
name: "modelCarousel",
|
name: "modelCarousel",
|
||||||
@@ -69,60 +87,249 @@ export default {
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
config: require("@/config"),
|
config: require("@/config"),
|
||||||
|
defaultAvatar: require("@/assets/images/default.png"),
|
||||||
userInfo: {}, // 用户信息
|
userInfo: {}, // 用户信息
|
||||||
articleList: [], // 常见问题
|
entranceList: [
|
||||||
params: {
|
{
|
||||||
// 请求常见问题参数
|
icon: "collage",
|
||||||
pageNumber: 1,
|
label: "宝贝收藏",
|
||||||
pageSize: 5,
|
path: "/home/Favorites"
|
||||||
type: "ANNOUNCEMENT",
|
|
||||||
sort: "sort",
|
|
||||||
},
|
},
|
||||||
|
|
||||||
|
{
|
||||||
|
icon: "carts",
|
||||||
|
label: "购物车",
|
||||||
|
path: "/cart"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "story",
|
||||||
|
label: "我的足迹",
|
||||||
|
path: "/home/MyTracks"
|
||||||
|
},
|
||||||
|
],
|
||||||
|
appendList: [
|
||||||
|
{
|
||||||
|
icon: "support",
|
||||||
|
label: "帮助中心",
|
||||||
|
path: "/article"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "feedback",
|
||||||
|
label: "我的评论",
|
||||||
|
path: "/home/CommentList"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "notice",
|
||||||
|
label: "收货地址",
|
||||||
|
path: "/home/MyAddress"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
icon: "notification",
|
||||||
|
label: "我的消息",
|
||||||
|
path: "/home/MsgList"
|
||||||
|
},
|
||||||
|
],
|
||||||
|
recentList: [
|
||||||
|
{
|
||||||
|
value: "0",
|
||||||
|
label: "购物车"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "0",
|
||||||
|
label: "待收货"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "0",
|
||||||
|
label: "待发货"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "0",
|
||||||
|
label: "代付款"
|
||||||
|
},
|
||||||
|
],
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
getArticleList() {
|
// 快捷跳转中心
|
||||||
// 获取常见问题列表
|
entryControl(val) {
|
||||||
articleList(this.params).then((res) => {
|
console.log("val",val)
|
||||||
if (res.success) {
|
let url = this.$router.resolve(val.path);
|
||||||
this.articleList = res.result.records;
|
window.open(url.href, '_blank');
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
|
||||||
goArticle(id) {
|
|
||||||
// 跳转文章详情
|
|
||||||
let routeUrl = this.$router.resolve({
|
|
||||||
path: "/article",
|
|
||||||
query: { id },
|
|
||||||
});
|
|
||||||
window.open(routeUrl.href, "_blank");
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
if (storage.getItem("userInfo"))
|
if (storage.getItem("userInfo"))
|
||||||
this.userInfo = JSON.parse(storage.getItem("userInfo"));
|
this.userInfo = JSON.parse(storage.getItem("userInfo"));
|
||||||
this.getArticleList();
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
.label {
|
||||||
|
font-size: 12px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 14px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #666666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.swiper-img {
|
||||||
|
overflow: hidden;
|
||||||
|
width: 637px;
|
||||||
|
height: 329.9px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-list {
|
||||||
|
width: 216px
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-list:nth-last-of-type(1) {
|
||||||
|
margin-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hot-box {
|
||||||
|
margin-top: 35px;
|
||||||
|
width: 216px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.hot-tag {
|
||||||
|
margin-right: 6px;
|
||||||
|
width: 36px;
|
||||||
|
height: 18px;
|
||||||
|
border-radius: 4px;
|
||||||
|
opacity: 1;
|
||||||
|
font-size: 12px;
|
||||||
|
border: 1px solid $theme_color;
|
||||||
|
color: $theme_color;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 18px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.gray-line {
|
||||||
|
width: 216px;
|
||||||
|
height: 1px;
|
||||||
|
border: 1px solid #E5E5E5;
|
||||||
|
margin-bottom: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
width: 20px !important;
|
||||||
|
height: 20px !important;
|
||||||
|
margin-bottom: 7px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-item {
|
||||||
|
|
||||||
|
cursor: pointer;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
>div {
|
||||||
|
font-size: 11px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 13px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #666666;
|
||||||
|
}
|
||||||
|
|
||||||
|
>.value {
|
||||||
|
font-size: 14px;
|
||||||
|
|
||||||
|
line-height: 17px;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: 400;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
margin-bottom: 3px;
|
||||||
|
color: $theme_color;
|
||||||
|
}
|
||||||
|
|
||||||
|
>.label {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
line-height: 14px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
color: #666666;
|
||||||
|
margin-bottom: 13px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
.model-carousel {
|
.model-carousel {
|
||||||
width: 1200px;
|
width: 1200px;
|
||||||
height: 340px;
|
height: 340px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.hover-pointer {
|
||||||
|
//display: block;
|
||||||
|
//width: 100%;
|
||||||
|
//height: 100%;
|
||||||
|
width: 637px;
|
||||||
|
height: 329.9px;
|
||||||
|
object-fit: cover;
|
||||||
|
border-radius: 10px;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.welcome {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 17px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.hr {
|
||||||
|
width: 216px;
|
||||||
|
height: 1px;
|
||||||
|
border: 1px solid #E5E5E5;
|
||||||
|
}
|
||||||
|
|
||||||
.btns {
|
.btns {
|
||||||
background-color:#363634 ;
|
margin-top: 21px;
|
||||||
line-height:30px;
|
margin-bottom: 13px;
|
||||||
color: white !important;
|
width: 77px;
|
||||||
|
height: 28px;
|
||||||
|
border-radius: 14px;
|
||||||
|
opacity: 1;
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 28px;
|
||||||
|
text-align: center;
|
||||||
|
cursor: pointer;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #FFFFFF;
|
||||||
|
background: $theme_color;
|
||||||
}
|
}
|
||||||
.btns:hover {
|
|
||||||
background-color: #363634;
|
.sign-up {
|
||||||
line-height:32px !important;
|
background: #F39519;
|
||||||
color: #e5d790 !important;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.avatar {
|
||||||
|
margin-bottom: 13px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.user-face {
|
||||||
|
|
||||||
|
margin-bottom: 12px;
|
||||||
|
width: 70px;
|
||||||
|
height: 70px;
|
||||||
|
border-radius: 50%;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
/* 导航主体 */
|
/* 导航主体 */
|
||||||
.nav-body {
|
.nav-body {
|
||||||
width: 1200px;
|
width: 1200px;
|
||||||
@@ -131,67 +338,80 @@ export default {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.nav-side {
|
.nav-side {
|
||||||
height: 100%;
|
height: 334px;
|
||||||
width: 200px;
|
width: 263.2px;
|
||||||
|
border-bottom-left-radius: 10px;
|
||||||
|
border-bottom-right-radius: 10px;
|
||||||
float: left;
|
float: left;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
background-color: #6e6568;
|
// background-color: #6e6568;
|
||||||
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/*导航内容*/
|
/*导航内容*/
|
||||||
.nav-content {
|
.nav-content {
|
||||||
width: 790px;
|
width: 637px;
|
||||||
overflow: hidden;
|
margin-left: 10.8px;
|
||||||
|
|
||||||
|
margin-top: 10px;
|
||||||
|
height: 333.9px;
|
||||||
|
|
||||||
float: left;
|
float: left;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-right {
|
.nav-right {
|
||||||
float: left;
|
float: left;
|
||||||
width: 210px;
|
margin-top: 10px;
|
||||||
|
width: 263.2px;
|
||||||
|
margin-left: 10px;
|
||||||
|
|
||||||
|
border-radius: 10px;
|
||||||
|
background: #FFFFFF;
|
||||||
|
|
||||||
.person-msg {
|
.person-msg {
|
||||||
|
cursor: pointer;
|
||||||
|
height: 333px;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
margin: 20px auto;
|
padding-top: 28px;
|
||||||
button {
|
padding-bottom: 25px;
|
||||||
height: 30px !important;
|
|
||||||
margin-top: 10px;
|
>.user-box{
|
||||||
line-height: 30px;
|
text-align: center;
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
.ivu-btn-default {
|
|
||||||
// color: $theme_color;
|
|
||||||
// border-color: $theme_color;
|
|
||||||
}
|
|
||||||
img {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
width: 80px;
|
|
||||||
height: 80px;
|
|
||||||
border-radius: 50%;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.shop-msg {
|
.shop-msg {
|
||||||
div {
|
div {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin: 10px 27px;
|
margin: 10px 27px;
|
||||||
|
|
||||||
span {
|
span {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
span:nth-child(1) {
|
span:nth-child(1) {
|
||||||
@include content_color($theme_color);
|
@include content_color($theme_color);
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
span:nth-child(2) {
|
span:nth-child(2) {
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
span:nth-child(3):hover {
|
span:nth-child(3):hover {
|
||||||
color: $theme_color;
|
color: $theme_color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
li {
|
li {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@@ -199,6 +419,7 @@ export default {
|
|||||||
color: #999395;
|
color: #999395;
|
||||||
width: 150px;
|
width: 150px;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: $theme_color;
|
color: $theme_color;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -65,12 +65,12 @@ export default {
|
|||||||
handleScrollx(){
|
handleScrollx(){
|
||||||
// console.log('滚动高度',window.pageYOffset) // 获取滚动条的高度
|
// console.log('滚动高度',window.pageYOffset) // 获取滚动条的高度
|
||||||
// console.log(this.$refs.obtain.getBoundingClientRect().top) //获取到距离顶部的距离
|
// console.log(this.$refs.obtain.getBoundingClientRect().top) //获取到距离顶部的距离
|
||||||
this.scrollHieght = Number(window.pageYOffset);//获取到距离顶部的距离
|
// this.scrollHieght = Number(window.pageYOffset);//获取到距离顶部的距离
|
||||||
this.scrollTops = Number(this.$refs.obtain.getBoundingClientRect().top); // 获取到距离顶部的距离
|
// this.scrollTops = Number(this.$refs.obtain.getBoundingClientRect().top); // 获取到距离顶部的距离
|
||||||
this.topSearchShow = true; // 展示图钉
|
// this.topSearchShow = true; // 展示图钉
|
||||||
if(this.scrollTops < -660){ // 超过隐藏
|
// if(this.scrollTops < -660){ // 超过隐藏
|
||||||
this.topSearchShow = false;
|
// this.topSearchShow = false;
|
||||||
}
|
// }
|
||||||
},
|
},
|
||||||
toguid(path,id){
|
toguid(path,id){
|
||||||
var path =path;
|
var path =path;
|
||||||
|
|||||||
228
buyer/src/components/indexDecorate/modelList/forYour.vue
Normal file
@@ -0,0 +1,228 @@
|
|||||||
|
<template>
|
||||||
|
<div class="model" v-if="data">
|
||||||
|
<div class="for-your">{{ data.options.title }}</div>
|
||||||
|
<div class="flex card">
|
||||||
|
<div class="left">
|
||||||
|
<img :src="data.options.data.image.src" alt="" />
|
||||||
|
</div>
|
||||||
|
<div class="right flex">
|
||||||
|
<!-- 商品区 -->
|
||||||
|
<div class="goods-list">
|
||||||
|
<div
|
||||||
|
class="goods-item"
|
||||||
|
:key="index"
|
||||||
|
v-for="(item, index) in data.options.data.list"
|
||||||
|
@click="linkTo(item.url)"
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
<div class="goods-name">{{ item.title }}</div>
|
||||||
|
<div class="goods-desc">{{ item.desc }}</div>
|
||||||
|
</div>
|
||||||
|
<img class="goods-img" :src="item.img" alt="" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 热卖区 -->
|
||||||
|
<div class="hot-list">
|
||||||
|
<div class="hot-title">{{ data.options.data.hot.title }}</div>
|
||||||
|
<div
|
||||||
|
class="hot-item flex flex-a-c"
|
||||||
|
v-for="(item, index) in data.options.data.hot.list"
|
||||||
|
:key="index"
|
||||||
|
@click="linkTo(item.url)"
|
||||||
|
>
|
||||||
|
<img :src="item.img" alt="" />
|
||||||
|
<div class="hot-goods">
|
||||||
|
<div class="hot-goods-title">{{ item.title }}</div>
|
||||||
|
<div>
|
||||||
|
<div class="hot-price">¥{{ item.price | unitPrice }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "forYour",
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
current: "",
|
||||||
|
};
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
data: {
|
||||||
|
type: Object,
|
||||||
|
default: {},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
mounted() {},
|
||||||
|
methods: {},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.goods-list {
|
||||||
|
display: flex;
|
||||||
|
width: 558px;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
}
|
||||||
|
.goods-item {
|
||||||
|
width: 278px;
|
||||||
|
height: 277px;
|
||||||
|
text-align: center;
|
||||||
|
box-sizing: border-box;
|
||||||
|
cursor: pointer;
|
||||||
|
border-right: 1.4px solid #e2e2e2;
|
||||||
|
&:nth-of-type(3) {
|
||||||
|
border-top: 1.4px solid #e2e2e2;
|
||||||
|
}
|
||||||
|
&:nth-of-type(4) {
|
||||||
|
border-top: 1.4px solid #e2e2e2;
|
||||||
|
}
|
||||||
|
&:hover {
|
||||||
|
/deep/ .goods-name {
|
||||||
|
color: $theme_color;
|
||||||
|
}
|
||||||
|
/deep/ .goods-desc {
|
||||||
|
color: $theme_color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.goods-name {
|
||||||
|
margin-top: 23px;
|
||||||
|
font-size: 25px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 30px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
.goods-img {
|
||||||
|
width: 190px;
|
||||||
|
height: 156px;
|
||||||
|
margin-top: 19px;
|
||||||
|
border-radius: 10px;
|
||||||
|
}
|
||||||
|
.goods-desc {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 17px;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 11px;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
.for-your {
|
||||||
|
font-size: 35px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 42px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
margin-bottom: 32px;
|
||||||
|
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.card,
|
||||||
|
.right-card {
|
||||||
|
opacity: 1;
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 10px;
|
||||||
|
position: relative;
|
||||||
|
box-shadow: 0px 1px 13px 0px #E5E5E5;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
.setup-box {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-tab-bar {
|
||||||
|
> .flex {
|
||||||
|
align-items: center;
|
||||||
|
margin: 10px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.draggable {
|
||||||
|
> .flex {
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.left {
|
||||||
|
width: 346px;
|
||||||
|
height: 554px;
|
||||||
|
border-radius: 9.8px 0px 0px 9.8px;
|
||||||
|
> img {
|
||||||
|
max-width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.right {
|
||||||
|
width: 839px;
|
||||||
|
height: 554px;
|
||||||
|
border-radius: 0px 9.8px 9.8px 0px;
|
||||||
|
}
|
||||||
|
.hot-list {
|
||||||
|
width: 279px;
|
||||||
|
}
|
||||||
|
.hot-title {
|
||||||
|
margin-left: 25px;
|
||||||
|
line-height: 63px;
|
||||||
|
font-size: 17px;
|
||||||
|
font-weight: normal;
|
||||||
|
|
||||||
|
letter-spacing: 0px;
|
||||||
|
color: #333333;
|
||||||
|
height: 63px;
|
||||||
|
}
|
||||||
|
.hot-item {
|
||||||
|
cursor: pointer;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-top: 1.4px solid #e2e2e2;
|
||||||
|
height: 122px;
|
||||||
|
padding:0 14px;
|
||||||
|
align-items: center;
|
||||||
|
&:hover {
|
||||||
|
> .hot-goods {
|
||||||
|
> .hot-goods-title {
|
||||||
|
color: $theme_color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> img {
|
||||||
|
width: 76.3px;
|
||||||
|
height: 77.7px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.hot-goods {
|
||||||
|
margin-left: 14px;
|
||||||
|
}
|
||||||
|
.hot-goods-title {
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 16px;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
.hot-price {
|
||||||
|
margin-top: 10.3px;
|
||||||
|
font-size: 24px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 29px;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: $theme_color;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
205
buyer/src/components/indexDecorate/modelList/goodsAndType.vue
Normal file
@@ -0,0 +1,205 @@
|
|||||||
|
<template>
|
||||||
|
<div class="goods-type-wrapper">
|
||||||
|
<div class="flex goods-type-line">
|
||||||
|
<div class="goods-type-title">{{ paramData.options.title }}</div>
|
||||||
|
<div class="flex goods-type-labels">
|
||||||
|
<div
|
||||||
|
:class="{ active: current === item.___index }"
|
||||||
|
class="goods-type-item"
|
||||||
|
v-for="(item, index) in paramData.options.labels"
|
||||||
|
:key="index"
|
||||||
|
@click="handleClickLabel(item, index)"
|
||||||
|
>
|
||||||
|
{{ item.label }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- 商品部分 -->
|
||||||
|
<div class="only-goods-list flex-j-sb">
|
||||||
|
<div
|
||||||
|
v-if="paramData.options"
|
||||||
|
class="only-goods-list-item "
|
||||||
|
v-for="(item, index) in paramData.options.list.filter((client) => {
|
||||||
|
return client.___index == current;
|
||||||
|
})"
|
||||||
|
:key="index"
|
||||||
|
@click="linkTo(item.url)"
|
||||||
|
>
|
||||||
|
<div class="goods-img">
|
||||||
|
<img :src="item.img" />
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<div class="goods-name wes-2">{{ item.title }}</div>
|
||||||
|
<div class="goods-desc">{{ item.desc }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="goods-price">
|
||||||
|
{{ item.price | unitPrice("¥") }}
|
||||||
|
</div>
|
||||||
|
<!-- 查看 -->
|
||||||
|
<div class="white-shadow">
|
||||||
|
<div class="search">去查看</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "goods",
|
||||||
|
props: {
|
||||||
|
paramData: {
|
||||||
|
type: Object,
|
||||||
|
default: {},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
current: "",
|
||||||
|
};
|
||||||
|
},
|
||||||
|
watch: {},
|
||||||
|
mounted() {
|
||||||
|
this.current = this.paramData.options.labels[0].___index;
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 筛选出当前分类下的商品
|
||||||
|
handleClickLabel(val, index) {
|
||||||
|
this.current = index;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.white-shadow {
|
||||||
|
width: 287px;
|
||||||
|
height: 122px;
|
||||||
|
border-radius: 0px 0px 10px 10px;
|
||||||
|
opacity: 1;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
opacity: 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
transition: 0.35s;
|
||||||
|
align-items: center;
|
||||||
|
background: linear-gradient(
|
||||||
|
180deg,
|
||||||
|
rgba(252, 252, 252, 0.58) -50%,
|
||||||
|
#ffffff 99%
|
||||||
|
);
|
||||||
|
}
|
||||||
|
.search {
|
||||||
|
width: 143px;
|
||||||
|
height: 45px;
|
||||||
|
border-radius: 22.5px;
|
||||||
|
opacity: 1;
|
||||||
|
font-size: 20px;
|
||||||
|
font-weight: normal;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
line-height: 45px;
|
||||||
|
color: #ffffff;
|
||||||
|
background: $theme_color;
|
||||||
|
}
|
||||||
|
.only-goods-list{
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
}
|
||||||
|
.only-goods-list-item {
|
||||||
|
padding-top: 30px;
|
||||||
|
width: 287px;
|
||||||
|
height: 343.7px;
|
||||||
|
border-radius: 9.8px;
|
||||||
|
opacity: 1;
|
||||||
|
margin-bottom: 14.3px;
|
||||||
|
cursor: pointer;
|
||||||
|
background: #ffffff;
|
||||||
|
transition: all 0.4s ease;
|
||||||
|
box-shadow: 0px 1px 13px 0px #e5e5e5;
|
||||||
|
position: relative;
|
||||||
|
&:hover {
|
||||||
|
transform: translateY(-5px);
|
||||||
|
box-shadow: 0px 1px 14px 0px #c5c5c5;
|
||||||
|
> .white-shadow {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
> .goods-img {
|
||||||
|
> img {
|
||||||
|
opacity: 0.8 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.goods-img {
|
||||||
|
margin-bottom: 9.8px;
|
||||||
|
text-align: center;
|
||||||
|
> img {
|
||||||
|
transition: all 0.4s ease;
|
||||||
|
width: auto;
|
||||||
|
max-height: 183px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.goods-name {
|
||||||
|
font-size: 18px;
|
||||||
|
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 22px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
width: 200px;
|
||||||
|
margin: 0 auto 12.4px auto;
|
||||||
|
color: #333333;
|
||||||
|
-webkit-text-stroke: #979797 0.7px; /* 浏览器可能不支持 */
|
||||||
|
}
|
||||||
|
.goods-desc {
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 17px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
margin-bottom: 12.4px;
|
||||||
|
color: #666666;
|
||||||
|
|
||||||
|
-webkit-text-stroke: #979797 0.7px; /* 浏览器可能不支持 */
|
||||||
|
}
|
||||||
|
.goods-price {
|
||||||
|
font-size: 25.2px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 30px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #f31947;
|
||||||
|
-webkit-text-stroke: #979797 0.7px; /* 浏览器可能不支持 */
|
||||||
|
}
|
||||||
|
.goods-type-line {
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
}
|
||||||
|
.goods-type-title {
|
||||||
|
font-size: 31px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 37px;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
.active {
|
||||||
|
color: #f31947;
|
||||||
|
}
|
||||||
|
.goods-type-labels {
|
||||||
|
cursor: pointer;
|
||||||
|
font-size: 21px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 25px;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
}
|
||||||
|
.goods-type-item {
|
||||||
|
margin-left: 28px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
53
buyer/src/components/indexDecorate/modelList/mixModel.vue
Normal file
@@ -0,0 +1,53 @@
|
|||||||
|
<template>
|
||||||
|
<div class="mix-model">
|
||||||
|
<!-- 左侧 -->
|
||||||
|
<div class="left-card">
|
||||||
|
<left :data="data" />
|
||||||
|
</div>
|
||||||
|
<!-- 右侧 -->
|
||||||
|
<div class="right-card">
|
||||||
|
<right :data="data" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import left from './mixs/mix-goods'
|
||||||
|
import right from './mixs/mix-brand'
|
||||||
|
export default {
|
||||||
|
name: "mixModel",
|
||||||
|
data() {
|
||||||
|
return {}
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
data: {
|
||||||
|
type: Object,
|
||||||
|
default: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
left,
|
||||||
|
right
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.mix-model{
|
||||||
|
display: flex;
|
||||||
|
justify-content:space-between;
|
||||||
|
}
|
||||||
|
.left-card,.right-card{
|
||||||
|
width: 584px;
|
||||||
|
height: 344px;
|
||||||
|
border-radius: 10px;
|
||||||
|
opacity: 1;
|
||||||
|
background: #FFFFFF;
|
||||||
|
box-shadow: 0px 1px 13px 0px #E5E5E5;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
132
buyer/src/components/indexDecorate/modelList/mixs/mix-brand.vue
Normal file
@@ -0,0 +1,132 @@
|
|||||||
|
<template>
|
||||||
|
<div class="flex" v-if="data.options.right.model == 'brand'">
|
||||||
|
<div class="left-side" @click="linkTo(data.options.right.data.image.url)">
|
||||||
|
<img :src="data.options.right.data.image.src" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="right-side">
|
||||||
|
<div class="badge-box flex">
|
||||||
|
<div class="round">
|
||||||
|
<Icon type="ios-arrow-forward" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="flex goods-list">
|
||||||
|
<div class="goods-item flex" @click="linkTo(item.url)" :key="index" v-for="(item,index) in data.options.right.data.list">
|
||||||
|
<div class="goods-thumbnail">
|
||||||
|
<img :src="item.img" alt="">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "mix-goods",
|
||||||
|
data() {
|
||||||
|
return {}
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
data: {
|
||||||
|
type: Object,
|
||||||
|
default: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {},
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.right-side{
|
||||||
|
width: 330px;
|
||||||
|
}
|
||||||
|
.goods-detail-title{
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
.goods-detail-price{
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 17px;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
color: $theme_color;
|
||||||
|
margin-top: 8px;
|
||||||
|
margin-bottom:10px;
|
||||||
|
}
|
||||||
|
.goods-thumbnail{
|
||||||
|
margin-left: 7px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
>img{
|
||||||
|
width:90px;
|
||||||
|
height: 90px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.badge-box{
|
||||||
|
margin-top: 33px;
|
||||||
|
justify-content:right;
|
||||||
|
>.round{
|
||||||
|
width: 17.5px;
|
||||||
|
height: 17.5px;
|
||||||
|
opacity: 1;
|
||||||
|
border-radius: 50%;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 17.5px;
|
||||||
|
border: 0.7px solid #333333;
|
||||||
|
margin-right: 17.5px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.goods-list{
|
||||||
|
width: 330px;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content:space-between;
|
||||||
|
padding: 0 16px;
|
||||||
|
}
|
||||||
|
.goods-item{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width:50%;
|
||||||
|
height: 85px;
|
||||||
|
border-radius: 9.8px;
|
||||||
|
opacity: 1;
|
||||||
|
transition: .35s;
|
||||||
|
background: #FFFFFF;
|
||||||
|
margin-bottom:9px;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
.left-side {
|
||||||
|
>img{
|
||||||
|
width: 254px;
|
||||||
|
height: 344px;
|
||||||
|
border-radius: 9.8px 0px 0px 9.8px;
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.badge {
|
||||||
|
width: 50px;
|
||||||
|
height: 27px;
|
||||||
|
line-height:27px;
|
||||||
|
border-radius: 13.3px 0px 0px 13.3px;
|
||||||
|
opacity: 1;
|
||||||
|
background: #F31947;
|
||||||
|
font-size: 12.6px;
|
||||||
|
font-weight: normal;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
margin-top: 26px;
|
||||||
|
margin-bottom:17px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
127
buyer/src/components/indexDecorate/modelList/mixs/mix-goods.vue
Normal file
@@ -0,0 +1,127 @@
|
|||||||
|
<template>
|
||||||
|
<div class="flex" v-if="data.options.left.model == 'goods'">
|
||||||
|
<div class="left-side" @click="linkTo(data.options.right.data.image.url)">
|
||||||
|
<img :src="data.options.left.data.image.src" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="right-side">
|
||||||
|
<div class="badge-box flex">
|
||||||
|
<div class="badge" @click="linkTo(data.options.right.data.image.url)">
|
||||||
|
{{data.options.left.data.badge.label}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex goods-list">
|
||||||
|
|
||||||
|
<div class="goods-item flex" @click="linkTo(item.url)" :key="index" v-for="(item,index) in data.options.left.data.list">
|
||||||
|
<div class="goods-thumbnail">
|
||||||
|
<img :src="item.img" alt="">
|
||||||
|
</div>
|
||||||
|
<div class="goods-detail">
|
||||||
|
<div class="goods-detail-title">{{item.title}}</div>
|
||||||
|
<div class="goods-detail-price">{{item.price | unitPrice('¥')}}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "mix-goods",
|
||||||
|
data() {
|
||||||
|
return {}
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
data: {
|
||||||
|
type: Object,
|
||||||
|
default: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {},
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.right-side{
|
||||||
|
width: 387px;
|
||||||
|
}
|
||||||
|
.goods-detail-title{
|
||||||
|
font-size: 13px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 16px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
.goods-detail-price{
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 17px;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
color: #F31947;
|
||||||
|
margin-top: 8px;
|
||||||
|
margin-bottom:10px;
|
||||||
|
}
|
||||||
|
.goods-thumbnail{
|
||||||
|
margin-left: 7px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
>img{
|
||||||
|
width:90px;
|
||||||
|
height: 90px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.badge-box{
|
||||||
|
|
||||||
|
justify-content:right;
|
||||||
|
}
|
||||||
|
.goods-list{
|
||||||
|
width: 387px;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content:space-between;
|
||||||
|
padding: 0 16px;
|
||||||
|
}
|
||||||
|
.goods-item{
|
||||||
|
cursor: pointer;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
width: 173.6px;
|
||||||
|
height: 119px;
|
||||||
|
border-radius: 9.8px;
|
||||||
|
opacity: 1;
|
||||||
|
transition: .35s;
|
||||||
|
background: #FFFFFF;
|
||||||
|
margin-bottom:9px;
|
||||||
|
&:hover{
|
||||||
|
box-shadow: 0px 1px 6px 0px #E5E5E5;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.left-side {
|
||||||
|
>img{
|
||||||
|
border-radius: 10px 0px 0px 10px;
|
||||||
|
display: block;
|
||||||
|
width: 196.7px;
|
||||||
|
height: 343.7px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.badge {
|
||||||
|
width: 50px;
|
||||||
|
height: 27px;
|
||||||
|
line-height:27px;
|
||||||
|
border-radius: 13.3px 0px 0px 13.3px;
|
||||||
|
opacity: 1;
|
||||||
|
background: #F31947;
|
||||||
|
font-size: 12.6px;
|
||||||
|
font-weight: normal;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
margin-top: 26px;
|
||||||
|
margin-bottom:17px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -0,0 +1,36 @@
|
|||||||
|
<template>
|
||||||
|
<div class="line flex flex-a-c flex-j-sb">
|
||||||
|
<div class="column" v-for="(item,index) in data.options.list" :key="index">
|
||||||
|
<img :src="item.img" class="three-column-img">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: "oneRowThreeColumns",
|
||||||
|
props: {
|
||||||
|
data: {
|
||||||
|
type: Object,
|
||||||
|
default: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data () {
|
||||||
|
return {
|
||||||
|
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.column{
|
||||||
|
width: 385px;
|
||||||
|
height: 165px;
|
||||||
|
>img{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
186
buyer/src/components/indexDecorate/modelList/onlyGoodsModel.vue
Normal file
@@ -0,0 +1,186 @@
|
|||||||
|
<template>
|
||||||
|
<div class="goods-type-wrapper">
|
||||||
|
<!-- 商品部分 -->
|
||||||
|
<div class="only-goods-list flex" >
|
||||||
|
<div
|
||||||
|
class="only-goods-list-item"
|
||||||
|
v-for="(item, index) in data.options.list"
|
||||||
|
:key="index"
|
||||||
|
@click="handleClick(item)"
|
||||||
|
>
|
||||||
|
<div>
|
||||||
|
<div class="goods-name wes-2">{{ item.title }}</div>
|
||||||
|
<div class="goods-desc">{{ item.desc }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="goods-img">
|
||||||
|
<img :src="item.img" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: "onlyGoodsList",
|
||||||
|
props: {
|
||||||
|
data: {
|
||||||
|
type: Object,
|
||||||
|
default: {},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
flag:false,
|
||||||
|
tabIndex:0,
|
||||||
|
current: 0,
|
||||||
|
showModal: false,
|
||||||
|
selected: {}, // 已选数据
|
||||||
|
picModelFlag: false,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted(){
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
handleClick(val){
|
||||||
|
this.linkTo(val.url)
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
|
||||||
|
.goods-type-wrapper {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.del-btn{
|
||||||
|
margin-left:10px;
|
||||||
|
}
|
||||||
|
.tab-bar {
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
.draggable {
|
||||||
|
padding: 10px;
|
||||||
|
border-bottom: 1px solid #ededed;
|
||||||
|
transition: 0.35s;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background-color: #ededed;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.column-config {
|
||||||
|
margin-left: 10px;
|
||||||
|
> * {
|
||||||
|
margin: 4px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.column-img {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
}
|
||||||
|
.add-goods {
|
||||||
|
margin-left: 20px;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
}
|
||||||
|
.only-goods-list {
|
||||||
|
position: relative;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
&:hover {
|
||||||
|
> .setup-box {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.column-goods-config {
|
||||||
|
flex: 2;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
}
|
||||||
|
.only-goods-list-item {
|
||||||
|
padding-top: 34.8px;
|
||||||
|
margin-bottom: 14.3px;
|
||||||
|
width: 287px;
|
||||||
|
height: 343.7px;
|
||||||
|
border-radius: 9.8px;
|
||||||
|
opacity: 1;
|
||||||
|
cursor: pointer;
|
||||||
|
background: #ffffff;
|
||||||
|
transition: 0.35s;
|
||||||
|
box-shadow: 0px 1px 13px 0px #e5e5e5;
|
||||||
|
&:hover {
|
||||||
|
box-shadow: 0px 1px 14px 0px #c5c5c5;
|
||||||
|
transform: translateY(-2px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.goods-img {
|
||||||
|
text-align: center;
|
||||||
|
> img {
|
||||||
|
width: auto;
|
||||||
|
max-height: 183px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.goods-name {
|
||||||
|
margin-bottom: 11.9px;
|
||||||
|
font-size: 25px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 30px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #333333;
|
||||||
|
|
||||||
|
-webkit-text-stroke: #979797 0.7px; /* 浏览器可能不支持 */
|
||||||
|
}
|
||||||
|
.goods-desc {
|
||||||
|
margin-bottom: 30px;
|
||||||
|
font-size: 16px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 19px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #666666;
|
||||||
|
|
||||||
|
-webkit-text-stroke: #979797 0.7px; /* 浏览器可能不支持 */
|
||||||
|
}
|
||||||
|
.goods-price {
|
||||||
|
font-size: 25.2px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 30px;
|
||||||
|
text-align: center;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: $theme_color;
|
||||||
|
-webkit-text-stroke: #979797 0.7px; /* 浏览器可能不支持 */
|
||||||
|
}
|
||||||
|
.goods-type-line {
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
margin-bottom: 25px;
|
||||||
|
}
|
||||||
|
.goods-type-title {
|
||||||
|
font-size: 31px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 37px;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
.active {
|
||||||
|
color: $theme_color;
|
||||||
|
}
|
||||||
|
.goods-type-labels {
|
||||||
|
font-size: 21px;
|
||||||
|
font-weight: normal;
|
||||||
|
line-height: 25px;
|
||||||
|
letter-spacing: 0px;
|
||||||
|
}
|
||||||
|
.goods-type-item {
|
||||||
|
margin-left: 28px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
@@ -6,11 +6,11 @@
|
|||||||
</p>
|
</p>
|
||||||
<!-- 普通发票 -->
|
<!-- 普通发票 -->
|
||||||
<div class="nav-content">
|
<div class="nav-content">
|
||||||
<Form :model="invoiceForm" ref="form" label-position="left" :rules="ruleInline" :label-width="110">
|
<Form :model="invoiceForm" ref="form" label-position="left" :label-width="110">
|
||||||
<FormItem label="发票类型">
|
<FormItem label="发票类型">
|
||||||
<RadioGroup v-model="invoice" type="button" button-style="solid">
|
<RadioGroup v-model="invoice" type="button" button-style="solid">
|
||||||
<Radio @on-change="changeInvoice" :label="1">电子普通发票</Radio>
|
<Radio @on-change="changeInvoice" :label="1">电子普通发票</Radio>
|
||||||
<Radio :label="2" :disabled="true">增值税专用发票</Radio>
|
<Radio :label="2" >增值税专用发票</Radio>
|
||||||
</RadioGroup>
|
</RadioGroup>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="发票抬头">
|
<FormItem label="发票抬头">
|
||||||
@@ -24,10 +24,46 @@
|
|||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="单位名称" v-if="type === 2" prop="receiptTitle">
|
<FormItem label="单位名称" v-if="type === 2" prop="receiptTitle">
|
||||||
<i-input v-model="invoiceForm.receiptTitle"></i-input>
|
<i-input v-model="invoiceForm.receiptTitle"></i-input>
|
||||||
|
<Poptip ref="poptip" placement="right" width="300">
|
||||||
|
<div class="global_color">选择其他发票抬头</div>
|
||||||
|
<div slot="content">
|
||||||
|
<Spin fix v-if="delReceiptLoad"></Spin>
|
||||||
|
<div class="receipt-content">
|
||||||
|
<div class="flex receipt-item" v-for="item in receiptList" :key="item.id" >
|
||||||
|
<div @click="chooseReceipt(item)">
|
||||||
|
<div class="receipt-title">{{ item.receiptTitle }}</div>
|
||||||
|
<div>{{ item.taxpayerId }}</div>
|
||||||
|
</div>
|
||||||
|
<div class="global_color" @click="delReceipt(item.id)">
|
||||||
|
删除
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style="text-align: right;">
|
||||||
|
<Page :total="total" @on-change="changePage"
|
||||||
|
:current="searchParams.pageNumber" :page-size="searchParams.pageSize" size="small" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</Poptip>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="纳税人识别号" v-if="type === 2" prop="taxpayerId">
|
<FormItem label="纳税人识别号" v-if="type === 2" prop="taxpayerId">
|
||||||
<i-input v-model="invoiceForm.taxpayerId"></i-input>
|
<i-input v-model="invoiceForm.taxpayerId"></i-input>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
|
<div v-if="type === 2" class="more" @click="showMore = !showMore">更多选填项</div>
|
||||||
|
<div v-if="showMore">
|
||||||
|
<FormItem label="单位地址" v-if="type === 2" prop="address">
|
||||||
|
<i-input v-model="invoiceForm.address"></i-input>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem label="单位电话" v-if="type === 2" prop="mobile">
|
||||||
|
<i-input v-model="invoiceForm.mobile"></i-input>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem label="开户银行" v-if="type === 2" prop="bank">
|
||||||
|
<i-input v-model="invoiceForm.bank"></i-input>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem label="银行账号" v-if="type === 2" prop="bankNumber">
|
||||||
|
<i-input v-model="invoiceForm.bankNumber"></i-input>
|
||||||
|
</FormItem>
|
||||||
|
</div>
|
||||||
<FormItem label="发票内容">
|
<FormItem label="发票内容">
|
||||||
<RadioGroup v-model="invoiceForm.receiptContent" type="button" button-style="solid">
|
<RadioGroup v-model="invoiceForm.receiptContent" type="button" button-style="solid">
|
||||||
<Radio label="商品明细">商品明细</Radio>
|
<Radio label="商品明细">商品明细</Radio>
|
||||||
@@ -36,8 +72,10 @@
|
|||||||
</FormItem>
|
</FormItem>
|
||||||
</Form>
|
</Form>
|
||||||
<div style="text-align: center">
|
<div style="text-align: center">
|
||||||
<Button type="primary" :loading="loading" @click="submit">保存发票信息</Button>
|
|
||||||
|
<Button type="primary" class="mr_10" :loading="loading" @click="submit">保存发票信息</Button>
|
||||||
<Button type="default" @click="invoiceAvailable = false">取消</Button>
|
<Button type="default" @click="invoiceAvailable = false">取消</Button>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
@@ -45,11 +83,15 @@
|
|||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import { receiptSelect } from '@/api/cart.js';
|
import { receiptSelect } from '@/api/cart.js';
|
||||||
import { TINumber } from '@/plugins/RegExp.js';
|
import { getMemberReceiptList ,setMemberReceiptList,delMemberReceipt } from '@/api/member.js';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'invoiceModal',
|
name: 'invoiceModal',
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
|
receiptList:[],
|
||||||
|
showMore:false,
|
||||||
|
delReceiptLoad:false,
|
||||||
invoice: 1, // 发票类型
|
invoice: 1, // 发票类型
|
||||||
invoiceAvailable: false, // 模态框显隐
|
invoiceAvailable: false, // 模态框显隐
|
||||||
loading: false, // 提交状态
|
loading: false, // 提交状态
|
||||||
@@ -59,17 +101,36 @@ export default {
|
|||||||
taxpayerId: '', // 纳税人识别号
|
taxpayerId: '', // 纳税人识别号
|
||||||
receiptContent: '商品明细' // 发票内容
|
receiptContent: '商品明细' // 发票内容
|
||||||
},
|
},
|
||||||
|
isDefault:false,
|
||||||
type: 1, // 1 个人 2 单位
|
type: 1, // 1 个人 2 单位
|
||||||
ruleInline: {
|
searchParams:{
|
||||||
taxpayerId: [
|
|
||||||
{ required: true, message: '请填写纳税人识别号' },
|
pageNumber:1,
|
||||||
{ pattern: TINumber, message: '请填写正确的纳税人识别号' }
|
pageSize:5
|
||||||
]
|
},
|
||||||
}
|
total:0,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
props: ['invoiceData'],
|
props: ['invoiceData'],
|
||||||
watch: {
|
watch: {
|
||||||
|
type(val){
|
||||||
|
if(val === 2 && !this.invoiceForm.receiptTitle){
|
||||||
|
// 查找默认的发票抬头
|
||||||
|
const defaultValue = this.receiptList.find(item => item.isDefault === 1)
|
||||||
|
if(!defaultValue){
|
||||||
|
this.invoiceForm.receiptTitle = this.receiptList[0].receiptTitle
|
||||||
|
this.invoiceForm.taxpayerId = this.receiptList[0].taxpayerId
|
||||||
|
}else{
|
||||||
|
this.invoiceForm.receiptTitle = defaultValue.receiptTitle
|
||||||
|
this.invoiceForm.taxpayerId = defaultValue.taxpayerId
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
invoiceAvailable(val){
|
||||||
|
if(val){
|
||||||
|
this.getReceiptList()
|
||||||
|
}
|
||||||
|
},
|
||||||
// 回显的发票信息
|
// 回显的发票信息
|
||||||
invoiceData: {
|
invoiceData: {
|
||||||
handler (val) {
|
handler (val) {
|
||||||
@@ -85,7 +146,40 @@ export default {
|
|||||||
immeadite: true
|
immeadite: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
mounted () {
|
||||||
|
this.getReceiptList()
|
||||||
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
changePage(v){
|
||||||
|
this.searchParams.pageNumber = v;
|
||||||
|
this.getReceiptList();
|
||||||
|
},
|
||||||
|
getReceiptList () { // 获取抬头列表
|
||||||
|
getMemberReceiptList(this.searchParams).then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
const list = res.result.records;
|
||||||
|
this.receiptList = list;
|
||||||
|
this.total = res.result.total
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
async delReceipt(id){
|
||||||
|
try {
|
||||||
|
this.delReceiptLoad = true
|
||||||
|
const res = await delMemberReceipt(id)
|
||||||
|
this.delReceiptLoad = false
|
||||||
|
if(res.success){
|
||||||
|
if(this.searchParams.pageNumber !==1 && this.total - 1 < this.searchParams.pageNumber * this.searchParams.pageSize){
|
||||||
|
this.searchParams.pageNumber = this.searchParams.pageNumber - 1
|
||||||
|
}
|
||||||
|
this.$Message.success('删除成功')
|
||||||
|
this.getReceiptList()
|
||||||
|
}
|
||||||
|
} catch (error) {
|
||||||
|
this.delReceiptLoad = false
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
/**
|
/**
|
||||||
* 选择发票抬头
|
* 选择发票抬头
|
||||||
*/
|
*/
|
||||||
@@ -94,12 +188,16 @@ export default {
|
|||||||
this.type = val;
|
this.type = val;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
chooseReceipt(val){
|
||||||
|
this.$refs.poptip.visible = false
|
||||||
|
this.invoiceForm.receiptTitle = val.receiptTitle
|
||||||
|
this.invoiceForm.taxpayerId = val.taxpayerId
|
||||||
|
},
|
||||||
/**
|
/**
|
||||||
* 保存判断
|
* 保存判断
|
||||||
*/
|
*/
|
||||||
save () {
|
save () {
|
||||||
let flage = true;
|
let flag = true;
|
||||||
|
|
||||||
// 保存分为两种类型,个人以及企业
|
// 保存分为两种类型,个人以及企业
|
||||||
const { receiptTitle } = JSON.parse(
|
const { receiptTitle } = JSON.parse(
|
||||||
@@ -108,31 +206,35 @@ export default {
|
|||||||
// 判断是否填写发票抬头
|
// 判断是否填写发票抬头
|
||||||
if (!receiptTitle) {
|
if (!receiptTitle) {
|
||||||
this.$Message.error('请填写发票抬头!');
|
this.$Message.error('请填写发票抬头!');
|
||||||
flage = false;
|
flag = false;
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
if (this.type === 2) {
|
if (this.type === 2) {
|
||||||
this.$refs.form.validate((valid) => {
|
this.$refs.form.validate((valid) => {
|
||||||
if (!valid) {
|
if (!valid) {
|
||||||
flage = false;
|
flag = false;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
delete this.invoiceForm.taxpayerId;
|
delete this.invoiceForm.taxpayerId;
|
||||||
}
|
}
|
||||||
|
|
||||||
return flage;
|
return flag;
|
||||||
},
|
},
|
||||||
// 保存发票信息
|
// 保存发票信息
|
||||||
async submit () {
|
async submit () {
|
||||||
if (this.save()) {
|
if (this.save()) {
|
||||||
this.loading = true;
|
|
||||||
let submit = {
|
let submit = {
|
||||||
way: this.$route.query.way,
|
way: this.$route.query.way,
|
||||||
...this.invoiceForm
|
...this.invoiceForm
|
||||||
};
|
};
|
||||||
|
// 存储到发票列表中
|
||||||
|
await setMemberReceiptList({...submit,isDefault:this.isDefault ? 1 : 0})
|
||||||
|
this.loading = true;
|
||||||
let receipt = await receiptSelect(submit);
|
let receipt = await receiptSelect(submit);
|
||||||
|
|
||||||
if (receipt.success) {
|
if (receipt.success) {
|
||||||
this.$emit('change', true);
|
this.$emit('change', true);
|
||||||
}
|
}
|
||||||
@@ -156,9 +258,33 @@ export default {
|
|||||||
color: $theme_color;
|
color: $theme_color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.global_color{
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
.receipt-item{
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding:8px 16px;
|
||||||
|
cursor: pointer;
|
||||||
|
line-height: 1.5;
|
||||||
|
border-bottom: 1px solid #ededed;
|
||||||
|
}
|
||||||
|
|
||||||
|
.receipt-content{
|
||||||
|
height: 280px;
|
||||||
|
}
|
||||||
|
|
||||||
.nav-content {
|
.nav-content {
|
||||||
width: 500px;
|
width: 500px;
|
||||||
margin: 10px auto;
|
margin: 10px auto;
|
||||||
}
|
}
|
||||||
|
.more{
|
||||||
|
text-align: center;
|
||||||
|
color: $theme_color;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
/deep/ .ivu-input{
|
||||||
|
width: 280px !important;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,114 +1,94 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="lili-map">
|
<div class="map">
|
||||||
<Modal v-model="showMap" title="选择地址" width="800">
|
|
||||||
<div class="address">{{ addrContent.address }}</div>
|
<div class="address">{{ addrContent.address }}</div>
|
||||||
<div id="map-container"></div>
|
<div id="map-container"></div>
|
||||||
|
|
||||||
<div class="search-con">
|
<div class="search-con">
|
||||||
<Input
|
<Input placeholder="输入关键字搜索" id="input-map" v-model="mapSearch" />
|
||||||
placeholder="输入关键字搜索"
|
|
||||||
id="input-map"
|
|
||||||
v-model="mapSearch"
|
|
||||||
/>
|
|
||||||
<ul>
|
<ul>
|
||||||
<li
|
<li v-for="(tip, index) in tips" :key="index" @click="selectAddr(tip.location)">
|
||||||
v-for="(tip, index) in tips"
|
|
||||||
:key="index"
|
|
||||||
@click="selectAddr(tip.location)"
|
|
||||||
>
|
|
||||||
<p>{{ tip.name }}</p>
|
<p>{{ tip.name }}</p>
|
||||||
<p>{{ tip.district + tip.address }}</p>
|
<p>{{ tip.district + tip.address }}</p>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<div slot="footer">
|
<div slot="footer" class="footer">
|
||||||
<Button type="default" @click="showMap = false">取消</Button>
|
|
||||||
<Button type="primary" :loading="loading" @click="ok">确定</Button>
|
<Button type="primary" :loading="loading" @click="ok">确定</Button>
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import AMapLoader from '@amap/amap-jsapi-loader';
|
import AMapLoader from "@amap/amap-jsapi-loader";
|
||||||
import { handleRegion } from '@/api/address.js';
|
import { handleRegion } from "@/api/address.js";
|
||||||
|
|
||||||
|
const config = require('@/config/index')
|
||||||
export default {
|
export default {
|
||||||
name: 'map',
|
name: "map",
|
||||||
props: {
|
|
||||||
useApi: {
|
|
||||||
default: true,
|
|
||||||
type: Boolean
|
|
||||||
}
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
config:require('@/config'),
|
config,
|
||||||
showMap: false, // 展示地图
|
showMap: false, // 地图显隐
|
||||||
mapSearch: '', // 地图搜索
|
mapSearch: "", // 地图搜索
|
||||||
map: null, // 初始化地图
|
map: null, // 初始化地图
|
||||||
autoComplete: null, // 初始化搜索方法
|
autoComplete: null, // 初始化搜索方法
|
||||||
geocoder: null, // 初始化地理、坐标转化
|
geocoder: null, // 初始化地理、坐标转化
|
||||||
positionPicker: null, // 地图拖拽选点
|
positionPicker: null, // 地图拖拽选点
|
||||||
tips: [], //搜索关键字列表
|
tips: [], //搜索关键字列表
|
||||||
addrContent: {}, // 回显地址信息
|
addrContent: {}, // 回显地址信息
|
||||||
loading: false // 加载状态
|
loading: false, // 加载状态
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
watch: {
|
watch: {
|
||||||
// 监听搜索框搜索地图
|
|
||||||
mapSearch: function (val) {
|
mapSearch: function (val) {
|
||||||
this.searchOfMap(val);
|
this.searchOfMap(val);
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
ok() {
|
ok() {
|
||||||
// 确定选择
|
|
||||||
this.loading = true;
|
if (this.addrContent && this.addrContent.regeocode) {
|
||||||
const address = this.addrContent.address;
|
|
||||||
const township = this.addrContent.regeocode.addressComponent.township;
|
|
||||||
const index = address.indexOf(township) + township.length;
|
|
||||||
this.addrContent.detail = address.substring(index);
|
|
||||||
const params = {
|
const params = {
|
||||||
cityCode: this.addrContent.regeocode.addressComponent.citycode,
|
cityCode: this.addrContent.regeocode.addressComponent.citycode,
|
||||||
townName: this.addrContent.regeocode.addressComponent.township
|
townName: this.addrContent.regeocode.addressComponent.township,
|
||||||
};
|
};
|
||||||
if (this.useApi) {
|
|
||||||
handleRegion(params).then((res) => {
|
handleRegion(params).then((res) => {
|
||||||
this.loading = false;
|
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.showMap = false;
|
this.addrContent.addr = res.result.name.replace(/,/g, " ");
|
||||||
this.addrContent.addr = res.result.name.replace(/,/g, ' ');
|
|
||||||
this.addrContent.addrId = res.result.id;
|
this.addrContent.addrId = res.result.id;
|
||||||
this.$emit('getAddress', this.addrContent);
|
this.loading = false;
|
||||||
|
|
||||||
|
this.$emit("getAddress", this.addrContent);
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
this.loading = false;
|
this.$Message.error('未获取到坐标信息!请查看高德API配置是否正确')
|
||||||
this.showMap = false;
|
|
||||||
this.$emit('getAddress', this.addrContent);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
init () { // 初始化地图
|
init() {
|
||||||
AMapLoader.load({
|
AMapLoader.load({
|
||||||
key: this.config.aMapKey, // 申请好的Web端开发者Key,首次调用 load 时必填
|
key: this.config.aMapKey, // 申请好的Web端开发者Key,首次调用 load 时必填
|
||||||
version: '', // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
|
version: "", // 指定要加载的 JSAPI 的版本,缺省时默认为 1.4.15
|
||||||
plugins: [
|
plugins: [
|
||||||
'AMap.ToolBar',
|
"AMap.ToolBar",
|
||||||
'AMap.Autocomplete',
|
"AMap.Autocomplete",
|
||||||
'AMap.PlaceSearch',
|
"AMap.PlaceSearch",
|
||||||
'AMap.Geolocation',
|
"AMap.Geolocation",
|
||||||
'AMap.Geocoder'
|
"AMap.Geocoder",
|
||||||
], // 需要使用的的插件列表,如比例尺'AMap.Scale'等
|
], // 需要使用的的插件列表,如比例尺'AMap.Scale'等
|
||||||
AMapUI: {
|
AMapUI: {
|
||||||
// 是否加载 AMapUI,缺省不加载
|
// 是否加载 AMapUI,缺省不加载
|
||||||
version: '1.1', // AMapUI 缺省 1.1
|
version: "1.1", // AMapUI 缺省 1.1
|
||||||
plugins: ['misc/PositionPicker'] // 需要加载的 AMapUI ui插件
|
plugins: ["misc/PositionPicker"], // 需要加载的 AMapUI ui插件
|
||||||
}
|
},
|
||||||
})
|
})
|
||||||
.then((AMap) => {
|
.then((AMap) => {
|
||||||
let that = this;
|
let that = this;
|
||||||
this.map = new AMap.Map('map-container', {
|
this.map = new AMap.Map("map-container", {
|
||||||
zoom: 12
|
zoom: 12,
|
||||||
});
|
});
|
||||||
that.map.addControl(new AMap.ToolBar());
|
that.map.addControl(new AMap.ToolBar());
|
||||||
that.map.addControl(new AMap.Autocomplete());
|
that.map.addControl(new AMap.Autocomplete());
|
||||||
@@ -117,15 +97,15 @@ export default {
|
|||||||
|
|
||||||
// 实例化Autocomplete
|
// 实例化Autocomplete
|
||||||
let autoOptions = {
|
let autoOptions = {
|
||||||
city: '全国'
|
city: "全国",
|
||||||
};
|
};
|
||||||
that.autoComplete = new AMap.Autocomplete(autoOptions); // 搜索
|
that.autoComplete = new AMap.Autocomplete(autoOptions); // 搜索
|
||||||
that.geocoder = new AMap.Geocoder(autoOptions);
|
that.geocoder = new AMap.Geocoder(autoOptions);
|
||||||
|
|
||||||
that.positionPicker = new AMapUI.PositionPicker({
|
that.positionPicker = new AMapUI.PositionPicker({
|
||||||
// 拖拽选点
|
// 拖拽选点
|
||||||
mode: 'dragMap',
|
mode: "dragMap",
|
||||||
map: that.map
|
map: that.map,
|
||||||
});
|
});
|
||||||
that.positionPicker.start();
|
that.positionPicker.start();
|
||||||
/**
|
/**
|
||||||
@@ -134,8 +114,7 @@ export default {
|
|||||||
* 需要字段可以查找
|
* 需要字段可以查找
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
that.positionPicker.on('success', function (positionResult) {
|
that.positionPicker.on("success", function (positionResult) {
|
||||||
// console.log(positionResult);
|
|
||||||
that.addrContent = positionResult;
|
that.addrContent = positionResult;
|
||||||
});
|
});
|
||||||
})
|
})
|
||||||
@@ -146,7 +125,7 @@ export default {
|
|||||||
let that = this;
|
let that = this;
|
||||||
this.autoComplete.search(val, function (status, result) {
|
this.autoComplete.search(val, function (status, result) {
|
||||||
// 搜索成功时,result即是对应的匹配数据
|
// 搜索成功时,result即是对应的匹配数据
|
||||||
if (status === 'complete' && result.info === 'OK') {
|
if (status == "complete" && result.info == "OK") {
|
||||||
that.tips = result.tips;
|
that.tips = result.tips;
|
||||||
} else {
|
} else {
|
||||||
that.tips = [];
|
that.tips = [];
|
||||||
@@ -156,16 +135,16 @@ export default {
|
|||||||
selectAddr(location) {
|
selectAddr(location) {
|
||||||
// 选择坐标
|
// 选择坐标
|
||||||
if (!location) {
|
if (!location) {
|
||||||
this.$Message.warning('请选择正确点位');
|
this.$Message.warning("请选择正确点位");
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
const lnglat = [location.lng, location.lat];
|
const lnglat = [location.lng, location.lat];
|
||||||
this.positionPicker.start(lnglat);
|
this.positionPicker.start(lnglat);
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.init();
|
this.init();
|
||||||
}
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@@ -179,16 +158,20 @@ export default {
|
|||||||
right: 20px;
|
right: 20px;
|
||||||
top: 64px;
|
top: 64px;
|
||||||
width: 260px;
|
width: 260px;
|
||||||
|
|
||||||
ul {
|
ul {
|
||||||
width: 260px;
|
width: 260px;
|
||||||
height: 400px;
|
height: 360px;
|
||||||
overflow: scroll;
|
overflow: scroll;
|
||||||
|
|
||||||
li {
|
li {
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
|
|
||||||
p:nth-child(2) {
|
p:nth-child(2) {
|
||||||
color: #999;
|
color: #999;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
background-color: #eee;
|
background-color: #eee;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
@@ -199,6 +182,12 @@ export default {
|
|||||||
|
|
||||||
.address {
|
.address {
|
||||||
margin-bottom: 10px;
|
margin-bottom: 10px;
|
||||||
|
// color: $theme_color;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.footer {
|
||||||
|
text-align: right;
|
||||||
|
margin: 10px 0;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
155
buyer/src/components/map/multiple-map.vue
Normal file
@@ -0,0 +1,155 @@
|
|||||||
|
<template>
|
||||||
|
<Modal width="800" footer-hide v-model="enableMap">
|
||||||
|
<RadioGroup @on-change="changeMap" v-model="mapDefault" type="button">
|
||||||
|
<Radio label="select">级联选择</Radio>
|
||||||
|
<Radio label="map" v-if="aMapSwitch">高德地图</Radio>
|
||||||
|
</RadioGroup>
|
||||||
|
<div>
|
||||||
|
<div v-if="mapDefault === 'select'">
|
||||||
|
<div class="selector">
|
||||||
|
<div class="selector-item" v-for="(plant, plantIndex) in Object.keys(data)" :key="plantIndex">
|
||||||
|
<div :class="{ 'active': chiosend[plantIndex].id == item.id }" v-for="(item, index) in data[plant]"
|
||||||
|
:key="index"
|
||||||
|
@click="init(item, plantIndex != Object.keys(data).length - 1 ? Object.keys(data)[plantIndex + 1] : 0, plantIndex)"
|
||||||
|
class="map-item">
|
||||||
|
{{ item.name }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div class="footer">
|
||||||
|
<Button type="primary" @click="finished">确定</Button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<mapping v-if="mapDefault === 'map'" ref="map" @getAddress="getAddress" />
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
</Modal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { aMapSwitch } from '@/config/index'
|
||||||
|
import mapping from "@/components/map/index.vue";
|
||||||
|
import * as API_Setup from "@/api/common.js";
|
||||||
|
export default {
|
||||||
|
components: { mapping },
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
aMapSwitch,
|
||||||
|
enableMap: false,
|
||||||
|
mapDefault: "select",
|
||||||
|
data: {
|
||||||
|
province: [], //省
|
||||||
|
city: [], //市
|
||||||
|
area: [], //区
|
||||||
|
street: [], //街道
|
||||||
|
},
|
||||||
|
chiosend: [],
|
||||||
|
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
this.chiosend = new Array(4).fill("");
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
open() {
|
||||||
|
this.enableMap = true
|
||||||
|
this.init({ id: 0 }, 'province');
|
||||||
|
},
|
||||||
|
changeMap(val) {
|
||||||
|
this.mapDefault = val
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
init(val, level = 'province', index) {
|
||||||
|
if (level == 0) {
|
||||||
|
// 说明选择到了街道,将街道id存入数组
|
||||||
|
this.chiosend.splice(3, 1, val);
|
||||||
|
}
|
||||||
|
else {
|
||||||
|
API_Setup.getRegion(val.id).then((res) => {
|
||||||
|
if (res.result.length && val.id !== 0) {
|
||||||
|
this.chiosend[index] = val
|
||||||
|
}
|
||||||
|
else if(!res.result.length){
|
||||||
|
this.chiosend[index] = val
|
||||||
|
}
|
||||||
|
this.data[level] = res.result;
|
||||||
|
if (level == 'city') {
|
||||||
|
this.data.area = []
|
||||||
|
this.data.street = []
|
||||||
|
this.chiosend.splice(1, 3, "","","");
|
||||||
|
}
|
||||||
|
if (level == 'area') {
|
||||||
|
this.data.street = []
|
||||||
|
this.chiosend.splice(2, 2, "","");
|
||||||
|
}
|
||||||
|
if (level == 'street') {
|
||||||
|
this.chiosend.splice(3, 1, "");
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getAddress(center) {
|
||||||
|
this.$emit('callback', {
|
||||||
|
type: this.mapDefault,
|
||||||
|
data: center
|
||||||
|
})
|
||||||
|
this.enableMap = false;
|
||||||
|
},
|
||||||
|
// 选择完成
|
||||||
|
finished() {
|
||||||
|
if(!this.chiosend[0]){
|
||||||
|
this.$Message.error("请选择地址")
|
||||||
|
return
|
||||||
|
}
|
||||||
|
const params = this.chiosend.filter((item) => item!=="" && item.value !== "");
|
||||||
|
this.enableMap = false;
|
||||||
|
this.$emit('callback', {
|
||||||
|
type: this.mapDefault,
|
||||||
|
data: params
|
||||||
|
})
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.selector {
|
||||||
|
|
||||||
|
|
||||||
|
height: 400px;
|
||||||
|
padding: 10px 0;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.selector-item {
|
||||||
|
width: 100%;
|
||||||
|
flex: 1;
|
||||||
|
overflow: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.map-item {
|
||||||
|
width: 100%;
|
||||||
|
padding: 10px;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
cursor: pointer;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
background: #eee;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.active {
|
||||||
|
background: #eee;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer {
|
||||||
|
text-align: right;
|
||||||
|
margin: 10px 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
58
buyer/src/components/mixes/talkIm.vue
Normal file
@@ -0,0 +1,58 @@
|
|||||||
|
<template>
|
||||||
|
<div></div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { getIMDetail ,getImSetting} from "@/api/common";
|
||||||
|
import Storage from "@/plugins/storage";
|
||||||
|
import { getMemberMsg } from "@/api/login";
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
Storage,
|
||||||
|
IMLink: "",
|
||||||
|
};
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 跳转im客服
|
||||||
|
async IMService(id, goodsId, skuId) {
|
||||||
|
|
||||||
|
// 获取访问Token
|
||||||
|
let accessToken = Storage.getItem("accessToken");
|
||||||
|
await this.getIMDetailMethods();
|
||||||
|
const userInfo = await getMemberMsg();
|
||||||
|
if (userInfo.success) {
|
||||||
|
//携带商品Id,在IM可以发送商品信息
|
||||||
|
if(goodsId && skuId){
|
||||||
|
window.open(
|
||||||
|
this.IMLink + "?token=" + accessToken + "&id=" + id || this.storeMsg.storeId + "&goodsId=" + goodsId + "&skuId=" + skuId
|
||||||
|
);
|
||||||
|
}else{
|
||||||
|
window.open(
|
||||||
|
this.IMLink + "?token=" + accessToken + "&id=" + id || this.storeMsg.storeId
|
||||||
|
);
|
||||||
|
}
|
||||||
|
|
||||||
|
} else {
|
||||||
|
this.$Message.error("请登录后再联系客服");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 获取im信息
|
||||||
|
async getIMDetailMethods() {
|
||||||
|
// 获取pc im
|
||||||
|
// let res = await getImSetting();
|
||||||
|
// if (res.success) {
|
||||||
|
// this.IMLink = res.result.qrCode
|
||||||
|
// }
|
||||||
|
let res = await getImSetting();
|
||||||
|
if (res.success) {
|
||||||
|
window.open(res.result.url);
|
||||||
|
// this.IMLink = res.result.qrCode;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped></style>
|
||||||
@@ -1,28 +1,29 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="cate-nav">
|
<div class="cate-nav width_1200_auto" :class="{'fixed-show':useClass == 'fixed-show'}">
|
||||||
<div class="nav-con">
|
<div class="nav-con" :class="{'background-white':useClass == 'background-white'}">
|
||||||
<div
|
<div
|
||||||
class="all-categories hover-pointer"
|
class="all-categories hover-pointer"
|
||||||
@mouseenter="showFirstLists"
|
@mouseenter="showFirstLists"
|
||||||
@mouseleave="showFirstList = false"
|
@mouseleave="showFirstList = false"
|
||||||
>
|
>
|
||||||
全部商品分类
|
商品分类
|
||||||
</div>
|
</div>
|
||||||
<ul class="nav-item " v-if="showNavBar">
|
<ul class="nav-item " v-if="showNavBar">
|
||||||
<li
|
<li
|
||||||
class="nav-lis"
|
class="nav-lis flex flex-a-c flex-j-c"
|
||||||
v-for="(item, index) in navList.list"
|
v-for="(item, index) in navList.list"
|
||||||
:key="index"
|
:key="index"
|
||||||
@click="linkTo(item.url)"
|
@click="linkTo(item.url)"
|
||||||
>
|
>
|
||||||
{{ item.name }}
|
{{ item.name }}
|
||||||
<!-- {{item}} -->
|
<div class="colum" v-if="index !== navList.list.length - 1"></div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
<!-- 全部商品分类 -->
|
<!-- 全部商品分类 -->
|
||||||
<div
|
<div
|
||||||
class="cate-list"
|
class="cate-list"
|
||||||
|
:style="{'top':!showNavBar ?'60px':'46px'}"
|
||||||
v-show="showAlways || showFirstList"
|
v-show="showAlways || showFirstList"
|
||||||
@mouseenter="showFirstList = true"
|
@mouseenter="showFirstList = true"
|
||||||
@mouseleave="showFirstList = false"
|
@mouseleave="showFirstList = false"
|
||||||
@@ -131,6 +132,10 @@ export default {
|
|||||||
default: false,
|
default: false,
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
},
|
},
|
||||||
|
useClass:{
|
||||||
|
type:null,
|
||||||
|
default:''
|
||||||
|
}
|
||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
@@ -223,46 +228,81 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
.background-white{
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
.nav-lis:hover {
|
.nav-lis:hover {
|
||||||
color: $theme_color !important;
|
color: $theme_color !important;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
|
||||||
|
}
|
||||||
|
.nav-lis{
|
||||||
|
width: 103px;
|
||||||
|
text-align: center;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.fixed-show{
|
||||||
|
margin-top: 0 !important;
|
||||||
|
>.nav-con{
|
||||||
|
>.all-categories{
|
||||||
|
align-items: center !important;
|
||||||
|
height: 60px;
|
||||||
|
display: inherit;
|
||||||
|
justify-content: center;
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.colum{
|
||||||
|
height: 14.7px;
|
||||||
|
opacity: 1;
|
||||||
|
border: 0.7px solid #CBC8C8;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
}
|
}
|
||||||
.cate-nav {
|
.cate-nav {
|
||||||
width: 1200px;
|
|
||||||
position: relative;
|
position: relative;
|
||||||
margin: 0 auto;
|
margin: 14px auto 0 auto;
|
||||||
}
|
}
|
||||||
/** 商品分类 */
|
/** 商品分类 */
|
||||||
.nav-con {
|
.nav-con {
|
||||||
width: 1200px;
|
height: 46px;
|
||||||
height: 40px;
|
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
display: flex;
|
display: flex;
|
||||||
.all-categories {
|
.all-categories {
|
||||||
width: 200px;
|
border-top-left-radius: 10px;
|
||||||
line-height: 40px;
|
border-top-right-radius: 10px;
|
||||||
color: #fff;
|
padding-left: 37.4px;
|
||||||
background-color: $theme_color;
|
background: #FFFFFF;
|
||||||
text-align: center;
|
width: 263.2px;
|
||||||
font-size: 16px;
|
padding-top: 15.4px;
|
||||||
|
line-height: 20px;
|
||||||
border-bottom: none;
|
border-bottom: none;
|
||||||
|
font-size: 16.8px;
|
||||||
|
font-weight: normal;
|
||||||
|
color: #333333;
|
||||||
|
letter-spacing: 0px;
|
||||||
}
|
}
|
||||||
.nav-item {
|
.nav-item {
|
||||||
width: 1000px;
|
width: 914px;
|
||||||
height: 40px;
|
height: 46px;
|
||||||
line-height: 40px;
|
border-radius: 10px;
|
||||||
|
background: #FFFFFF;
|
||||||
|
margin-left: 10px;
|
||||||
|
line-height: 46px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
list-style: none;
|
list-style: none;
|
||||||
// background-color: #eee;
|
// background-color: #eee;
|
||||||
display: flex;
|
display: flex;
|
||||||
li {
|
li {
|
||||||
float: left;
|
float: left;
|
||||||
font-weight: bold;
|
font-size: 17px;
|
||||||
margin-left: 20px;
|
font-weight: normal;
|
||||||
color: rgb(129, 127, 127);
|
color: #333333;
|
||||||
font-size: 15px;
|
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
color: #e1251b;
|
color: $theme_color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -271,17 +311,33 @@ export default {
|
|||||||
.cate-list {
|
.cate-list {
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|
||||||
z-index: 1000;
|
z-index: 1000;
|
||||||
}
|
}
|
||||||
|
|
||||||
.nav-side {
|
.nav-side {
|
||||||
width: 200px;
|
width: 263.2px;
|
||||||
|
color: #666;
|
||||||
float: left;
|
float: left;
|
||||||
padding: 0px;
|
|
||||||
color: #fff;
|
|
||||||
background-color: #6e6568;
|
|
||||||
height: 335px;
|
|
||||||
overflow:hidden;
|
overflow:hidden;
|
||||||
|
|
||||||
|
border-bottom-left-radius: 10px;
|
||||||
|
border-bottom-right-radius: 10px;
|
||||||
|
background-color: #fff;
|
||||||
|
height: 340px;
|
||||||
|
////自动移滚动条样式
|
||||||
|
//&::-webkit-scrollbar {
|
||||||
|
// width: 1px;
|
||||||
|
// height: 5px;
|
||||||
|
//}
|
||||||
|
//&::-webkit-scrollbar-thumb {
|
||||||
|
// border-radius: 1em;
|
||||||
|
// background-color: rgba(50, 50, 50, 0.3);
|
||||||
|
//}
|
||||||
|
//&::-webkit-scrollbar-track {
|
||||||
|
// border-radius: 1em;
|
||||||
|
// background-color: rgba(50, 50, 50, 0.1);
|
||||||
|
//}
|
||||||
}
|
}
|
||||||
.large-nav {
|
.large-nav {
|
||||||
height: 470px;
|
height: 470px;
|
||||||
@@ -294,22 +350,16 @@ export default {
|
|||||||
}
|
}
|
||||||
.nav-side ul {
|
.nav-side ul {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 0px;
|
|
||||||
padding-top: 5px;
|
|
||||||
list-style: none;
|
list-style: none;
|
||||||
}
|
}
|
||||||
.nav-side li {
|
.nav-side li {
|
||||||
padding: 7.5px 0;
|
padding: 0 0 16.2px 37.4px;
|
||||||
padding-left: 12px;
|
|
||||||
font-size: 13px;
|
font-size: 13px;
|
||||||
line-height: 18px;
|
line-height: 18px;
|
||||||
&:hover {
|
|
||||||
background: #999395;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
.nav-side-item:hover {
|
.nav-side-item:hover {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
color: #e1251b;
|
color: $theme_color;
|
||||||
}
|
}
|
||||||
|
|
||||||
/*显示商品详细信息*/
|
/*显示商品详细信息*/
|
||||||
@@ -335,10 +385,11 @@ export default {
|
|||||||
padding-left: 12px;
|
padding-left: 12px;
|
||||||
margin-right: 15px;
|
margin-right: 15px;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
background-color: #6e6568;
|
color: #333;
|
||||||
}
|
}
|
||||||
.nav-detail-item span:hover {
|
.nav-detail-item span:hover {
|
||||||
background-color: #e1251b;
|
background-color: $theme_color;
|
||||||
|
color: #fff;
|
||||||
}
|
}
|
||||||
.detail-item-panel li {
|
.detail-item-panel li {
|
||||||
line-height: 30px;
|
line-height: 30px;
|
||||||
@@ -353,7 +404,7 @@ export default {
|
|||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
.detail-item-title:hover {
|
.detail-item-title:hover {
|
||||||
color: #e1251b;
|
color: $theme_color;
|
||||||
}
|
}
|
||||||
.detail-item-row {
|
.detail-item-row {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -373,6 +424,6 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.detail-item:hover {
|
.detail-item:hover {
|
||||||
color: #e1251b;
|
color: $theme_color;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -153,7 +153,9 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<div @click="moreOptions" v-if="tagsContent.length>4" class="more-options">{{showTagCount===5?'更多筛选项':'收起筛选项'}}<Icon :type="showTagCount===5?'ios-arrow-down':'ios-arrow-up'" /></div>
|
<div @click="moreOptions" v-if="tagsContent.length>4" class="more-options">
|
||||||
|
{{showTagCount===5?'更多筛选项':'收起筛选项'}}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|||||||
@@ -16,6 +16,12 @@ module.exports = {
|
|||||||
//FIXME 请检查当前高德key创建的日期,如果2021年12月02日之前申请的 无需填写安全密钥
|
//FIXME 请检查当前高德key创建的日期,如果2021年12月02日之前申请的 无需填写安全密钥
|
||||||
aMapSecurityJsCode:"2bd0fbf621881f4c77be74f0e76495f3", // 高德web端js申请的安全密钥
|
aMapSecurityJsCode:"2bd0fbf621881f4c77be74f0e76495f3", // 高德web端js申请的安全密钥
|
||||||
aMapKey: "7f11113750315d8543daaf5c3ba353ca", //高德web端js申请的api key
|
aMapKey: "7f11113750315d8543daaf5c3ba353ca", //高德web端js申请的api key
|
||||||
|
aMapSwitch:false, //是否开启高德定位
|
||||||
enableCDN: true, //生产环境 是否启用cdn加载 vue等js
|
enableCDN: true, //生产环境 是否启用cdn加载 vue等js
|
||||||
port: 10000, //端口
|
port: 10000, //端口
|
||||||
|
inputMaxLength:'140', //全局输入框默认最大输入长度字
|
||||||
|
|
||||||
|
|
||||||
|
PC_DOMAIN: "https://pc-b2b2c.pickmall.cn", // PC端域名
|
||||||
|
WAP_DOMAIN: "https://m-b2b2c.pickmall.cn", // WAP端域名
|
||||||
};
|
};
|
||||||
|
|||||||
@@ -10,8 +10,13 @@ import storage from "@/plugins/storage";
|
|||||||
// 全局引入封装组件
|
// 全局引入封装组件
|
||||||
import {InstallAll} from "@/components/global.js";
|
import {InstallAll} from "@/components/global.js";
|
||||||
|
|
||||||
const { aMapSecurityJsCode, title } = require("@/config");
|
const {aMapSecurityJsCode, title, inputMaxLength} = require("@/config");
|
||||||
Vue.use(ViewUI);
|
|
||||||
|
const copyViewUi = {...ViewUI}
|
||||||
|
copyViewUi.Input.props.maxlength.default = inputMaxLength // 挂载最大输入值
|
||||||
|
Vue.use(copyViewUi);
|
||||||
|
|
||||||
|
|
||||||
Vue.use(InstallAll);
|
Vue.use(InstallAll);
|
||||||
Vue.config.productionTip = false;
|
Vue.config.productionTip = false;
|
||||||
|
|
||||||
|
|||||||
@@ -10,7 +10,7 @@
|
|||||||
>)
|
>)
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Search :showTag="false" :showLogo="false"></Search>
|
|
||||||
</div>
|
</div>
|
||||||
<Divider />
|
<Divider />
|
||||||
<!-- 购物车主体 -->
|
<!-- 购物车主体 -->
|
||||||
@@ -57,15 +57,6 @@
|
|||||||
:key="index"
|
:key="index"
|
||||||
>
|
>
|
||||||
<div class="shop-name">
|
<div class="shop-name">
|
||||||
<div>
|
|
||||||
<Checkbox
|
|
||||||
v-model="shop.checked"
|
|
||||||
@on-change="changeChecked(shop.checked, 'shop', shop.storeId)"
|
|
||||||
></Checkbox>
|
|
||||||
<span class="go-shop-page" @click="goShopPage(shop.storeId)">{{
|
|
||||||
shop.storeName
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
<span
|
<span
|
||||||
class="shop-coupon"
|
class="shop-coupon"
|
||||||
v-if="shop.couponList.length"
|
v-if="shop.couponList.length"
|
||||||
@@ -245,7 +236,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<Spin size="large" fix v-if="loading"></Spin>
|
<Spin size="large" fix v-if="loading"></Spin>
|
||||||
</div>
|
</div>
|
||||||
<BaseFooter></BaseFooter>
|
<BaseFooter class="footer"></BaseFooter>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -449,6 +440,9 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
.footer{
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
/** logo 搜索 start **/
|
/** logo 搜索 start **/
|
||||||
.logo {
|
.logo {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
@@ -543,90 +537,6 @@ export default {
|
|||||||
padding-top: 100px;
|
padding-top: 100px;
|
||||||
}
|
}
|
||||||
&-items {
|
&-items {
|
||||||
.shop-name {
|
|
||||||
height: 50px;
|
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
padding: 0 20px;
|
|
||||||
position: relative;
|
|
||||||
@include title_color($light_title_color);
|
|
||||||
> * {
|
|
||||||
width: 50%;
|
|
||||||
}
|
|
||||||
.go-shop-page:hover {
|
|
||||||
color: $theme_color;
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
.customer-service {
|
|
||||||
margin-left: 5px;
|
|
||||||
color: #fcc217;
|
|
||||||
cursor: pointer;
|
|
||||||
&:hover {
|
|
||||||
color: $theme_color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/** 优惠券 */
|
|
||||||
.shop-coupon {
|
|
||||||
width: 80px;
|
|
||||||
height: 24px;
|
|
||||||
position: relative;
|
|
||||||
background: url(../assets/images/cart-coupon-icons02.png) 0 0 no-repeat;
|
|
||||||
> div {
|
|
||||||
position: absolute;
|
|
||||||
top: 35px;
|
|
||||||
left: 0;
|
|
||||||
width: 300px;
|
|
||||||
height: 300px;
|
|
||||||
background-color: #fff;
|
|
||||||
border: 1px solid $theme_color;
|
|
||||||
// border-radius: 3px;
|
|
||||||
z-index: 1;
|
|
||||||
padding: 10px 20px;
|
|
||||||
&::before {
|
|
||||||
content: "";
|
|
||||||
display: block;
|
|
||||||
background: url(../assets/images/cart-coupon-icons02.png) 0 -58px no-repeat;
|
|
||||||
width: 80px;
|
|
||||||
height: 12px;
|
|
||||||
position: absolute;
|
|
||||||
top: -12px;
|
|
||||||
left: 0;
|
|
||||||
}
|
|
||||||
.coupon-item {
|
|
||||||
margin-bottom: 10px;
|
|
||||||
span:nth-child(1) {
|
|
||||||
border: 1px solid #e33937;
|
|
||||||
display: inline-block;
|
|
||||||
padding: 3px 10px;
|
|
||||||
color: $theme_color;
|
|
||||||
border-radius: 3px;
|
|
||||||
}
|
|
||||||
span:nth-child(2) {
|
|
||||||
font-size: 12px;
|
|
||||||
margin-left: 5px;
|
|
||||||
color: #999;
|
|
||||||
}
|
|
||||||
.coupon-btn {
|
|
||||||
height: 26px;
|
|
||||||
float: right;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
&::after {
|
|
||||||
display: block;
|
|
||||||
content: "";
|
|
||||||
clear: right;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.promotion-notice {
|
|
||||||
text-align: right;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
.shop-coupon-show {
|
|
||||||
background-position-y: -34px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.goods-item {
|
.goods-item {
|
||||||
position: relative;
|
position: relative;
|
||||||
@extend .cart-goods-title;
|
@extend .cart-goods-title;
|
||||||
@@ -781,4 +691,5 @@ export default {
|
|||||||
.ivu-input-number-input {
|
.ivu-input-number-input {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -5,10 +5,16 @@
|
|||||||
<div>
|
<div>
|
||||||
<div class="coupon-title">
|
<div class="coupon-title">
|
||||||
<router-link to="/">
|
<router-link to="/">
|
||||||
<img src="../assets/images/logo.png" width="120" alt="">
|
<img src="../assets/images/logo.png" width="120" alt="" />
|
||||||
</router-link>
|
</router-link>
|
||||||
<p>领券中心</p>
|
<p>领券中心</p>
|
||||||
<Input search style="width:400px" @on-search='search' enter-button="搜索" placeholder="搜索优惠券" />
|
<Input
|
||||||
|
search
|
||||||
|
style="width: 400px"
|
||||||
|
@on-search="search"
|
||||||
|
enter-button="搜索"
|
||||||
|
placeholder="搜索优惠券"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="fontsize_18 recommend">推荐好券</div>
|
<div class="fontsize_18 recommend">推荐好券</div>
|
||||||
@@ -18,9 +24,22 @@
|
|||||||
<li v-for="(item, index) in list" class="coupon-item" :key="index">
|
<li v-for="(item, index) in list" class="coupon-item" :key="index">
|
||||||
<div class="c-left">
|
<div class="c-left">
|
||||||
<div>
|
<div>
|
||||||
<span v-if="item.couponType === 'PRICE'" class="fontsize_12 global_color">¥<span class="price">{{item.price | unitPrice}}</span></span>
|
<span
|
||||||
<span v-if="item.couponType === 'DISCOUNT'" class="fontsize_12 global_color"><span class="price">{{item.couponDiscount}}</span>折</span>
|
v-if="item.couponType === 'PRICE'"
|
||||||
<span class="describe">满{{item.consumeThreshold}}元可用</span>
|
class="fontsize_12 global_color"
|
||||||
|
>¥<span class="price">{{
|
||||||
|
item.price | unitPrice
|
||||||
|
}}</span></span
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
v-if="item.couponType === 'DISCOUNT'"
|
||||||
|
class="fontsize_12 global_color"
|
||||||
|
><span class="price">{{ item.couponDiscount }}</span
|
||||||
|
>折</span
|
||||||
|
>
|
||||||
|
<span class="describe"
|
||||||
|
>满{{ item.consumeThreshold }}元可用</span
|
||||||
|
>
|
||||||
</div>
|
</div>
|
||||||
<p>使用范围:{{ useScope(item.scopeType, item.storeName) }}</p>
|
<p>使用范围:{{ useScope(item.scopeType, item.storeName) }}</p>
|
||||||
<p>有效期:{{ item.endTime }}</p>
|
<p>有效期:{{ item.endTime }}</p>
|
||||||
@@ -31,12 +50,15 @@
|
|||||||
<i class="circle-bottom"></i>
|
<i class="circle-bottom"></i>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<Page :total="total" @on-change="changePageNum"
|
<Page
|
||||||
|
:total="total"
|
||||||
|
@on-change="changePageNum"
|
||||||
class="pageration"
|
class="pageration"
|
||||||
@on-page-size-change="changePageSize"
|
@on-page-size-change="changePageSize"
|
||||||
:page-size="params.pageSize"
|
:page-size="params.pageSize"
|
||||||
show-total
|
show-total
|
||||||
show-sizer>
|
show-sizer
|
||||||
|
>
|
||||||
</Page>
|
</Page>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -44,103 +66,104 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import {couponList, receiveCoupon} from '@/api/member.js'
|
import { couponList, receiveCoupon } from "@/api/member.js";
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
list: [], // 优惠券列表
|
list: [], // 优惠券列表
|
||||||
total: 0, // 优惠券总数
|
total: 0, // 优惠券总数
|
||||||
params: { // 请求参数
|
params: {
|
||||||
getType: 'FREE',
|
// 请求参数
|
||||||
|
getType: "FREE",
|
||||||
pageNumber: 1,
|
pageNumber: 1,
|
||||||
pageSize: 20
|
pageSize: 20,
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 搜索优惠券
|
// 搜索优惠券
|
||||||
search(item) {
|
search(item) {
|
||||||
this.params.couponName = item
|
this.params.couponName = item;
|
||||||
this.params.pageNumber = 1
|
this.params.pageNumber = 1;
|
||||||
this.getList()
|
this.getList();
|
||||||
},
|
},
|
||||||
// 获取优惠券列表
|
// 获取优惠券列表
|
||||||
getList() {
|
getList() {
|
||||||
this.$Spin.show()
|
this.$Spin.show();
|
||||||
couponList(this.params).then(res => {
|
couponList(this.params)
|
||||||
this.$Spin.hide()
|
.then((res) => {
|
||||||
this.loading = false
|
this.$Spin.hide();
|
||||||
|
this.loading = false;
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.list = res.result.records
|
this.list = res.result.records;
|
||||||
this.total = res.result.total
|
this.total = res.result.total;
|
||||||
}
|
}
|
||||||
}).catch(() => { this.$Spin.hide() })
|
})
|
||||||
|
.catch(() => {
|
||||||
|
this.$Spin.hide();
|
||||||
|
});
|
||||||
},
|
},
|
||||||
// 分页 改变页码
|
// 分页 改变页码
|
||||||
changePageNum(val) {
|
changePageNum(val) {
|
||||||
this.params.pageNumber = val;
|
this.params.pageNumber = val;
|
||||||
this.getList()
|
this.getList();
|
||||||
},
|
},
|
||||||
// 分页 改变每页数
|
// 分页 改变每页数
|
||||||
changePageSize(val) {
|
changePageSize(val) {
|
||||||
this.params.pageNumber = 1;
|
this.params.pageNumber = 1;
|
||||||
this.params.pageSize = val;
|
this.params.pageSize = val;
|
||||||
this.getList()
|
this.getList();
|
||||||
},
|
},
|
||||||
// 领取优惠券
|
// 领取优惠券
|
||||||
receive(item) {
|
receive(item) {
|
||||||
receiveCoupon(item.id).then(res => {
|
receiveCoupon(item.id).then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
|
console.log(item);
|
||||||
this.$Modal.confirm({
|
this.$Modal.confirm({
|
||||||
title: '领取优惠券',
|
title: "领取优惠券",
|
||||||
content: '<p>优惠券领取成功,可到我的优惠券页面查看</p>',
|
content: "<p>优惠券领取成功,可到我的优惠券页面查看</p>",
|
||||||
okText: '我的优惠券',
|
okText: "我的优惠券",
|
||||||
cancelText: '立即使用',
|
cancelText: "立即使用",
|
||||||
closable: true,
|
closable: true,
|
||||||
onOk: () => {
|
onOk: () => {
|
||||||
this.$router.push('/home/Coupons')
|
this.$router.push("/home/Coupons");
|
||||||
},
|
},
|
||||||
onCancel: () => {
|
onCancel: () => {
|
||||||
if (item.storeId !== '0') {
|
this.$router.push({
|
||||||
this.$router.push({path: '/merchant', query: {id: item.storeId}})
|
path: "/goodsList",
|
||||||
} else {
|
query: { promotionsId: item.id, promotionType: "COUPON" },
|
||||||
if (item.scopeType === 'PORTION_GOODS_CATEGORY') {
|
});
|
||||||
this.$router.push({path: '/goodsList', query: {categoryId: item.scopeId}})
|
},
|
||||||
} else {
|
|
||||||
this.$router.push({path: '/goodsList'})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
// 优惠券可用范围
|
// 优惠券可用范围
|
||||||
useScope(type, storeName) {
|
useScope(type, storeName) {
|
||||||
let shop = '平台';
|
let shop = "平台";
|
||||||
let goods = '全部商品'
|
let goods = "全部商品";
|
||||||
if (storeName !== 'platform') shop = storeName
|
if (storeName !== "platform") shop = storeName;
|
||||||
switch (type) {
|
switch (type) {
|
||||||
case 'ALL':
|
case "ALL":
|
||||||
goods = '全部商品'
|
goods = "全部商品";
|
||||||
break;
|
break;
|
||||||
case 'PORTION_GOODS':
|
case "PORTION_GOODS":
|
||||||
goods = '部分商品'
|
goods = "部分商品";
|
||||||
break;
|
break;
|
||||||
case 'PORTION_GOODS_CATEGORY':
|
case "PORTION_GOODS_CATEGORY":
|
||||||
goods = '部分分类商品'
|
goods = "部分分类商品";
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
return `${shop}${goods}可用`
|
return `${shop}${goods}可用`;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.getList()
|
this.getList();
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import '../assets/styles/coupon.scss';
|
@import "../assets/styles/coupon.scss";
|
||||||
.content {
|
.content {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
@@ -168,7 +191,7 @@ export default {
|
|||||||
}
|
}
|
||||||
.coupon-item {
|
.coupon-item {
|
||||||
b {
|
b {
|
||||||
background: url('../assets/images/small-circle.png') top left repeat-y;
|
background: url("../assets/images/small-circle.png") top left repeat-y;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
.pageration {
|
.pageration {
|
||||||
|
|||||||
@@ -2,48 +2,39 @@
|
|||||||
<div style="background: #fff">
|
<div style="background: #fff">
|
||||||
<BaseHeader></BaseHeader>
|
<BaseHeader></BaseHeader>
|
||||||
<Search></Search>
|
<Search></Search>
|
||||||
<drawer></drawer>
|
|
||||||
<ShopHeader :detail="storeMsg"></ShopHeader>
|
|
||||||
<div class="shop-item-path">
|
<div class="shop-item-path">
|
||||||
<div class="shop-nav-container">
|
<div class="shop-nav-container">
|
||||||
<Breadcrumb>
|
<Breadcrumb>
|
||||||
<BreadcrumbItem to="/">首页</BreadcrumbItem>
|
<BreadcrumbItem to="/">首页</BreadcrumbItem>
|
||||||
<BreadcrumbItem
|
<BreadcrumbItem v-for="(item, index) in categoryBar" :to="goGoodsList(index)" target="_blank" :key="index">
|
||||||
v-for="(item, index) in categoryBar"
|
|
||||||
:to="goGoodsList(index)"
|
|
||||||
target="_blank"
|
|
||||||
:key="index"
|
|
||||||
>
|
|
||||||
{{ item.name }}
|
{{ item.name }}
|
||||||
</BreadcrumbItem>
|
</BreadcrumbItem>
|
||||||
</Breadcrumb>
|
</Breadcrumb>
|
||||||
<div class="store-collect">
|
<div class="store-collect" v-if="!takeDownSale">
|
||||||
<span class="mr_10" v-if="goodsMsg.data">
|
<span class="mr_10" v-if="goodsMsg.data">
|
||||||
<router-link :to="'Merchant?id=' + goodsMsg.data.storeId">{{
|
|
||||||
goodsMsg.data.storeName
|
|
||||||
}}</router-link>
|
|
||||||
</span>
|
</span>
|
||||||
<span @click="collect">
|
<span class="ml_10" @click="getIMDetailMethods()">联系客服</span>
|
||||||
<Icon
|
|
||||||
type="ios-heart"
|
|
||||||
:color="storeCollected ? '#ed3f14' : '#666'"
|
|
||||||
/>
|
|
||||||
{{ storeCollected ? "已收藏店铺" : "收藏店铺" }}
|
|
||||||
</span>
|
|
||||||
<span class="ml_10" @click="IMService()">联系客服</span>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 商品信息展示 -->
|
<!-- 商品信息展示 -->
|
||||||
<ShowGoods
|
<ShowGoods @handleClickSku="targetClickSku" v-if="goodsMsg.data" :detail="goodsMsg"></ShowGoods>
|
||||||
@handleClickSku="targetClickSku"
|
|
||||||
v-if="goodsMsg.data"
|
|
||||||
:detail="goodsMsg"
|
|
||||||
></ShowGoods>
|
|
||||||
<!-- 商品详细展示 -->
|
<!-- 商品详细展示 -->
|
||||||
<ShowGoodsDetail v-if="goodsMsg.data" :detail="goodsMsg"></ShowGoodsDetail>
|
<ShowGoodsDetail v-if="goodsMsg.data" :detail="goodsMsg"></ShowGoodsDetail>
|
||||||
|
|
||||||
|
<empty _Title='当前商品已下架' v-if="takeDownSale">
|
||||||
|
<div class="sale-btn">
|
||||||
|
<Button size="small" class="mr_10" @click="target('/')">返回首页</Button>
|
||||||
|
<Button size="small" @click="target('goodsList')">返回商品列表</Button>
|
||||||
|
</div>
|
||||||
|
</empty>
|
||||||
|
|
||||||
|
<Modal title="扫码联系客服" hide-footer v-model="showQrCode">
|
||||||
|
<div class="img">
|
||||||
|
<img :src="IMLink" alt="">
|
||||||
|
</div>
|
||||||
|
</Modal>
|
||||||
<Spin size="large" fix v-if="isLoading"></Spin>
|
<Spin size="large" fix v-if="isLoading"></Spin>
|
||||||
<BaseFooter></BaseFooter>
|
<BaseFooter></BaseFooter>
|
||||||
</div>
|
</div>
|
||||||
@@ -51,19 +42,19 @@
|
|||||||
|
|
||||||
<script>
|
<script>
|
||||||
import Search from "@/components/Search";
|
import Search from "@/components/Search";
|
||||||
import ShopHeader from "@/components/header/ShopHeader";
|
|
||||||
import ShowGoods from "@/components/goodsDetail/ShowGoods";
|
import ShowGoods from "@/components/goodsDetail/ShowGoods";
|
||||||
|
import empty from "@/components/empty/Main";
|
||||||
import ShowGoodsDetail from "@/components/goodsDetail/ShowGoodsDetail";
|
import ShowGoodsDetail from "@/components/goodsDetail/ShowGoodsDetail";
|
||||||
import { goodsSkuDetail } from "@/api/goods";
|
import { goodsSkuDetail } from "@/api/goods";
|
||||||
import {
|
import {
|
||||||
cancelCollect,
|
cancelStoreCollect,
|
||||||
collectGoods,
|
collectStore,
|
||||||
isCollection,
|
isStoreCollection,
|
||||||
getGoodsDistribution,
|
getGoodsDistribution,
|
||||||
} from "@/api/member";
|
} from "@/api/member";
|
||||||
import { getDetailById } from "@/api/shopentry";
|
import { getDetailById } from "@/api/shopentry";
|
||||||
import { getIMDetail } from "@/api/common";
|
import imTalk from '@/components/mixes/talkIm'
|
||||||
import Storage from "../plugins/storage";
|
|
||||||
export default {
|
export default {
|
||||||
name: "GoodsDetail",
|
name: "GoodsDetail",
|
||||||
beforeRouteEnter (to, from, next) {
|
beforeRouteEnter (to, from, next) {
|
||||||
@@ -73,40 +64,26 @@ export default {
|
|||||||
created () {
|
created () {
|
||||||
this.getGoodsDetail();
|
this.getGoodsDetail();
|
||||||
},
|
},
|
||||||
|
mixins: [imTalk],
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
|
showQrCode:false,
|
||||||
goodsMsg: {}, // 商品信息
|
goodsMsg: {}, // 商品信息
|
||||||
isLoading: false, // 加载状态
|
isLoading: false, // 加载状态
|
||||||
categoryBar: [], // 分类
|
categoryBar: [], // 分类
|
||||||
storeCollected: false, // 商品收藏
|
storeCollected: false, // 商品收藏
|
||||||
storeMsg: {}, // 店铺信息
|
storeMsg: {}, // 店铺信息
|
||||||
|
takeDownSale:false, // 是否下架
|
||||||
IMLink:"",
|
IMLink:"",
|
||||||
|
// qrCode:""
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 跳转im客服
|
|
||||||
async IMService() {
|
// 跳转首页或商品页面
|
||||||
// 获取访问Token
|
target(url){
|
||||||
let accessToken = Storage.getItem("accessToken");
|
this.$router.push({path: url})
|
||||||
await this.getIMDetailMethods();
|
|
||||||
if (!accessToken) {
|
|
||||||
this.$Message.error("请登录后再联系客服");
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
window.open(
|
|
||||||
this.IMLink +
|
|
||||||
"?token=" +
|
|
||||||
accessToken +
|
|
||||||
"&id=" +
|
|
||||||
this.goodsMsg.data.storeId
|
|
||||||
);
|
|
||||||
},
|
|
||||||
// 获取im信息
|
|
||||||
async getIMDetailMethods() {
|
|
||||||
let res = await getIMDetail();
|
|
||||||
if (res.success) {
|
|
||||||
this.IMLink = res.result;
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
// 点击规格
|
// 点击规格
|
||||||
targetClickSku (val) {
|
targetClickSku (val) {
|
||||||
@@ -141,6 +118,7 @@ export default {
|
|||||||
.then((res) => {
|
.then((res) => {
|
||||||
this.isLoading = false;
|
this.isLoading = false;
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
|
|
||||||
const result = res.result;
|
const result = res.result;
|
||||||
const cateName = res.result.categoryName;
|
const cateName = res.result.categoryName;
|
||||||
const cateId = result.data.categoryPath.split(",");
|
const cateId = result.data.categoryPath.split(",");
|
||||||
@@ -149,34 +127,42 @@ export default {
|
|||||||
// 插入分类id和name
|
// 插入分类id和name
|
||||||
cateArr.push({
|
cateArr.push({
|
||||||
id: e,
|
id: e,
|
||||||
name: cateName[index],
|
name: cateName ? cateName[index] : "",
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
this.categoryBar = cateArr;
|
this.categoryBar = cateArr;
|
||||||
this.$set(this, "goodsMsg", res.result);
|
this.$set(this, "goodsMsg", res.result);
|
||||||
|
if (!this.goodsMsg.data.intro) {
|
||||||
|
this.goodsMsg.data.intro = ''
|
||||||
|
}
|
||||||
// 判断是否收藏
|
// 判断是否收藏
|
||||||
if (this.Cookies.getItem("userInfo")) {
|
if (this.Cookies.getItem("userInfo")) {
|
||||||
isCollection("STORE", this.goodsMsg.data.storeId).then((res) => {
|
isStoreCollection("STORE", this.goodsMsg.data.storeId).then((res) => {
|
||||||
if (res.success && res.result) {
|
if (res.success && res.result) {
|
||||||
this.storeCollected = true;
|
this.storeCollected = true;
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
if (!this.storeMsg) {
|
if (!this.storeMsg) {
|
||||||
// 获取店铺信息
|
// 获取店铺信息
|
||||||
getDetailById(this.goodsMsg.data.storeId).then((res) => {
|
getDetailById(this.goodsMsg.data.storeId).then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.storeMsg = res.result;
|
this.storeMsg = res.result;
|
||||||
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
this.$Message.error(res.message);
|
this.$Message.error(res.message);
|
||||||
this.$router.push("/");
|
this.isLoading = false
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch((e) => {
|
.catch((e) => {
|
||||||
this.$router.push("/");
|
this.isLoading = false
|
||||||
|
if(e.code === 11001){
|
||||||
|
this.takeDownSale = true
|
||||||
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
goGoodsList (currIndex) {
|
goGoodsList (currIndex) {
|
||||||
@@ -192,13 +178,13 @@ export default {
|
|||||||
async collect () {
|
async collect () {
|
||||||
// 收藏店铺
|
// 收藏店铺
|
||||||
if (this.storeCollected) {
|
if (this.storeCollected) {
|
||||||
let cancel = await cancelCollect("STORE", this.goodsMsg.data.storeId);
|
let cancel = await cancelStoreCollect("STORE", this.goodsMsg.data.storeId);
|
||||||
if (cancel.success) {
|
if (cancel.success) {
|
||||||
this.$Message.success("已取消收藏");
|
this.$Message.success("已取消收藏");
|
||||||
this.storeCollected = false;
|
this.storeCollected = false;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
let collect = await collectGoods("STORE", this.goodsMsg.data.storeId);
|
let collect = await collectStore("STORE", this.goodsMsg.data.storeId);
|
||||||
if (collect.code === 200) {
|
if (collect.code === 200) {
|
||||||
this.storeCollected = true;
|
this.storeCollected = true;
|
||||||
this.$Message.success("收藏店铺成功,可以前往个人中心我的收藏查看");
|
this.$Message.success("收藏店铺成功,可以前往个人中心我的收藏查看");
|
||||||
@@ -209,9 +195,9 @@ export default {
|
|||||||
watch: {},
|
watch: {},
|
||||||
components: {
|
components: {
|
||||||
Search,
|
Search,
|
||||||
ShopHeader,
|
|
||||||
ShowGoods,
|
ShowGoods,
|
||||||
ShowGoodsDetail,
|
ShowGoodsDetail,
|
||||||
|
empty
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -242,4 +228,15 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.sale-btn{
|
||||||
|
margin:10px 0
|
||||||
|
|
||||||
|
}
|
||||||
|
.img{
|
||||||
|
text-align: center;
|
||||||
|
>img{
|
||||||
|
width: 200px;
|
||||||
|
height: 200px;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,9 +1,8 @@
|
|||||||
<template>
|
<template>
|
||||||
<div>
|
<div class="wrapper">
|
||||||
<BaseHeader></BaseHeader>
|
<BaseHeader></BaseHeader>
|
||||||
<Search @search="handleSearch"></Search>
|
<Search @search="handleSearch"></Search>
|
||||||
<drawer></drawer>
|
|
||||||
<cateNav></cateNav>
|
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<!-- 商品筛选栏 -->
|
<!-- 商品筛选栏 -->
|
||||||
<GoodsClassNav @getParams="getParams"></GoodsClassNav>
|
<GoodsClassNav @getParams="getParams"></GoodsClassNav>
|
||||||
@@ -49,59 +48,54 @@
|
|||||||
class="goods-show-info"
|
class="goods-show-info"
|
||||||
v-for="(item, index) in goodsList"
|
v-for="(item, index) in goodsList"
|
||||||
:key="index"
|
:key="index"
|
||||||
@click="goGoodsDetail(item.id, item.content.goodsId)"
|
@click="goGoodsDetail(item.id, item.goodsId)"
|
||||||
>
|
>
|
||||||
<div class="goods-show-img">
|
<div class="goods-show-img">
|
||||||
<img width="220" height="220" :src="item.content.thumbnail" />
|
<img width="220" height="220" :src="item.thumbnail" />
|
||||||
</div>
|
</div>
|
||||||
<div class="goods-show-price">
|
<div class="goods-show-price">
|
||||||
<span>
|
<span>
|
||||||
<span class="seckill-price text-danger">{{
|
<span class="seckill-price text-danger">{{
|
||||||
item.content.price | unitPrice("¥")
|
item.price | unitPrice("¥")
|
||||||
}}</span>
|
}}</span>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="goods-show-detail">
|
<div class="goods-show-detail">
|
||||||
<Tag
|
<Tag
|
||||||
v-if="item.content.salesModel === 'WHOLESALE'"
|
v-if="item.salesModel === 'WHOLESALE'"
|
||||||
class="goods-show-tag"
|
class="goods-show-tag"
|
||||||
color="purple"
|
color="purple"
|
||||||
>
|
>
|
||||||
批发
|
批发
|
||||||
</Tag>
|
</Tag>
|
||||||
<span>{{ item.content.goodsName }}</span>
|
<span>{{ item.goodsName }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="goods-show-num">
|
<div class="goods-show-num">
|
||||||
已有<span>{{ item.content.commentNum || 0 }}</span
|
已有<span>{{ item.commentNum || 0 }}</span
|
||||||
>人评价
|
>人评价
|
||||||
</div>
|
</div>
|
||||||
<div class="goods-show-seller">
|
|
||||||
<Tag
|
|
||||||
class="goods-show-buyer"
|
|
||||||
v-if="item.content.selfOperated"
|
|
||||||
size="default"
|
|
||||||
color="error"
|
|
||||||
>自营
|
|
||||||
</Tag>
|
|
||||||
<div class="goods-show-right">
|
<div class="goods-show-right">
|
||||||
<div
|
<Tag
|
||||||
class="goods-show-middle"
|
class="goods-show-tag"
|
||||||
v-if="goodsListType.content.goodsType == 'VIRTUAL_GOODS'"
|
color="red"
|
||||||
|
v-if="item.selfOperated"
|
||||||
|
>
|
||||||
|
自营
|
||||||
|
</Tag>
|
||||||
|
<Tag
|
||||||
|
class="goods-show-tag"
|
||||||
|
color="blue"
|
||||||
|
v-if="item.goodsType === 'VIRTUAL_GOODS'"
|
||||||
>
|
>
|
||||||
虚拟
|
虚拟
|
||||||
</div>
|
</Tag>
|
||||||
<div
|
<Tag
|
||||||
class="goods-show-middle"
|
class="goods-show-tag"
|
||||||
v-else-if="
|
color="blue"
|
||||||
goodsListType.content.goodsType == 'PHYSICAL_GOODS'
|
v-else-if="item.goodsType === 'PHYSICAL_GOODS'"
|
||||||
"
|
|
||||||
>
|
>
|
||||||
实物
|
实物
|
||||||
</div>
|
</Tag>
|
||||||
</div>
|
|
||||||
<span class="text-bottom" style="color: #e4393c">{{
|
|
||||||
item.content.storeName
|
|
||||||
}}</span>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -145,7 +139,6 @@ export default {
|
|||||||
],
|
],
|
||||||
goodsList: [], // 商品列表
|
goodsList: [], // 商品列表
|
||||||
loading: false, // 加载状态
|
loading: false, // 加载状态
|
||||||
goodsListType: "",
|
|
||||||
total: 0, // 列表总数
|
total: 0, // 列表总数
|
||||||
params: {
|
params: {
|
||||||
// 请求参数
|
// 请求参数
|
||||||
@@ -158,19 +151,28 @@ export default {
|
|||||||
watch: {
|
watch: {
|
||||||
$route() {
|
$route() {
|
||||||
const keyword = this.$route.query.keyword;
|
const keyword = this.$route.query.keyword;
|
||||||
|
if (keyword) {
|
||||||
this.handleSearch(keyword);
|
this.handleSearch(keyword);
|
||||||
|
}
|
||||||
if (this.$route.query.categoryId) {
|
if (this.$route.query.categoryId) {
|
||||||
let cateId = this.$route.query.categoryId.split(",");
|
let cateId = this.$route.query.categoryId.split(",");
|
||||||
Object.assign(this.params, this.$route.query);
|
Object.assign(this.params, this.$route.query);
|
||||||
this.params.categoryId = cateId[cateId.length - 1];
|
this.params.categoryId = cateId[cateId.length - 1];
|
||||||
this.getGoodsList();
|
|
||||||
}
|
}
|
||||||
|
if (this.$route.query.promotionType) {
|
||||||
|
this.params.promotionType = this.$route.query.promotionType;
|
||||||
|
}
|
||||||
|
if (this.$route.query.promotionsId) {
|
||||||
|
this.params.promotionsId = this.$route.query.promotionsId;
|
||||||
|
}
|
||||||
|
this.getGoodsList();
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 搜索
|
// 搜索
|
||||||
handleSearch(key) {
|
handleSearch(key) {
|
||||||
this.params.keyword = key;
|
this.params.keyword = key;
|
||||||
|
this.$route.query.keyword = key
|
||||||
this.params.pageNumber = 0;
|
this.params.pageNumber = 0;
|
||||||
this.getGoodsList();
|
this.getGoodsList();
|
||||||
},
|
},
|
||||||
@@ -221,11 +223,8 @@ export default {
|
|||||||
.then((res) => {
|
.then((res) => {
|
||||||
this.loading = false;
|
this.loading = false;
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.goodsList = res.result.content;
|
this.goodsList = res.result.records;
|
||||||
this.total = res.result.totalElements;
|
this.total = res.result.total;
|
||||||
for (var i = 0; i < this.goodsList.length; i++) {
|
|
||||||
this.goodsListType = this.goodsList[i];
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
@@ -256,12 +255,16 @@ export default {
|
|||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
@import "../assets/styles/goodsList.scss";
|
@import "../assets/styles/goodsList.scss";
|
||||||
|
.cate-nav{
|
||||||
|
margin-top: 10px;
|
||||||
|
}
|
||||||
.goods-show-info > .goods-show-seller > .goods-show-buyer {
|
.goods-show-info > .goods-show-seller > .goods-show-buyer {
|
||||||
height: 16px;
|
width: 35px;
|
||||||
width: 30px;
|
height: 17px;
|
||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
line-height: 17px;
|
line-height: 17px;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
align-content: center;
|
||||||
padding: 0 3px;
|
padding: 0 3px;
|
||||||
background-color: #e23a3a;
|
background-color: #e23a3a;
|
||||||
}
|
}
|
||||||
@@ -281,8 +284,8 @@ export default {
|
|||||||
vertical-align: middle;
|
vertical-align: middle;
|
||||||
}
|
}
|
||||||
.container {
|
.container {
|
||||||
margin: 15px auto;
|
margin:25px auto 15px auto;
|
||||||
width: 1200px;
|
width: 1184px;
|
||||||
min-width: 1000px;
|
min-width: 1000px;
|
||||||
position: relative;
|
position: relative;
|
||||||
}
|
}
|
||||||
@@ -293,72 +296,14 @@ export default {
|
|||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
/* ---------------侧边广告栏开始------------------- */
|
/* ---------------侧边广告栏开始------------------- */
|
||||||
.as-box {
|
|
||||||
width: 200px;
|
|
||||||
border: 1px solid #ccc;
|
|
||||||
}
|
|
||||||
.goods-show-right {
|
.goods-show-right {
|
||||||
width: 35px;
|
display: flex;
|
||||||
height: 17px;
|
flex-direction: row;
|
||||||
// vertical-align:middle;
|
|
||||||
overflow: hidden;
|
|
||||||
margin-top: 1.5px;
|
|
||||||
margin-right: 5px;
|
|
||||||
line-height: 16px;
|
|
||||||
background: white;
|
|
||||||
border-radius: 4px;
|
|
||||||
margin-bottom: 5px;
|
|
||||||
float: left;
|
|
||||||
text-align: center;
|
|
||||||
border: 1px solid rgba(112, 123, 187, 0.8);
|
|
||||||
color: rgba(112, 123, 187, 0.8);
|
|
||||||
}
|
|
||||||
.goods-show-middle:hover {
|
|
||||||
color: rgba(2, 15, 88, 0.6);
|
|
||||||
border: 0.2px solid rgba(0, 13, 87, 0.6);
|
|
||||||
border-radius: 4px;
|
|
||||||
line-height: 18px;
|
|
||||||
}
|
|
||||||
.item-as-title {
|
|
||||||
width: 100%;
|
|
||||||
height: 36px;
|
|
||||||
color: $theme_color;
|
|
||||||
line-height: 36px;
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
.item-as-title span:first-child {
|
|
||||||
margin-left: 20px;
|
|
||||||
}
|
|
||||||
.item-as-title span:last-child {
|
|
||||||
float: right;
|
|
||||||
margin-right: 15px;
|
|
||||||
font-size: 10px;
|
|
||||||
color: rgb(204, 204, 204);
|
|
||||||
}
|
|
||||||
.item-as {
|
|
||||||
width: 160px;
|
|
||||||
margin: 18px auto;
|
|
||||||
}
|
|
||||||
.item-as-img {
|
|
||||||
width: 160px;
|
|
||||||
height: 160px;
|
|
||||||
margin: 0px auto;
|
|
||||||
}
|
|
||||||
.item-as-price span {
|
|
||||||
font-size: 18px;
|
|
||||||
}
|
|
||||||
.item-as-intro {
|
|
||||||
margin-top: 5px;
|
margin-top: 5px;
|
||||||
font-size: 12px;
|
|
||||||
}
|
}
|
||||||
.item-as-selled {
|
|
||||||
margin-top: 5px;
|
|
||||||
font-size: 12px;
|
|
||||||
}
|
|
||||||
.item-as-selled span {
|
|
||||||
color: #005aa0;
|
|
||||||
}
|
|
||||||
/* ---------------侧边广告栏结束------------------- */
|
|
||||||
|
|
||||||
/* ---------------商品栏开始------------------- */
|
/* ---------------商品栏开始------------------- */
|
||||||
.goods-list-box {
|
.goods-list-box {
|
||||||
|
|||||||
@@ -1,6 +1,28 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<drawer></drawer>
|
<Modal v-model="showCpmodel" width="350">
|
||||||
|
<template #header>
|
||||||
|
<p style="color:black;text-align:left">
|
||||||
|
<!-- <Icon type="ios-information-circle"></Icon> -->
|
||||||
|
<span>活动优惠券</span>
|
||||||
|
</p>
|
||||||
|
</template>
|
||||||
|
<template>
|
||||||
|
<Scroll :on-reach-bottom="handleReachBottom">
|
||||||
|
<Card dis-hover v-for="(item, index) in autoCoupList" :key="index" style="margin: 10px 15px">
|
||||||
|
<span v-if="item.couponType === 'PRICE'" class="fontsize_12 global_color" style="font-size: 15px;">¥<span class="price">{{item.price | unitPrice}}</span></span>
|
||||||
|
<span v-if="item.couponType === 'DISCOUNT'" class="fontsize_12 global_color" style="font-size: 15px;"><span class="price">{{item.discount}}</span>折</span>
|
||||||
|
<span class="describe" style="font-size: 15px;margin-left: 5px;">满{{item.consumeThreshold}}元可用</span>
|
||||||
|
<p style="font-size: 10px;">使用范围:{{useScope(item.scopeType, item.storeName)}}</p>
|
||||||
|
<p style="font-size: 10px;">有效期:{{item.endTime}}</p>
|
||||||
|
</Card>
|
||||||
|
</Scroll>
|
||||||
|
</template>
|
||||||
|
<template #footer>
|
||||||
|
<Button type="error" @click="showCpmodel=false">确定</Button>
|
||||||
|
</template>
|
||||||
|
</Modal>
|
||||||
|
|
||||||
<!-- 固定头部 -->
|
<!-- 固定头部 -->
|
||||||
<hover-search class="hover-search" :class="{show: topSearchShow}"></hover-search>
|
<hover-search class="hover-search" :class="{show: topSearchShow}"></hover-search>
|
||||||
<!-- 顶部广告 -->
|
<!-- 顶部广告 -->
|
||||||
@@ -15,6 +37,8 @@
|
|||||||
<model-form ref="modelForm" :data="modelForm"></model-form>
|
<model-form ref="modelForm" :data="modelForm"></model-form>
|
||||||
<!-- 底部栏 -->
|
<!-- 底部栏 -->
|
||||||
<BaseFooter></BaseFooter>
|
<BaseFooter></BaseFooter>
|
||||||
|
<!-- 侧边栏 -->
|
||||||
|
<fixedBar class="fixed-bar" :class="{'show-fixed': topSearchShow}"></fixedBar>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -22,8 +46,9 @@
|
|||||||
import Search from '@/components/Search';
|
import Search from '@/components/Search';
|
||||||
import ModelForm from '@/components/indexDecorate/ModelForm';
|
import ModelForm from '@/components/indexDecorate/ModelForm';
|
||||||
import HoverSearch from '@/components/header/hoverSearch';
|
import HoverSearch from '@/components/header/hoverSearch';
|
||||||
import storage from '@/plugins/storage';
|
import fixedBar from '@/components/fixed/index';
|
||||||
import { indexData } from '@/api/index.js';
|
import storage from "@/plugins/storage";
|
||||||
|
import { indexData,getAutoCoup } from '@/api/index.js';
|
||||||
import {seckillByDay} from '@/api/promotion'
|
import {seckillByDay} from '@/api/promotion'
|
||||||
export default {
|
export default {
|
||||||
name: 'Index',
|
name: 'Index',
|
||||||
@@ -38,9 +63,14 @@ export default {
|
|||||||
that.topSearchShow = false;
|
that.topSearchShow = false;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
if(storage.getItem('userInfo')){
|
||||||
|
this.getAutoCoup()
|
||||||
|
}
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
|
autoCoupList:[],
|
||||||
|
showCpmodel:false,
|
||||||
modelForm: { list: [] }, // 楼层装修数据
|
modelForm: { list: [] }, // 楼层装修数据
|
||||||
topAdvert: {}, // 顶部广告
|
topAdvert: {}, // 顶部广告
|
||||||
showNav: false, // 是否展示分类栏
|
showNav: false, // 是否展示分类栏
|
||||||
@@ -49,12 +79,94 @@ export default {
|
|||||||
carouselOpacity: false // 不同轮播分类样式
|
carouselOpacity: false // 不同轮播分类样式
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
props:{
|
||||||
|
pageData:{
|
||||||
|
type:null,
|
||||||
|
default:""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// created(){
|
||||||
|
|
||||||
|
// },
|
||||||
methods: {
|
methods: {
|
||||||
|
// 优惠券可用范围
|
||||||
|
useScope (type, storeName) {
|
||||||
|
let shop = '平台';
|
||||||
|
let goods = '全部商品'
|
||||||
|
if (storeName !== 'platform') shop = storeName
|
||||||
|
switch (type) {
|
||||||
|
case 'ALL':
|
||||||
|
goods = '全部商品'
|
||||||
|
break;
|
||||||
|
case 'PORTION_GOODS':
|
||||||
|
goods = '部分商品'
|
||||||
|
break;
|
||||||
|
case 'PORTION_GOODS_CATEGORY':
|
||||||
|
goods = '部分分类商品'
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
return `${shop}${goods}可用`
|
||||||
|
},
|
||||||
|
getAutoCoup(){
|
||||||
|
let data = new Date()
|
||||||
|
let datas = data.getDate()
|
||||||
|
let hours = data.getHours()
|
||||||
|
let flagCoup = storage.getItem('getTimes') //缓存
|
||||||
|
if(flagCoup && flagCoup != undefined && flagCoup != null){ //判断当前是否有缓存
|
||||||
|
if(Number(datas) > Number(flagCoup)){ //判断缓存是否小于当前天数
|
||||||
|
if(Number(hours) >= 6){//超过或等于6时清楚缓存
|
||||||
|
storage.setItem('getTimes',datas)//存储缓存
|
||||||
|
this.getcps()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
// window.localStorage.setItem('getTimes',datas)//存储缓存
|
||||||
|
this.getcps()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
getcps(){
|
||||||
|
console.log(123123)
|
||||||
|
let data = new Date()
|
||||||
|
let datas = data.getDate()
|
||||||
|
getAutoCoup().then(res=>{ //调用自动发券
|
||||||
|
if(res.success){
|
||||||
|
this.autoCoupList.push(...res.result);
|
||||||
|
let objs = {};
|
||||||
|
this.autoCoupList = this.autoCoupList.reduce((cur, next) => {
|
||||||
|
//对象去重
|
||||||
|
if (next.id != undefined) {
|
||||||
|
objs[next.id]
|
||||||
|
? ""
|
||||||
|
: (objs[next.id] = true && cur.push(next));
|
||||||
|
}
|
||||||
|
return cur;
|
||||||
|
}, []);
|
||||||
|
if(this.autoCoupList != '' && this.autoCoupList.length > 0){
|
||||||
|
this.showCpmodel = true;
|
||||||
|
}
|
||||||
|
storage.setItem('getTimes',datas)//存储缓存
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
handleReachBottom(){
|
||||||
|
|
||||||
|
} ,
|
||||||
getIndexData () {
|
getIndexData () {
|
||||||
|
if(this.pageData){
|
||||||
|
this.parsePageData(JSON.stringify(this.pageData))
|
||||||
|
}
|
||||||
|
else{
|
||||||
// 获取首页装修数据
|
// 获取首页装修数据
|
||||||
indexData({ clientType: 'PC' }).then(async (res) => {
|
indexData({ clientType: 'PC' }).then(async (res) => {
|
||||||
if (res.success) {
|
if (res.success && res.result) {
|
||||||
let dataJson = JSON.parse(res.result.pageData);
|
this.parsePageData(res.result.pageData)
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async parsePageData(pageData){
|
||||||
|
let dataJson = JSON.parse(pageData);
|
||||||
// 秒杀活动不是装修的数据,需要调用接口判断是否有秒杀商品
|
// 秒杀活动不是装修的数据,需要调用接口判断是否有秒杀商品
|
||||||
// 轮播图根据不同轮播,样式不同
|
// 轮播图根据不同轮播,样式不同
|
||||||
for (let i = 0; i < dataJson.list.length; i++) {
|
for (let i = 0; i < dataJson.list.length; i++) {
|
||||||
@@ -73,9 +185,8 @@ export default {
|
|||||||
storage.setItem('navList', dataJson.list[1])
|
storage.setItem('navList', dataJson.list[1])
|
||||||
this.showNav = true
|
this.showNav = true
|
||||||
this.topAdvert = dataJson.list[0];
|
this.topAdvert = dataJson.list[0];
|
||||||
}
|
|
||||||
});
|
|
||||||
},
|
},
|
||||||
|
|
||||||
async getListByDay () { // 当天秒杀活动
|
async getListByDay () { // 当天秒杀活动
|
||||||
const res = await seckillByDay()
|
const res = await seckillByDay()
|
||||||
if (res.success && res.result.length) {
|
if (res.success && res.result.length) {
|
||||||
@@ -88,12 +199,14 @@ export default {
|
|||||||
components: {
|
components: {
|
||||||
Search,
|
Search,
|
||||||
ModelForm,
|
ModelForm,
|
||||||
HoverSearch
|
HoverSearch,
|
||||||
|
fixedBar
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
@import '../assets/styles/coupon.scss';
|
||||||
.container {
|
.container {
|
||||||
@include sub_background_color($light_background_color);
|
@include sub_background_color($light_background_color);
|
||||||
}
|
}
|
||||||
@@ -119,4 +232,55 @@ export default {
|
|||||||
transform: translateZ(0);
|
transform: translateZ(0);
|
||||||
top: 0;
|
top: 0;
|
||||||
}
|
}
|
||||||
|
.fixed-bar{
|
||||||
|
opacity: 0 !important;
|
||||||
|
transform: translateY(-10px);
|
||||||
|
transition: .35s;
|
||||||
|
z-index: 999999;
|
||||||
|
height: 0px !important;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.show-fixed{
|
||||||
|
height: 354px !important;
|
||||||
|
opacity: 1 !important;
|
||||||
|
transform: translateY(0);
|
||||||
|
-webkit-transform: translateZ(0);
|
||||||
|
-moz-transform: translateZ(0);
|
||||||
|
-ms-transform: translateZ(0);
|
||||||
|
-o-transform: translateZ(0);
|
||||||
|
transform: translateZ(0);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* 2K */
|
||||||
|
@media screen and (min-width: 2561px) and (max-width: 3840px) {
|
||||||
|
/* 样式 */
|
||||||
|
.fixed-bar{
|
||||||
|
position: fixed;
|
||||||
|
right:900px;
|
||||||
|
top: 500px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 1080p */
|
||||||
|
@media screen and (max-width: 2560px) {
|
||||||
|
/* 样式 */
|
||||||
|
.fixed-bar{
|
||||||
|
position: fixed;
|
||||||
|
right:300px;
|
||||||
|
top: 500px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@media screen and (max-width: 2025px) {
|
||||||
|
/* 样式 */
|
||||||
|
.fixed-bar{
|
||||||
|
position: fixed;
|
||||||
|
right:150px;
|
||||||
|
top: 300px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -235,6 +235,7 @@ export default {
|
|||||||
this.$Message.success("登录成功");
|
this.$Message.success("登录成功");
|
||||||
storage.setItem("accessToken", res.result.accessToken);
|
storage.setItem("accessToken", res.result.accessToken);
|
||||||
storage.setItem("refreshToken", res.result.refreshToken);
|
storage.setItem("refreshToken", res.result.refreshToken);
|
||||||
|
storage.setItem('getTimes',0)
|
||||||
apiLogin.getMemberMsg().then((res) => {
|
apiLogin.getMemberMsg().then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
storage.setItem("userInfo", res.result);
|
storage.setItem("userInfo", res.result);
|
||||||
|
|||||||
@@ -2,16 +2,20 @@
|
|||||||
<div class="merchant">
|
<div class="merchant">
|
||||||
<BaseHeader/>
|
<BaseHeader/>
|
||||||
<!-- 搜索栏 -->
|
<!-- 搜索栏 -->
|
||||||
<Search :store="true" @search="search"></Search>
|
<Search :storeId="storeMsg.storeId" @search="search"></Search>
|
||||||
<!-- 店铺logo -->
|
<!-- 店铺logo -->
|
||||||
<div class="shop-logo">
|
<div class="shop-logo">
|
||||||
<div>
|
<div>
|
||||||
<p>{{storeMsg.storeName || 'xx店铺'}}</p>
|
<p>{{ storeMsg.storeName || '店铺' }}</p>
|
||||||
<p class="ellipsis" :alt="storeMsg.storeDesc" v-html="storeMsg.storeDesc"></p>
|
<p :alt="storeMsg.storeDesc" class="ellipsis" v-html="storeMsg.storeDesc"></p>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<span class="hover-pointer" @click="collect"><Icon type="ios-heart" :color="storeCollected ? '#ed3f14' : '#fff'" />{{storeCollected?'已收藏店铺':'收藏店铺'}}</span>
|
<span class="hover-pointer" @click="collect"><Icon :color="storeCollected ? '#ed3f14' : '#fff'"
|
||||||
<span style="width:80px" class="hover-pointer ml_10" @click="IMService()"><Icon custom="icomoon icon-customer-service" />联系客服</span>
|
type="ios-heart"/>{{
|
||||||
|
storeCollected ? '已收藏店铺' : '收藏店铺'
|
||||||
|
}}</span>
|
||||||
|
<span class="hover-pointer ml_10" style="width:80px" @click="IMService(storeMsg.storeId,null,null)"><Icon
|
||||||
|
custom="icomoon icon-customer-service"/>联系客服</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="store-category">
|
<div class="store-category">
|
||||||
@@ -22,7 +26,7 @@
|
|||||||
>
|
>
|
||||||
首页
|
首页
|
||||||
</li>
|
</li>
|
||||||
<li class="cate-item" v-for="(cate, index) in cateList" :key="index">
|
<li v-for="(cate, index) in cateList" :key="index" class="cate-item">
|
||||||
<Dropdown v-if="cate.children.length">
|
<Dropdown v-if="cate.children.length">
|
||||||
<div @click.self="searchByCate(cate)">
|
<div @click.self="searchByCate(cate)">
|
||||||
{{ cate.labelName }}
|
{{ cate.labelName }}
|
||||||
@@ -30,10 +34,10 @@
|
|||||||
</div>
|
</div>
|
||||||
<DropdownMenu slot="list">
|
<DropdownMenu slot="list">
|
||||||
<DropdownItem
|
<DropdownItem
|
||||||
@click.native="searchByCate(sec)"
|
|
||||||
:name="sec.id"
|
|
||||||
v-for="sec in cate.children"
|
v-for="sec in cate.children"
|
||||||
:key="sec.id"
|
:key="sec.id"
|
||||||
|
:name="sec.id"
|
||||||
|
@click.native="searchByCate(sec)"
|
||||||
>{{ sec.labelName }}
|
>{{ sec.labelName }}
|
||||||
</DropdownItem
|
</DropdownItem
|
||||||
>
|
>
|
||||||
@@ -46,50 +50,55 @@
|
|||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="promotion-decorate">{{ cateName }}</div>
|
|
||||||
|
|
||||||
<!-- <div class="goods-list">-->
|
|
||||||
<!-- <empty v-if="goodsList.length === 0"/>-->
|
|
||||||
<!-- <div-->
|
|
||||||
<!-- v-else-->
|
|
||||||
<!-- class="goods-show-info"-->
|
|
||||||
<!-- v-for="(item, index) in goodsList"-->
|
|
||||||
<!-- :key="index"-->
|
|
||||||
<!-- @click="goGoodsDetail(item.content.id, item.content.goodsId)"-->
|
|
||||||
<!-- >-->
|
|
||||||
<!-- <div class="goods-show-img">-->
|
|
||||||
<!-- <img width="220" height="220" :src="item.content.thumbnail"/>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- <div class="goods-show-price">-->
|
|
||||||
<!-- <span>-->
|
|
||||||
<!-- <span class="seckill-price text-danger">{{-->
|
|
||||||
<!-- item.content.price | unitPrice("¥")-->
|
|
||||||
<!-- }}</span>-->
|
|
||||||
<!-- </span>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- <div class="goods-show-detail">-->
|
|
||||||
<!-- <span>{{ item.content.goodsName }}</span>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- <div class="goods-show-num">-->
|
|
||||||
<!-- 已有<span>{{ item.content.commentNum || 0 }}</span-->
|
|
||||||
<!-- >人评价-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- <div class="goods-page">-->
|
|
||||||
<!-- <Page-->
|
|
||||||
<!-- show-sizer-->
|
|
||||||
<!-- @on-change="changePageNum"-->
|
|
||||||
<!-- @on-page-size-change="changePageSize"-->
|
|
||||||
<!-- :total="total"-->
|
|
||||||
<!-- :page-size="params.pageSize"-->
|
|
||||||
<!-- ></Page>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- -->
|
|
||||||
|
|
||||||
|
|
||||||
|
<div v-if="storeMsg.pageShow&&storeMsg.pageShow==='1'">
|
||||||
<!-- 楼层装修部分 -->
|
<!-- 楼层装修部分 -->
|
||||||
<model-form ref="modelForm" :data="modelForm"></model-form>
|
<model-form ref="modelForm" :data="modelForm"></model-form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
<div v-else>
|
||||||
|
<div class="promotion-decorate">{{ cateName }}</div>
|
||||||
|
<div class="goods-list">
|
||||||
|
<empty v-if="goodsList.length === 0"/>
|
||||||
|
<div
|
||||||
|
v-for="(item, index) in goodsList"
|
||||||
|
v-else
|
||||||
|
:key="index"
|
||||||
|
class="goods-show-info"
|
||||||
|
@click="goGoodsDetail(item.id, item.goodsId)"
|
||||||
|
>
|
||||||
|
|
||||||
|
<div class="goods-show-img">
|
||||||
|
<img :src="item.small" height="220" width="220" alt=""/>
|
||||||
|
</div>
|
||||||
|
<div class="goods-show-price">
|
||||||
|
<span>
|
||||||
|
<span class="seckill-price text-danger">{{
|
||||||
|
item.price | unitPrice("¥")
|
||||||
|
}}</span>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div class="goods-show-detail">
|
||||||
|
<span>{{ item.goodsName }}</span>
|
||||||
|
</div>
|
||||||
|
<div class="goods-show-num">
|
||||||
|
已有<span>{{ item.commentNum || 0 }}</span
|
||||||
|
>人评价
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="goods-page">
|
||||||
|
<Page
|
||||||
|
:page-size="params.pageSize"
|
||||||
|
:total="total"
|
||||||
|
show-sizer
|
||||||
|
@on-change="changePageNum"
|
||||||
|
@on-page-size-change="changePageSize"
|
||||||
|
></Page>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
<BaseFooter/>
|
<BaseFooter/>
|
||||||
|
|
||||||
@@ -97,17 +106,16 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { getIMDetail } from "@/api/common";
|
|
||||||
import Storage from "../plugins/storage";
|
import {getCateById, getDetailById} from "@/api/shopentry";
|
||||||
import {getDetailById, getCateById} from "@/api/shopentry";
|
import {cancelStoreCollect, collectStore} from "@/api/member";
|
||||||
import {cancelCollect, collectGoods, isCollection} from "@/api/member";
|
|
||||||
import {goodsList} from "@/api/goods";
|
import {goodsList} from "@/api/goods";
|
||||||
import Search from "@/components/Search";
|
import Search from "@/components/Search";
|
||||||
import ModelForm from "@/components/indexDecorate/ModelForm";
|
import ModelForm from "@/components/indexDecorate/ModelForm";
|
||||||
import HoverSearch from "@/components/header/hoverSearch";
|
import HoverSearch from "@/components/header/hoverSearch";
|
||||||
import storage from "@/plugins/storage";
|
import storage from "@/plugins/storage";
|
||||||
import {getFloorStoreData} from "@/api/index.js";
|
import {getFloorStoreData} from "@/api/index.js";
|
||||||
import {seckillByDay} from "@/api/promotion";
|
import imTalk from '@/components/mixes/talkIm'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: "Merchant",
|
name: "Merchant",
|
||||||
@@ -116,6 +124,7 @@ export default {
|
|||||||
ModelForm,
|
ModelForm,
|
||||||
HoverSearch,
|
HoverSearch,
|
||||||
},
|
},
|
||||||
|
mixins: [imTalk],
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
// 店铺装修的内容
|
// 店铺装修的内容
|
||||||
@@ -131,7 +140,6 @@ export default {
|
|||||||
cateList: [], // 店铺分裂
|
cateList: [], // 店铺分裂
|
||||||
goodsList: [], // 商品列表
|
goodsList: [], // 商品列表
|
||||||
total: 0, // 商品数量
|
total: 0, // 商品数量
|
||||||
IMLink:"",
|
|
||||||
params: {
|
params: {
|
||||||
// 请求参数
|
// 请求参数
|
||||||
pageNumber: 1,
|
pageNumber: 1,
|
||||||
@@ -156,8 +164,8 @@ export default {
|
|||||||
let dataJson = JSON.parse(res.result.pageData);
|
let dataJson = JSON.parse(res.result.pageData);
|
||||||
// 秒杀活动不是装修的数据,需要调用接口判断是否有秒杀商品
|
// 秒杀活动不是装修的数据,需要调用接口判断是否有秒杀商品
|
||||||
// 轮播图根据不同轮播,样式不同
|
// 轮播图根据不同轮播,样式不同
|
||||||
for (let i = 0; i < dataJson.list.length; i++) {
|
for (const element of dataJson.list) {
|
||||||
let type = dataJson.list[i].type;
|
let type = element.type;
|
||||||
if (type === "carousel2") {
|
if (type === "carousel2") {
|
||||||
this.carouselLarge = true;
|
this.carouselLarge = true;
|
||||||
} else if (type === "carousel1") {
|
} else if (type === "carousel1") {
|
||||||
@@ -178,45 +186,23 @@ export default {
|
|||||||
}
|
}
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
// 跳转im客服
|
|
||||||
async IMService() {
|
|
||||||
// 获取访问Token
|
// getStoreMsg () { // 店铺信息
|
||||||
let accessToken = Storage.getItem("accessToken");
|
// getDetailById(this.$route.query.id).then(res => {
|
||||||
await this.getIMDetailMethods();
|
// if (res.success) {
|
||||||
if (!accessToken) {
|
// this.storeMsg = res.result
|
||||||
this.$Message.error("请登录后再联系客服");
|
// document.title = this.storeMsg.storeName
|
||||||
return;
|
// if (this.Cookies.getItem('userInfo')) {
|
||||||
}
|
// isCollection('STORE', this.storeMsg.storeId).then(res => {
|
||||||
window.open(
|
// if (res.success && res.result) {
|
||||||
this.IMLink +
|
// this.storeCollected = true;
|
||||||
"?token=" +
|
// }
|
||||||
accessToken +
|
// })
|
||||||
"&id=" +
|
// }
|
||||||
this.storeMsg.storeId
|
// }
|
||||||
);
|
// })
|
||||||
},
|
// },
|
||||||
// 获取im信息
|
|
||||||
async getIMDetailMethods() {
|
|
||||||
let res = await getIMDetail();
|
|
||||||
if (res.success) {
|
|
||||||
this.IMLink = res.result;
|
|
||||||
}
|
|
||||||
},
|
|
||||||
getStoreMsg () { // 店铺信息
|
|
||||||
getDetailById(this.$route.query.id).then(res => {
|
|
||||||
if (res.success) {
|
|
||||||
this.storeMsg = res.result
|
|
||||||
document.title = this.storeMsg.storeName
|
|
||||||
if (this.Cookies.getItem('userInfo')) {
|
|
||||||
isCollection('STORE', this.storeMsg.storeId).then(res => {
|
|
||||||
if (res.success && res.result) {
|
|
||||||
this.storeCollected = true;
|
|
||||||
}
|
|
||||||
})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
})
|
|
||||||
},
|
|
||||||
// async getListByDay() {
|
// async getListByDay() {
|
||||||
// // 当天秒杀活动
|
// // 当天秒杀活动
|
||||||
// const res = await seckillByDay();
|
// const res = await seckillByDay();
|
||||||
@@ -227,33 +213,41 @@ export default {
|
|||||||
// }
|
// }
|
||||||
// },
|
// },
|
||||||
|
|
||||||
// getStoreMsg() {
|
getStoreMsg() {
|
||||||
// // 店铺信息
|
// 店铺信息
|
||||||
// getDetailById(this.$route.query.id).then((res) => {
|
getDetailById(this.$route.query.id).then((res) => {
|
||||||
// if (res.success) {
|
if (res.success) {
|
||||||
//
|
|
||||||
// this.storeMsg = res.result;
|
this.storeMsg = res.result;
|
||||||
//
|
console.log(this.storeMsg)
|
||||||
//
|
|
||||||
// this.getIndexData();
|
//判定如果开启楼层展示,则获取页面信息 否则读取商品信息
|
||||||
// let that = this;
|
if (this.storeMsg.pageShow && this.storeMsg.pageShow === '1') {
|
||||||
// window.onscroll = function () {
|
|
||||||
// let top =
|
this.getIndexData();
|
||||||
// document.documentElement.scrollTop || document.body.scrollTop;
|
} else {
|
||||||
// if (top > 300) {
|
this.getGoodsList();
|
||||||
// that.topSearchShow = true;
|
this.getCateList();
|
||||||
// } else {
|
}
|
||||||
// that.topSearchShow = false;
|
let that = this;
|
||||||
// }
|
window.onscroll = function () {
|
||||||
// };
|
let top =
|
||||||
// }
|
document.documentElement.scrollTop || document.body.scrollTop;
|
||||||
// });
|
if (top > 300) {
|
||||||
// },
|
that.topSearchShow = true;
|
||||||
|
} else {
|
||||||
|
that.topSearchShow = false;
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
getCateList() {
|
getCateList() {
|
||||||
// 店铺分类
|
// 店铺分类
|
||||||
getCateById(this.$route.query.id).then((res) => {
|
getCateById(this.$route.query.id).then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.cateList = res.result;
|
this.cateList = res.result;
|
||||||
|
console.log(this.cateList,'cateList')
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
@@ -262,8 +256,8 @@ export default {
|
|||||||
goodsList(this.params)
|
goodsList(this.params)
|
||||||
.then((res) => {
|
.then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.goodsList = res.result.content;
|
this.goodsList = res.result.records;
|
||||||
this.total = res.result.totalElements;
|
this.total = res.result.total;
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
.catch(() => {
|
.catch(() => {
|
||||||
@@ -303,13 +297,13 @@ export default {
|
|||||||
async collect() {
|
async collect() {
|
||||||
// 收藏店铺
|
// 收藏店铺
|
||||||
if (this.storeCollected) {
|
if (this.storeCollected) {
|
||||||
let cancel = await cancelCollect("STORE", this.storeMsg.storeId);
|
let cancel = await cancelStoreCollect("STORE", this.storeMsg.storeId);
|
||||||
if (cancel.success) {
|
if (cancel.success) {
|
||||||
this.$Message.success("已取消收藏");
|
this.$Message.success("已取消收藏");
|
||||||
this.storeCollected = false;
|
this.storeCollected = false;
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
let collect = await collectGoods("STORE", this.storeMsg.storeId);
|
let collect = await collectStore("STORE", this.storeMsg.storeId);
|
||||||
if (collect.code === 200) {
|
if (collect.code === 200) {
|
||||||
this.storeCollected = true;
|
this.storeCollected = true;
|
||||||
this.$Message.success("收藏店铺成功,可以前往个人中心我的收藏查看");
|
this.$Message.success("收藏店铺成功,可以前往个人中心我的收藏查看");
|
||||||
@@ -320,7 +314,7 @@ export default {
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style lang="scss" scoped>
|
||||||
@import "../assets/styles/goodsList.scss";
|
@import "../assets/styles/goodsList.scss";
|
||||||
|
|
||||||
.merchant {
|
.merchant {
|
||||||
|
|||||||
@@ -2,7 +2,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<BaseHeader></BaseHeader>
|
<BaseHeader></BaseHeader>
|
||||||
<Search></Search>
|
<Search></Search>
|
||||||
<cateNav></cateNav>
|
|
||||||
<!-- 添加成功提示 -->
|
<!-- 添加成功提示 -->
|
||||||
<div class="add-info-box-container">
|
<div class="add-info-box-container">
|
||||||
<div class="add-info-box">
|
<div class="add-info-box">
|
||||||
|
|||||||
37
buyer/src/pages/Topic.vue
Normal file
@@ -0,0 +1,37 @@
|
|||||||
|
<template>
|
||||||
|
<div v-if="pageData">
|
||||||
|
<Index :page-data="pageData" />
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Index from './Index.vue'
|
||||||
|
import { getTopicData } from '@/api/index'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
pageData: ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: { Index },
|
||||||
|
mounted() {
|
||||||
|
// 接收id进行查询
|
||||||
|
const id = this.$route.query.id
|
||||||
|
this.init(id)
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
async init(id) {
|
||||||
|
const res = await getTopicData(id)
|
||||||
|
if (res.success) {
|
||||||
|
console.log(res.result)
|
||||||
|
// 直接复用首页就行
|
||||||
|
if (res.result.pageData) {
|
||||||
|
this.pageData = JSON.parse(res.result.pageData)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped></style>
|
||||||
@@ -2,7 +2,7 @@
|
|||||||
<div>
|
<div>
|
||||||
<BaseHeader></BaseHeader>
|
<BaseHeader></BaseHeader>
|
||||||
<Search></Search>
|
<Search></Search>
|
||||||
<cateNav></cateNav>
|
|
||||||
<div class="title-bg"><p>文章帮助中心</p></div>
|
<div class="title-bg"><p>文章帮助中心</p></div>
|
||||||
<div class="container width_1200">
|
<div class="container width_1200">
|
||||||
<Layout class="layoutAll">
|
<Layout class="layoutAll">
|
||||||
@@ -182,7 +182,6 @@ export default {
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
}
|
}
|
||||||
.title-bg{
|
.title-bg{
|
||||||
border-top: 3px solid $theme_color;
|
|
||||||
height: 100px;
|
height: 100px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background-color: #7b7b7b;
|
background-color: #7b7b7b;
|
||||||
|
|||||||
@@ -30,8 +30,12 @@ export const orderStatusList = [
|
|||||||
status: 'TAKE'
|
status: 'TAKE'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: '已取消',
|
name: '已关闭',
|
||||||
status: 'CANCELLED'
|
status: 'CANCELLED'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '待提货',
|
||||||
|
status: 'STAY_PICKED_UP'
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
// 订单售后状态
|
// 订单售后状态
|
||||||
|
|||||||
@@ -36,7 +36,7 @@
|
|||||||
<i-col span="4">
|
<i-col span="4">
|
||||||
<Tooltip transfer>
|
<Tooltip transfer>
|
||||||
<div class="content">{{item.content}}</div>
|
<div class="content">{{item.content}}</div>
|
||||||
<div style="white-space: normal;" slot="content">
|
<div style="white-space: normal;word-break:break-all" slot="content">
|
||||||
{{item.content}}
|
{{item.content}}
|
||||||
</div>
|
</div>
|
||||||
</Tooltip>
|
</Tooltip>
|
||||||
@@ -160,7 +160,11 @@ export default {
|
|||||||
color: #999;
|
color: #999;
|
||||||
max-height: 60px;
|
max-height: 60px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
word-wrap: break-word;
|
// word-wrap: break-word;
|
||||||
|
display:-webkit-box;
|
||||||
|
-webkit-box-orient:vertical;/*设置方向*/
|
||||||
|
-webkit-line-clamp:3;/*设置超过为省略号的行数*/
|
||||||
|
word-break:break-all;
|
||||||
}
|
}
|
||||||
|
|
||||||
.eval-detail {
|
.eval-detail {
|
||||||
|
|||||||
@@ -41,7 +41,7 @@
|
|||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
<Alert class="l_title" show-icon type="warning">商家申诉信息</Alert>
|
<!-- <Alert class="l_title" show-icon type="warning">商家申诉信息</Alert>
|
||||||
<table cellspacing="0" cellpadding='0' border="1">
|
<table cellspacing="0" cellpadding='0' border="1">
|
||||||
<tr>
|
<tr>
|
||||||
<td>申诉时间</td>
|
<td>申诉时间</td>
|
||||||
@@ -68,7 +68,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</table>
|
</table> -->
|
||||||
|
|
||||||
<Alert class="l_title" show-icon type="warning">平台仲裁</Alert>
|
<Alert class="l_title" show-icon type="warning">平台仲裁</Alert>
|
||||||
<table cellspacing="0" cellpadding='0' border="1">
|
<table cellspacing="0" cellpadding='0' border="1">
|
||||||
|
|||||||
@@ -226,7 +226,23 @@
|
|||||||
>
|
>
|
||||||
</Alert>
|
</Alert>
|
||||||
</div>
|
</div>
|
||||||
|
<!-- 分销资格被清退 -->
|
||||||
|
<div v-if="status === 4">
|
||||||
|
<Alert type="error">
|
||||||
|
您的分销资格已被清退。请联系管理员或进行申诉
|
||||||
|
|
||||||
|
<Button style="margin-left: 50px;" type="warning" @click="repaying">申诉</Button>
|
||||||
|
</Alert>
|
||||||
|
</div>
|
||||||
|
<!-- 分销申诉审核 -->
|
||||||
|
<div v-if="status === 5">
|
||||||
|
<Alert type="success">
|
||||||
|
您提交的申诉正在审核
|
||||||
|
<template slot="desc"
|
||||||
|
>提交认证申请后,工作人员将在三个工作日进行核对完成审核</template
|
||||||
|
>
|
||||||
|
</Alert>
|
||||||
|
</div>
|
||||||
<Modal v-model="withdrawApplyModal" width="530">
|
<Modal v-model="withdrawApplyModal" width="530">
|
||||||
<p slot="header">
|
<p slot="header">
|
||||||
<Icon type="edit"></Icon>
|
<Icon type="edit"></Icon>
|
||||||
@@ -243,21 +259,39 @@
|
|||||||
</Modal>
|
</Modal>
|
||||||
<Modal v-model="qrcodeShow" title="分销商品" width="800">
|
<Modal v-model="qrcodeShow" title="分销商品" width="800">
|
||||||
<Alert type="warning"> 下载二维码或者复制链接分享商品 </Alert>
|
<Alert type="warning"> 下载二维码或者复制链接分享商品 </Alert>
|
||||||
<div style="width: 200px; height: 200px; border: 1px solid #eee">
|
<div class="qrcode">
|
||||||
|
<div style="width: 150px; height: 150px; border: 1px solid #eee">
|
||||||
<vue-qr
|
<vue-qr
|
||||||
:text="qrcode"
|
:text="qrcode"
|
||||||
:callback="qrcodeData"
|
:callback="qrcodeData"
|
||||||
:margin="0"
|
:margin="0"
|
||||||
colorDark="#000"
|
colorDark="#000"
|
||||||
colorLight="#fff"
|
colorLight="#fff"
|
||||||
:size="200"
|
:size="150"
|
||||||
></vue-qr>
|
></vue-qr>
|
||||||
|
<div class="qrcode-platform">PC端</div>
|
||||||
<Button class="download-btn" type="success" @click="downloadQrcode"
|
<Button class="download-btn" type="success" @click="downloadQrcode"
|
||||||
>下载二维码</Button
|
>下载二维码</Button
|
||||||
>
|
>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt_10">
|
<div style="width: 150px; height: 150px; border: 1px solid #eee">
|
||||||
商品链接:<Input style="width: 400px" v-model="qrcode"></Input>
|
<vue-qr
|
||||||
|
:text="qrcodeH5"
|
||||||
|
:callback="qrcodeDataH5"
|
||||||
|
:margin="0"
|
||||||
|
colorDark="#000"
|
||||||
|
colorLight="#fff"
|
||||||
|
:size="150"
|
||||||
|
></vue-qr>
|
||||||
|
<div class="qrcode-platform">移动应用端</div>
|
||||||
|
<Button class="download-btn" type="success" @click="downloadQrcodeH5"
|
||||||
|
>下载二维码</Button
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="mt_10" style="margin-top: 100px;">
|
||||||
|
商品链接:<Input style="width: 600px" v-model="qrcode"></Input>
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
</div>
|
</div>
|
||||||
@@ -280,6 +314,7 @@ export default {
|
|||||||
components: { vueQr },
|
components: { vueQr },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
config:require('@/config'),
|
||||||
status: 0, // 申请状态,0为未申请 1 申请中 2 申请完成 3 功能暂未开启
|
status: 0, // 申请状态,0为未申请 1 申请中 2 申请完成 3 功能暂未开启
|
||||||
applyForm: {}, // 申请表单
|
applyForm: {}, // 申请表单
|
||||||
rules: {
|
rules: {
|
||||||
@@ -313,14 +348,6 @@ export default {
|
|||||||
// 可以单个或者同时写两个触发验证方式
|
// 可以单个或者同时写两个触发验证方式
|
||||||
trigger: "blur",
|
trigger: "blur",
|
||||||
},
|
},
|
||||||
{
|
|
||||||
validator: (rule, value, callback) => {
|
|
||||||
// 上面有说,返回true表示校验通过,返回false表示不通过
|
|
||||||
// this.$u.test.mobile()就是返回true或者false的
|
|
||||||
return checkBankno(value);
|
|
||||||
},
|
|
||||||
message: "银行账号不正确",
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
tabName: "goodsChecked", // 当前所在tab
|
tabName: "goodsChecked", // 当前所在tab
|
||||||
@@ -364,8 +391,10 @@ export default {
|
|||||||
order: "desc",
|
order: "desc",
|
||||||
},
|
},
|
||||||
qrcode: "", // 二维码
|
qrcode: "", // 二维码
|
||||||
|
qrcodeH5:"",//H5二维码
|
||||||
qrcodeShow: false, // 显示二维码
|
qrcodeShow: false, // 显示二维码
|
||||||
base64Img: "", // base64编码
|
base64Img: "", // base64编码
|
||||||
|
base64ImgH5: "", // base64H5编码
|
||||||
goodsNameCurr: "", // 当前分销商品名称
|
goodsNameCurr: "", // 当前分销商品名称
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
@@ -378,7 +407,7 @@ export default {
|
|||||||
this.$refs.form.validate((valid) => {
|
this.$refs.form.validate((valid) => {
|
||||||
if (valid) {
|
if (valid) {
|
||||||
this.applyLoading = true;
|
this.applyLoading = true;
|
||||||
applyDistribution(this.form).then((res) => {
|
applyDistribution(this.applyForm).then((res) => {
|
||||||
this.applyLoading = false;
|
this.applyLoading = false;
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.$Message.success("申请已提交,请等待管理员审核");
|
this.$Message.success("申请已提交,请等待管理员审核");
|
||||||
@@ -406,6 +435,10 @@ export default {
|
|||||||
// 二维码base64地址
|
// 二维码base64地址
|
||||||
this.base64Img = data64;
|
this.base64Img = data64;
|
||||||
},
|
},
|
||||||
|
qrcodeDataH5(data64) {
|
||||||
|
// 二维码H5端base64地址
|
||||||
|
this.base64ImgH5 = data64;
|
||||||
|
},
|
||||||
downloadQrcode() {
|
downloadQrcode() {
|
||||||
// 下载二维码
|
// 下载二维码
|
||||||
let a = document.createElement("a"); // 生成一个a元素
|
let a = document.createElement("a"); // 生成一个a元素
|
||||||
@@ -414,6 +447,14 @@ export default {
|
|||||||
a.href = this.base64Img; // 将生成的URL设置为a.href属性
|
a.href = this.base64Img; // 将生成的URL设置为a.href属性
|
||||||
a.dispatchEvent(event); // 触发a的单击事件
|
a.dispatchEvent(event); // 触发a的单击事件
|
||||||
},
|
},
|
||||||
|
downloadQrcodeH5(){
|
||||||
|
// 下载H5二维码
|
||||||
|
let a = document.createElement("a"); // 生成一个a元素
|
||||||
|
let event = new MouseEvent("click"); // 创建一个单击事件
|
||||||
|
a.download = this.goodsNameCurr || "photo";
|
||||||
|
a.href = this.base64ImgH5; // 将生成的URL设置为a.href属性
|
||||||
|
a.dispatchEvent(event); // 触发a的单击事件
|
||||||
|
},
|
||||||
tabPaneChange(tab) {
|
tabPaneChange(tab) {
|
||||||
// tab栏切换
|
// tab栏切换
|
||||||
if (tab === "goodsChecked") {
|
if (tab === "goodsChecked") {
|
||||||
@@ -453,7 +494,8 @@ export default {
|
|||||||
},
|
},
|
||||||
fenxiao(row) {
|
fenxiao(row) {
|
||||||
// 分销商品
|
// 分销商品
|
||||||
this.qrcode = `${location.origin}/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}&distributionId=${this.result.id}`;
|
this.qrcode = `${this.config.PC_DOMAIN}/goodsDetail?skuId=${row.skuId}&goodsId=${row.goodsId}&distributionId=${this.result.id}`;
|
||||||
|
this.qrcodeH5 = `${this.config.WAP_DOMAIN}/pages/product/goods?skuId=${row.skuId}&goodsId=${row.goodsId}&distributionId=${this.result.id}`;
|
||||||
this.goodsNameCurr = row.goodsName;
|
this.goodsNameCurr = row.goodsName;
|
||||||
this.qrcodeShow = true;
|
this.qrcodeShow = true;
|
||||||
},
|
},
|
||||||
@@ -469,18 +511,31 @@ export default {
|
|||||||
if (res.success) this.logData = res.result;
|
if (res.success) this.logData = res.result;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
//申诉
|
||||||
|
repaying(){
|
||||||
|
applyDistribution().then((res) => {
|
||||||
|
this.applyLoading = false;
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("申诉已提交,请等待管理员审核");
|
||||||
|
// this.status = 1;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
distribution() {
|
distribution() {
|
||||||
// 获取分销商信息
|
// 获取分销商信息
|
||||||
distribution().then((res) => {
|
distribution().then((res) => {
|
||||||
if (res.result) {
|
if (res.result) {
|
||||||
this.result = res.result;
|
this.result = res.result;
|
||||||
let type = res.result.distributionStatus;
|
let type = res.result.distributionStatus;
|
||||||
|
|
||||||
if (type === "PASS") {
|
if (type === "PASS") {
|
||||||
this.status = 2;
|
this.status = 2;
|
||||||
this.getGoodsData();
|
this.getGoodsData();
|
||||||
} else if (type === "RETREAT" || type === "REFUSE") {
|
} else if ( type === "REFUSE") {
|
||||||
this.status = 0;
|
this.status = 0;
|
||||||
|
} else if (type === "RETREAT") {
|
||||||
|
this.status = 4;
|
||||||
|
}else if (type === "APPEAL") {
|
||||||
|
this.status = 5;
|
||||||
}else {
|
}else {
|
||||||
this.status = 1;
|
this.status = 1;
|
||||||
}
|
}
|
||||||
@@ -523,11 +578,13 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
.download-btn {
|
.download-btn {
|
||||||
position: relative;
|
// position: relative;
|
||||||
top: -200px;
|
// top: -200px;
|
||||||
left: 200px;
|
// left: 200px;
|
||||||
|
margin-left: 25px;
|
||||||
|
margin-top: 5px
|
||||||
}
|
}
|
||||||
/depp/ .ivu-alert-message {
|
/deep/ .ivu-alert-message {
|
||||||
p {
|
p {
|
||||||
margin: 4px 0;
|
margin: 4px 0;
|
||||||
}
|
}
|
||||||
@@ -540,4 +597,15 @@ export default {
|
|||||||
margin: 6px 0;
|
margin: 6px 0;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.qrcode{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-evenly;
|
||||||
|
padding-top: 10px
|
||||||
|
|
||||||
|
}
|
||||||
|
.qrcode-platform{
|
||||||
|
text-align: center;
|
||||||
|
font-size: 14px;
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -1,9 +1,10 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="wrapper">
|
<div class="wrapper">
|
||||||
<card _Title="近期收藏" :_Tabs="favoriteWay" @_Change="change" :_Size="16" v-if="!homePage" />
|
<card _Title="近期收藏" :_Tabs="favoriteWay" @_Change="change" :_Size="16" v-if="!homePage" />
|
||||||
<card _Title="近期收藏" :_Size="16" :_Tabs="favoriteWay" @_Change="change" _More="全部收藏" _Src="/home/Favorites" v-else></card>
|
<card _Title="近期收藏" :_Size="16" :_Tabs="favoriteWay" @_Change="change" _More="全部收藏" _Src="/home/Favorites" v-else>
|
||||||
|
</card>
|
||||||
<div v-if="list.length">
|
<div v-if="list.length">
|
||||||
<template v-for="(item) in list">
|
<div v-for="(item, index) in list" :key="index">
|
||||||
<div class="goodsItem" :key="item.skuId">
|
<div class="goodsItem" :key="item.skuId">
|
||||||
<div class="goodsImg hover-pointer" v-if="params.type === 'GOODS'">
|
<div class="goodsImg hover-pointer" v-if="params.type === 'GOODS'">
|
||||||
<img :src="item.image" />
|
<img :src="item.image" />
|
||||||
@@ -11,24 +12,25 @@
|
|||||||
<div class="goodsImg hover-pointer" v-else>
|
<div class="goodsImg hover-pointer" v-else>
|
||||||
<img :src="item.storeLogo" />
|
<img :src="item.storeLogo" />
|
||||||
</div>
|
</div>
|
||||||
<div class="goodsTitle hover-color" v-if="params.type === 'GOODS'" @click="buynow(item.skuId, item.goodsId)">
|
<div class="goodsTitle hover-color" v-if="params.type === 'GOODS'" @click="buynow(item.skuId, item.goodsId,item.id)">
|
||||||
{{ item.goodsName }}
|
{{ item.goodsName }}
|
||||||
</div>
|
</div>
|
||||||
<div v-else class="goodsTitle hover-pointer">
|
<div v-else class="goodsTitle hover-pointer" @click="buynow(item.skuId, item.goodsId,item.id)" >
|
||||||
{{item.storeName}}
|
<Tag color="error" class="operated" v-if="item.selfOperated">商家自营</Tag>
|
||||||
</div>
|
</div>
|
||||||
<div class="goodsPrice">
|
<div class="goodsPrice">
|
||||||
<span v-if="params.type === 'GOODS'">{{ item.price | unitPrice('¥') }}</span>
|
<span v-if="params.type === 'GOODS'">{{ item.price | unitPrice('¥') }}</span>
|
||||||
<Tag color="error" v-if="item.selfOperated">商家自营</Tag>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="goodsBuy">
|
<div class="goodsBuy">
|
||||||
<Button size="small" type="primary" @click="buynow(item.skuId, item.goodsId)" v-if="params.type === 'GOODS'">立即购买</Button>
|
<Button size="small" type="primary" @click="buynow(item.skuId, item.goodsId)"
|
||||||
|
v-if="params.type === 'GOODS'">立即购买</Button>
|
||||||
<Button size="small" type="primary" @click="goShop(item.id)" v-else>店铺购买</Button>
|
<Button size="small" type="primary" @click="goShop(item.id)" v-else>店铺购买</Button>
|
||||||
<Button size="small" v-if="params.type === 'GOODS'" @click="cancel(item.skuId)">取消收藏</Button>
|
<Button size="small" v-if="params.type === 'GOODS'" @click="cancel(item.skuId)">取消收藏</Button>
|
||||||
<Button size="small" v-if="params.type === 'SHOP'" @click="cancel(item.id)">取消收藏</Button>
|
<Button size="small" v-if="params.type === 'STORE'" @click="cancelStore(item.id)">取消收藏</Button>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
|
||||||
<Spin size="large" fix v-if="spinShow"></Spin>
|
<Spin size="large" fix v-if="spinShow"></Spin>
|
||||||
</div>
|
</div>
|
||||||
<empty v-else />
|
<empty v-else />
|
||||||
@@ -36,7 +38,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { collectList, cancelCollect } from '@/api/member.js'
|
import { collectList, cancelCollect, storeCollectList, cancelStoreCollect } from '@/api/member.js'
|
||||||
export default {
|
export default {
|
||||||
name: 'Favorites',
|
name: 'Favorites',
|
||||||
props: {
|
props: {
|
||||||
@@ -53,11 +55,12 @@ export default {
|
|||||||
params: { // 请求参数
|
params: { // 请求参数
|
||||||
pageNumber: 1,
|
pageNumber: 1,
|
||||||
pageSize: 100,
|
pageSize: 100,
|
||||||
type: 'GOODS'
|
type: this.$route.query.type || 'GOODS'
|
||||||
},
|
},
|
||||||
spinShow: false // 加载状态
|
spinShow: false // 加载状态
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
getList() { // 获取收藏列表
|
getList() { // 获取收藏列表
|
||||||
this.spinShow = true
|
this.spinShow = true
|
||||||
@@ -66,10 +69,16 @@ export default {
|
|||||||
if (res.success) this.list = res.result.records;
|
if (res.success) this.list = res.result.records;
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
getStoreList() { // 获取收藏列表
|
||||||
|
this.spinShow = true
|
||||||
|
storeCollectList(this.params).then(res => {
|
||||||
|
this.spinShow = false
|
||||||
|
if (res.success) this.list = res.result.records;
|
||||||
|
})
|
||||||
|
},
|
||||||
change(index) { // tab栏切换
|
change(index) { // tab栏切换
|
||||||
if (index === 0) { this.params.type = 'GOODS' }
|
if (index === 0) { this.params.type = 'GOODS', this.getList() }
|
||||||
if (index === 1) { this.params.type = 'SHOP' }
|
if (index === 1) { this.params.type = 'STORE', this.getStoreList() }
|
||||||
this.getList()
|
|
||||||
},
|
},
|
||||||
cancel(id) { // 取消收藏
|
cancel(id) { // 取消收藏
|
||||||
let typeName = this.params.type === 'GOODS' ? '商品' : '店铺'
|
let typeName = this.params.type === 'GOODS' ? '商品' : '店铺'
|
||||||
@@ -85,12 +94,37 @@ export default {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
buynow (skuId, goodsId) { // 跳转详情
|
cancelStore(id) { // 取消收藏
|
||||||
let url = this.$router.resolve({
|
let typeName = this.params.type === 'GOODS' ? '商品' : '店铺'
|
||||||
|
this.$Modal.confirm({
|
||||||
|
title: 'Title',
|
||||||
|
content: `<p>确定取消收藏该${typeName}吗?</p>`,
|
||||||
|
onOk: () => {
|
||||||
|
cancelStoreCollect(this.params.type, id).then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
this.getStoreList();
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
buynow(skuId, goodsId,storeId) { // 跳转详情
|
||||||
|
console.log(this.params.type)
|
||||||
|
let url
|
||||||
|
if (this.params.type === 'STORE') {
|
||||||
|
url = this.$router.resolve({
|
||||||
|
path: '/Merchant',
|
||||||
|
query: { 'id': storeId }
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
url = this.$router.resolve({
|
||||||
path: '/goodsDetail',
|
path: '/goodsDetail',
|
||||||
query: { skuId, goodsId }
|
query: { skuId, goodsId }
|
||||||
})
|
})
|
||||||
|
|
||||||
|
}
|
||||||
window.open(url.href, '_blank')
|
window.open(url.href, '_blank')
|
||||||
|
|
||||||
},
|
},
|
||||||
goShop(id) { // 跳转店铺页面
|
goShop(id) { // 跳转店铺页面
|
||||||
let url = this.$router.resolve({
|
let url = this.$router.resolve({
|
||||||
@@ -103,6 +137,7 @@ export default {
|
|||||||
mounted() {
|
mounted() {
|
||||||
if (this.homePage) this.params.pageSize = 5;
|
if (this.homePage) this.params.pageSize = 5;
|
||||||
this.getList()
|
this.getList()
|
||||||
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -115,9 +150,15 @@ export default {
|
|||||||
.goodsTitle {
|
.goodsTitle {
|
||||||
margin: 0 6px;
|
margin: 0 6px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.operated {
|
||||||
|
margin-left: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
.wrapper {
|
.wrapper {
|
||||||
margin-bottom: 40px;
|
margin-bottom: 40px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.goodsItem {
|
.goodsItem {
|
||||||
display: flex;
|
display: flex;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
@@ -148,12 +189,15 @@ export default {
|
|||||||
white-space: nowrap;
|
white-space: nowrap;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.goodsBuy {
|
.goodsBuy {
|
||||||
margin-left: 80px;
|
margin-left: 80px;
|
||||||
|
|
||||||
>* {
|
>* {
|
||||||
margin: 0 4px;
|
margin: 0 4px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.page-size {
|
.page-size {
|
||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -37,9 +37,9 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import storage from '@/plugins/storage.js';
|
|
||||||
import { editMemberInfo } from '@/api/account.js';
|
import { editMemberInfo } from '@/api/account.js';
|
||||||
import { commonUrl } from '@/plugins/request.js';
|
import { commonUrl } from '@/plugins/request.js';
|
||||||
|
import storage from '@/plugins/storage.js';
|
||||||
export default {
|
export default {
|
||||||
name: 'Profile',
|
name: 'Profile',
|
||||||
data () {
|
data () {
|
||||||
@@ -70,6 +70,7 @@ export default {
|
|||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.$Message.success('修改个人资料成功')
|
this.$Message.success('修改个人资料成功')
|
||||||
storage.setItem('userInfo', res.result)
|
storage.setItem('userInfo', res.result)
|
||||||
|
this.$router.go(0)
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -60,24 +60,27 @@
|
|||||||
v-model="orderGoods.content"
|
v-model="orderGoods.content"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
|
||||||
<span class="color999">商家回复:</span>
|
|
||||||
<span>{{ orderGoods.reply }}</span>
|
|
||||||
</div>
|
|
||||||
<div style="display: flex; align-items: center">
|
<div style="display: flex; align-items: center">
|
||||||
<template v-if="orderGoods.images">
|
<template v-if="orderGoods.images">
|
||||||
<div
|
<div class="demo-upload-list" v-for="(img, index) in orderGoods.images.split(',')" :key="index">
|
||||||
class="demo-upload-list"
|
|
||||||
v-for="(img, index) in orderGoods.images.split(',')"
|
|
||||||
:key="index"
|
|
||||||
>
|
|
||||||
<img :src="img" />
|
<img :src="img" />
|
||||||
<div class="demo-upload-list-cover">
|
<div class="demo-upload-list-cover"><Icon type="ios-eye-outline" @click.native="handleView(img)"></Icon></div>
|
||||||
<Icon type="ios-eye-outline" @click.native="handleView(img)"></Icon>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
</div>
|
</div>
|
||||||
|
<div style="margin-top: 20px;" v-if="orderGoods.reply || orderGoods.replyImage">
|
||||||
|
<span class="color999">商家回复:</span>
|
||||||
|
<span>{{ orderGoods.reply }}</span>
|
||||||
|
<div style="display: flex; align-items: center">
|
||||||
|
<template v-if="orderGoods.replyImage">
|
||||||
|
<div class="demo-upload-list" v-for="(img, index) in orderGoods.replyImage.split(',')" :key="index">
|
||||||
|
<img :src="img" />
|
||||||
|
<div class="demo-upload-list-cover"><Icon type="ios-eye-outline" @click.native="handleView(img)"></Icon></div>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|||||||
@@ -7,8 +7,9 @@
|
|||||||
<i-input v-model="formData.name" placeholder="请输入收件人姓名" style="width: 600px"></i-input>
|
<i-input v-model="formData.name" placeholder="请输入收件人姓名" style="width: 600px"></i-input>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="收件地区" prop="address">
|
<FormItem label="收件地区" prop="address">
|
||||||
<i-input v-model="formData.address" disabled placeholder="请选择收货地址" style="width: 600px"></i-input>
|
<span>{{ formData.address || '暂无地址' }}</span>
|
||||||
<Button type="primary" size="small" @click="$refs.map.showMap = true">选择</Button>
|
|
||||||
|
<Button type="default" style="margin-left: 10px;" size="small" @click="$refs.map.open()">选择</Button>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="详细地址" prop="detail">
|
<FormItem label="详细地址" prop="detail">
|
||||||
<i-input v-model="formData.detail" placeholder="请输入详细地址" style="width: 600px"></i-input>
|
<i-input v-model="formData.detail" placeholder="请输入详细地址" style="width: 600px"></i-input>
|
||||||
@@ -29,14 +30,15 @@
|
|||||||
<Button type="primary" class="mr_10" :loading="loading" @click="save">保存收货地址</Button>
|
<Button type="primary" class="mr_10" :loading="loading" @click="save">保存收货地址</Button>
|
||||||
<Button @click="$router.back()">返回</Button>
|
<Button @click="$router.back()">返回</Button>
|
||||||
</div>
|
</div>
|
||||||
<lili-map ref="map" @getAddress="getAddress"></lili-map>
|
|
||||||
|
<multipleMap ref="map" @callback="getAddress" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import card from "@/components/card";
|
import card from "@/components/card";
|
||||||
import liliMap from "@/components/map";
|
|
||||||
|
|
||||||
|
import multipleMap from "@/components/map/multiple-map";
|
||||||
import * as RegExp from "@/plugins/RegExp.js";
|
import * as RegExp from "@/plugins/RegExp.js";
|
||||||
import {
|
import {
|
||||||
newMemberAddress,
|
newMemberAddress,
|
||||||
@@ -117,15 +119,25 @@ export default {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
getAddress(item) {
|
getAddress(val) {
|
||||||
// 获取地图选择信息
|
// 获取地图选择信息
|
||||||
console.log(item);
|
if(val.type === 'select'){
|
||||||
this.mapMsg = item;
|
const paths = val.data.map(item => item.name).join(',')
|
||||||
this.$set(this.formData, "address", item.addr);
|
const ids = val.data.map(item => item.id).join(',')
|
||||||
this.$set(this.formData, "consigneeAddressIdPath", item.addrId);
|
this.$set(this.formData,'address',paths)
|
||||||
this.$set(this.formData, "detail", item.detail);
|
this.$set(this.formData,'consigneeAddressIdPath',ids)
|
||||||
this.formData.lat = item.position.lat;
|
const coord = val.data[val.data.length - 1].center.split(',')
|
||||||
this.formData.lon = item.position.lng;
|
this.formData.lat = coord[1]
|
||||||
|
this.formData.lon = coord[0]
|
||||||
|
}else{
|
||||||
|
this.$set(this.formData, "address", val.data.addr);
|
||||||
|
this.$set(this.formData, "consigneeAddressIdPath", val.data.addrId);
|
||||||
|
this.$set(this.formData, "detail", val.data.address);
|
||||||
|
this.formData.lat = val.data.position.lat;
|
||||||
|
this.formData.lon = val.data.position.lng;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
@@ -134,7 +146,7 @@ export default {
|
|||||||
},
|
},
|
||||||
components: {
|
components: {
|
||||||
card,
|
card,
|
||||||
liliMap,
|
multipleMap
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|||||||
@@ -9,7 +9,7 @@
|
|||||||
class="width_300"
|
class="width_300"
|
||||||
search
|
search
|
||||||
enter-button
|
enter-button
|
||||||
v-model="params.sn"
|
v-model="params.keywords"
|
||||||
@on-search="getList"
|
@on-search="getList"
|
||||||
placeholder="请输入订单号搜索"
|
placeholder="请输入订单号搜索"
|
||||||
/>
|
/>
|
||||||
@@ -42,10 +42,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
|
||||||
<span @click="shopPage(order.shopId)">{{ order.storeName }}</span>
|
<div class="btns">
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<!-- 订单基础操作 -->
|
<!-- 订单基础操作 -->
|
||||||
<Button @click="goDetail(order.sn)" type="info" size="small">售后详情</Button>
|
<Button @click="goDetail(order.sn)" type="info" size="small">售后详情</Button>
|
||||||
<Button @click="openModal(order)"
|
<Button @click="openModal(order)"
|
||||||
@@ -95,8 +93,8 @@
|
|||||||
<Option v-for="item in companyList" :value="item.id" :key="item.id">{{ item.name }}</Option>
|
<Option v-for="item in companyList" :value="item.id" :key="item.id">{{ item.name }}</Option>
|
||||||
</Select>
|
</Select>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="快递单号" prop="logisticsNo">
|
<FormItem label="物流单号" prop="logisticsNo">
|
||||||
<Input v-model="form.logisticsNo" placeholder="请填写快递单号"></Input>
|
<Input v-model="form.logisticsNo" placeholder="请填写物流单号"></Input>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="发货时间" prop="mDeliverTime">
|
<FormItem label="发货时间" prop="mDeliverTime">
|
||||||
<DatePicker type="date" style="width:100%" v-model="form.mDeliverTime" @on-change="changeTime"
|
<DatePicker type="date" style="width:100%" v-model="form.mDeliverTime" @on-change="changeTime"
|
||||||
@@ -184,14 +182,7 @@ export default {
|
|||||||
});
|
});
|
||||||
window.open(routeUrl.href, '_blank');
|
window.open(routeUrl.href, '_blank');
|
||||||
},
|
},
|
||||||
// 跳转店铺首页
|
|
||||||
shopPage(id) {
|
|
||||||
let routeUrl = this.$router.resolve({
|
|
||||||
path: '/Merchant',
|
|
||||||
query: {id: id}
|
|
||||||
});
|
|
||||||
window.open(routeUrl.href, '_blank');
|
|
||||||
},
|
|
||||||
getList() { // 获取售后列表
|
getList() { // 获取售后列表
|
||||||
this.spinShow = true;
|
this.spinShow = true;
|
||||||
let params = JSON.parse(JSON.stringify(this.params))
|
let params = JSON.parse(JSON.stringify(this.params))
|
||||||
@@ -363,4 +354,10 @@ export default {
|
|||||||
.modal-goods {
|
.modal-goods {
|
||||||
padding: 5px;
|
padding: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.btns{
|
||||||
|
>*{
|
||||||
|
margin: 4px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -13,15 +13,7 @@
|
|||||||
<p class="global_color fontsize_18">{{ afterSale.orderStatusValue }}</p>
|
<p class="global_color fontsize_18">{{ afterSale.orderStatusValue }}</p>
|
||||||
<p>售后单号:{{ afterSale.sn }} 订单号:{{afterSale.orderSn}}</p>
|
<p>售后单号:{{ afterSale.sn }} 订单号:{{afterSale.orderSn}}</p>
|
||||||
<div style="color:#999;" class="operation-time">创建时间:{{afterSale.createTime}}</div>
|
<div style="color:#999;" class="operation-time">创建时间:{{afterSale.createTime}}</div>
|
||||||
<div class="service-after">
|
|
||||||
<div>
|
|
||||||
本次售后服务由<span>{{afterSale.storeName}}</span>为您提供
|
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<img :src="afterSale.goodsImage" alt="" width="60" height="60">
|
|
||||||
<span>{{afterSale.goodsName}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="order-card">
|
<div class="order-card">
|
||||||
<h3>售后进程</h3>
|
<h3>售后进程</h3>
|
||||||
@@ -85,8 +77,8 @@
|
|||||||
<Option v-for="item in companyList" :value="item.id" :key="item.id">{{ item.name }}</Option>
|
<Option v-for="item in companyList" :value="item.id" :key="item.id">{{ item.name }}</Option>
|
||||||
</Select>
|
</Select>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="快递单号" prop="logisticsNo">
|
<FormItem label="物流单号" prop="logisticsNo">
|
||||||
<Input v-model="form.logisticsNo" placeholder="请填写快递单号"></Input>
|
<Input v-model="form.logisticsNo" placeholder="请填写物流单号"></Input>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem label="发货时间" prop="mDeliverTime">
|
<FormItem label="发货时间" prop="mDeliverTime">
|
||||||
<DatePicker type="date" style="width:100%" v-model="form.mDeliverTime" @on-change="changeTime" format="yyyy-MM-dd" placeholder="选择发货时间"></DatePicker>
|
<DatePicker type="date" style="width:100%" v-model="form.mDeliverTime" @on-change="changeTime" format="yyyy-MM-dd" placeholder="选择发货时间"></DatePicker>
|
||||||
|
|||||||
@@ -4,7 +4,7 @@
|
|||||||
<card _Title="我的订单" :_Size="16" :_Tabs="changeWay" @_Change="change" v-if="!homePage"></card>
|
<card _Title="我的订单" :_Size="16" :_Tabs="changeWay" @_Change="change" v-if="!homePage"></card>
|
||||||
<card _Title="我的订单" :_Size="16" :_Tabs="changeWay" @_Change="change" _More="全部订单" _Src="/home/MyOrder" v-else></card>
|
<card _Title="我的订单" :_Size="16" :_Tabs="changeWay" @_Change="change" _More="全部订单" _Src="/home/MyOrder" v-else></card>
|
||||||
<!-- 搜索 筛选 -->
|
<!-- 搜索 筛选 -->
|
||||||
<div class="mb_20 box" v-if="!homePage">
|
<div class="mb_24 box" v-if="!homePage">
|
||||||
<div class="global_float_right" >
|
<div class="global_float_right" >
|
||||||
<Input
|
<Input
|
||||||
class="width_300"
|
class="width_300"
|
||||||
@@ -51,26 +51,24 @@
|
|||||||
<div>
|
<div>
|
||||||
<div class="hover-color" @click="goodsDetail(goods.skuId, goods.goodsId)">{{ goods.name }}</div>
|
<div class="hover-color" @click="goodsDetail(goods.skuId, goods.goodsId)">{{ goods.name }}</div>
|
||||||
<div class="mt_10">
|
<div class="mt_10">
|
||||||
<span class="global_color"
|
<span class="global_color">{{ goods.goodsPrice | unitPrice("¥") }} </span>x {{ goods.num }}
|
||||||
>{{ goods.goodsPrice | unitPrice("¥") }} </span
|
<span style="margin-left: 10px;color: #ff9900;">{{refundPriceList(goods.isRefund)}}</span>
|
||||||
>x {{ goods.num }}
|
|
||||||
</div>
|
</div>
|
||||||
<Button v-if="goods.commentStatus == 'UNFINISHED'" @click="comment(order.sn, goodsIndex)" size="small" type="success" class="fontsize_12" style="position:relative;top:-22px;left:100px;margin-right:10px">评价</Button>
|
<Button v-if="goods.commentStatus == 'UNFINISHED'" @click="comment(order.sn, goodsIndex)" size="small" type="success" class="fontsize_12" style="position:relative;top:-22px;left:190px;margin-right:10px">评价</Button>
|
||||||
<Button v-if="goods.complainStatus == 'NO_APPLY'" @click="complain(order.sn, goodsIndex)" type="warning" class="fontsize_12" size="small" style="position:relative;top:-22px;left:100px">投诉</Button>
|
<Button v-if="goods.complainStatus == 'NO_APPLY'" @click="complain(order.sn, goodsIndex)" type="warning" class="fontsize_12" size="small" style="position:relative;top:-22px;left:190px">投诉</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div>
|
|
||||||
<span @click="shopPage(order.storeId)">{{ order.storeName }}</span>
|
<div class="btns">
|
||||||
</div>
|
|
||||||
<div>
|
|
||||||
<!-- 订单基础操作 -->
|
<!-- 订单基础操作 -->
|
||||||
<Button @click="orderDetail(order.sn)" type="info" size="small">订单详情</Button>
|
<Button @click="orderDetail(order.sn)" type="info" size="small">订单详情</Button>
|
||||||
<Button @click="handleCancelOrder(order.sn)" type="error" v-if="order.allowOperationVO.cancel" size="small">取消订单</Button>
|
<Button @click="handleCancelOrder(order.sn)" type="error" v-if="order.allowOperationVO.cancel" size="small">取消订单</Button>
|
||||||
<Button @click="goPay(order.sn)" size="small" type="success" v-if="order.allowOperationVO.pay">去支付</Button>
|
<Button @click="goPay(order.sn)" size="small" type="success" v-if="order.allowOperationVO.pay">去支付</Button>
|
||||||
<Button @click="received(order.sn)" size="small" type="warning" v-if="order.allowOperationVO.rog">确认收货</Button>
|
<Button @click="received(order.sn)" size="small" type="warning" v-if="order.allowOperationVO.rog">确认收货</Button>
|
||||||
<!-- 售后 -->
|
<!-- 售后 -->
|
||||||
<Button v-if="order.groupAfterSaleStatus && order.groupAfterSaleStatus.includes('NOT_APPLIED')" @click="applyAfterSale(order.orderItems)" size="small">申请售后</Button>
|
<Button v-if="order.groupAfterSaleStatus && (order.groupAfterSaleStatus.includes('NOT_APPLIED')|| order.groupAfterSaleStatus.includes('PART_AFTER_SALE'))"
|
||||||
|
@click="applyAfterSale(order.orderItems)" size="small">申请售后</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -154,6 +152,21 @@ export default {
|
|||||||
this.getList();
|
this.getList();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 退款状态枚举
|
||||||
|
refundPriceList(status) {
|
||||||
|
switch (status) {
|
||||||
|
case 'ALL_REFUND':
|
||||||
|
return "全部退款";
|
||||||
|
case 'PART_REFUND':
|
||||||
|
return "部分退款";
|
||||||
|
case 'NO_REFUND':
|
||||||
|
return "";
|
||||||
|
case 'REFUNDING':
|
||||||
|
return "退款中";
|
||||||
|
default:
|
||||||
|
return "";
|
||||||
|
}
|
||||||
|
},
|
||||||
goodsDetail (skuId, goodsId) {
|
goodsDetail (skuId, goodsId) {
|
||||||
// 跳转商品详情
|
// 跳转商品详情
|
||||||
let routeUrl = this.$router.resolve({
|
let routeUrl = this.$router.resolve({
|
||||||
@@ -180,14 +193,7 @@ export default {
|
|||||||
}
|
}
|
||||||
this.getList()
|
this.getList()
|
||||||
},
|
},
|
||||||
// 跳转店铺首页
|
|
||||||
shopPage (id) {
|
|
||||||
let routeUrl = this.$router.resolve({
|
|
||||||
path: '/Merchant',
|
|
||||||
query: { id: id }
|
|
||||||
});
|
|
||||||
window.open(routeUrl.href, '_blank');
|
|
||||||
},
|
|
||||||
orderDetail (sn) {
|
orderDetail (sn) {
|
||||||
// 跳转订单详情
|
// 跳转订单详情
|
||||||
this.$router.push({ name: 'OrderDetail', query: {sn} });
|
this.$router.push({ name: 'OrderDetail', query: {sn} });
|
||||||
@@ -206,7 +212,7 @@ export default {
|
|||||||
applyAfterSale (goodsItem) { // 申请售后
|
applyAfterSale (goodsItem) { // 申请售后
|
||||||
let arr = []
|
let arr = []
|
||||||
goodsItem.forEach(e => {
|
goodsItem.forEach(e => {
|
||||||
if (e.afterSaleStatus === 'NOT_APPLIED') {
|
if (e.afterSaleStatus === 'NOT_APPLIED'|| e.afterSaleStatus === 'PART_AFTER_SALE') {
|
||||||
arr.push(e)
|
arr.push(e)
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -376,4 +382,9 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.btns{
|
||||||
|
>*{
|
||||||
|
margin: 4px 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -30,6 +30,7 @@
|
|||||||
size="small"
|
size="small"
|
||||||
>取消订单</Button
|
>取消订单</Button
|
||||||
>
|
>
|
||||||
|
<Button v-if="order.allowOperationVO.showLogistics || orderPackage.length > 0 || logistics" type="info" @click="logisticsList()" size="small">查看物流</Button>
|
||||||
</Card>
|
</Card>
|
||||||
<p class="verificationCode" v-if="order.order.verificationCode">
|
<p class="verificationCode" v-if="order.order.verificationCode">
|
||||||
核验码:<span>{{ order.order.verificationCode }}</span>
|
核验码:<span>{{ order.order.verificationCode }}</span>
|
||||||
@@ -53,7 +54,7 @@
|
|||||||
></Step>
|
></Step>
|
||||||
</Steps>
|
</Steps>
|
||||||
</div>
|
</div>
|
||||||
<div class="order-card">
|
<div class="order-card" v-if="order.order.deliveryMethod === 'LOGISTICS' && order.order.orderType !== 'VIRTUAL'">
|
||||||
<h3>收货人信息</h3>
|
<h3>收货人信息</h3>
|
||||||
<p>收货人:{{ order.order.consigneeName }}</p>
|
<p>收货人:{{ order.order.consigneeName }}</p>
|
||||||
<p>手机号码:{{ order.order.consigneeMobile | secrecyMobile }}</p>
|
<p>手机号码:{{ order.order.consigneeMobile | secrecyMobile }}</p>
|
||||||
@@ -62,15 +63,20 @@
|
|||||||
{{ order.order.consigneeDetail }}
|
{{ order.order.consigneeDetail }}
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="order-card" v-if="order.order.deliveryMethod === 'SELF_PICK_UP'">
|
||||||
|
<h3>自提点信息</h3>
|
||||||
|
<p>自提点名称:{{ order.order.storeAddressPath }}</p>
|
||||||
|
<p>联系方式:{{ order.order.storeAddressMobile }}</p>
|
||||||
|
</div>
|
||||||
<div class="order-card">
|
<div class="order-card">
|
||||||
<h3>付款信息</h3>
|
<h3>付款信息</h3>
|
||||||
<p>支付方式:{{ order.paymentMethodValue }}</p>
|
<p>支付方式:{{ order.paymentMethodValue }}</p>
|
||||||
<p>付款状态:{{ order.payStatusValue }}</p>
|
<p>付款状态:{{ order.payStatusValue }}</p>
|
||||||
</div>
|
</div>
|
||||||
<div class="order-card" v-if="!order.order.verificationCode">
|
<div class="order-card" v-if="!order.order.verificationCode && order.order.orderType !== 'VIRTUAL'">
|
||||||
<h3>配送信息</h3>
|
<h3>配送信息</h3>
|
||||||
<p>配送方式:{{ order.deliveryMethodValue }}</p>
|
<p>配送方式:{{ order.deliveryMethodValue }}</p>
|
||||||
<p>配送状态:{{ order.deliverStatusValue }}</p>
|
<p v-if="order.order.deliveryMethod === 'LOGISTICS'">配送状态:{{ order.deliverStatusValue }}</p>
|
||||||
<p v-if="logistics">
|
<p v-if="logistics">
|
||||||
物流信息:{{ logistics.shipper || "暂无物流信息" }}
|
物流信息:{{ logistics.shipper || "暂无物流信息" }}
|
||||||
</p>
|
</p>
|
||||||
@@ -89,7 +95,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="order-card" v-if="order.order.payStatus === 'PAID'">
|
<div class="order-card" v-if="order.order.payStatus === 'PAID'">
|
||||||
<h3>发票信息</h3>
|
<h3>发票信息</h3>
|
||||||
<template v-if="order.order.needReceipt">
|
<template v-if="order.order.needReceipt && order.receipt">
|
||||||
<p>发票抬头:{{ order.receipt.receiptTitle }}</p>
|
<p>发票抬头:{{ order.receipt.receiptTitle }}</p>
|
||||||
<p>发票内容:{{ order.receipt.receiptContent }}</p>
|
<p>发票内容:{{ order.receipt.receiptContent }}</p>
|
||||||
<p v-if="order.receipt.taxpayerId">
|
<p v-if="order.receipt.taxpayerId">
|
||||||
@@ -100,18 +106,16 @@
|
|||||||
</div>
|
</div>
|
||||||
<!-- 订单商品 -->
|
<!-- 订单商品 -->
|
||||||
<div class="goods">
|
<div class="goods">
|
||||||
<div class="shop-name">
|
|
||||||
<span @click="shopPage(order.order.storeId)">{{
|
|
||||||
order.order.storeName
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
<table>
|
<table>
|
||||||
<thead>
|
<thead>
|
||||||
<tr>
|
<tr>
|
||||||
<th width="40%">商品</th>
|
<th width="30%">商品</th>
|
||||||
<th width="20%">货号</th>
|
<th width="15%">货号</th>
|
||||||
<th width="10%">单价</th>
|
<th width="10%">单价</th>
|
||||||
<th width="10%">数量</th>
|
<th width="5%">数量</th>
|
||||||
|
<th width="10%">退款状态</th>
|
||||||
|
<th width="10%">实际退款金额</th>
|
||||||
<th width="10%">小计</th>
|
<th width="10%">小计</th>
|
||||||
<th width="10%">操作</th>
|
<th width="10%">操作</th>
|
||||||
</tr>
|
</tr>
|
||||||
@@ -136,6 +140,8 @@
|
|||||||
<td>{{ goods.id }}</td>
|
<td>{{ goods.id }}</td>
|
||||||
<td>{{ goods.goodsPrice | unitPrice("¥") }}</td>
|
<td>{{ goods.goodsPrice | unitPrice("¥") }}</td>
|
||||||
<td>{{ goods.num }}</td>
|
<td>{{ goods.num }}</td>
|
||||||
|
<td>{{refundPriceList(goods.isRefund)}}</td>
|
||||||
|
<td>{{ goods.refundPrice | unitPrice("¥") }}</td>
|
||||||
<td>{{ (goods.goodsPrice * goods.num) | unitPrice("¥") }}</td>
|
<td>{{ (goods.goodsPrice * goods.num) | unitPrice("¥") }}</td>
|
||||||
<td>
|
<td>
|
||||||
<Button
|
<Button
|
||||||
@@ -179,7 +185,7 @@
|
|||||||
><span>{{ order.order.goodsPrice | unitPrice("¥") }}</span
|
><span>{{ order.order.goodsPrice | unitPrice("¥") }}</span
|
||||||
><br />
|
><br />
|
||||||
</div>
|
</div>
|
||||||
<div>
|
<div v-if="order.order.orderType !== 'VIRTUAL'">
|
||||||
<span>运费:</span
|
<span>运费:</span
|
||||||
><span>+{{ order.order.freightPrice | unitPrice("¥") }}</span
|
><span>+{{ order.order.freightPrice | unitPrice("¥") }}</span
|
||||||
><br />
|
><br />
|
||||||
@@ -196,6 +202,10 @@
|
|||||||
<span>活动优惠:</span
|
<span>活动优惠:</span
|
||||||
><span>-{{ order.order.discountPrice | unitPrice("¥") }}</span>
|
><span>-{{ order.order.discountPrice | unitPrice("¥") }}</span>
|
||||||
</div>
|
</div>
|
||||||
|
<div v-if="order.order.priceDetailDTO.updatePrice">
|
||||||
|
<span>修改价格:</span
|
||||||
|
><span>{{ order.order.priceDetailDTO.updatePrice | unitPrice("¥") }}</span>
|
||||||
|
</div>
|
||||||
<div>
|
<div>
|
||||||
<span>应付金额:</span>
|
<span>应付金额:</span>
|
||||||
<span class="actrual-price">{{
|
<span class="actrual-price">{{
|
||||||
@@ -221,6 +231,70 @@
|
|||||||
</Radio>
|
</Radio>
|
||||||
</RadioGroup>
|
</RadioGroup>
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
||||||
|
<!--查询物流-->
|
||||||
|
<Modal v-model="logisticsModal" width="40">
|
||||||
|
<p slot="header"><span>查询物流</span></p>
|
||||||
|
<div class="layui-layer-wrap">
|
||||||
|
<dl>
|
||||||
|
<dt>订单号:</dt>
|
||||||
|
<dd><div class="text-box">{{ order.order.sn }}</div></dd>
|
||||||
|
</dl>
|
||||||
|
</div>
|
||||||
|
<div v-if="orderPackage.length > 0" v-for="(packageItem, packageIndex) in orderPackage" :key="packageIndex">
|
||||||
|
<div class="layui-layer-wrap">
|
||||||
|
<dl><dt>物流公司:</dt>
|
||||||
|
<dd><div class="text-box">{{ packageItem.logisticsName }}</div></dd>
|
||||||
|
</dl>
|
||||||
|
<dl><dt>快递单号:</dt>
|
||||||
|
<dd><div nctype="ordersSn" class="text-box">{{ packageItem.logisticsNo }}</div></dd>
|
||||||
|
</dl>
|
||||||
|
<div class="div-express-log">
|
||||||
|
<ul class="express-log express-log-name">
|
||||||
|
<li v-for="(item, index) in packageItem.orderPackageItemList" :key="index">
|
||||||
|
<span class="time" style="width: 50%;"><span>商品名称:</span><span>{{ item.goodsName }}</span></span>
|
||||||
|
<span class="time" style="width: 30%;"><span>发货时间:</span><span>{{ item.logisticsTime }}</span></span>
|
||||||
|
<span class="time" style="width: 20%;"><span>发货数量:</span><span>{{ item.deliverNumber }}</span></span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<div class="div-express-log" style="overflow: hidden;">
|
||||||
|
<ul class="express-log" v-if="packageItem.traces && packageItem.traces.traces">
|
||||||
|
<li v-for="(item, index) in packageItem.traces.traces" :key="index">
|
||||||
|
<span class="time">{{ item.AcceptTime || item.acceptTime }}</span>
|
||||||
|
<span class="detail">{{ item.AcceptStation || item.remark }}</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<ul class="express-log" v-else><li>暂无物流信息</li></ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div v-if = "orderPackage.length == 0 && logistics">
|
||||||
|
<div class="layui-layer-wrap">
|
||||||
|
<dl>
|
||||||
|
<dt>物流公司:</dt>
|
||||||
|
<dd><div class="text-box">{{ logistics.shipper }}</div></dd>
|
||||||
|
</dl>
|
||||||
|
<dl>
|
||||||
|
<dt>快递单号:</dt>
|
||||||
|
<dd><div nctype="ordersSn" class="text-box">{{ logistics.logisticCode }}</div></dd>
|
||||||
|
</dl>
|
||||||
|
<div class="div-express-log">
|
||||||
|
<ul class="express-log" v-if="logistics && logistics.traces">
|
||||||
|
<li v-for="(item, index) in logistics.traces" :key="index">
|
||||||
|
<span class="time">{{ item.AcceptTime }}</span>
|
||||||
|
<span class="detail">{{ item.AcceptStation }}</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
<ul class="express-log" v-else><li>暂无物流信息</li></ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div slot="footer" style="text-align: right">
|
||||||
|
<Button @click="logisticsModal = false">取消</Button>
|
||||||
|
</div>
|
||||||
|
</Modal>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
@@ -229,6 +303,7 @@ import {
|
|||||||
getTraces,
|
getTraces,
|
||||||
sureReceived,
|
sureReceived,
|
||||||
cancelOrder,
|
cancelOrder,
|
||||||
|
getPackage
|
||||||
} from "@/api/order.js";
|
} from "@/api/order.js";
|
||||||
import { afterSaleReason } from "@/api/member";
|
import { afterSaleReason } from "@/api/member";
|
||||||
export default {
|
export default {
|
||||||
@@ -245,9 +320,27 @@ export default {
|
|||||||
},
|
},
|
||||||
cancelAvail: false, // 取消订单modal控制
|
cancelAvail: false, // 取消订单modal控制
|
||||||
cancelReason: [], // 取消订单原因
|
cancelReason: [], // 取消订单原因
|
||||||
|
orderPackage: [],
|
||||||
|
packageTraceList: [],
|
||||||
|
logisticsModal: false,
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 退款状态枚举
|
||||||
|
refundPriceList(status) {
|
||||||
|
switch (status) {
|
||||||
|
case 'ALL_REFUND':
|
||||||
|
return "全部退款";
|
||||||
|
case 'PART_REFUND':
|
||||||
|
return "部分退款";
|
||||||
|
case 'NO_REFUND':
|
||||||
|
return "未退款";
|
||||||
|
case 'REFUNDING':
|
||||||
|
return "退款中";
|
||||||
|
default:
|
||||||
|
return "未退款";
|
||||||
|
}
|
||||||
|
},
|
||||||
goodsDetail(skuId, goodsId) {
|
goodsDetail(skuId, goodsId) {
|
||||||
// 跳转商品详情
|
// 跳转商品详情
|
||||||
let routeUrl = this.$router.resolve({
|
let routeUrl = this.$router.resolve({
|
||||||
@@ -270,9 +363,20 @@ export default {
|
|||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.order = res.result;
|
this.order = res.result;
|
||||||
this.progressList = res.result.orderLogs;
|
this.progressList = res.result.orderLogs;
|
||||||
|
if (this.order.order.deliveryMethod === 'LOGISTICS') {
|
||||||
|
this.getOrderPackage(this.order.order.sn);
|
||||||
|
this.traces();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
getOrderPackage(sn) {
|
||||||
|
getPackage(sn).then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
this.orderPackage = res.result
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
traces() {
|
traces() {
|
||||||
// 物流信息
|
// 物流信息
|
||||||
getTraces(this.$route.query.sn).then((res) => {
|
getTraces(this.$route.query.sn).then((res) => {
|
||||||
@@ -281,6 +385,15 @@ export default {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
logisticsList() {
|
||||||
|
this.logisticsModal = true;
|
||||||
|
this.packageTraceList = this.orderPackage;
|
||||||
|
// getTracesList(this.order.order.sn).then((res) => {
|
||||||
|
// if (res.success && res.result != null) {
|
||||||
|
// this.packageTraceList = res.result;
|
||||||
|
// }
|
||||||
|
// });
|
||||||
|
},
|
||||||
received(sn) {
|
received(sn) {
|
||||||
// 确认收货
|
// 确认收货
|
||||||
sureReceived(sn).then((res) => {
|
sureReceived(sn).then((res) => {
|
||||||
@@ -336,7 +449,6 @@ export default {
|
|||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.getDetail();
|
this.getDetail();
|
||||||
this.traces();
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -374,24 +486,6 @@ export default {
|
|||||||
top: 20px;
|
top: 20px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
/** 店铺名称 */
|
|
||||||
.shop-name {
|
|
||||||
margin: 15px 0;
|
|
||||||
span {
|
|
||||||
color: #438cde;
|
|
||||||
cursor: pointer;
|
|
||||||
&:hover {
|
|
||||||
color: $theme_color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
.ivu-icon {
|
|
||||||
color: #ff8f23;
|
|
||||||
cursor: pointer;
|
|
||||||
&:hover {
|
|
||||||
color: $theme_color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
/** 商品列表 */
|
/** 商品列表 */
|
||||||
table {
|
table {
|
||||||
border: 1px solid #ddd;
|
border: 1px solid #ddd;
|
||||||
@@ -456,4 +550,120 @@ table {
|
|||||||
.progress {
|
.progress {
|
||||||
margin: 15px 0;
|
margin: 15px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.layui-layer-wrap {
|
||||||
|
dl {
|
||||||
|
border-top: solid 1px #f5f5f5;
|
||||||
|
margin-top: -1px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
dt {
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 28px;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 8px 1% 8px 0;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
dd {
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 28px;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 8px 0 8px 8px;
|
||||||
|
border-left: solid 1px #f5f5f5;
|
||||||
|
|
||||||
|
.text-box {
|
||||||
|
line-height: 40px;
|
||||||
|
color: #333;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.layui-layer-wrap > .div-express-log {
|
||||||
|
max-height: 300px;
|
||||||
|
}
|
||||||
|
/deep/ .layui-layer-wrap > .div-express-log::-webkit-scrollbar{
|
||||||
|
width: 1px;
|
||||||
|
height: 5px;
|
||||||
|
}
|
||||||
|
/deep/ .layui-layer-wrap > .div-express-log::-webkit-scrollbar-thumb{
|
||||||
|
border-radius: 1em;
|
||||||
|
background-color: rgba(50,50,50,.3);
|
||||||
|
}
|
||||||
|
/deep/ .layui-layer-wrap > .div-express-log::-webkit-scrollbar-track{
|
||||||
|
border-radius: 1em;
|
||||||
|
background-color: rgba(50,50,50,.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.div-express-log {
|
||||||
|
max-height: 300px;
|
||||||
|
border: solid 1px #e7e7e7;
|
||||||
|
background: #fafafa;
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.express-log {
|
||||||
|
/*margin: 5px -10px 5px 5px;*/
|
||||||
|
padding: 10px;
|
||||||
|
list-style-type: none;
|
||||||
|
|
||||||
|
.time {
|
||||||
|
width: 30%;
|
||||||
|
display: inline-block;
|
||||||
|
float: left;
|
||||||
|
}
|
||||||
|
|
||||||
|
.detail {
|
||||||
|
width: 60%;
|
||||||
|
margin-left: 30px;
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
li {
|
||||||
|
line-height: 30px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.express-log-name {
|
||||||
|
li {
|
||||||
|
display: flex;
|
||||||
|
span {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.layui-layer-wrap {
|
||||||
|
dl {
|
||||||
|
border-top: solid 1px #f5f5f5;
|
||||||
|
margin-top: -1px;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
dt {
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 28px;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 8px 1% 8px 0;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
dd {
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 28px;
|
||||||
|
display: inline-block;
|
||||||
|
padding: 8px 0 8px 8px;
|
||||||
|
border-left: solid 1px #f5f5f5;
|
||||||
|
|
||||||
|
.text-box {
|
||||||
|
line-height: 40px;
|
||||||
|
color: #333;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -6,120 +6,139 @@
|
|||||||
<li v-for="(item, index) in list" class="coupon-item" :key="index">
|
<li v-for="(item, index) in list" class="coupon-item" :key="index">
|
||||||
<div class="c-left">
|
<div class="c-left">
|
||||||
<div>
|
<div>
|
||||||
<span v-if="item.couponType === 'PRICE'" class="fontsize_12 global_color">¥<span class="price">{{item.price | unitPrice}}</span></span>
|
<span
|
||||||
<span v-if="item.couponType === 'DISCOUNT'" class="fontsize_12 global_color"><span class="price">{{item.discount}}</span>折</span>
|
v-if="item.couponType === 'PRICE'"
|
||||||
|
class="fontsize_12 global_color"
|
||||||
|
>¥<span class="price">{{ item.price | unitPrice }}</span></span
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
v-if="item.couponType === 'DISCOUNT'"
|
||||||
|
class="fontsize_12 global_color"
|
||||||
|
><span class="price">{{ item.discount }}</span
|
||||||
|
>折</span
|
||||||
|
>
|
||||||
<span class="describe">满{{ item.consumeThreshold }}元可用</span>
|
<span class="describe">满{{ item.consumeThreshold }}元可用</span>
|
||||||
</div>
|
</div>
|
||||||
<p>使用范围:{{ useScope(item.scopeType, item.storeName) }}</p>
|
<p>使用范围:{{ useScope(item.scopeType, item.storeName) }}</p>
|
||||||
<p>有效期:{{ item.endTime }}</p>
|
<p>有效期:{{ item.endTime }}</p>
|
||||||
</div>
|
</div>
|
||||||
<b></b>
|
<b></b>
|
||||||
<a class="c-right" :class="{'canot-use':params.memberCouponStatus !== 'NEW'}" @click="go(item)">立即使用</a>
|
<a
|
||||||
|
class="c-right"
|
||||||
|
:class="{ 'canot-use': params.memberCouponStatus !== 'NEW' }"
|
||||||
|
@click="go(item)"
|
||||||
|
>立即使用</a
|
||||||
|
>
|
||||||
<i class="circle-top"></i>
|
<i class="circle-top"></i>
|
||||||
<i class="circle-bottom"></i>
|
<i class="circle-bottom"></i>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
<Page :total="total" @on-change="changePageNum"
|
<Page
|
||||||
|
:total="total"
|
||||||
|
@on-change="changePageNum"
|
||||||
class="pageration"
|
class="pageration"
|
||||||
@on-page-size-change="changePageSize"
|
@on-page-size-change="changePageSize"
|
||||||
:page-size="params.pageSize"
|
:page-size="params.pageSize"
|
||||||
show-total
|
show-total
|
||||||
show-sizer>
|
show-sizer
|
||||||
|
>
|
||||||
</Page>
|
</Page>
|
||||||
<Spin v-if="loading" fix></Spin>
|
<Spin v-if="loading" fix></Spin>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { memberCouponList } from '@/api/member.js';
|
import { memberCouponList } from "@/api/member.js";
|
||||||
export default {
|
export default {
|
||||||
name: 'Coupons',
|
name: "Coupons",
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
statusNameList: [ // 优惠券状态
|
statusNameList: [
|
||||||
'未使用',
|
// 优惠券状态
|
||||||
'已使用',
|
"未使用",
|
||||||
'已过期'
|
"已使用",
|
||||||
|
"已过期",
|
||||||
],
|
],
|
||||||
statusList: ['NEW', 'USED', 'EXPIRE'], // 优惠券状态
|
statusList: ["NEW", "USED", "EXPIRE"], // 优惠券状态
|
||||||
loading: false, // 列表加载状态
|
loading: false, // 列表加载状态
|
||||||
params: { // 请求参数
|
params: {
|
||||||
|
// 请求参数
|
||||||
pageNumber: 1,
|
pageNumber: 1,
|
||||||
pageSize: 10,
|
pageSize: 10,
|
||||||
memberCouponStatus: 'NEW'
|
memberCouponStatus: "NEW",
|
||||||
},
|
},
|
||||||
total: 0, // 优惠券总数
|
total: 0, // 优惠券总数
|
||||||
list: [] // 优惠券列表
|
list: [], // 优惠券列表
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
getList () { // 获取优惠券列表
|
getList() {
|
||||||
this.loading = true
|
// 获取优惠券列表
|
||||||
memberCouponList(this.params).then(res => {
|
this.loading = true;
|
||||||
this.loading = false
|
memberCouponList(this.params).then((res) => {
|
||||||
|
this.loading = false;
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.list = res.result.records
|
this.list = res.result.records;
|
||||||
this.total = res.result.total
|
this.total = res.result.total;
|
||||||
}
|
}
|
||||||
})
|
});
|
||||||
},
|
},
|
||||||
// 切换优惠券状态
|
// 切换优惠券状态
|
||||||
change(index) {
|
change(index) {
|
||||||
this.params.memberCouponStatus = this.statusList[index]
|
this.params.memberCouponStatus = this.statusList[index];
|
||||||
this.params.pageNumber = 1;
|
this.params.pageNumber = 1;
|
||||||
this.getList()
|
this.getList();
|
||||||
},
|
},
|
||||||
go (item) { // 根据使用条件跳转商品列表页面
|
go(item) {
|
||||||
if (this.params.memberCouponStatus !== 'NEW') return;
|
// 根据使用条件跳转商品列表页面
|
||||||
|
if (this.params.memberCouponStatus !== "NEW") return;
|
||||||
|
|
||||||
if (item.storeId !== '0') {
|
this.$router.push({
|
||||||
this.$router.push({path: '/merchant', query: {id: item.storeId}})
|
path: "/goodsList",
|
||||||
} else {
|
query: { promotionsId: item.couponId, promotionType: "COUPON" },
|
||||||
if (item.scopeType === 'PORTION_GOODS_CATEGORY') {
|
});
|
||||||
this.$router.push({path: '/goodsList', query: {categoryId: item.scopeId}})
|
|
||||||
} else {
|
|
||||||
this.$router.push({path: '/goodsList'})
|
|
||||||
}
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
|
|
||||||
changePageNum (val) { // 分页改变页码
|
changePageNum(val) {
|
||||||
|
// 分页改变页码
|
||||||
this.params.pageNumber = val;
|
this.params.pageNumber = val;
|
||||||
this.getList()
|
this.getList();
|
||||||
},
|
},
|
||||||
|
|
||||||
changePageSize (val) { // 分页改变页数
|
changePageSize(val) {
|
||||||
|
// 分页改变页数
|
||||||
this.params.pageNumber = 1;
|
this.params.pageNumber = 1;
|
||||||
this.params.pageSize = val;
|
this.params.pageSize = val;
|
||||||
this.getList()
|
this.getList();
|
||||||
},
|
},
|
||||||
|
|
||||||
useScope (type, storeName) { // 根据字段返回 优惠券适用范围
|
useScope(type, storeName) {
|
||||||
let shop = '平台';
|
// 根据字段返回 优惠券适用范围
|
||||||
let goods = '全部商品'
|
let shop = "平台";
|
||||||
if (storeName !== 'platform') shop = storeName
|
let goods = "全部商品";
|
||||||
|
if (storeName !== "platform") shop = storeName;
|
||||||
switch (type) {
|
switch (type) {
|
||||||
case 'ALL':
|
case "ALL":
|
||||||
goods = '全部商品'
|
goods = "全部商品";
|
||||||
break;
|
break;
|
||||||
case 'PORTION_GOODS':
|
case "PORTION_GOODS":
|
||||||
goods = '部分商品'
|
goods = "部分商品";
|
||||||
break;
|
break;
|
||||||
case 'PORTION_GOODS_CATEGORY':
|
case "PORTION_GOODS_CATEGORY":
|
||||||
goods = '部分分类商品'
|
goods = "部分分类商品";
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
return `${shop}${goods}可用`
|
return `${shop}${goods}可用`;
|
||||||
}
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
this.getList()
|
this.getList();
|
||||||
}
|
},
|
||||||
}
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
@import '../../../assets/styles/coupon.scss';
|
@import "../../../assets/styles/coupon.scss";
|
||||||
.coupon-item {
|
.coupon-item {
|
||||||
height: 125px;
|
height: 125px;
|
||||||
.c-left {
|
.c-left {
|
||||||
|
|||||||
@@ -22,19 +22,19 @@
|
|||||||
<div>
|
<div>
|
||||||
<Form
|
<Form
|
||||||
ref="formData"
|
ref="formData"
|
||||||
:model="formData"
|
|
||||||
label-position="left"
|
|
||||||
:label-width="100"
|
:label-width="100"
|
||||||
|
:model="formData"
|
||||||
:rules="formValidate"
|
:rules="formValidate"
|
||||||
|
label-position="left"
|
||||||
>
|
>
|
||||||
<FormItem label="充值金额" prop="price">
|
<FormItem label="充值金额" prop="price">
|
||||||
<Input v-model="formData.price" size="large" number maxlength="9"
|
<Input v-model="formData.price" maxlength="9" number size="large"
|
||||||
><span slot="append">元</span></Input>
|
><span slot="append">元</span></Input>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
</Form>
|
</Form>
|
||||||
</div>
|
</div>
|
||||||
<div slot="footer" style="text-align: center">
|
<div slot="footer" style="text-align: center">
|
||||||
<Button type="success" size="large" @click="rechargePrice">充值</Button>
|
<Button size="large" type="success" @click="rechargePrice">充值</Button>
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
<!-- 提现申请 -->
|
<!-- 提现申请 -->
|
||||||
@@ -46,23 +46,45 @@
|
|||||||
<div>
|
<div>
|
||||||
<Form
|
<Form
|
||||||
ref="withdrawApplyFormData"
|
ref="withdrawApplyFormData"
|
||||||
|
:label-width="120"
|
||||||
:model="withdrawApplyFormData"
|
:model="withdrawApplyFormData"
|
||||||
label-position="left"
|
|
||||||
:label-width="100"
|
|
||||||
:rules="withdrawApplyFormValidate"
|
:rules="withdrawApplyFormValidate"
|
||||||
>
|
>
|
||||||
|
<FormItem label="提现类型" prop="type">
|
||||||
|
<Select v-model="withdrawApplyFormData.type" disabled>
|
||||||
|
<Option value="ALI">支付宝</Option>
|
||||||
|
<Option value="WECHAT">微信</Option>
|
||||||
|
</Select>
|
||||||
|
</FormItem>
|
||||||
<FormItem label="提现金额" prop="price">
|
<FormItem label="提现金额" prop="price">
|
||||||
<Input
|
<Input
|
||||||
v-model="withdrawApplyFormData.price"
|
v-model="withdrawApplyFormData.price"
|
||||||
size="large"
|
|
||||||
number
|
|
||||||
maxlength="9"
|
maxlength="9"
|
||||||
|
number
|
||||||
|
size="large"
|
||||||
><span slot="append">元</span></Input>
|
><span slot="append">元</span></Input>
|
||||||
|
<span style="color: red">最低提现金额 {{ withdrawApplyFormData.minPrice }}元</span>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem v-if="withdrawApplyFormData.type === 'ALI'" label="真实姓名" prop="realName">
|
||||||
|
<Input
|
||||||
|
v-model="withdrawApplyFormData.realName"
|
||||||
|
maxlength="9"
|
||||||
|
number
|
||||||
|
size="large"
|
||||||
|
></Input>
|
||||||
|
</FormItem>
|
||||||
|
<FormItem v-if="withdrawApplyFormData.type === 'ALI'" label="第三方登录账号" prop="connectNumber">
|
||||||
|
<Input
|
||||||
|
v-model="withdrawApplyFormData.connectNumber"
|
||||||
|
maxlength="9"
|
||||||
|
number
|
||||||
|
size="large"
|
||||||
|
></Input>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
</Form>
|
</Form>
|
||||||
</div>
|
</div>
|
||||||
<div slot="footer" style="text-align: center">
|
<div slot="footer" style="text-align: center">
|
||||||
<Button type="success" size="large" @click="withdrawal">提现</Button>
|
<Button size="large" type="success" @click="withdrawal">提现</Button>
|
||||||
</div>
|
</div>
|
||||||
</Modal>
|
</Modal>
|
||||||
<!-- 余额日志 -->
|
<!-- 余额日志 -->
|
||||||
@@ -73,15 +95,15 @@
|
|||||||
<div class="page-size">
|
<div class="page-size">
|
||||||
<Page
|
<Page
|
||||||
:current="walletForm.pageNumber"
|
:current="walletForm.pageNumber"
|
||||||
:total="logColumnsData.total"
|
|
||||||
:page-size="walletForm.pageSize"
|
:page-size="walletForm.pageSize"
|
||||||
|
:page-size-opts="[10, 20, 50]"
|
||||||
|
:total="logColumnsData.total"
|
||||||
|
show-sizer
|
||||||
|
show-total
|
||||||
|
size="small"
|
||||||
|
transfer
|
||||||
@on-change="changePage"
|
@on-change="changePage"
|
||||||
@on-page-size-change="changePageSize"
|
@on-page-size-change="changePageSize"
|
||||||
:page-size-opts="[10, 20, 50]"
|
|
||||||
size="small"
|
|
||||||
show-total
|
|
||||||
show-sizer
|
|
||||||
transfer
|
|
||||||
></Page>
|
></Page>
|
||||||
</div>
|
</div>
|
||||||
</TabPane>
|
</TabPane>
|
||||||
@@ -95,15 +117,15 @@
|
|||||||
<div class="page-size">
|
<div class="page-size">
|
||||||
<Page
|
<Page
|
||||||
:current="rechargeForm.pageNumber"
|
:current="rechargeForm.pageNumber"
|
||||||
:total="rechargeListData.total"
|
|
||||||
:page-size="rechargeForm.pageSize"
|
:page-size="rechargeForm.pageSize"
|
||||||
|
:page-size-opts="[10, 20, 50]"
|
||||||
|
:total="rechargeListData.total"
|
||||||
|
show-sizer
|
||||||
|
show-total
|
||||||
|
size="small"
|
||||||
|
transfer
|
||||||
@on-change="rechargeChangePage"
|
@on-change="rechargeChangePage"
|
||||||
@on-page-size-change="rechargeChangePageSize"
|
@on-page-size-change="rechargeChangePageSize"
|
||||||
:page-size-opts="[10, 20, 50]"
|
|
||||||
size="small"
|
|
||||||
show-total
|
|
||||||
show-sizer
|
|
||||||
transfer
|
|
||||||
></Page>
|
></Page>
|
||||||
</div>
|
</div>
|
||||||
</TabPane>
|
</TabPane>
|
||||||
@@ -117,15 +139,15 @@
|
|||||||
<div class="page-size">
|
<div class="page-size">
|
||||||
<Page
|
<Page
|
||||||
:current="withdrawApplyForm.pageNumber"
|
:current="withdrawApplyForm.pageNumber"
|
||||||
:total="withdrawApplyColumnsListData.total"
|
|
||||||
:page-size="withdrawApplyForm.pageSize"
|
:page-size="withdrawApplyForm.pageSize"
|
||||||
|
:page-size-opts="[10, 20, 50]"
|
||||||
|
:total="withdrawApplyColumnsListData.total"
|
||||||
|
show-sizer
|
||||||
|
show-total
|
||||||
|
size="small"
|
||||||
|
transfer
|
||||||
@on-change="withdrawChangePage"
|
@on-change="withdrawChangePage"
|
||||||
@on-page-size-change="withdrawChangePageSize"
|
@on-page-size-change="withdrawChangePageSize"
|
||||||
:page-size-opts="[10, 20, 50]"
|
|
||||||
size="small"
|
|
||||||
show-total
|
|
||||||
show-sizer
|
|
||||||
transfer
|
|
||||||
></Page>
|
></Page>
|
||||||
</div>
|
</div>
|
||||||
</TabPane>
|
</TabPane>
|
||||||
@@ -134,14 +156,9 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import {
|
import {getDepositLog, getMembersWallet, getRecharge, getWithdrawApply, recharge, withdrawalApply} from '@/api/member';
|
||||||
getMembersWallet,
|
import {withdrawalSettingVO} from "@/api/pay";
|
||||||
getDepositLog,
|
|
||||||
getRecharge,
|
|
||||||
getWithdrawApply,
|
|
||||||
recharge,
|
|
||||||
withdrawalApply
|
|
||||||
} from '@/api/member';
|
|
||||||
export default {
|
export default {
|
||||||
name: 'MoneyManagement',
|
name: 'MoneyManagement',
|
||||||
data() {
|
data() {
|
||||||
@@ -157,7 +174,11 @@ export default {
|
|||||||
},
|
},
|
||||||
// 提现金额
|
// 提现金额
|
||||||
withdrawApplyFormData: {
|
withdrawApplyFormData: {
|
||||||
price: 1
|
price: 1,
|
||||||
|
minPrice: 1,
|
||||||
|
type: '',
|
||||||
|
realName: '',
|
||||||
|
connectNumber: '',
|
||||||
},
|
},
|
||||||
// 余额日志
|
// 余额日志
|
||||||
walletForm: {
|
walletForm: {
|
||||||
@@ -186,7 +207,13 @@ export default {
|
|||||||
message: '请输入大于0小于9999的合法提现金额',
|
message: '请输入大于0小于9999的合法提现金额',
|
||||||
trigger: 'change'
|
trigger: 'change'
|
||||||
}
|
}
|
||||||
]
|
],
|
||||||
|
realName: [
|
||||||
|
{required: true, message: '请输入真实姓名'},
|
||||||
|
],
|
||||||
|
connectNumber: [
|
||||||
|
{required: true, message: '请输入第三方登录账号'},
|
||||||
|
],
|
||||||
},
|
},
|
||||||
formValidate: {
|
formValidate: {
|
||||||
price: [
|
price: [
|
||||||
@@ -341,7 +368,11 @@ export default {
|
|||||||
if (params.row.applyStatus === 'APPLY') {
|
if (params.row.applyStatus === 'APPLY') {
|
||||||
return h('div', [h('span', {}, '申请中')]);
|
return h('div', [h('span', {}, '申请中')]);
|
||||||
} else if (params.row.applyStatus === 'VIA_AUDITING') {
|
} else if (params.row.applyStatus === 'VIA_AUDITING') {
|
||||||
|
return h('div', [h('span', {}, '审核通过')]);
|
||||||
|
} else if (params.row.applyStatus === 'SUCCESS') {
|
||||||
return h('div', [h('span', {}, '提现成功')]);
|
return h('div', [h('span', {}, '提现成功')]);
|
||||||
|
} else if (params.row.applyStatus === 'ERROR') {
|
||||||
|
return h('div', [h('span', {}, '提现失败')]);
|
||||||
} else {
|
} else {
|
||||||
return h('div', [h('span', {}, '审核拒绝')]);
|
return h('div', [h('span', {}, '审核拒绝')]);
|
||||||
}
|
}
|
||||||
@@ -460,8 +491,19 @@ export default {
|
|||||||
},
|
},
|
||||||
// 申请提现弹出框
|
// 申请提现弹出框
|
||||||
withdrawalApply() {
|
withdrawalApply() {
|
||||||
this.withdrawApplyFormData.price = 1;
|
|
||||||
this.withdrawApplyModal = true;
|
this.withdrawApplyModal = true;
|
||||||
|
this.withdrawApplyFormData.minPrice = 1;
|
||||||
|
this.withdrawApplyFormData.price = 1;
|
||||||
|
this.withdrawApplyFormData.type = '';
|
||||||
|
this.withdrawApplyFormData.realName = '';
|
||||||
|
this.withdrawApplyFormData.connectNumber = '';
|
||||||
|
withdrawalSettingVO().then((res) => {
|
||||||
|
if (res.code === 200) {
|
||||||
|
this.withdrawApplyFormData.minPrice = res.result.minPrice;
|
||||||
|
this.withdrawApplyFormData.type = res.result.type;
|
||||||
|
this.withdrawApplyFormData.price = 1;
|
||||||
|
}
|
||||||
|
});
|
||||||
},
|
},
|
||||||
// 提现
|
// 提现
|
||||||
withdrawal() {
|
withdrawal() {
|
||||||
@@ -482,25 +524,30 @@ export default {
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style lang="scss" scoped>
|
||||||
.box {
|
.box {
|
||||||
margin: 20px 0;
|
margin: 20px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.page-size {
|
.page-size {
|
||||||
margin: 15px 0px;
|
margin: 15px 0px;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: flex-end;
|
justify-content: flex-end;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.account-price {
|
.account-price {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.subTips {
|
.subTips {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.account-btns {
|
.account-btns {
|
||||||
margin: 10px 0;
|
margin: 10px 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ivu-btn {
|
.ivu-btn {
|
||||||
margin: 0 4px;
|
margin: 0 4px;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -112,7 +112,10 @@ export default {
|
|||||||
tracksList(this.params).then((res) => {
|
tracksList(this.params).then((res) => {
|
||||||
this.spinShow = false;
|
this.spinShow = false;
|
||||||
if (res.success && res.result.records.length) {
|
if (res.success && res.result.records.length) {
|
||||||
this.list = res.result.records;
|
this.list = res.result.records.filter(item =>{
|
||||||
|
return item != null
|
||||||
|
});
|
||||||
|
this.total = res.result.total
|
||||||
} else {
|
} else {
|
||||||
this.list = [];
|
this.list = [];
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -9,42 +9,29 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="cart-steps">
|
<div class="cart-steps">
|
||||||
<span :class="stepIndex == 1 ? 'active' : ''">1.我的购物车</span>
|
<span :class="stepIndex == 1 ? 'active' : ''">1.我的购物车</span>
|
||||||
<Icon
|
<Icon :class="stepIndex == 1 ? 'active-arrow' : ''" custom="icomoon icon-next"></Icon>
|
||||||
:class="stepIndex == 1 ? 'active-arrow' : ''"
|
|
||||||
custom="icomoon icon-next"
|
|
||||||
></Icon>
|
|
||||||
<span :class="stepIndex == 1 ? 'active' : ''">2.填写订单信息</span>
|
<span :class="stepIndex == 1 ? 'active' : ''">2.填写订单信息</span>
|
||||||
<Icon
|
<Icon :class="stepIndex == 1 ? 'active-arrow' : ''" custom="icomoon icon-next"></Icon>
|
||||||
:class="stepIndex == 1 ? 'active-arrow' : ''"
|
|
||||||
custom="icomoon icon-next"
|
|
||||||
></Icon>
|
|
||||||
<span :class="stepIndex == 2 ? 'active' : ''">3.成功提交订单</span>
|
<span :class="stepIndex == 2 ? 'active' : ''">3.成功提交订单</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<Divider />
|
<Divider />
|
||||||
<div class="content width_1200">
|
<div class="content width_1200">
|
||||||
<!-- 收货地址 -->
|
<!-- 收货地址 -->
|
||||||
<div class="address">
|
<div class="address" v-if="selectedDeliverMethod === 'LOGISTICS' && goodsType !== 'VIRTUAL_GOODS'">
|
||||||
<div class="card-head">
|
<div class="card-head">
|
||||||
<span>收货人信息</span>
|
<span>收货人信息</span>
|
||||||
<span @click="goAddressManage">管理收货人地址</span>
|
<span @click="goAddressManage">管理收货人地址</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="address-manage">
|
<div class="address-manage">
|
||||||
<div
|
<div class="address-item" v-show="moreAddr ? true : index < 3"
|
||||||
class="address-item"
|
:class="selectedAddress.id === item.id ? 'border-red' : ''" @mouseenter="showEditBtn = index"
|
||||||
v-show="moreAddr ? true : index < 3"
|
@mouseleave="showEditBtn = ''" @click="selectAddress(item)" v-for="(item, index) in addressList"
|
||||||
:class="selectedAddress.id === item.id ? 'border-red' : ''"
|
:key="index">
|
||||||
@mouseenter="showEditBtn = index"
|
|
||||||
@mouseleave="showEditBtn = ''"
|
|
||||||
@click="selectAddress(item)"
|
|
||||||
v-for="(item, index) in addressList"
|
|
||||||
:key="index"
|
|
||||||
>
|
|
||||||
<div>
|
<div>
|
||||||
<span>{{ item.name }}</span>
|
<span>{{ item.name }}</span>
|
||||||
<Tag class="ml_10" v-if="item.isDefault" color="red">默认</Tag>
|
<Tag class="ml_10" v-if="item.isDefault" color="red">默认</Tag>
|
||||||
<Tag class="ml_10" v-if="item.alias" color="warning"
|
<Tag class="ml_10" v-if="item.alias" color="warning">{{ item.alias }}
|
||||||
>{{ item.alias }}
|
|
||||||
</Tag>
|
</Tag>
|
||||||
</div>
|
</div>
|
||||||
<div>{{ item.mobile }}</div>
|
<div>{{ item.mobile }}</div>
|
||||||
@@ -53,12 +40,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="edit-btn" v-show="showEditBtn === index">
|
<div class="edit-btn" v-show="showEditBtn === index">
|
||||||
<span @click.stop="editAddress(item.id)">修改</span>
|
<span @click.stop="editAddress(item.id)">修改</span>
|
||||||
<span
|
<span class="ml_10" v-if="!item.isDefault" @click.stop="delAddress(item)">删除</span>
|
||||||
class="ml_10"
|
|
||||||
v-if="!item.isDefault"
|
|
||||||
@click.stop="delAddress(item)"
|
|
||||||
>删除</span
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="corner-icon" v-show="selectedAddress.id === item.id">
|
<div class="corner-icon" v-show="selectedAddress.id === item.id">
|
||||||
<div></div>
|
<div></div>
|
||||||
@@ -70,49 +52,75 @@
|
|||||||
<div>添加新地址</div>
|
<div>添加新地址</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="more-addr" @click="moreAddr = !moreAddr" v-if="addressList.length > 3">
|
||||||
<div
|
|
||||||
class="more-addr"
|
|
||||||
@click="moreAddr = !moreAddr"
|
|
||||||
v-if="addressList.length > 3"
|
|
||||||
>
|
|
||||||
{{ moreAddr ? "收起地址" : "更多地址" }}
|
{{ moreAddr ? "收起地址" : "更多地址" }}
|
||||||
<Icon v-show="!moreAddr" type="md-arrow-dropdown" />
|
<Icon v-show="!moreAddr" type="md-arrow-dropdown" />
|
||||||
<Icon v-show="moreAddr" type="md-arrow-dropup" />
|
<Icon v-show="moreAddr" type="md-arrow-dropup" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div class="address" v-if="selectedDeliverMethod === 'SELF_PICK_UP'">
|
||||||
|
<div class="card-head">
|
||||||
|
<span>自提点信息</span>
|
||||||
|
</div>
|
||||||
|
<div class="address-manage">
|
||||||
|
<div class="address-item" v-show="storeMoreAddr ? true : index < 3"
|
||||||
|
:class="selectedAddress.id === item.id ? 'border-red' : ''" @mouseenter="showEditBtn = index"
|
||||||
|
@mouseleave="showEditBtn = ''" @click="selectStoreAddress(item)" v-for="(item, index) in storeAddressList"
|
||||||
|
:key="index">
|
||||||
|
<div>
|
||||||
|
<span>{{ item.addressName }}</span>
|
||||||
|
</div>
|
||||||
|
<div>{{ item.mobile }}</div>
|
||||||
|
<div>
|
||||||
|
{{ item.address | unitAddress }} {{ item.detail }}
|
||||||
|
</div>
|
||||||
|
<div class="corner-icon" v-show="selectedStoreAddress.id === item.id">
|
||||||
|
<div></div>
|
||||||
|
<Icon type="md-checkmark" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="more-addr" @click="storeMoreAddr = !storeMoreAddr" v-if="addressList.length > 3">
|
||||||
|
{{ storeMoreAddr ? "收起地址" : "更多地址" }}
|
||||||
|
<Icon v-show="!storeMoreAddr" type="md-arrow-dropdown" />
|
||||||
|
<Icon v-show="storeMoreAddr" type="md-arrow-dropup" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
</div>
|
||||||
|
<div class="goods-content" v-if="goodsType !== 'VIRTUAL_GOODS'">
|
||||||
|
<div class="card-head mt_20 mb_20">
|
||||||
|
<span>配送方式</span>
|
||||||
|
</div>
|
||||||
|
<div class="delivery-method">
|
||||||
|
|
||||||
|
<div class="method-item" v-show="moreAddr ? true : index < 3"
|
||||||
|
:class="selectedDeliverMethod === item.value ? 'border-red' : ''" @mouseenter="showEditBtn = item.value"
|
||||||
|
@mouseleave="showEditBtn = ''" @click="selectDeliverMethod(item)" v-for="(item, index) in shippingMethod"
|
||||||
|
:key="index">
|
||||||
|
<div>{{ item.label }}</div>
|
||||||
|
<div class="corner-icon" v-show="selectedDeliverMethod === item.value">
|
||||||
|
<div></div>
|
||||||
|
<Icon type="md-checkmark" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<!-- 商品信息 -->
|
<!-- 商品信息 -->
|
||||||
<div class="goods-content">
|
<div class="goods-content">
|
||||||
<div class="card-head mt_20 mb_20">
|
<div class="card-head mt_20 mb_20">
|
||||||
<span>商品信息</span>
|
<span>商品信息</span>
|
||||||
<span @click="$router.push('/cart')">返回购物车</span>
|
<span @click="$router.push('/cart')">返回购物车</span>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div class="goods-msg" v-for="(shop, shopIndex) in goodsList" :key="shopIndex">
|
||||||
class="goods-msg"
|
|
||||||
v-for="(shop, shopIndex) in goodsList"
|
|
||||||
:key="shopIndex"
|
|
||||||
>
|
|
||||||
<div v-if="shop.checked">
|
<div v-if="shop.checked">
|
||||||
<div class="shop-name">
|
|
||||||
<span>
|
|
||||||
<span class="hover-color" @click="goShopPage(shop.storeId)">{{
|
|
||||||
shop.storeName
|
|
||||||
}}</span
|
|
||||||
>
|
|
||||||
</span>
|
|
||||||
</div>
|
|
||||||
<div class="goods-list">
|
<div class="goods-list">
|
||||||
<div
|
<div class="goods-item" v-for="(goods, goodsIndex) in shop.checkedSkuList" :key="goodsIndex">
|
||||||
class="goods-item"
|
<span class="hover-color" @click="
|
||||||
v-for="(goods, goodsIndex) in shop.checkedSkuList"
|
|
||||||
:key="goodsIndex"
|
|
||||||
>
|
|
||||||
<span
|
|
||||||
class="hover-color"
|
|
||||||
@click="
|
|
||||||
goGoodsDetail(goods.goodsSku.id, goods.goodsSku.goodsId)
|
goGoodsDetail(goods.goodsSku.id, goods.goodsSku.goodsId)
|
||||||
"
|
">
|
||||||
>
|
|
||||||
<img :src="goods.goodsSku.thumbnail" alt="" />
|
<img :src="goods.goodsSku.thumbnail" alt="" />
|
||||||
<span style="vertical-align: top">{{
|
<span style="vertical-align: top">{{
|
||||||
goods.goodsSku.goodsName
|
goods.goodsSku.goodsName
|
||||||
@@ -129,16 +137,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="order-mark">
|
<div class="order-mark">
|
||||||
<Input
|
<Input type="textarea" maxlength="60" v-model="shop.remark" show-word-limit placeholder="订单备注" />
|
||||||
type="textarea"
|
<span style="font-size: 12px; color: #999">提示:请勿填写有关支付、收货、发票方面的信息</span>
|
||||||
maxlength="60"
|
|
||||||
v-model="shop.remark"
|
|
||||||
show-word-limit
|
|
||||||
placeholder="订单备注"
|
|
||||||
/>
|
|
||||||
<span style="font-size: 12px; color: #999"
|
|
||||||
>提示:请勿填写有关支付、收货、发票方面的信息</span
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -146,13 +146,9 @@
|
|||||||
<!-- 发票信息 -->
|
<!-- 发票信息 -->
|
||||||
<div class="invoice">
|
<div class="invoice">
|
||||||
<div class="card-head mt_20 mb_20">
|
<div class="card-head mt_20 mb_20">
|
||||||
<span class="relative"
|
<span class="relative">发票信息<span class="inv-tips">
|
||||||
>发票信息<span class="inv-tips">
|
<Icon type="ios-alert-outline" />开企业抬头发票须填写纳税人识别号,以免影响报销
|
||||||
<Icon
|
</span></span>
|
||||||
type="ios-alert-outline"
|
|
||||||
/>开企业抬头发票须填写纳税人识别号,以免影响报销
|
|
||||||
</span></span
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="inovice-content">
|
<div class="inovice-content">
|
||||||
<span>{{ invoiceData.receiptTitle }}</span>
|
<span>{{ invoiceData.receiptTitle }}</span>
|
||||||
@@ -167,47 +163,24 @@
|
|||||||
</div>
|
</div>
|
||||||
<div v-if="couponList.length === 0">无可用优惠券</div>
|
<div v-if="couponList.length === 0">无可用优惠券</div>
|
||||||
<ul v-else class="coupon-list">
|
<ul v-else class="coupon-list">
|
||||||
<li
|
<li v-for="(item, index) in couponList" class="coupon-item" :key="index">
|
||||||
v-for="(item, index) in couponList"
|
|
||||||
class="coupon-item"
|
|
||||||
:key="index"
|
|
||||||
>
|
|
||||||
<div class="c-left">
|
<div class="c-left">
|
||||||
<div>
|
<div>
|
||||||
<span
|
<span v-if="item.couponType === 'PRICE'" class="fontsize_12 global_color">¥<span class="price">{{
|
||||||
v-if="item.couponType === 'PRICE'"
|
|
||||||
class="fontsize_12 global_color"
|
|
||||||
>¥<span class="price">{{
|
|
||||||
item.price | unitPrice
|
item.price | unitPrice
|
||||||
}}</span></span
|
}}</span></span>
|
||||||
>
|
<span v-if="item.couponType === 'DISCOUNT'" class="fontsize_12 global_color"><span class="price">{{
|
||||||
<span
|
item.discount
|
||||||
v-if="item.couponType === 'DISCOUNT'"
|
}}</span>折</span>
|
||||||
class="fontsize_12 global_color"
|
<span class="describe">满{{ item.consumeThreshold }}元可用</span>
|
||||||
><span class="price">{{ item.discount }}</span
|
|
||||||
>折</span
|
|
||||||
>
|
|
||||||
<span class="describe"
|
|
||||||
>满{{ item.consumeThreshold }}元可用</span
|
|
||||||
>
|
|
||||||
</div>
|
</div>
|
||||||
<p>使用范围:{{ useScope(item.scopeType) }}</p>
|
<p>使用范围:{{ useScope(item.scopeType) }}</p>
|
||||||
<p>有效期:{{ item.endTime }}</p>
|
<p>有效期:{{ item.endTime }}</p>
|
||||||
</div>
|
</div>
|
||||||
<img
|
<img class="used" v-if="usedCouponId.includes(item.id)" src="../../assets/images/geted.png" alt="" />
|
||||||
class="used"
|
|
||||||
v-if="usedCouponId.includes(item.id)"
|
|
||||||
src="../../assets/images/geted.png"
|
|
||||||
alt=""
|
|
||||||
/>
|
|
||||||
<b></b>
|
<b></b>
|
||||||
<a class="c-right" @click="useCoupon(item.id, true)">立即使用</a>
|
<a class="c-right" @click="useCoupon(item.id, true)">立即使用</a>
|
||||||
<a
|
<a class="c-right" v-if="usedCouponId.includes(item.id)" @click="useCoupon(item.id, false)">放弃优惠</a>
|
||||||
class="c-right"
|
|
||||||
v-if="usedCouponId.includes(item.id)"
|
|
||||||
@click="useCoupon(item.id, false)"
|
|
||||||
>放弃优惠</a
|
|
||||||
>
|
|
||||||
<i class="circle-top"></i>
|
<i class="circle-top"></i>
|
||||||
<i class="circle-bottom"></i>
|
<i class="circle-bottom"></i>
|
||||||
</li>
|
</li>
|
||||||
@@ -216,29 +189,23 @@
|
|||||||
<!-- 订单价格 -->
|
<!-- 订单价格 -->
|
||||||
<div class="order-price">
|
<div class="order-price">
|
||||||
<div>
|
<div>
|
||||||
<span>{{ totalNum }}件商品,总商品金额:</span
|
<span>{{ totalNum }}件商品,总商品金额:</span><span>{{ priceDetailDTO.goodsPrice | unitPrice("¥") }}</span>
|
||||||
><span>{{ priceDetailDTO.goodsPrice | unitPrice("¥") }}</span>
|
|
||||||
</div>
|
</div>
|
||||||
<div v-if="priceDetailDTO.freightPrice > 0">
|
<div v-if="priceDetailDTO.freightPrice > 0">
|
||||||
<span>运费:</span
|
<span>运费:</span><span>{{ priceDetailDTO.freightPrice | unitPrice("¥") }}</span>
|
||||||
><span>{{ priceDetailDTO.freightPrice | unitPrice("¥") }}</span>
|
|
||||||
</div>
|
</div>
|
||||||
<div v-if="priceDetailDTO.discountPrice > 0">
|
<div v-if="priceDetailDTO.discountPrice > 0">
|
||||||
<span>优惠金额:</span
|
<span>优惠金额:</span><span>-{{ priceDetailDTO.discountPrice | unitPrice("¥") }}</span>
|
||||||
><span>-{{ priceDetailDTO.discountPrice | unitPrice("¥") }}</span>
|
|
||||||
</div>
|
</div>
|
||||||
<div v-if="priceDetailDTO.couponPrice > 0">
|
<div v-if="priceDetailDTO.couponPrice > 0">
|
||||||
<span>优惠券金额:</span
|
<span>优惠券金额:</span><span>-{{ priceDetailDTO.couponPrice | unitPrice("¥") }}</span>
|
||||||
><span>-{{ priceDetailDTO.couponPrice | unitPrice("¥") }}</span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div v-if="$route.query.way === 'POINTS'">
|
<div v-if="$route.query.way === 'POINTS'">
|
||||||
<span>应付积分:</span
|
<span>应付积分:</span><span class="actrual-price">{{ priceDetailDTO.payPoint }}</span>
|
||||||
><span class="actrual-price">{{ priceDetailDTO.payPoint }}</span>
|
|
||||||
</div>
|
</div>
|
||||||
<div v-else>
|
<div v-else>
|
||||||
<span>应付金额:</span
|
<span>应付金额:</span><span class="actrual-price">{{
|
||||||
><span class="actrual-price">{{
|
|
||||||
priceDetailDTO.flowPrice | unitPrice("¥")
|
priceDetailDTO.flowPrice | unitPrice("¥")
|
||||||
}}</span>
|
}}</span>
|
||||||
</div>
|
</div>
|
||||||
@@ -247,26 +214,21 @@
|
|||||||
<!-- 底部支付栏 -->
|
<!-- 底部支付栏 -->
|
||||||
<div class="order-footer width_1200">
|
<div class="order-footer width_1200">
|
||||||
<div class="pay ml_20" @click="pay">提交订单</div>
|
<div class="pay ml_20" @click="pay">提交订单</div>
|
||||||
<div class="pay-address" v-if="addressList.length">
|
<div class="pay-address" v-if="addressList.length && selectedDeliverMethod === 'LOGISTICS'">
|
||||||
配送至:{{ selectedAddress.consigneeAddressPath | unitAddress }}
|
配送至:{{ selectedAddress.consigneeAddressPath | unitAddress }}
|
||||||
{{ selectedAddress.detail }} 收货人:{{
|
{{ selectedAddress.detail }} 收货人:{{
|
||||||
selectedAddress.name
|
selectedAddress.name
|
||||||
}} {{ selectedAddress.mobile }}
|
}} {{ selectedAddress.mobile }}
|
||||||
</div>
|
</div>
|
||||||
|
<div class="pay-address" v-if="addressList.length && selectedDeliverMethod === 'SELF_PICK_UP'">
|
||||||
|
自提地点:{{selectedStoreAddress.address}} 联系方式:{{ selectedStoreAddress.mobile }}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<BaseFooter></BaseFooter>
|
<BaseFooter></BaseFooter>
|
||||||
<!-- 添加发票模态框 -->
|
<!-- 添加发票模态框 -->
|
||||||
<invoice-modal
|
<invoice-modal ref="invModal" :invoiceData="invoiceData" @change="getInvMsg" />
|
||||||
ref="invModal"
|
|
||||||
:invoiceData="invoiceData"
|
|
||||||
@change="getInvMsg"
|
|
||||||
/>
|
|
||||||
<!-- 选择地址模态框 -->
|
<!-- 选择地址模态框 -->
|
||||||
<address-manage
|
<address-manage ref="address" :id="addrId" @change="addrChange"></address-manage>
|
||||||
ref="address"
|
|
||||||
:id="addrId"
|
|
||||||
@change="addrChange"
|
|
||||||
></address-manage>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -279,8 +241,12 @@ import {
|
|||||||
createTrade,
|
createTrade,
|
||||||
selectAddr,
|
selectAddr,
|
||||||
selectCoupon,
|
selectCoupon,
|
||||||
|
setShipMethod,
|
||||||
|
setStoreAddressId,
|
||||||
|
shippingMethodList,
|
||||||
couponNum,
|
couponNum,
|
||||||
} from "@/api/cart";
|
} from "@/api/cart";
|
||||||
|
import { getStoreAddress } from "@/api/shopentry.js"
|
||||||
import { canUseCouponList } from "@/api/member.js";
|
import { canUseCouponList } from "@/api/member.js";
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
@@ -288,15 +254,36 @@ export default {
|
|||||||
components: { invoiceModal, addressManage },
|
components: { invoiceModal, addressManage },
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
selectedStoreAddress: 'm',
|
||||||
|
selectMethod: '',
|
||||||
stepIndex: 1, // 顶部步骤条状态
|
stepIndex: 1, // 顶部步骤条状态
|
||||||
invoiceAvailable: false, // 发票编辑按钮
|
invoiceAvailable: false, // 发票编辑按钮
|
||||||
showEditBtn: "", // 鼠标移入显示编辑按钮
|
showEditBtn: "", // 鼠标移入显示编辑按钮
|
||||||
orderMark: "", // 订单备注
|
orderMark: "", // 订单备注
|
||||||
|
goodsType: "", // 商品类型
|
||||||
|
storeMoreAddr: false,
|
||||||
invoiceData: {
|
invoiceData: {
|
||||||
// 发票数据
|
// 发票数据
|
||||||
receiptTitle: "个人",
|
receiptTitle: "个人",
|
||||||
receiptContent: "不开发票",
|
receiptContent: "不开发票",
|
||||||
},
|
},
|
||||||
|
searchForm: {
|
||||||
|
pageNumber: 1,
|
||||||
|
pageSize: 100
|
||||||
|
},
|
||||||
|
shippingMethod: [],
|
||||||
|
storeAddressList: [],
|
||||||
|
shippingWay: [
|
||||||
|
{
|
||||||
|
value: "LOGISTICS",
|
||||||
|
label: "物流",
|
||||||
|
},
|
||||||
|
{
|
||||||
|
value: "SELF_PICK_UP",
|
||||||
|
label: "自提",
|
||||||
|
},
|
||||||
|
],
|
||||||
|
selectedDeliverMethod: 'LOGISTICS',
|
||||||
addressList: [], // 地址列表
|
addressList: [], // 地址列表
|
||||||
selectedAddress: {}, // 所选地址
|
selectedAddress: {}, // 所选地址
|
||||||
goodsList: [], // 商品列表
|
goodsList: [], // 商品列表
|
||||||
@@ -308,6 +295,7 @@ export default {
|
|||||||
couponList: [], // 可用优惠券列表
|
couponList: [], // 可用优惠券列表
|
||||||
usedCouponId: [], // 已使用优惠券id
|
usedCouponId: [], // 已使用优惠券id
|
||||||
selectedCoupon: {}, // 已选优惠券对象
|
selectedCoupon: {}, // 已选优惠券对象
|
||||||
|
storeId: '', //店铺Id
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
@@ -317,6 +305,7 @@ export default {
|
|||||||
// 初始化数据
|
// 初始化数据
|
||||||
init() {
|
init() {
|
||||||
this.getGoodsDetail();
|
this.getGoodsDetail();
|
||||||
|
this.getDistribution();
|
||||||
},
|
},
|
||||||
goAddressManage() {
|
goAddressManage() {
|
||||||
// 跳转地址管理页面
|
// 跳转地址管理页面
|
||||||
@@ -324,7 +313,7 @@ export default {
|
|||||||
},
|
},
|
||||||
getAddress() {
|
getAddress() {
|
||||||
// 获取收货地址列表
|
// 获取收货地址列表
|
||||||
memberAddress().then((res) => {
|
memberAddress(this.searchForm).then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.addressList = res.result.records;
|
this.addressList = res.result.records;
|
||||||
this.addressList.forEach((e, index) => {
|
this.addressList.forEach((e, index) => {
|
||||||
@@ -335,6 +324,38 @@ export default {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
|
// 获取配送方式列表
|
||||||
|
async getDistribution() {
|
||||||
|
let shopRes = await shippingMethodList({ way: this.$route.query.way });
|
||||||
|
let shopList;
|
||||||
|
if (shopRes.success) {
|
||||||
|
shopList = shopRes.result;
|
||||||
|
let way = [];
|
||||||
|
console.log(shopList)
|
||||||
|
this.shippingWay.forEach((item) => {
|
||||||
|
shopList.forEach((child) => {
|
||||||
|
if (item.value == child) {
|
||||||
|
way.push(item);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
this.shippingMethod = way;
|
||||||
|
console.log(this.shippingMethod)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
async getStoreAddressList() {
|
||||||
|
getStoreAddress(this.storeId,this.searchForm).then(res => {
|
||||||
|
if (res.success) {
|
||||||
|
this.storeAddressList = res.result.records
|
||||||
|
this.storeAddressList.forEach((e, index) => {
|
||||||
|
if (e.id === this.selectedAddress.id && index > 2) {
|
||||||
|
this.storeMoreAddr = true;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
getGoodsDetail() {
|
getGoodsDetail() {
|
||||||
// 订单商品详情
|
// 订单商品详情
|
||||||
this.$Spin.show();
|
this.$Spin.show();
|
||||||
@@ -364,7 +385,10 @@ export default {
|
|||||||
this.goodsList = res.result.cartList;
|
this.goodsList = res.result.cartList;
|
||||||
this.priceDetailDTO = res.result.priceDetailDTO;
|
this.priceDetailDTO = res.result.priceDetailDTO;
|
||||||
this.skuList = res.result.skuList;
|
this.skuList = res.result.skuList;
|
||||||
|
if (res.result.skuList[0] && res.result.skuList[0].goodsSku) {
|
||||||
|
this.goodsType = res.result.skuList[0].goodsSku.goodsType;
|
||||||
|
}
|
||||||
|
this.storeId = this.goodsList[0].storeId
|
||||||
if (res.result.receiptVO) {
|
if (res.result.receiptVO) {
|
||||||
this.invoiceData = res.result.receiptVO;
|
this.invoiceData = res.result.receiptVO;
|
||||||
}
|
}
|
||||||
@@ -401,6 +425,7 @@ export default {
|
|||||||
this.selectedAddress = res.result.memberAddress;
|
this.selectedAddress = res.result.memberAddress;
|
||||||
}
|
}
|
||||||
this.getAddress();
|
this.getAddress();
|
||||||
|
this.getStoreAddressList();
|
||||||
this.totalNum = 0;
|
this.totalNum = 0;
|
||||||
for (let i = 0; i < this.skuList.length; i++) {
|
for (let i = 0; i < this.skuList.length; i++) {
|
||||||
this.totalNum += this.skuList[i].num;
|
this.totalNum += this.skuList[i].num;
|
||||||
@@ -475,8 +500,32 @@ export default {
|
|||||||
};
|
};
|
||||||
selectAddr(params).then((res) => {
|
selectAddr(params).then((res) => {
|
||||||
if (res.success) {
|
if (res.success) {
|
||||||
this.$Message.success("选择收货地址成功");
|
this.$Message.success("选择配送方式成功");
|
||||||
this.selectedAddress = item;
|
this.selectMethod = item;
|
||||||
|
this.getGoodsDetail();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
selectStoreAddress(item) {
|
||||||
|
console.log(item.id)
|
||||||
|
console.log(this.$route.query.way)
|
||||||
|
// 选择自提地址
|
||||||
|
setStoreAddressId(item.id,this.$route.query.way).then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
this.$Message.success("选择自提地址成功");
|
||||||
|
this.selectedStoreAddress = item;
|
||||||
|
this.getGoodsDetail();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
selectDeliverMethod(item) {
|
||||||
|
let params = {
|
||||||
|
way: this.$route.query.way,
|
||||||
|
shippingMethod: item.value,
|
||||||
|
};
|
||||||
|
setShipMethod(params).then((res) => {
|
||||||
|
if (res.success) {
|
||||||
|
this.selectedDeliverMethod = item.value;
|
||||||
this.getGoodsDetail();
|
this.getGoodsDetail();
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -605,9 +654,11 @@ export default {
|
|||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
@import "../../assets/styles/coupon.scss";
|
@import "../../assets/styles/coupon.scss";
|
||||||
|
|
||||||
.goods-msg {
|
.goods-msg {
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
}
|
}
|
||||||
|
|
||||||
/** logo start */
|
/** logo start */
|
||||||
.logo {
|
.logo {
|
||||||
height: 40px;
|
height: 40px;
|
||||||
@@ -680,6 +731,76 @@ export default {
|
|||||||
padding: 15px 25px;
|
padding: 15px 25px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.delivery-method {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
|
||||||
|
>div {
|
||||||
|
border: 1px dotted #949494;
|
||||||
|
width: 50px;
|
||||||
|
height: 40px;
|
||||||
|
margin: 20px 20px 0 0;
|
||||||
|
padding: 10px;
|
||||||
|
cursor: pointer;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.method-item {
|
||||||
|
position: relative;
|
||||||
|
font-size: 12px;
|
||||||
|
|
||||||
|
>div:nth-child(1) {
|
||||||
|
margin-bottom: 10px;
|
||||||
|
|
||||||
|
span {
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
>span:nth-child(1) {
|
||||||
|
color: #000000;
|
||||||
|
font-size: 14px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.edit-btn {
|
||||||
|
font-size: 12px;
|
||||||
|
position: absolute;
|
||||||
|
top: 15px;
|
||||||
|
right: 20px;
|
||||||
|
color: $theme_color;
|
||||||
|
|
||||||
|
span:hover {
|
||||||
|
border-bottom: 1px solid $theme_color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.corner-icon {
|
||||||
|
position: absolute;
|
||||||
|
right: -1px;
|
||||||
|
bottom: -1px;
|
||||||
|
|
||||||
|
div {
|
||||||
|
width: 0;
|
||||||
|
border-top: 20px solid transparent;
|
||||||
|
border-right: 20px solid $theme_color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ivu-icon {
|
||||||
|
font-size: 12px;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
right: 1px;
|
||||||
|
transform: rotate(-15deg);
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-red {
|
||||||
|
border-color: $theme_color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/** 地址管理 */
|
/** 地址管理 */
|
||||||
.address-manage {
|
.address-manage {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -704,6 +825,7 @@ export default {
|
|||||||
.ivu-icon {
|
.ivu-icon {
|
||||||
font-size: 24px;
|
font-size: 24px;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.address-item {
|
.address-item {
|
||||||
@@ -762,53 +884,6 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
/** 购买商品列表 start */
|
|
||||||
.shop-name {
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
|
|
||||||
> span:nth-child(1) {
|
|
||||||
font-weight: bold;
|
|
||||||
|
|
||||||
.ivu-icon {
|
|
||||||
color: #ff8f23;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
color: $theme_color;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
> span:nth-child(2) {
|
|
||||||
color: #999;
|
|
||||||
position: relative;
|
|
||||||
display: flex;
|
|
||||||
width: 200px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.delivery-list {
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
top: 20px;
|
|
||||||
background-color: #f3fafe;
|
|
||||||
box-shadow: 0px 0px 5px #b9b2b2;
|
|
||||||
display: flex;
|
|
||||||
flex-wrap: wrap;
|
|
||||||
width: 200px;
|
|
||||||
min-height: 100px;
|
|
||||||
padding: 10px;
|
|
||||||
|
|
||||||
li {
|
|
||||||
width: 90px;
|
|
||||||
height: 30px;
|
|
||||||
text-align: center;
|
|
||||||
|
|
||||||
&:hover {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.goods-list {
|
.goods-list {
|
||||||
width: 1150px;
|
width: 1150px;
|
||||||
@@ -843,6 +918,7 @@ export default {
|
|||||||
|
|
||||||
flex: 1;
|
flex: 1;
|
||||||
text-align: left;
|
text-align: left;
|
||||||
|
|
||||||
>span {
|
>span {
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -78,6 +78,8 @@ export default {
|
|||||||
this.support = this.payDetail.support
|
this.support = this.payDetail.support
|
||||||
this.walletValue = this.payDetail.walletValue
|
this.walletValue = this.payDetail.walletValue
|
||||||
}
|
}
|
||||||
|
}).catch((err) => {
|
||||||
|
this.$router.push({name: 'MyOrder'});
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
// 支付
|
// 支付
|
||||||
|
|||||||
@@ -32,9 +32,7 @@
|
|||||||
已有<span>{{ item.commentNum || 0 }}</span
|
已有<span>{{ item.commentNum || 0 }}</span
|
||||||
>人评价
|
>人评价
|
||||||
</div>
|
</div>
|
||||||
<div class="goods-show-seller">
|
|
||||||
<span>{{ item.storeName }}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="page-size">
|
<div class="page-size">
|
||||||
|
|||||||
@@ -6,12 +6,7 @@
|
|||||||
<div class="promotion-decorate">限时秒杀</div>
|
<div class="promotion-decorate">限时秒杀</div>
|
||||||
<ul class="time-line">
|
<ul class="time-line">
|
||||||
<template v-for="(time, index) in list">
|
<template v-for="(time, index) in list">
|
||||||
<li
|
<li v-if="index < 5" @click="currIndex = index" :key="index" :class="{ currTimeline: currIndex === index }">
|
||||||
v-if="index < 5"
|
|
||||||
@click="currIndex = index"
|
|
||||||
:key="index"
|
|
||||||
:class="{ currTimeline: currIndex === index }"
|
|
||||||
>
|
|
||||||
<div>{{ time.timeLine + ":00" }}</div>
|
<div>{{ time.timeLine + ":00" }}</div>
|
||||||
<div v-if="currIndex === index">
|
<div v-if="currIndex === index">
|
||||||
<p>{{ nowHour >= time.timeLine ? "秒杀中" : "即将开始" }}</p>
|
<p>{{ nowHour >= time.timeLine ? "秒杀中" : "即将开始" }}</p>
|
||||||
@@ -30,13 +25,8 @@
|
|||||||
<!-- 秒杀商品列表 -->
|
<!-- 秒杀商品列表 -->
|
||||||
<div class="goods-list">
|
<div class="goods-list">
|
||||||
<empty v-if="goodsList.length === 0" />
|
<empty v-if="goodsList.length === 0" />
|
||||||
<div
|
<div v-else class="goods-show-info1" v-for="(item, index) in goodsList" :key="index"
|
||||||
v-else
|
@click="goGoodsDetail(item.skuId, item.goodsId)">
|
||||||
class="goods-show-info1"
|
|
||||||
v-for="(item, index) in goodsList"
|
|
||||||
:key="index"
|
|
||||||
@click="goGoodsDetail(item.skuId, item.goodsId)"
|
|
||||||
>
|
|
||||||
<div class="goods-show-img">
|
<div class="goods-show-img">
|
||||||
<img width="200" height="200" :src="item.goodsImage" />
|
<img width="200" height="200" :src="item.goodsImage" />
|
||||||
</div>
|
</div>
|
||||||
@@ -50,49 +40,33 @@
|
|||||||
}}</span>
|
}}</span>
|
||||||
</span>
|
</span>
|
||||||
</div>
|
</div>
|
||||||
<div class="goods-show-detail">
|
<div class="goods-show-detail" style="margin-bottom: 20px">
|
||||||
<span>{{ item.goodsName }}</span>
|
<span>{{ item.goodsName }}</span>
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div class="goods-seckill-btn" :class="{
|
||||||
class="goods-seckill-btn"
|
|
||||||
:class="{
|
|
||||||
'goods-seckill-btn-gray': nowHour < list[currIndex].timeLine,
|
'goods-seckill-btn-gray': nowHour < list[currIndex].timeLine,
|
||||||
}"
|
}">
|
||||||
>
|
|
||||||
{{ nowHour >= list[currIndex].timeLine ? "立即抢购" : "即将开始" }}
|
{{ nowHour >= list[currIndex].timeLine ? "立即抢购" : "即将开始" }}
|
||||||
</div>
|
</div>
|
||||||
<div
|
<div v-if="nowHour >= list[currIndex].timeLine && item.quantity <= item.salesNum"
|
||||||
v-if="nowHour >= list[currIndex].timeLine"
|
class="goods-seckill-btn goods-seckill-btn-gray">
|
||||||
class="goods-seckill-btn goods-seckill-btn-gray"
|
|
||||||
>
|
|
||||||
已售罄
|
已售罄
|
||||||
</div>
|
</div>
|
||||||
<div v-if="nowHour >= list[currIndex].timeLine" class="goods-show-num1">
|
<div v-if="nowHour >= list[currIndex].timeLine" class="goods-show-num1">
|
||||||
<span
|
<span>已售{{
|
||||||
>已售{{
|
|
||||||
(item.quantity && item.quantity > 0
|
(item.quantity && item.quantity > 0
|
||||||
? Math.ceil(
|
? Math.ceil(
|
||||||
(item.salesNum / (item.quantity + item.salesNum)) * 100
|
(item.salesNum / (item.quantity)) * 100
|
||||||
)
|
)
|
||||||
: 100) + "%"
|
: 100) + "%"
|
||||||
}}</span
|
}}</span><Progress hide-info stroke-color="#df0021" style="width: 110px" class="ml_10" :percent="item.quantity && item.quantity > 0
|
||||||
><Progress
|
|
||||||
hide-info
|
|
||||||
stroke-color="#df0021"
|
|
||||||
style="width: 110px"
|
|
||||||
class="ml_10"
|
|
||||||
:percent="
|
|
||||||
item.quantity && item.quantity > 0
|
|
||||||
? Math.ceil(
|
? Math.ceil(
|
||||||
(item.salesNum / (item.quantity + item.salesNum)) * 100
|
(item.salesNum / (item.quantity)) * 100
|
||||||
)
|
)
|
||||||
: 100
|
: 100
|
||||||
"
|
" />
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
<div class="goods-show-seller">
|
|
||||||
<span>{{ item.storeName }}</span>
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<BaseFooter />
|
<BaseFooter />
|
||||||
@@ -198,6 +172,7 @@ export default {
|
|||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
@import "../../assets/styles/goodsList.scss";
|
@import "../../assets/styles/goodsList.scss";
|
||||||
|
|
||||||
.goods-seckill-btn {
|
.goods-seckill-btn {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 0;
|
right: 0;
|
||||||
@@ -209,20 +184,26 @@ export default {
|
|||||||
line-height: 35px;
|
line-height: 35px;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
background-color: $theme_color;
|
background-color: $theme_color;
|
||||||
|
margin-bottom: 1px;
|
||||||
|
margin-right: 1px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.goods-seckill-btn-gray {
|
.goods-seckill-btn-gray {
|
||||||
background-color: #666;
|
background-color: #666;
|
||||||
}
|
}
|
||||||
|
|
||||||
.promotion-decorate::before,
|
.promotion-decorate::before,
|
||||||
.promotion-decorate::after {
|
.promotion-decorate::after {
|
||||||
background-image: url("/src/assets/images/sprite@2x.png");
|
background-image: url("/src/assets/images/sprite@2x.png");
|
||||||
}
|
}
|
||||||
|
|
||||||
.time-line {
|
.time-line {
|
||||||
width: 1200px;
|
width: 1200px;
|
||||||
height: 60px;
|
height: 60px;
|
||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
li {
|
li {
|
||||||
padding: 0 30px;
|
padding: 0 30px;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
@@ -231,9 +212,11 @@ export default {
|
|||||||
height: 100%;
|
height: 100%;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.not-curr {
|
.not-curr {
|
||||||
border: 1px solid #999;
|
border: 1px solid #999;
|
||||||
border-radius: 20px;
|
border-radius: 20px;
|
||||||
@@ -243,36 +226,43 @@ export default {
|
|||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.currTimeline {
|
.currTimeline {
|
||||||
background-color: $theme_color;
|
background-color: $theme_color;
|
||||||
color: #fff;
|
color: #fff;
|
||||||
|
|
||||||
>div:nth-child(1) {
|
>div:nth-child(1) {
|
||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
>div:nth-child(2) {
|
>div:nth-child(2) {
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
margin-left: 10px;
|
margin-left: 10px;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.goods-show-info1 {
|
.goods-show-info1 {
|
||||||
width: 275px;
|
width: 290px;
|
||||||
padding: 6px;
|
padding: 6px;
|
||||||
margin: 10px 0px;
|
margin: 10px 0px;
|
||||||
margin-left: 5px;
|
margin-left: 8px;
|
||||||
position: relative;
|
position: relative;
|
||||||
border: 1px solid #fff;
|
border: 1px solid #fff;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
.goods-show-info1:hover {
|
.goods-show-info1:hover {
|
||||||
border: 1px solid #ccc;
|
border: 1px solid #ccc;
|
||||||
box-shadow: 0px 0px 15px #ccc;
|
box-shadow: 0px 0px 15px #ccc;
|
||||||
}
|
}
|
||||||
|
|
||||||
.goods-show-img {
|
.goods-show-img {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ivu-progress-success .ivu-progress-bg {
|
.ivu-progress-success .ivu-progress-bg {
|
||||||
background-color: #111fff;
|
background-color: #111fff;
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -10,11 +10,8 @@
|
|||||||
/>
|
/>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem prop="companyAddressIdPath" label="公司所在地">
|
<FormItem prop="companyAddressIdPath" label="公司所在地">
|
||||||
<region
|
<span>{{ form.companyAddressPath || '暂无地址' }}</span>
|
||||||
style="width: 250px"
|
<Button type="default" style="margin-left: 10px;" @click="$refs.map.open()">选择</Button>
|
||||||
@selected="selectedRegion"
|
|
||||||
:addressId="address"
|
|
||||||
/>
|
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem prop="companyAddress" label="公司详细地址">
|
<FormItem prop="companyAddress" label="公司详细地址">
|
||||||
<Input
|
<Input
|
||||||
@@ -187,16 +184,18 @@
|
|||||||
<Modal title="View Image" v-model="visible">
|
<Modal title="View Image" v-model="visible">
|
||||||
<img :src="previewPicture" v-if="visible" style="width: 100%" />
|
<img :src="previewPicture" v-if="visible" style="width: 100%" />
|
||||||
</Modal>
|
</Modal>
|
||||||
|
|
||||||
|
<multipleMap ref="map" @callback="getAddress" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import { applyFirst } from '@/api/shopentry';
|
import { applyFirst } from '@/api/shopentry';
|
||||||
import * as RegExp from '@/plugins/RegExp.js';
|
import * as RegExp from '@/plugins/RegExp.js';
|
||||||
import region from '@/components/map/region.vue';
|
import multipleMap from "@/components/map/multiple-map";
|
||||||
import storage from '@/plugins/storage';
|
import storage from '@/plugins/storage';
|
||||||
import { commonUrl } from '@/plugins/request.js';
|
import { commonUrl } from '@/plugins/request.js';
|
||||||
export default {
|
export default {
|
||||||
components: { region },
|
components: { multipleMap },
|
||||||
props: {
|
props: {
|
||||||
content: {
|
content: {
|
||||||
default: {},
|
default: {},
|
||||||
@@ -209,7 +208,7 @@ export default {
|
|||||||
accessToken: {}, // 验证token
|
accessToken: {}, // 验证token
|
||||||
visible: false, // 预览图片
|
visible: false, // 预览图片
|
||||||
loading: false, // 加载状态
|
loading: false, // 加载状态
|
||||||
address: '', // 地址
|
|
||||||
previewPicture: '', // 预览图片url
|
previewPicture: '', // 预览图片url
|
||||||
form: { // 表单数据
|
form: { // 表单数据
|
||||||
legalPhoto: [],
|
legalPhoto: [],
|
||||||
@@ -234,7 +233,7 @@ export default {
|
|||||||
],
|
],
|
||||||
companyPhone: [
|
companyPhone: [
|
||||||
{ required: true, message: '请填写公司电话' },
|
{ required: true, message: '请填写公司电话' },
|
||||||
{ pattern: RegExp.TEL, message: '请填写正确的号码' }
|
{ pattern: RegExp.mobile, message: '请填写正确的号码' }
|
||||||
],
|
],
|
||||||
companyEmail: [
|
companyEmail: [
|
||||||
{ required: true, message: '请填写电子邮箱' },
|
{ required: true, message: '请填写电子邮箱' },
|
||||||
@@ -258,6 +257,19 @@ export default {
|
|||||||
};
|
};
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
|
// 获取店铺地址
|
||||||
|
getAddress(val){
|
||||||
|
if(val.type === 'select'){
|
||||||
|
const paths = val.data.map(item => item.name).join(',')
|
||||||
|
const ids = val.data.map(item => item.id).join(',')
|
||||||
|
this.$set(this.form, 'companyAddressIdPath', ids)
|
||||||
|
this.$set(this.form, 'companyAddressPath', paths)
|
||||||
|
}else{
|
||||||
|
this.$set(this.form, 'companyAddressIdPath', val.data.addrId)
|
||||||
|
this.$set(this.form, 'companyAddressPath', val.data.addr)
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
// 下一步
|
// 下一步
|
||||||
next () {
|
next () {
|
||||||
this.$refs.firstForm.validate((valid) => {
|
this.$refs.firstForm.validate((valid) => {
|
||||||
@@ -279,15 +291,7 @@ export default {
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
// 地址选择回显
|
|
||||||
selectedRegion (item) {
|
|
||||||
this.$set(this.form, 'companyAddressIdPath', item[0].toString());
|
|
||||||
this.$set(
|
|
||||||
this.form,
|
|
||||||
'companyAddressPath',
|
|
||||||
item[1].toString().replace(/\s/g, '')
|
|
||||||
);
|
|
||||||
},
|
|
||||||
// 上传之前
|
// 上传之前
|
||||||
beforeUpload () {
|
beforeUpload () {
|
||||||
this.uploadLoading = true;
|
this.uploadLoading = true;
|
||||||
@@ -354,7 +358,7 @@ export default {
|
|||||||
if (this.form.licencePhoto) {
|
if (this.form.licencePhoto) {
|
||||||
this.form.legalPhoto = this.content.legalPhoto.split(',');
|
this.form.legalPhoto = this.content.legalPhoto.split(',');
|
||||||
this.form.licencePhoto = this.content.licencePhoto.split(',');
|
this.form.licencePhoto = this.content.licencePhoto.split(',');
|
||||||
this.address = this.form.companyAddressIdPath;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -22,12 +22,15 @@
|
|||||||
<span v-if="storeDisable == 'REFUSED'">审核未通过,请修改资质信息,如有疑问请联系管理员</span>
|
<span v-if="storeDisable == 'REFUSED'">审核未通过,请修改资质信息,如有疑问请联系管理员</span>
|
||||||
</div>
|
</div>
|
||||||
<Button v-if="currentIndex === 3" @click="$router.push('/')">返回</Button>
|
<Button v-if="currentIndex === 3" @click="$router.push('/')">返回</Button>
|
||||||
|
|
||||||
<Button type="primary" @click='currentIndex = 0'
|
<Button type="primary" @click='currentIndex = 0'
|
||||||
v-if="storeDisable === 'REFUSED' && currentIndex === 3">重新申请</Button>
|
v-if="storeDisable === 'REFUSED' && currentIndex === 3">重新申请</Button>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<Modal title="店铺入驻协议" v-model="showAgreement" width="1200" :closable="false" :mask-closable="false">
|
<Modal title="店铺入驻协议" v-model="showAgreement" width="1200" :closable="false" :mask-closable="false">
|
||||||
|
<Scroll :on-reach-bottom="handleReachBottom">
|
||||||
<div class="agreeent-con" v-html="agreementCon"></div>
|
<div class="agreeent-con" v-html="agreementCon"></div>
|
||||||
|
</Scroll>
|
||||||
|
|
||||||
<div slot="footer" style="text-align: center">
|
<div slot="footer" style="text-align: center">
|
||||||
<p>
|
<p>
|
||||||
@@ -39,6 +42,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
|
||||||
import { agreement, applyStatus } from "@/api/shopentry";
|
import { agreement, applyStatus } from "@/api/shopentry";
|
||||||
import firstApply from "./FirstApply";
|
import firstApply from "./FirstApply";
|
||||||
import secondApply from "./SecondApply";
|
import secondApply from "./SecondApply";
|
||||||
@@ -68,6 +72,9 @@ export default {
|
|||||||
agreement().then((res) => {
|
agreement().then((res) => {
|
||||||
this.agreementCon = res.result.content;
|
this.agreementCon = res.result.content;
|
||||||
});
|
});
|
||||||
|
},
|
||||||
|
handleReachBottom(){
|
||||||
|
|
||||||
},
|
},
|
||||||
getData(status) {
|
getData(status) {
|
||||||
// 获取已填写店铺信息
|
// 获取已填写店铺信息
|
||||||
@@ -146,8 +153,11 @@ export default {
|
|||||||
},
|
},
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
|
|
||||||
this.getData("init");
|
this.getData("init");
|
||||||
this.getArticle();
|
this.getArticle();
|
||||||
|
|
||||||
|
|
||||||
},
|
},
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -172,6 +182,10 @@ export default {
|
|||||||
}
|
}
|
||||||
.agreeent-con {
|
.agreeent-con {
|
||||||
max-height: 500px;
|
max-height: 500px;
|
||||||
|
::v-deep img{
|
||||||
|
max-width: 100%;
|
||||||
|
|
||||||
|
}
|
||||||
}
|
}
|
||||||
.success-page {
|
.success-page {
|
||||||
height: 500px;
|
height: 500px;
|
||||||
|
|||||||
@@ -60,24 +60,10 @@
|
|||||||
>
|
>
|
||||||
</Select>
|
</Select>
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem prop="storeCenter" label="店铺定位">
|
|
||||||
<Button
|
|
||||||
type="info"
|
|
||||||
v-if="!form.storeCenter"
|
|
||||||
@click="$refs.liliMap.showMap = true"
|
|
||||||
>点击获取店铺定位</Button>
|
|
||||||
<Button
|
|
||||||
type="success"
|
|
||||||
v-else
|
|
||||||
@click="$refs.liliMap.showMap = true"
|
|
||||||
>已定位</Button>
|
|
||||||
</FormItem>
|
|
||||||
<FormItem prop="storeAddressIdPath" label="店铺所在地">
|
<FormItem prop="storeAddressIdPath" label="店铺所在地">
|
||||||
<region
|
<span>{{ form.storeAddressPath || '暂无地址' }}</span>
|
||||||
style="width: 250px"
|
<Button type="default" style="margin-left: 10px;" @click="$refs.map.open()">选择</Button>
|
||||||
@selected="selectedRegion"
|
|
||||||
:addressId="address"
|
|
||||||
/>
|
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem prop="storeAddressDetail" label="店铺详细地址">
|
<FormItem prop="storeAddressDetail" label="店铺详细地址">
|
||||||
<Input
|
<Input
|
||||||
@@ -107,16 +93,20 @@
|
|||||||
<Modal title="View Image" v-model="visible">
|
<Modal title="View Image" v-model="visible">
|
||||||
<img :src="previewPicture" v-if="visible" style="width: 100%" />
|
<img :src="previewPicture" v-if="visible" style="width: 100%" />
|
||||||
</Modal>
|
</Modal>
|
||||||
<lili-map ref="liliMap" @getAddress="getAddress" :useApi="false"></lili-map>
|
<multipleMap ref="map" @callback="getAddress" />
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
import { applyThird } from '@/api/shopentry';
|
import { applyThird } from '@/api/shopentry';
|
||||||
import { getCategory } from '@/api/goods';
|
import { getCategory } from '@/api/goods';
|
||||||
import Map from '@/components/map/index';
|
|
||||||
import storage from '@/plugins/storage';
|
import storage from '@/plugins/storage';
|
||||||
import { commonUrl } from '@/plugins/request.js';
|
import { commonUrl } from '@/plugins/request.js';
|
||||||
import region from '@/components/map/region.vue';
|
|
||||||
|
|
||||||
|
import multipleMap from "@/components/map/multiple-map";
|
||||||
|
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
props: {
|
props: {
|
||||||
content: {
|
content: {
|
||||||
@@ -124,7 +114,7 @@ export default {
|
|||||||
type: Object
|
type: Object
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
components: { liliMap: Map, region },
|
components: { multipleMap },
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
loading: false, // 加载状态
|
loading: false, // 加载状态
|
||||||
@@ -132,7 +122,7 @@ export default {
|
|||||||
action: commonUrl + '/common/common/upload/file', // 上传地址
|
action: commonUrl + '/common/common/upload/file', // 上传地址
|
||||||
accessToken: {}, // 验证token
|
accessToken: {}, // 验证token
|
||||||
previewPicture: '', // 预览图片
|
previewPicture: '', // 预览图片
|
||||||
address: '', // 回显地址
|
|
||||||
visible: false, // 图片预览
|
visible: false, // 图片预览
|
||||||
form: { // 表单数据
|
form: { // 表单数据
|
||||||
storeLogo: []
|
storeLogo: []
|
||||||
@@ -217,12 +207,22 @@ export default {
|
|||||||
this.form[listName].splice(index, 1);
|
this.form[listName].splice(index, 1);
|
||||||
},
|
},
|
||||||
// 选择坐标回调
|
// 选择坐标回调
|
||||||
getAddress (item) {
|
getAddress (val) {
|
||||||
|
if(val.type === 'select'){
|
||||||
|
const paths = val.data.map(item => item.name).join(',')
|
||||||
|
const ids = val.data.map(item => item.id).join(',')
|
||||||
|
this.$set(this.form, "storeAddressPath", paths);
|
||||||
|
this.$set(this.form, "storeAddressIdPath", ids);
|
||||||
|
this.form.storeCenter = val.data[val.data.length - 1].center
|
||||||
|
}else{
|
||||||
|
this.$set(this.form, "storeAddressPath", val.data.addr);
|
||||||
|
this.$set(this.form, "storeAddressIdPath", val.data.addrId);
|
||||||
this.$set(
|
this.$set(
|
||||||
this.form,
|
this.form,
|
||||||
'storeCenter',
|
'storeCenter',
|
||||||
item.position.lng + ',' + item.position.lat
|
val.data.position.lng + ',' + val.data.position.lat
|
||||||
);
|
);
|
||||||
|
}
|
||||||
},
|
},
|
||||||
// 获取商品分类
|
// 获取商品分类
|
||||||
getCategoryList () {
|
getCategoryList () {
|
||||||
@@ -230,15 +230,8 @@ export default {
|
|||||||
if (res.success) this.categoryList = res.result;
|
if (res.success) this.categoryList = res.result;
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
// 地址选择回显
|
|
||||||
selectedRegion (item) {
|
|
||||||
this.$set(this.form, 'storeAddressIdPath', item[0].toString());
|
|
||||||
this.$set(
|
|
||||||
this.form,
|
|
||||||
'storeAddressPath',
|
|
||||||
item[1].toString().replace(/\s/g, '')
|
|
||||||
);
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
this.accessToken.accessToken = storage.getItem('accessToken');
|
this.accessToken.accessToken = storage.getItem('accessToken');
|
||||||
@@ -253,7 +246,6 @@ export default {
|
|||||||
} else {
|
} else {
|
||||||
this.form.storeLogo = [];
|
this.form.storeLogo = [];
|
||||||
}
|
}
|
||||||
this.address = this.form.storeAddressIdPath;
|
|
||||||
this.$forceUpdate();
|
this.$forceUpdate();
|
||||||
}
|
}
|
||||||
this.$refs.thirdForm.resetFields()
|
this.$refs.thirdForm.resetFields()
|
||||||
|
|||||||
@@ -160,7 +160,7 @@ service.interceptors.response.use(
|
|||||||
Message.error(errorData.message || _message);
|
Message.error(errorData.message || _message);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
return Promise.reject(error);
|
return Promise.reject(errorData);
|
||||||
}
|
}
|
||||||
);
|
);
|
||||||
|
|
||||||
|
|||||||
@@ -88,7 +88,7 @@ const Home = (resolve) => require(["@/pages/user/Home"], resolve);
|
|||||||
|
|
||||||
const Merchant = (resolve) => require(["@/pages/Merchant"], resolve);
|
const Merchant = (resolve) => require(["@/pages/Merchant"], resolve);
|
||||||
const UserMain = (resolve) => require(["@/pages/home/Main"], resolve);
|
const UserMain = (resolve) => require(["@/pages/home/Main"], resolve);
|
||||||
|
const topic = (resolve) => require(["@/pages/Topic"], resolve);
|
||||||
/**
|
/**
|
||||||
* 店铺入驻
|
* 店铺入驻
|
||||||
*/
|
*/
|
||||||
@@ -113,6 +113,11 @@ export default new Router({
|
|||||||
name: "Index",
|
name: "Index",
|
||||||
component: Index,
|
component: Index,
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: "/topic", // 首页
|
||||||
|
name: "topic",
|
||||||
|
component: topic,
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: "/login", // 登陆
|
path: "/login", // 登陆
|
||||||
name: "login",
|
name: "login",
|
||||||
|
|||||||
@@ -9,6 +9,7 @@ Vue.use(Vuex);
|
|||||||
|
|
||||||
export default new Vuex.Store({
|
export default new Vuex.Store({
|
||||||
state: {
|
state: {
|
||||||
|
imQrCode: '',
|
||||||
navList: [], // 首页快捷导航
|
navList: [], // 首页快捷导航
|
||||||
cartNum: storage.getItem('cartNum') || 0,
|
cartNum: storage.getItem('cartNum') || 0,
|
||||||
logoImg: storage.getItem('logoImg') || require('@/assets/images/logo2.png'),
|
logoImg: storage.getItem('logoImg') || require('@/assets/images/logo2.png'),
|
||||||
|
|||||||
8157
buyer/yarn.lock
10
im/.env
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
NODE_ENV=production
|
||||||
|
VUE_APP_PREVIEW=false
|
||||||
|
VUE_APP_API_BASE_URL=https://im-api.pickmall.cn
|
||||||
|
VUE_APP_WEB_SOCKET_URL=wss://im-api.pickmall.cn/lili/webSocket
|
||||||
|
VUE_APP_COMMON=https://common-api.pickmall.cn
|
||||||
|
VUE_APP_BUYER=https://buyer-api.pickmall.cn
|
||||||
|
VUE_APP_SELLER=https://store-api.pickmall.cn
|
||||||
|
VUE_APP_WEBSITE_NAME="LiLi IM"
|
||||||
|
VUE_APP_PC_URL=https://pc-b2b2c.pickmall.cn/
|
||||||
|
VUE_APP_PC_STORE=https://store-b2b2c.pickmall.cn/
|
||||||
10
im/.env.development
Normal file
@@ -0,0 +1,10 @@
|
|||||||
|
NODE_ENV=development
|
||||||
|
VUE_APP_PREVIEW=false
|
||||||
|
VUE_APP_API_BASE_URL=https://im-api.pickmall.cn
|
||||||
|
VUE_APP_WEB_SOCKET_URL=wss://im-api.pickmall.cn/lili/webSocket
|
||||||
|
VUE_APP_COMMON=https://common-api.pickmall.cn
|
||||||
|
VUE_APP_BUYER=https://buyer-api.pickmall.cn
|
||||||
|
VUE_APP_SELLER=https://store-api.pickmall.cn
|
||||||
|
VUE_APP_WEBSITE_NAME="LiLi IM"
|
||||||
|
VUE_APP_PC_URL=https://pc-b2b2c.pickmall.cn/
|
||||||
|
VUE_APP_PC_STORE=https://store-b2b2c.pickmall.cn/
|
||||||
23
im/.gitignore
vendored
Normal file
@@ -0,0 +1,23 @@
|
|||||||
|
.DS_Store
|
||||||
|
node_modules
|
||||||
|
/dist
|
||||||
|
|
||||||
|
|
||||||
|
# local env files
|
||||||
|
.env.local
|
||||||
|
.env.*.local
|
||||||
|
|
||||||
|
# Log files
|
||||||
|
npm-debug.log*
|
||||||
|
yarn-debug.log*
|
||||||
|
yarn-error.log*
|
||||||
|
pnpm-debug.log*
|
||||||
|
|
||||||
|
# Editor directories and files
|
||||||
|
.idea
|
||||||
|
.vscode
|
||||||
|
*.suo
|
||||||
|
*.ntvs*
|
||||||
|
*.njsproj
|
||||||
|
*.sln
|
||||||
|
*.sw?
|
||||||
21
im/LICENSE
Normal file
@@ -0,0 +1,21 @@
|
|||||||
|
MIT License
|
||||||
|
|
||||||
|
Copyright (c) 2020 YuanDong
|
||||||
|
|
||||||
|
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||||
|
of this software and associated documentation files (the "Software"), to deal
|
||||||
|
in the Software without restriction, including without limitation the rights
|
||||||
|
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||||
|
copies of the Software, and to permit persons to whom the Software is
|
||||||
|
furnished to do so, subject to the following conditions:
|
||||||
|
|
||||||
|
The above copyright notice and this permission notice shall be included in all
|
||||||
|
copies or substantial portions of the Software.
|
||||||
|
|
||||||
|
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||||
|
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||||
|
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||||
|
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||||
|
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||||
|
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
||||||
|
SOFTWARE.
|
||||||