初始化提交,将mall4uni放到mall4j项目下
53
mall4uni/App.vue
Normal file
@ -0,0 +1,53 @@
|
||||
<script>
|
||||
//app.js
|
||||
var http = require("./utils/http.js");
|
||||
var util = require('./utils/util.js')
|
||||
|
||||
export default {
|
||||
onLaunach: function() {},
|
||||
onShow: function() {
|
||||
// 判断浏览器环境
|
||||
var ua = navigator.userAgent.toLowerCase();
|
||||
if (ua.search(/MicroMessenger/i) > -1 && !uni.getStorageSync('appType')) {
|
||||
// 微信环境
|
||||
uni.setStorageSync('appType', 2)
|
||||
http.mpAuthLogin()
|
||||
}
|
||||
const state = util.getUrlKey('state')
|
||||
const code = util.getUrlKey('code')
|
||||
if ((state == 'needCode' || state == 'unNeedCode') && code) {
|
||||
let path = window.location.href
|
||||
if (path.indexOf('code=') > 0 && path.indexOf('&state=unNeedCode') > -1) {
|
||||
http.mpLogin(null, code)
|
||||
path = path.substring(0, path.indexOf('code=') - 1)
|
||||
history.replaceState({}, '', path)
|
||||
}
|
||||
http.getCartCount()
|
||||
}
|
||||
},
|
||||
globalData: {
|
||||
// 定义全局请求队列
|
||||
requestQueue: [],
|
||||
// 是否正在进行登陆
|
||||
isLanding: false,
|
||||
// 购物车商品数量
|
||||
totalCartCount: 0
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./app.css";
|
||||
|
||||
/* 隐藏头部 */
|
||||
uni-page-head {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 轮播图指示点 */
|
||||
uni-swiper .uni-swiper-dots-horizontal {
|
||||
bottom: 20px !important;
|
||||
}
|
||||
</style>
|
||||
661
mall4uni/LICENSE
Normal file
@ -0,0 +1,661 @@
|
||||
GNU AFFERO GENERAL PUBLIC LICENSE
|
||||
Version 3, 19 November 2007
|
||||
|
||||
Copyright (C) 2007 Free Software Foundation, Inc. <https://fsf.org/>
|
||||
Everyone is permitted to copy and distribute verbatim copies
|
||||
of this license document, but changing it is not allowed.
|
||||
|
||||
Preamble
|
||||
|
||||
The GNU Affero General Public License is a free, copyleft license for
|
||||
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
|
||||
to take away your freedom to share and change the works. By contrast,
|
||||
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
|
||||
software for all its users.
|
||||
|
||||
When we speak of free software, we are referring to freedom, not
|
||||
price. Our General Public Licenses are designed to make sure that you
|
||||
have the freedom to distribute copies of free software (and charge for
|
||||
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
|
||||
free programs, and that you know you can do these things.
|
||||
|
||||
Developers that use our General Public Licenses protect your rights
|
||||
with two steps: (1) assert copyright on the software, and (2) offer
|
||||
you this License which gives you legal permission to copy, distribute
|
||||
and/or modify the software.
|
||||
|
||||
A secondary benefit of defending all users' freedom is that
|
||||
improvements made in alternate versions of the program, if they
|
||||
receive widespread use, become available for other developers to
|
||||
incorporate. Many developers of free software are heartened and
|
||||
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.
|
||||
|
||||
The GNU Affero General Public License is designed specifically to
|
||||
ensure that, in such cases, the modified source code becomes available
|
||||
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.
|
||||
|
||||
An older license, called the Affero General Public License and
|
||||
published by Affero, was designed to accomplish similar goals. This is
|
||||
a different license, not a version of the Affero GPL, but Affero has
|
||||
released a new version of the Affero GPL which permits relicensing under
|
||||
this license.
|
||||
|
||||
The precise terms and conditions for copying, distribution and
|
||||
modification follow.
|
||||
|
||||
TERMS AND CONDITIONS
|
||||
|
||||
0. Definitions.
|
||||
|
||||
"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
|
||||
works, such as semiconductor masks.
|
||||
|
||||
"The Program" refers to any copyrightable work licensed under this
|
||||
License. Each licensee is addressed as "you". "Licensees" and
|
||||
"recipients" may be individuals or organizations.
|
||||
|
||||
To "modify" a work means to copy from or adapt all or part of the work
|
||||
in a fashion requiring copyright permission, other than the making of an
|
||||
exact copy. The resulting work is called a "modified version" of the
|
||||
earlier work or a work "based on" the earlier work.
|
||||
|
||||
A "covered work" means either the unmodified Program or a work based
|
||||
on the Program.
|
||||
|
||||
To "propagate" a work means to do anything with it that, without
|
||||
permission, would make you directly or secondarily liable for
|
||||
infringement under applicable copyright law, except executing it on a
|
||||
computer or modifying a private copy. Propagation includes copying,
|
||||
distribution (with or without modification), making available to the
|
||||
public, and in some countries other activities as well.
|
||||
|
||||
To "convey" a work means any kind of propagation that enables other
|
||||
parties to make or receive copies. Mere interaction with a user through
|
||||
a computer network, with no transfer of a copy, is not conveying.
|
||||
|
||||
An interactive user interface displays "Appropriate Legal Notices"
|
||||
to the extent that it includes a convenient and prominently visible
|
||||
feature that (1) displays an appropriate copyright notice, and (2)
|
||||
tells the user that there is no warranty for the work (except to the
|
||||
extent that warranties are provided), that licensees may convey the
|
||||
work under this License, and how to view a copy of this License. If
|
||||
the interface presents a list of user commands or options, such as a
|
||||
menu, a prominent item in the list meets this criterion.
|
||||
|
||||
1. Source Code.
|
||||
|
||||
The "source code" for a work means the preferred form of the work
|
||||
for making modifications to it. "Object code" means any non-source
|
||||
form of a work.
|
||||
|
||||
A "Standard Interface" means an interface that either is an official
|
||||
standard defined by a recognized standards body, or, in the case of
|
||||
interfaces specified for a particular programming language, one that
|
||||
is widely used among developers working in that language.
|
||||
|
||||
The "System Libraries" of an executable work include anything, other
|
||||
than the work as a whole, that (a) is included in the normal form of
|
||||
packaging a Major Component, but which is not part of that Major
|
||||
Component, and (b) serves only to enable use of the work with that
|
||||
Major Component, or to implement a Standard Interface for which an
|
||||
implementation is available to the public in source code form. A
|
||||
"Major Component", in this context, means a major essential component
|
||||
(kernel, window system, and so on) of the specific operating system
|
||||
(if any) on which the executable work runs, or a compiler used to
|
||||
produce the work, or an object code interpreter used to run it.
|
||||
|
||||
The "Corresponding Source" for a work in object code form means all
|
||||
the source code needed to generate, install, and (for an executable
|
||||
work) run the object code and to modify the work, including scripts to
|
||||
control those activities. However, it does not include the work's
|
||||
System Libraries, or general-purpose tools or generally available free
|
||||
programs which are used unmodified in performing those activities but
|
||||
which are not part of the work. For example, Corresponding Source
|
||||
includes interface definition files associated with source files for
|
||||
the work, and the source code for shared libraries and dynamically
|
||||
linked subprograms that the work is specifically designed to require,
|
||||
such as by intimate data communication or control flow between those
|
||||
subprograms and other parts of the work.
|
||||
|
||||
The Corresponding Source need not include anything that users
|
||||
can regenerate automatically from other parts of the Corresponding
|
||||
Source.
|
||||
|
||||
The Corresponding Source for a work in source code form is that
|
||||
same work.
|
||||
|
||||
2. Basic Permissions.
|
||||
|
||||
All rights granted under this License are granted for the term of
|
||||
copyright on the Program, and are irrevocable provided the stated
|
||||
conditions are met. This License explicitly affirms your unlimited
|
||||
permission to run the unmodified Program. The output from running a
|
||||
covered work is covered by this License only if the output, given its
|
||||
content, constitutes a covered work. This License acknowledges your
|
||||
rights of fair use or other equivalent, as provided by copyright law.
|
||||
|
||||
You may make, run and propagate covered works that you do not
|
||||
convey, without conditions so long as your license otherwise remains
|
||||
in force. You may convey covered works to others for the sole purpose
|
||||
of having them make modifications exclusively for you, or provide you
|
||||
with facilities for running those works, provided that you comply with
|
||||
the terms of this License in conveying all material for which you do
|
||||
not control copyright. Those thus making or running the covered works
|
||||
for you must do so exclusively on your behalf, under your direction
|
||||
and control, on terms that prohibit them from making any copies of
|
||||
your copyrighted material outside their relationship with you.
|
||||
|
||||
Conveying under any other circumstances is permitted solely under
|
||||
the conditions stated below. Sublicensing is not allowed; section 10
|
||||
makes it unnecessary.
|
||||
|
||||
3. Protecting Users' Legal Rights From Anti-Circumvention Law.
|
||||
|
||||
No covered work shall be deemed part of an effective technological
|
||||
measure under any applicable law fulfilling obligations under article
|
||||
11 of the WIPO copyright treaty adopted on 20 December 1996, or
|
||||
similar laws prohibiting or restricting circumvention of such
|
||||
measures.
|
||||
|
||||
When you convey a covered work, you waive any legal power to forbid
|
||||
circumvention of technological measures to the extent such circumvention
|
||||
is effected by exercising rights under this License with respect to
|
||||
the covered work, and you disclaim any intention to limit operation or
|
||||
modification of the work as a means of enforcing, against the work's
|
||||
users, your or third parties' legal rights to forbid circumvention of
|
||||
technological measures.
|
||||
|
||||
4. Conveying Verbatim Copies.
|
||||
|
||||
You may convey verbatim copies of the Program's source code as you
|
||||
receive it, in any medium, provided that you conspicuously and
|
||||
appropriately publish on each copy an appropriate copyright notice;
|
||||
keep intact all notices stating that this License and any
|
||||
non-permissive terms added in accord with section 7 apply to the code;
|
||||
keep intact all notices of the absence of any warranty; and give all
|
||||
recipients a copy of this License along with the Program.
|
||||
|
||||
You may charge any price or no price for each copy that you convey,
|
||||
and you may offer support or warranty protection for a fee.
|
||||
|
||||
5. Conveying Modified Source Versions.
|
||||
|
||||
You may convey a work based on the Program, or the modifications to
|
||||
produce it from the Program, in the form of source code under the
|
||||
terms of section 4, provided that you also meet all of these conditions:
|
||||
|
||||
a) The work must carry prominent notices stating that you modified
|
||||
it, and giving a relevant date.
|
||||
|
||||
b) The work must carry prominent notices stating that it is
|
||||
released under this License and any conditions added under section
|
||||
7. This requirement modifies the requirement in section 4 to
|
||||
"keep intact all notices".
|
||||
|
||||
c) You must license the entire work, as a whole, under this
|
||||
License to anyone who comes into possession of a copy. This
|
||||
License will therefore apply, along with any applicable section 7
|
||||
additional terms, to the whole of the work, and all its parts,
|
||||
regardless of how they are packaged. This License gives no
|
||||
permission to license the work in any other way, but it does not
|
||||
invalidate such permission if you have separately received it.
|
||||
|
||||
d) If the work has interactive user interfaces, each must display
|
||||
Appropriate Legal Notices; however, if the Program has interactive
|
||||
interfaces that do not display Appropriate Legal Notices, your
|
||||
work need not make them do so.
|
||||
|
||||
A compilation of a covered work with other separate and independent
|
||||
works, which are not by their nature extensions of the covered work,
|
||||
and which are not combined with it such as to form a larger program,
|
||||
in or on a volume of a storage or distribution medium, is called an
|
||||
"aggregate" if the compilation and its resulting copyright are not
|
||||
used to limit the access or legal rights of the compilation's users
|
||||
beyond what the individual works permit. Inclusion of a covered work
|
||||
in an aggregate does not cause this License to apply to the other
|
||||
parts of the aggregate.
|
||||
|
||||
6. Conveying Non-Source Forms.
|
||||
|
||||
You may convey a covered work in object code form under the terms
|
||||
of sections 4 and 5, provided that you also convey the
|
||||
machine-readable Corresponding Source under the terms of this License,
|
||||
in one of these ways:
|
||||
|
||||
a) Convey the object code in, or embodied in, a physical product
|
||||
(including a physical distribution medium), accompanied by the
|
||||
Corresponding Source fixed on a durable physical medium
|
||||
customarily used for software interchange.
|
||||
|
||||
b) Convey the object code in, or embodied in, a physical product
|
||||
(including a physical distribution medium), accompanied by a
|
||||
written offer, valid for at least three years and valid for as
|
||||
long as you offer spare parts or customer support for that product
|
||||
model, to give anyone who possesses the object code either (1) a
|
||||
copy of the Corresponding Source for all the software in the
|
||||
product that is covered by this License, on a durable physical
|
||||
medium customarily used for software interchange, for a price no
|
||||
more than your reasonable cost of physically performing this
|
||||
conveying of source, or (2) access to copy the
|
||||
Corresponding Source from a network server at no charge.
|
||||
|
||||
c) Convey individual copies of the object code with a copy of the
|
||||
written offer to provide the Corresponding Source. This
|
||||
alternative is allowed only occasionally and noncommercially, and
|
||||
only if you received the object code with such an offer, in accord
|
||||
with subsection 6b.
|
||||
|
||||
d) Convey the object code by offering access from a designated
|
||||
place (gratis or for a charge), and offer equivalent access to the
|
||||
Corresponding Source in the same way through the same place at no
|
||||
further charge. You need not require recipients to copy the
|
||||
Corresponding Source along with the object code. If the place to
|
||||
copy the object code is a network server, the Corresponding Source
|
||||
may be on a different server (operated by you or a third party)
|
||||
that supports equivalent copying facilities, provided you maintain
|
||||
clear directions next to the object code saying where to find the
|
||||
Corresponding Source. Regardless of what server hosts the
|
||||
Corresponding Source, you remain obligated to ensure that it is
|
||||
available for as long as needed to satisfy these requirements.
|
||||
|
||||
e) Convey the object code using peer-to-peer transmission, provided
|
||||
you inform other peers where the object code and Corresponding
|
||||
Source of the work are being offered to the general public at no
|
||||
charge under subsection 6d.
|
||||
|
||||
A separable portion of the object code, whose source code is excluded
|
||||
from the Corresponding Source as a System Library, need not be
|
||||
included in conveying the object code work.
|
||||
|
||||
A "User Product" is either (1) a "consumer product", which means any
|
||||
tangible personal property which is normally used for personal, family,
|
||||
or household purposes, or (2) anything designed or sold for incorporation
|
||||
into a dwelling. In determining whether a product is a consumer product,
|
||||
doubtful cases shall be resolved in favor of coverage. For a particular
|
||||
product received by a particular user, "normally used" refers to a
|
||||
typical or common use of that class of product, regardless of the status
|
||||
of the particular user or of the way in which the particular user
|
||||
actually uses, or expects or is expected to use, the product. A product
|
||||
is a consumer product regardless of whether the product has substantial
|
||||
commercial, industrial or non-consumer uses, unless such uses represent
|
||||
the only significant mode of use of the product.
|
||||
|
||||
"Installation Information" for a User Product means any methods,
|
||||
procedures, authorization keys, or other information required to install
|
||||
and execute modified versions of a covered work in that User Product from
|
||||
a modified version of its Corresponding Source. The information must
|
||||
suffice to ensure that the continued functioning of the modified object
|
||||
code is in no case prevented or interfered with solely because
|
||||
modification has been made.
|
||||
|
||||
If you convey an object code work under this section in, or with, or
|
||||
specifically for use in, a User Product, and the conveying occurs as
|
||||
part of a transaction in which the right of possession and use of the
|
||||
User Product is transferred to the recipient in perpetuity or for a
|
||||
fixed term (regardless of how the transaction is characterized), the
|
||||
Corresponding Source conveyed under this section must be accompanied
|
||||
by the Installation Information. But this requirement does not apply
|
||||
if neither you nor any third party retains the ability to install
|
||||
modified object code on the User Product (for example, the work has
|
||||
been installed in ROM).
|
||||
|
||||
The requirement to provide Installation Information does not include a
|
||||
requirement to continue to provide support service, warranty, or updates
|
||||
for a work that has been modified or installed by the recipient, or for
|
||||
the User Product in which it has been modified or installed. Access to a
|
||||
network may be denied when the modification itself materially and
|
||||
adversely affects the operation of the network or violates the rules and
|
||||
protocols for communication across the network.
|
||||
|
||||
Corresponding Source conveyed, and Installation Information provided,
|
||||
in accord with this section must be in a format that is publicly
|
||||
documented (and with an implementation available to the public in
|
||||
source code form), and must require no special password or key for
|
||||
unpacking, reading or copying.
|
||||
|
||||
7. Additional Terms.
|
||||
|
||||
"Additional permissions" are terms that supplement the terms of this
|
||||
License by making exceptions from one or more of its conditions.
|
||||
Additional permissions that are applicable to the entire Program shall
|
||||
be treated as though they were included in this License, to the extent
|
||||
that they are valid under applicable law. If additional permissions
|
||||
apply only to part of the Program, that part may be used separately
|
||||
under those permissions, but the entire Program remains governed by
|
||||
this License without regard to the additional permissions.
|
||||
|
||||
When you convey a copy of a covered work, you may at your option
|
||||
remove any additional permissions from that copy, or from any part of
|
||||
it. (Additional permissions may be written to require their own
|
||||
removal in certain cases when you modify the work.) You may place
|
||||
additional permissions on material, added by you to a covered work,
|
||||
for which you have or can give appropriate copyright permission.
|
||||
|
||||
Notwithstanding any other provision of this License, for material you
|
||||
add to a covered work, you may (if authorized by the copyright holders of
|
||||
that material) supplement the terms of this License with terms:
|
||||
|
||||
a) Disclaiming warranty or limiting liability differently from the
|
||||
terms of sections 15 and 16 of this License; or
|
||||
|
||||
b) Requiring preservation of specified reasonable legal notices or
|
||||
author attributions in that material or in the Appropriate Legal
|
||||
Notices displayed by works containing it; or
|
||||
|
||||
c) Prohibiting misrepresentation of the origin of that material, or
|
||||
requiring that modified versions of such material be marked in
|
||||
reasonable ways as different from the original version; or
|
||||
|
||||
d) Limiting the use for publicity purposes of names of licensors or
|
||||
authors of the material; or
|
||||
|
||||
e) Declining to grant rights under trademark law for use of some
|
||||
trade names, trademarks, or service marks; or
|
||||
|
||||
f) Requiring indemnification of licensors and authors of that
|
||||
material by anyone who conveys the material (or modified versions of
|
||||
it) with contractual assumptions of liability to the recipient, for
|
||||
any liability that these contractual assumptions directly impose on
|
||||
those licensors and authors.
|
||||
|
||||
All other non-permissive additional terms are considered "further
|
||||
restrictions" within the meaning of section 10. If the Program as you
|
||||
received it, or any part of it, contains a notice stating that it is
|
||||
governed by this License along with a term that is a further
|
||||
restriction, you may remove that term. If a license document contains
|
||||
a further restriction but permits relicensing or conveying under this
|
||||
License, you may add to a covered work material governed by the terms
|
||||
of that license document, provided that the further restriction does
|
||||
not survive such relicensing or conveying.
|
||||
|
||||
If you add terms to a covered work in accord with this section, you
|
||||
must place, in the relevant source files, a statement of the
|
||||
additional terms that apply to those files, or a notice indicating
|
||||
where to find the applicable terms.
|
||||
|
||||
Additional terms, permissive or non-permissive, may be stated in the
|
||||
form of a separately written license, or stated as exceptions;
|
||||
the above requirements apply either way.
|
||||
|
||||
8. Termination.
|
||||
|
||||
You may not propagate or modify a covered work except as expressly
|
||||
provided under this License. Any attempt otherwise to propagate or
|
||||
modify it is void, and will automatically terminate your rights under
|
||||
this License (including any patent licenses granted under the third
|
||||
paragraph of section 11).
|
||||
|
||||
However, if you cease all violation of this License, then your
|
||||
license from a particular copyright holder is reinstated (a)
|
||||
provisionally, unless and until the copyright holder explicitly and
|
||||
finally terminates your license, and (b) permanently, if the copyright
|
||||
holder fails to notify you of the violation by some reasonable means
|
||||
prior to 60 days after the cessation.
|
||||
|
||||
Moreover, your license from a particular copyright holder is
|
||||
reinstated permanently if the copyright holder notifies you of the
|
||||
violation by some reasonable means, this is the first time you have
|
||||
received notice of violation of this License (for any work) from that
|
||||
copyright holder, and you cure the violation prior to 30 days after
|
||||
your receipt of the notice.
|
||||
|
||||
Termination of your rights under this section does not terminate the
|
||||
licenses of parties who have received copies or rights from you under
|
||||
this License. If your rights have been terminated and not permanently
|
||||
reinstated, you do not qualify to receive new licenses for the same
|
||||
material under section 10.
|
||||
|
||||
9. Acceptance Not Required for Having Copies.
|
||||
|
||||
You are not required to accept this License in order to receive or
|
||||
run a copy of the Program. Ancillary propagation of a covered work
|
||||
occurring solely as a consequence of using peer-to-peer transmission
|
||||
to receive a copy likewise does not require acceptance. However,
|
||||
nothing other than this License grants you permission to propagate or
|
||||
modify any covered work. These actions infringe copyright if you do
|
||||
not accept this License. Therefore, by modifying or propagating a
|
||||
covered work, you indicate your acceptance of this License to do so.
|
||||
|
||||
10. Automatic Licensing of Downstream Recipients.
|
||||
|
||||
Each time you convey a covered work, the recipient automatically
|
||||
receives a license from the original licensors, to run, modify and
|
||||
propagate that work, subject to this License. You are not responsible
|
||||
for enforcing compliance by third parties with this License.
|
||||
|
||||
An "entity transaction" is a transaction transferring control of an
|
||||
organization, or substantially all assets of one, or subdividing an
|
||||
organization, or merging organizations. If propagation of a covered
|
||||
work results from an entity transaction, each party to that
|
||||
transaction who receives a copy of the work also receives whatever
|
||||
licenses to the work the party's predecessor in interest had or could
|
||||
give under the previous paragraph, plus a right to possession of the
|
||||
Corresponding Source of the work from the predecessor in interest, if
|
||||
the predecessor has it or can get it with reasonable efforts.
|
||||
|
||||
You may not impose any further restrictions on the exercise of the
|
||||
rights granted or affirmed under this License. For example, you may
|
||||
not impose a license fee, royalty, or other charge for exercise of
|
||||
rights granted under this License, and you may not initiate litigation
|
||||
(including a cross-claim or counterclaim in a lawsuit) alleging that
|
||||
any patent claim is infringed by making, using, selling, offering for
|
||||
sale, or importing the Program or any portion of it.
|
||||
|
||||
11. Patents.
|
||||
|
||||
A "contributor" is a copyright holder who authorizes use under this
|
||||
License of the Program or a work on which the Program is based. The
|
||||
work thus licensed is called the contributor's "contributor version".
|
||||
|
||||
A contributor's "essential patent claims" are all patent claims
|
||||
owned or controlled by the contributor, whether already acquired or
|
||||
hereafter acquired, that would be infringed by some manner, permitted
|
||||
by this License, of making, using, or selling its contributor version,
|
||||
but do not include claims that would be infringed only as a
|
||||
consequence of further modification of the contributor version. For
|
||||
purposes of this definition, "control" includes the right to grant
|
||||
patent sublicenses in a manner consistent with the requirements of
|
||||
this License.
|
||||
|
||||
Each contributor grants you a non-exclusive, worldwide, royalty-free
|
||||
patent license under the contributor's essential patent claims, to
|
||||
make, use, sell, offer for sale, import and otherwise run, modify and
|
||||
propagate the contents of its contributor version.
|
||||
|
||||
In the following three paragraphs, a "patent license" is any express
|
||||
agreement or commitment, however denominated, not to enforce a patent
|
||||
(such as an express permission to practice a patent or covenant not to
|
||||
sue for patent infringement). To "grant" such a patent license to a
|
||||
party means to make such an agreement or commitment not to enforce a
|
||||
patent against the party.
|
||||
|
||||
If you convey a covered work, knowingly relying on a patent license,
|
||||
and the Corresponding Source of the work is not available for anyone
|
||||
to copy, free of charge and under the terms of this License, through a
|
||||
publicly available network server or other readily accessible means,
|
||||
then you must either (1) cause the Corresponding Source to be so
|
||||
available, or (2) arrange to deprive yourself of the benefit of the
|
||||
patent license for this particular work, or (3) arrange, in a manner
|
||||
consistent with the requirements of this License, to extend the patent
|
||||
license to downstream recipients. "Knowingly relying" means you have
|
||||
actual knowledge that, but for the patent license, your conveying the
|
||||
covered work in a country, or your recipient's use of the covered work
|
||||
in a country, would infringe one or more identifiable patents in that
|
||||
country that you have reason to believe are valid.
|
||||
|
||||
If, pursuant to or in connection with a single transaction or
|
||||
arrangement, you convey, or propagate by procuring conveyance of, a
|
||||
covered work, and grant a patent license to some of the parties
|
||||
receiving the covered work authorizing them to use, propagate, modify
|
||||
or convey a specific copy of the covered work, then the patent license
|
||||
you grant is automatically extended to all recipients of the covered
|
||||
work and works based on it.
|
||||
|
||||
A patent license is "discriminatory" if it does not include within
|
||||
the scope of its coverage, prohibits the exercise of, or is
|
||||
conditioned on the non-exercise of one or more of the rights that are
|
||||
specifically granted under this License. You may not convey a covered
|
||||
work if you are a party to an arrangement with a third party that is
|
||||
in the business of distributing software, under which you make payment
|
||||
to the third party based on the extent of your activity of conveying
|
||||
the work, and under which the third party grants, to any of the
|
||||
parties who would receive the covered work from you, a discriminatory
|
||||
patent license (a) in connection with copies of the covered work
|
||||
conveyed by you (or copies made from those copies), or (b) primarily
|
||||
for and in connection with specific products or compilations that
|
||||
contain the covered work, unless you entered into that arrangement,
|
||||
or that patent license was granted, prior to 28 March 2007.
|
||||
|
||||
Nothing in this License shall be construed as excluding or limiting
|
||||
any implied license or other defenses to infringement that may
|
||||
otherwise be available to you under applicable patent law.
|
||||
|
||||
12. No Surrender of Others' Freedom.
|
||||
|
||||
If conditions are imposed on you (whether by court order, agreement or
|
||||
otherwise) that contradict the conditions of this License, they do not
|
||||
excuse you from the conditions of this License. If you cannot convey a
|
||||
covered work so as to satisfy simultaneously your obligations under this
|
||||
License and any other pertinent obligations, then as a consequence you may
|
||||
not convey it at all. For example, if you agree to terms that obligate you
|
||||
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
|
||||
License would be to refrain entirely from conveying the Program.
|
||||
|
||||
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
|
||||
permission to link or combine any covered work with a work licensed
|
||||
under version 3 of the GNU General Public License into a single
|
||||
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,
|
||||
but the work with which it is combined will remain governed by version
|
||||
3 of the GNU General Public License.
|
||||
|
||||
14. Revised Versions of this License.
|
||||
|
||||
The Free Software Foundation may publish revised and/or new versions of
|
||||
the GNU Affero General Public License from time to time. Such new versions
|
||||
will be similar in spirit to the present version, but may differ in detail to
|
||||
address new problems or concerns.
|
||||
|
||||
Each version is given a distinguishing version number. If the
|
||||
Program specifies that a certain numbered version of the GNU Affero General
|
||||
Public License "or any later version" applies to it, you have the
|
||||
option of following the terms and conditions either of that numbered
|
||||
version or of any later version published by the Free Software
|
||||
Foundation. If the Program does not specify a version number of the
|
||||
GNU Affero General Public License, you may choose any version ever published
|
||||
by the Free Software Foundation.
|
||||
|
||||
If the Program specifies that a proxy can decide which future
|
||||
versions of the GNU Affero General Public License can be used, that proxy's
|
||||
public statement of acceptance of a version permanently authorizes you
|
||||
to choose that version for the Program.
|
||||
|
||||
Later license versions may give you additional or different
|
||||
permissions. However, no additional obligations are imposed on any
|
||||
author or copyright holder as a result of your choosing to follow a
|
||||
later version.
|
||||
|
||||
15. Disclaimer of Warranty.
|
||||
|
||||
THERE IS NO WARRANTY FOR THE PROGRAM, TO THE EXTENT PERMITTED BY
|
||||
APPLICABLE LAW. EXCEPT WHEN OTHERWISE STATED IN WRITING THE COPYRIGHT
|
||||
HOLDERS AND/OR OTHER PARTIES PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY
|
||||
OF ANY KIND, EITHER EXPRESSED OR IMPLIED, INCLUDING, BUT NOT LIMITED TO,
|
||||
THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
|
||||
PURPOSE. THE ENTIRE RISK AS TO THE QUALITY AND PERFORMANCE OF THE PROGRAM
|
||||
IS WITH YOU. SHOULD THE PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF
|
||||
ALL NECESSARY SERVICING, REPAIR OR CORRECTION.
|
||||
|
||||
16. Limitation of Liability.
|
||||
|
||||
IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING
|
||||
WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MODIFIES AND/OR CONVEYS
|
||||
THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, INCLUDING ANY
|
||||
GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING OUT OF THE
|
||||
USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED TO LOSS OF
|
||||
DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY YOU OR THIRD
|
||||
PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER PROGRAMS),
|
||||
EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE POSSIBILITY OF
|
||||
SUCH DAMAGES.
|
||||
|
||||
17. Interpretation of Sections 15 and 16.
|
||||
|
||||
If the disclaimer of warranty and limitation of liability provided
|
||||
above cannot be given local legal effect according to their terms,
|
||||
reviewing courts shall apply local law that most closely approximates
|
||||
an absolute waiver of all civil liability in connection with the
|
||||
Program, unless a warranty or assumption of liability accompanies a
|
||||
copy of the Program in return for a fee.
|
||||
|
||||
END OF TERMS AND CONDITIONS
|
||||
|
||||
How to Apply These Terms to Your New Programs
|
||||
|
||||
If you develop a new program, and you want it to be of the greatest
|
||||
possible use to the public, the best way to achieve this is to make it
|
||||
free software which everyone can redistribute and change under these terms.
|
||||
|
||||
To do so, attach the following notices to the program. It is safest
|
||||
to attach them to the start of each source file to most effectively
|
||||
state the exclusion of warranty; and each file should have at least
|
||||
the "copyright" line and a pointer to where the full notice is found.
|
||||
|
||||
<one line to give the program's name and a brief idea of what it does.>
|
||||
Copyright (C) <year> <name of author>
|
||||
|
||||
This program is free software: you can redistribute it and/or modify
|
||||
it under the terms of the GNU Affero General Public License as published
|
||||
by the Free Software Foundation, either version 3 of the License, or
|
||||
(at your option) any later version.
|
||||
|
||||
This program is distributed in the hope that it will be useful,
|
||||
but WITHOUT ANY WARRANTY; without even the implied warranty of
|
||||
MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
|
||||
GNU Affero General Public License for more details.
|
||||
|
||||
You should have received a copy of the GNU Affero General Public License
|
||||
along with this program. If not, see <https://www.gnu.org/licenses/>.
|
||||
|
||||
Also add information on how to contact you by electronic and paper mail.
|
||||
|
||||
If your software can interact with users remotely through a computer
|
||||
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
|
||||
interface could display a "Source" link that leads users to an archive
|
||||
of the code. There are many ways you could offer source, and different
|
||||
solutions will be better for different programs; see section 13 for the
|
||||
specific requirements.
|
||||
|
||||
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.
|
||||
For more information on this, and how to apply and follow the GNU AGPL, see
|
||||
<https://www.gnu.org/licenses/>.
|
||||
55
mall4uni/README.md
Normal file
@ -0,0 +1,55 @@
|
||||
一个基于uni-app的轻量级、前后端分离、拥有完整sku和下单流程的完全开源商城 uni-appH5端
|
||||
|
||||
|
||||
|
||||
该项目仅供学习参考、可供个人学习使用、如需商用联系作者进行授权,否则必将追究法律责任
|
||||
|
||||
|
||||
|
||||
## 前言
|
||||
|
||||
`亚米商城`项目致力于为中小企业打造一个完整、易于维护的开源的电商系统,采用现阶段流行技术实现。后台管理系统包含商品管理、订单管理、运费模板、规格管理、会员管理、运营管理、内容管理、统计报表、权限管理、设置等模块。
|
||||
|
||||
|
||||
|
||||
## 项目链接
|
||||
|
||||
java后台:https://github.com/gz-yami/mall4j
|
||||
|
||||
vue后台:https://github.com/gz-yami/mall4v
|
||||
|
||||
小程序:https://github.com/gz-yami/mall4m
|
||||
|
||||
uni-app:https://gitee.com/gz-yami/mall4uni
|
||||
|
||||
|
||||
|
||||
## 演示地址
|
||||
|
||||
后台:<http://mall4j-admin.gz-yami.com> 账号:admin/123456
|
||||
|
||||
小程序:1. 扫描二维码
|
||||
|
||||

|
||||
|
||||
2. 搜索小程序 **亚米商城**
|
||||
|
||||
|
||||
|
||||
## 相关截图
|
||||
|
||||

|
||||
|
||||
|
||||
|
||||
## 提交反馈
|
||||
|
||||
提问之前,请先阅读[提问的智慧](https://github.com/ryanhanwu/How-To-Ask-Questions-The-Smart-Way/blob/master/README-zh_CN.md):
|
||||
|
||||
- QQ群:722835385
|
||||
|
||||

|
||||
|
||||
- 论坛:<http://bbs.gz-yami.com>
|
||||
|
||||
- 商务邮箱:yamitech@163.com
|
||||
115
mall4uni/app.css
Normal file
@ -0,0 +1,115 @@
|
||||
/**app.wxss**/
|
||||
.container {
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
color: #333;
|
||||
font-family: helvetica,'Heiti SC',PingFangSC-Light;
|
||||
}
|
||||
.price{
|
||||
font-family: Arial;
|
||||
display: inline-block;
|
||||
color: #eb2444;
|
||||
padding-bottom:10rpx;
|
||||
padding-left:10rpx;
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
/* 价格数字显示不同大小 */
|
||||
|
||||
.symbol {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.big-num {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.small-num {
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
/*
|
||||
*改变checkbox样式
|
||||
*自定义样式
|
||||
*/
|
||||
/* reg */
|
||||
uni-checkbox-group {
|
||||
width: 100% !important;
|
||||
}
|
||||
uni-checkbox-group uni-label{
|
||||
width: 33% !important;
|
||||
display: inline-flex;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
/*checkbox 选项框大小 */
|
||||
uni-checkbox .uni-checkbox-input{
|
||||
width: 38rpx !important;
|
||||
height: 38rpx !important;
|
||||
border-radius: 50%!important;
|
||||
}
|
||||
/*checkbox选中后样式 */
|
||||
uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked{
|
||||
background: #e43130;
|
||||
border: 1px solid transparent !important;
|
||||
}
|
||||
/*checkbox选中后图标样式 */
|
||||
uni-checkbox .uni-checkbox-input.uni-checkbox-input-checked::before{
|
||||
display: inline-block;
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
line-height: 20rpx;
|
||||
text-align: center;
|
||||
font-size: 18rpx;
|
||||
color: #fff;
|
||||
background: transparent;
|
||||
transform: translate(-60%, -50%) scale(1);
|
||||
-webkit-transform: translate(-60%, -50%) scale(1);
|
||||
}
|
||||
|
||||
/*
|
||||
*改变radio样式
|
||||
*自定义样式
|
||||
*/
|
||||
/* 未选中的 背景样式 */
|
||||
uni-radio .uni-radio-input{
|
||||
height: 36rpx;
|
||||
width: 36rpx;
|
||||
border-radius: 50%;
|
||||
background: transparent;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
/* 选中后的 背景样式 */
|
||||
uni-radio .uni-radio-input.uni-radio-input-checked{
|
||||
border: none !important;
|
||||
background: #e43130 !important;
|
||||
}
|
||||
/* 选中后的 对勾样式 */
|
||||
uni-radio .uni-radio-input.uni-radio-input-checked::before{
|
||||
border-radius: 50%;
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
line-height: 32rpx;
|
||||
text-align: center;
|
||||
font-size: 20rpx;
|
||||
color:#fff;
|
||||
background: #e43130;
|
||||
border-radius: 50%;
|
||||
transform: translate(-50%, -50%) scale(1);
|
||||
-webkit-transform: translate(-50%, -50%) scale(1);
|
||||
}
|
||||
|
||||
|
||||
/* 底部按钮兼容 iPhone X以上 */
|
||||
@media screen and (width: 375px) and (height: 812px){
|
||||
.container {
|
||||
padding-bottom: 70px;
|
||||
}
|
||||
}
|
||||
|
||||
@media screen and (width: 414px) and (height: 736px){
|
||||
.container {
|
||||
padding-bottom: 70px;
|
||||
}
|
||||
}
|
||||
118
mall4uni/components/coupon/coupon.css
Normal file
@ -0,0 +1,118 @@
|
||||
.coupon-item{
|
||||
margin: 15px 0;
|
||||
position: relative;
|
||||
box-shadow: 1px 1px 3px rgba(0,0,0,0.15);
|
||||
height: 95px;
|
||||
background: #fff;
|
||||
}
|
||||
.coupon-item .left{
|
||||
float: left;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
border-left: 1px dashed #fff;
|
||||
padding: 20px 0;
|
||||
background: -webkit-gradient(linear,left top,right top,from(#F45C43),to(#eb2444));
|
||||
background: -o-linear-gradient(left,#F45C43,#eb2444);
|
||||
background: linear-gradient(left,#F45C43,#eb2444);
|
||||
background: -webkit-linear-gradient(left,#F45C43,#eb2444);
|
||||
width: 260rpx;
|
||||
height: 55px;
|
||||
}
|
||||
.coupon-item .left .num{
|
||||
font-weight:600;
|
||||
font-size:36rpx;
|
||||
height:70rpx;
|
||||
line-height:70rpx;
|
||||
font-family:arial;
|
||||
}
|
||||
.coupon-item .left .num .coupon-price{
|
||||
font-size: 72rpx;
|
||||
line-height: 72rpx;
|
||||
display: inline-block;
|
||||
font-family: arial;
|
||||
}
|
||||
.coupon-item .left .condition{
|
||||
font-size: 28rpx;
|
||||
line-height: 28rpx;
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
padding: 0 2px;
|
||||
font-family: arial;
|
||||
}
|
||||
.coupon-item .right{
|
||||
margin-left: 280rpx;
|
||||
padding: 5px;
|
||||
position: relative;
|
||||
}
|
||||
.coupon-item .right .c-des{
|
||||
height: 30px;
|
||||
font-size: 26rpx;
|
||||
line-height: 30px;
|
||||
overflow: hidden;
|
||||
font-weight: 600;
|
||||
}
|
||||
.coupon-item .right .c-des .c-type{
|
||||
font-size: 24rpx;
|
||||
background: #fdf0f0;
|
||||
color: #eb2444;
|
||||
border-radius: 8px;
|
||||
padding:3px 10px;
|
||||
}
|
||||
.coupon-item .right .c-date{
|
||||
font-size: 24rpx;
|
||||
margin-top:25px;
|
||||
}
|
||||
.coupon-item .right .c-date .c-data-info{
|
||||
font-family: arial;
|
||||
}
|
||||
.coupon-item .right .c-date .c-btn{
|
||||
position: absolute;
|
||||
bottom:0;
|
||||
right:10px;
|
||||
color: #fff;
|
||||
font-size: 24rpx;
|
||||
font-family: arial;
|
||||
border-radius: 14px;
|
||||
padding:3px 7px;
|
||||
/* background: -webkit-gradient(linear,left top,right top,from(#6c96da),to(#6b83d7));
|
||||
background: -o-linear-gradient(left,#6c96da,#6b83d7);
|
||||
background: linear-gradient(left,#6c96da,#6b83d7);
|
||||
background: -webkit-linear-gradient(left,#6c96da,#6b83d7); */
|
||||
background: #eb2444;
|
||||
border: 1px solid #eb2444;
|
||||
}
|
||||
|
||||
.coupon-item .right .c-date .c-btn.get-btn{
|
||||
background: #fff;
|
||||
border: 1px solid #eb2444;
|
||||
color:#eb2444;
|
||||
}
|
||||
|
||||
.coupon-item.gray .left{
|
||||
background: #bbb;
|
||||
}
|
||||
|
||||
.coupon-item.gray .right .c-des .c-type{
|
||||
background: #bbb;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.coupon-item.gray .right .c-date .c-btn{
|
||||
display: none;
|
||||
}
|
||||
|
||||
.coupon-item .tag-img{
|
||||
position: absolute;
|
||||
top:0;
|
||||
right:0;
|
||||
width:120rpx;
|
||||
height:120rpx;
|
||||
}
|
||||
|
||||
.coupon-item .sel-btn{
|
||||
position:absolute;
|
||||
right:10px;
|
||||
top:35px;
|
||||
}
|
||||
104
mall4uni/components/coupon/coupon.vue
Normal file
@ -0,0 +1,104 @@
|
||||
<template>
|
||||
<view :class="'coupon-item ' + (canUse?'':'gray')">
|
||||
<view class="left">
|
||||
<view class="num" v-if="item.couponType == 1">
|
||||
¥
|
||||
<text class="coupon-price">{{item.reduceAmount}}</text>
|
||||
</view>
|
||||
<view class="num" v-if="item.couponType == 2">
|
||||
<text class="coupon-price">{{item.couponDiscount}}</text>折
|
||||
</view>
|
||||
<view class="condition">
|
||||
满{{item.cashCondition}}元可用
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="c-des">
|
||||
<text class="c-type">{{item.suitableProdType==0?'通用':'商品'}}</text> {{item.suitableProdType==0?'全场通用':'指定商品可用'}}
|
||||
</view>
|
||||
<view class="c-date">
|
||||
<text v-if="showTimeType==1 && item.couponType==2" class="c-data-info">领券{{item.validDays}}天后失效</text>
|
||||
<text v-else class="c-data-info">{{item.startTime}}~{{item.endTime}}</text>
|
||||
<text class="c-btn" v-if="item.canReceive && !order" @tap="receiveCoupon">立即领取</text>
|
||||
<text class="c-btn get-btn" v-if="!item.canReceive && !order" @tap="useCoupon">立即使用</text>
|
||||
</view>
|
||||
<view v-if="order && canUse" class="sel-btn">
|
||||
<checkbox color="#eb2444" :data-couponid="item.couponId" :checked="item.choose" @tap="checkCoupon"></checkbox>
|
||||
</view>
|
||||
</view>
|
||||
<image class="tag-img" src="/static/images/icon/coupon-used.png" v-if="type==1"></image>
|
||||
<image class="tag-img" src="/static/images/icon/coupon-ot.png" v-if="type==2"></image>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
var http = require("../../utils/http.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
stsType: 4
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {
|
||||
item: Object,
|
||||
type: Number,
|
||||
order: Boolean,
|
||||
canUse: Boolean,
|
||||
index: Number,
|
||||
showTimeType: Number
|
||||
},
|
||||
// 生命周期函数,可以为函数,或一个在methods段中定义的方法名
|
||||
beforeMount: function () {//console.log(this.data.item);
|
||||
},
|
||||
methods: {
|
||||
receiveCoupon() {
|
||||
var couponId = this.item.couponId;
|
||||
http.request({
|
||||
url: "/p/myCoupon/receive",
|
||||
method: "POST",
|
||||
data: couponId,
|
||||
callBack: () => {
|
||||
var coupon = this.item;
|
||||
coupon.canReceive = false;
|
||||
this.setData({
|
||||
item: coupon
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
checkCoupon(e) {
|
||||
// this.triggerEvent('checkCoupon', this.data.index);
|
||||
this.$emit('checkCoupon', {
|
||||
detail: {
|
||||
couponId: e.currentTarget.dataset.couponid
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 立即使用
|
||||
*/
|
||||
useCoupon() {
|
||||
var url = '/pages/prod-classify/prod-classify?sts=' + this.stsType;
|
||||
var id = this.item.couponId;
|
||||
var title = "优惠券活动商品";
|
||||
|
||||
if (id) {
|
||||
url += "&tagid=" + id + "&title=" + title;
|
||||
}
|
||||
|
||||
uni.navigateTo({
|
||||
url: url
|
||||
});
|
||||
}
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./coupon.css";
|
||||
</style>
|
||||
66
mall4uni/components/production/production.css
Normal file
@ -0,0 +1,66 @@
|
||||
|
||||
.prod-items {
|
||||
width: 375rpx;
|
||||
float: left;
|
||||
background: #fff;
|
||||
padding-bottom: 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
prod:nth-child(2n-1) .prod-items {
|
||||
padding: 20rpx 10rpx 10rpx 20rpx;
|
||||
}
|
||||
|
||||
prod:nth-child(2n) .prod-items {
|
||||
padding: 20rpx 20rpx 10rpx 10rpx;
|
||||
}
|
||||
|
||||
.hot-imagecont .hotsaleimg {
|
||||
width:345rpx;
|
||||
height:345rpx;
|
||||
|
||||
}
|
||||
|
||||
.hot-text .hotprod-text {
|
||||
height: 76rpx;
|
||||
font-size: 28rpx;
|
||||
display: -webkit-box;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.prod-items .hot-imagecont {
|
||||
border-radius: 8rpx;
|
||||
text-align: center;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.prod-items .hot-text {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.prod-items .hot-text .prod-info {
|
||||
font-size: 20rpx;
|
||||
color: #777;
|
||||
margin-top: 8rpx;
|
||||
}
|
||||
|
||||
.prod-items .hot-text .prod-text-info {
|
||||
position: relative;
|
||||
height: 50rpx;
|
||||
line-height: 70rpx;
|
||||
font-family: Arial;
|
||||
}
|
||||
|
||||
.prod-items .hot-text .prod-text-info .price {
|
||||
color: #eb2444;
|
||||
}
|
||||
.deadline-price{
|
||||
font-size: 22rpx;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
47
mall4uni/components/production/production.vue
Normal file
@ -0,0 +1,47 @@
|
||||
<template>
|
||||
<view class="prod-items" @tap="toProdPage" :data-prodid="item.prodId">
|
||||
<view class="hot-imagecont">
|
||||
<image :src="item.pic" class="hotsaleimg"></image>
|
||||
</view>
|
||||
<view class="hot-text">
|
||||
<view class="hotprod-text">{{item.prodName}}</view>
|
||||
<view class="prod-info" v-if="sts==6">{{item.prodCommNumber}}评价 {{item.positiveRating}}%好评</view>
|
||||
<view class="prod-text-info">
|
||||
<view class="price">
|
||||
<text v-if="sts==2" class="deadline-price">限时价</text>
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(item.price)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(item.price)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script module="wxs" lang="wxs" src="../../wxs/number.wxs"></script>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {
|
||||
item: Object,
|
||||
sts: Number
|
||||
},
|
||||
methods: {
|
||||
toProdPage: function (e) {
|
||||
var prodid = e.currentTarget.dataset.prodid;
|
||||
uni.navigateTo({
|
||||
url: '/pages/prod/prod?prodid=' + prodid
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./production.css";
|
||||
</style>
|
||||
37
mall4uni/main.js
Normal file
@ -0,0 +1,37 @@
|
||||
import Vue from 'vue';
|
||||
import App from './App';
|
||||
|
||||
Vue.config.productionTip = false;
|
||||
|
||||
|
||||
Vue.mixin({
|
||||
methods: {
|
||||
setData: function(obj) {
|
||||
let that = this;
|
||||
let keys = [];
|
||||
let val, data;
|
||||
Object.keys(obj).forEach(function(key) {
|
||||
keys = key.split('.');
|
||||
val = obj[key];
|
||||
data = that.$data;
|
||||
keys.forEach(function(key2, index) {
|
||||
if (index + 1 == keys.length) {
|
||||
that.$set(data, key2, val);
|
||||
} else {
|
||||
if (!data[key2]) {
|
||||
that.$set(data, key2, {});
|
||||
}
|
||||
}
|
||||
data = data[key2];
|
||||
})
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
App.mpType = 'app';
|
||||
|
||||
const app = new Vue({
|
||||
...App
|
||||
});
|
||||
app.$mount();
|
||||
92
mall4uni/manifest.json
Normal file
@ -0,0 +1,92 @@
|
||||
{
|
||||
"name" : "yamikejimall4j",
|
||||
"appid" : "",
|
||||
"description" : "",
|
||||
"versionName" : "1.0.0",
|
||||
"versionCode" : "100",
|
||||
"transformPx" : false,
|
||||
"app-plus" : {
|
||||
"usingComponents" : true,
|
||||
"nvueCompiler" : "uni-app",
|
||||
"compilerVersion" : 3,
|
||||
"splashscreen" : {
|
||||
"alwaysShowBeforeRender" : true,
|
||||
"waiting" : true,
|
||||
"autoclose" : true,
|
||||
"delay" : 0
|
||||
},
|
||||
"modules" : {},
|
||||
"distribute" : {
|
||||
"android" : {
|
||||
"permissions" : [
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
|
||||
"<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
|
||||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
|
||||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
|
||||
"<uses-permission android:name=\"android.permission.CALL_PHONE\"/>",
|
||||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
|
||||
"<uses-feature android:name=\"android.hardware.camera\"/>",
|
||||
"<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
|
||||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
|
||||
]
|
||||
},
|
||||
"ios" : {},
|
||||
"sdkConfigs" : {}
|
||||
}
|
||||
},
|
||||
"quickapp" : {},
|
||||
"mp-weixin" : {
|
||||
"appid" : "wx6fa71e69231a4fa4",
|
||||
"setting" : {
|
||||
"urlCheck" : false
|
||||
},
|
||||
"usingComponents" : true,
|
||||
"permission" : {
|
||||
"scope.userLocation" : {
|
||||
"desc" : "你的位置信息将用于小程序位置接口的效果展示"
|
||||
}
|
||||
},
|
||||
"plugins" : {}
|
||||
},
|
||||
"mp-alipay" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-baidu" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"mp-toutiao" : {
|
||||
"usingComponents" : true
|
||||
},
|
||||
"h5" : {
|
||||
"title" : "H5商城",
|
||||
"domain" : "",
|
||||
"devServer" : {
|
||||
"disableHostCheck" : true,
|
||||
"proxy" : {
|
||||
"/api" : {
|
||||
"target" : "http://192.168.1.17:8286",
|
||||
"pathRewrite" : {
|
||||
"^/api" : ""
|
||||
}
|
||||
}
|
||||
},
|
||||
"port" : 8989
|
||||
},
|
||||
"router" : {
|
||||
"mode" : "history"
|
||||
}
|
||||
}
|
||||
}
|
||||
50
mall4uni/package-lock.json
generated
Normal file
@ -0,0 +1,50 @@
|
||||
{
|
||||
"name": "mall4uni",
|
||||
"version": "1.0.0",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
"decode-uri-component": {
|
||||
"version": "0.2.0",
|
||||
"resolved": "https://registry.npmjs.org/decode-uri-component/-/decode-uri-component-0.2.0.tgz",
|
||||
"integrity": "sha1-6zkTMzRYd1y4TNGh+uBiEGu4dUU=",
|
||||
"dev": true
|
||||
},
|
||||
"filter-obj": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/filter-obj/-/filter-obj-1.1.0.tgz",
|
||||
"integrity": "sha1-mzERErxsYSehbgFsbF1/GeCAXFs=",
|
||||
"dev": true
|
||||
},
|
||||
"query-string": {
|
||||
"version": "6.14.1",
|
||||
"resolved": "https://registry.npmjs.org/query-string/-/query-string-6.14.1.tgz",
|
||||
"integrity": "sha512-XDxAeVmpfu1/6IjyT/gXHOl+S0vQ9owggJ30hhWKdHAsNPOcasn5o9BW0eejZqL2e4vMjhAxoW3jVHcD6mbcYw==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"decode-uri-component": "^0.2.0",
|
||||
"filter-obj": "^1.1.0",
|
||||
"split-on-first": "^1.0.0",
|
||||
"strict-uri-encode": "^2.0.0"
|
||||
}
|
||||
},
|
||||
"split-on-first": {
|
||||
"version": "1.1.0",
|
||||
"resolved": "https://registry.npmjs.org/split-on-first/-/split-on-first-1.1.0.tgz",
|
||||
"integrity": "sha512-43ZssAJaMusuKWL8sKUBQXHWOpq8d6CfN/u1p4gUzfJkM05C8rxTmYrkIPTXapZpORA6LkkzcUulJ8FqA7Uudw==",
|
||||
"dev": true
|
||||
},
|
||||
"strict-uri-encode": {
|
||||
"version": "2.0.0",
|
||||
"resolved": "https://registry.npmjs.org/strict-uri-encode/-/strict-uri-encode-2.0.0.tgz",
|
||||
"integrity": "sha1-ucczDHBChi9rFC3CdLvMWGbONUY=",
|
||||
"dev": true
|
||||
},
|
||||
"uni-read-pages": {
|
||||
"version": "1.0.5",
|
||||
"resolved": "https://registry.npmjs.org/uni-read-pages/-/uni-read-pages-1.0.5.tgz",
|
||||
"integrity": "sha512-GkrrZ0LX0vn9R5k6RKEi0Ez3Q3e2vUpjXQ8Z6/K/d28KudI9ajqgt8WEjQFlG5EPm1K6uTArN8LlqmZTEixDUA==",
|
||||
"dev": true
|
||||
}
|
||||
}
|
||||
}
|
||||
20
mall4uni/package.json
Normal file
@ -0,0 +1,20 @@
|
||||
{
|
||||
"name": "mall4uni",
|
||||
"version": "1.0.0",
|
||||
"description": "请使用 uniapp官方推荐的开发工具 HBuilderX 导入项目进行开发",
|
||||
"main": "main.js",
|
||||
"scripts": {
|
||||
"test": "echo \"Error: no test specified\" && exit 1"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://gitee.com/gz-yami/mall4uni.git"
|
||||
},
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
"license": "ISC",
|
||||
"devDependencies": {
|
||||
"uni-read-pages": "^1.0.5",
|
||||
"query-string": "^6.13.1"
|
||||
}
|
||||
}
|
||||
212
mall4uni/pages.json
Normal file
@ -0,0 +1,212 @@
|
||||
{
|
||||
"pages": [
|
||||
{
|
||||
"path": "pages/index/index",
|
||||
"style": {
|
||||
"backgroundTextStyle": "dark",
|
||||
"navigationBarBackgroundColor": "white",
|
||||
"navigationBarTextStyle": "black",
|
||||
"enablePullDownRefresh": true,
|
||||
"navigationBarTitleText": "亚米科技mall4j"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/logs/logs",
|
||||
"style": {
|
||||
"navigationBarTitleText": "查看启动日志"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/user/user",
|
||||
"style": {
|
||||
"navigationBarTitleText": "个人中心"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/basket/basket",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "购物车",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/category/category",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "分类商品",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/search-page/search-page",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "搜索",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/delivery-address/delivery-address",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "收货地址",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/editAddress/editAddress",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "编辑收货地址",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/orderList/orderList",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarTitleText": "订单列表",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarBackgroundColor": "#fafafa"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/order-detail/order-detail",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "订单详情",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/submit-order/submit-order",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "提交订单",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/binding-phone/binding-phone",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "绑定手机号码",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/express-delivery/express-delivery",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "物流查询",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/pay-result/pay-result",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "支付结果",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/search-prod-show/search-prod-show",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "搜索结果",
|
||||
"navigationBarTextStyle": "black"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/prod/prod",
|
||||
"style": {
|
||||
"navigationBarTitleText": "商品详情"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/login/login",
|
||||
"style": {}
|
||||
},
|
||||
{
|
||||
"path": "pages/prod-classify/prod-classify",
|
||||
"style": {
|
||||
"onReachBottomDistance": 0
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/recent-news/recent-news",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarTitleText": "最新公告",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarBackgroundColor": "#fafafa"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/news-detail/news-detail",
|
||||
"style": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarTitleText": "最新公告",
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarBackgroundColor": "#fafafa"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/accountLogin/accountLogin"
|
||||
},
|
||||
{
|
||||
"path": "pages/register/register"
|
||||
}
|
||||
],
|
||||
"tabBar": {
|
||||
"selectedColor": "#3a86b9",
|
||||
"color": "#b8b8b8",
|
||||
"list": [
|
||||
{
|
||||
"pagePath": "pages/index/index",
|
||||
"text": "首页",
|
||||
"iconPath": "/static/images/tabbar/homepage.png",
|
||||
"selectedIconPath": "/static/images/tabbar/homepage-sel.png"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/category/category",
|
||||
"text": "分类",
|
||||
"iconPath": "/static/images/tabbar/category.png",
|
||||
"selectedIconPath": "/static/images/tabbar/category-sel.png"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/basket/basket",
|
||||
"text": "购物车",
|
||||
"iconPath": "/static/images/tabbar/basket.png",
|
||||
"selectedIconPath": "/static/images/tabbar/basket-sel.png"
|
||||
},
|
||||
{
|
||||
"pagePath": "pages/user/user",
|
||||
"text": "我的",
|
||||
"iconPath": "/static/images/tabbar/user.png",
|
||||
"selectedIconPath": "/static/images/tabbar/user-sel.png"
|
||||
}
|
||||
]
|
||||
},
|
||||
"sitemapLocation": "sitemap.json",
|
||||
"globalStyle": {
|
||||
"backgroundTextStyle": "light",
|
||||
"navigationBarBackgroundColor": "#fff",
|
||||
"navigationBarTitleText": "WeChat",
|
||||
"navigationBarTextStyle": "black"
|
||||
},
|
||||
"subPackages": []
|
||||
}
|
||||
118
mall4uni/pages/accountLogin/accountLogin.css
Normal file
@ -0,0 +1,118 @@
|
||||
page{
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
}
|
||||
.con{
|
||||
margin-top: 50px;
|
||||
}
|
||||
image {
|
||||
display: block;
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
margin: auto;
|
||||
border-radius: 50%;
|
||||
margin-bottom: 8%;
|
||||
}
|
||||
.login-form{
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 20%;
|
||||
}
|
||||
.authorized-btn {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
background-color: #0ab906;
|
||||
border: 1rpx solid #0ab906;
|
||||
color: #fff;
|
||||
border-radius: 6rpx;
|
||||
font-size: 26rpx;
|
||||
padding: 8rpx;
|
||||
margin-top: 80rpx;
|
||||
}
|
||||
.to-idx-btn{
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
background-color: #eeeeee;
|
||||
color: #333;
|
||||
border-radius: 6rpx;
|
||||
font-size: 26rpx;
|
||||
padding: 8rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.form-title {
|
||||
width: 100%;
|
||||
margin-bottom: 50rpx;
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
color: #00a0e9;
|
||||
}
|
||||
.item {
|
||||
display: block;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.account{
|
||||
display: flex;
|
||||
background: #f8f8f8;
|
||||
padding: 15rpx;
|
||||
box-sizing: border-box;
|
||||
font-size: 26rpx;
|
||||
align-items: center;
|
||||
}
|
||||
.account input{
|
||||
padding-left: 20rpx;
|
||||
width:75%;
|
||||
}
|
||||
.inp-palcehoder{
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.account input.int-yzm {
|
||||
width: 410rpx;
|
||||
padding-right: 10rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.input-btn {
|
||||
width: 152rpx;
|
||||
font-size: 26rpx;
|
||||
color: #00a0ea;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
button::after{
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
/* 找回密码&去注册 */
|
||||
.operate {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.forgot-password,
|
||||
.to-register {
|
||||
font-size: 28rpx;
|
||||
color: #00AAFF;
|
||||
}
|
||||
|
||||
/* 错误提示 */
|
||||
.error .error-text {
|
||||
display: block;
|
||||
width: 100%;
|
||||
font-size: 28rpx;
|
||||
color: #e43130;
|
||||
text-align: left;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.error .error-text .warning-icon {
|
||||
display: inline-block;;
|
||||
color: #fff;
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
line-height: 26rpx;
|
||||
background: #e43130;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
margin-right: 12rpx;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
243
mall4uni/pages/accountLogin/accountLogin.vue
Normal file
@ -0,0 +1,243 @@
|
||||
<template>
|
||||
<view class="con">
|
||||
<image src="../../static/logo.png"></image>
|
||||
<!-- 登录 -->
|
||||
<view class="login-form">
|
||||
<view :class="['item',errorTips==1? 'error':'']">
|
||||
<view class="account">
|
||||
<text class="input-item">账号</text>
|
||||
<input type="text" @input="getInputVal" data-type="account" placeholder-class="inp-palcehoder" placeholder="请输入用户名"></input>
|
||||
</view>
|
||||
<view class="error-text" v-if="errorTips==1"><text class="warning-icon">!</text>请输入账号!</view>
|
||||
</view>
|
||||
<view :class="['item',errorTips==2? 'error':'']">
|
||||
<view class="account">
|
||||
<text class="input-item">密码</text>
|
||||
<input type="password" @input="getInputVal" data-type="password" placeholder-class="inp-palcehoder" placeholder="请输入密码"></input>
|
||||
</view>
|
||||
<view class="error-text" v-if="errorTips==2"><text class="warning-icon">!</text>请输入密码!</view>
|
||||
</view>
|
||||
<view class="operate">
|
||||
<view class="to-register" @tap="toRegitser">还没有账号?<text>去注册></text></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<button class="authorized-btn" @tap="login">登录</button>
|
||||
<button class="to-idx-btn" @tap="toIndex">回到首页</button>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
var http = require("../../utils/http");
|
||||
var util = require('../../utils/util.js');
|
||||
import {
|
||||
AppType
|
||||
} from '../../utils/constant.js'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
principal: '', // 账号
|
||||
credentials: '', // 密码
|
||||
// isPersonalCenter: false, //是否从个人中心页面跳转过来
|
||||
errorTips: 0, //错误提示
|
||||
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
computed: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function(options) {
|
||||
if (options.isPersonalCenter) {
|
||||
this.isPersonalCenter = options.isPersonalCenter
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function() {
|
||||
//头部导航标题
|
||||
uni.setNavigationBarTitle({
|
||||
title: "用户登录"
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function() {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function() {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function() {},
|
||||
|
||||
methods: {
|
||||
/**
|
||||
* 输入框的值
|
||||
*/
|
||||
getInputVal: function(e) {
|
||||
const type = e.currentTarget.dataset.type;
|
||||
if (type == 'account') {
|
||||
this.setData({
|
||||
principal: e.detail.value
|
||||
});
|
||||
} else if (type == 'password') {
|
||||
this.setData({
|
||||
credentials: e.detail.value
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 登录
|
||||
*/
|
||||
login() {
|
||||
// // #ifdef H5
|
||||
// var ua = navigator.userAgent.toLowerCase();
|
||||
// var data = {
|
||||
// appType: ua.search(/MicroMessenger/i) > -1 ? AppType.MP : AppType.H5,
|
||||
// principal: ua.search(/MicroMessenger/i) > -1 ? this.principal + ':' + util.getUrlKey('code') : this.principal,
|
||||
// credentials: this.credentials,
|
||||
// loginType: 0, //账号登录
|
||||
// }
|
||||
// // #endif
|
||||
// // #ifdef APP-PLUS
|
||||
// var data = {
|
||||
// appType: uni.getStorageSync('appType'),
|
||||
// principal: this.principal,
|
||||
// credentials: this.credentials,
|
||||
// loginType: 0, //账号登录
|
||||
// }
|
||||
// // #endif
|
||||
|
||||
if (this.principal.length == 0) {
|
||||
this.setData({
|
||||
errorTips: 1
|
||||
})
|
||||
return
|
||||
} else if (this.credentials.length == 0) {
|
||||
this.setData({
|
||||
errorTips: 2
|
||||
})
|
||||
return
|
||||
} else {
|
||||
this.setData({
|
||||
errorTips: 0
|
||||
})
|
||||
// #ifdef H5 || APP-PLUS
|
||||
var params = {
|
||||
url: "/webLogin",
|
||||
method: "post",
|
||||
data: {
|
||||
"principal": this.principal,
|
||||
"credentials": this.credentials
|
||||
},
|
||||
callBack: res => {
|
||||
console.log("login",res)
|
||||
var loginResult = '';
|
||||
uni.setStorageSync("loginResult",res);
|
||||
uni.setStorageSync('token', 'bearer' + res.access_token);
|
||||
// return
|
||||
http.loginSuccess(res, () => {
|
||||
uni.showToast({
|
||||
title: "登录成功",
|
||||
icon: 'none',
|
||||
complete: () => {
|
||||
// this.$Router.pushTab('/pages/index/index')
|
||||
setTimeout(() => {
|
||||
wx.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
},1000)
|
||||
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
}
|
||||
http.request(params)
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
wx.login({
|
||||
success: (res) => {
|
||||
var params = {
|
||||
url: "/login",
|
||||
method: "post",
|
||||
data: {
|
||||
appType: 1,
|
||||
credentials: this.credentials,
|
||||
loginType: 0,
|
||||
principal: this.principal + ':' + res.code
|
||||
},
|
||||
callBack: result => {
|
||||
http.loginSuccess(result)
|
||||
this.$Router.pushTab('/pages/index/index')
|
||||
},
|
||||
}
|
||||
http.request(params)
|
||||
},
|
||||
})
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 去注册
|
||||
*/
|
||||
toRegitser() {
|
||||
uni.navigateTo({
|
||||
url: "/pages/register/register"
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 回到首页
|
||||
*/
|
||||
toIndex() {
|
||||
wx.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
// this.$Router.pushTab('/pages/index/index')
|
||||
}
|
||||
|
||||
},
|
||||
watch: {
|
||||
principal(nv, ov) {
|
||||
this.errorTips = 0
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./accountLogin.css";
|
||||
</style>
|
||||
387
mall4uni/pages/basket/basket.css
Normal file
@ -0,0 +1,387 @@
|
||||
/* pages/basket/basket.wxss */
|
||||
|
||||
page {
|
||||
width: 100%;
|
||||
background: #f4f4f4;
|
||||
}
|
||||
.container{
|
||||
padding-bottom:118rpx;
|
||||
}
|
||||
container .prod-list {
|
||||
width: 100%;
|
||||
background: #f8f8f8;
|
||||
}
|
||||
|
||||
.prod-list .prod-block {
|
||||
background: #fff;
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
|
||||
.prod-list .prod-block .discount-tips {
|
||||
padding: 20rpx 0 20rpx 20rpx;
|
||||
border-bottom: 2rpx solid #f4f4f4;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
}
|
||||
|
||||
.prod-list .prod-block .discount-tips .text-block {
|
||||
padding:3rpx 5rpx;
|
||||
/* padding: 0 5rpx; */
|
||||
border-radius: 8rpx;
|
||||
font-size: 22rpx;
|
||||
color: #eb2444;
|
||||
border: 2rpx solid #eb2444;
|
||||
}
|
||||
|
||||
.prod-list .prod-block .discount-tips .text-list {
|
||||
font-size: 24rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
.prod-list .item {
|
||||
background: #fff;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.prod-list .item .prodinfo {
|
||||
position: relative;
|
||||
color: #999;
|
||||
width:100%;
|
||||
}
|
||||
|
||||
.prod-list .item .prodinfo::after {
|
||||
content: '';
|
||||
background-color: #f4f4f4;
|
||||
left: 0;
|
||||
height: 1px;
|
||||
transform-origin: 50% 100% 0;
|
||||
bottom: -20rpx;
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 642rpx;
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.prod-list .item:last-child .prodinfo::after {
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.prod-list .item .staus {
|
||||
text-align: center;
|
||||
background: rgb(196, 192, 192);
|
||||
font-size: 20rpx;
|
||||
width: 50rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.prodinfo {
|
||||
display: flex;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.prod-list .item .opt {
|
||||
font-size: 28rpx;
|
||||
margin-left: 20rpx;
|
||||
width:100%;
|
||||
|
||||
}
|
||||
|
||||
.prodinfo .opt .prod-name {
|
||||
color:#333;
|
||||
max-height: 72rpx;
|
||||
line-height: 36rpx;
|
||||
display: -webkit-box;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.prodinfo .opt .prod-info-text {
|
||||
color: #999;
|
||||
display: inline-block;
|
||||
-webkit-line-clamp: 1;
|
||||
height: 48rpx;
|
||||
line-height: 48rpx;
|
||||
background: #f9f9f9;
|
||||
padding: 0 10rpx 0 10rpx;
|
||||
border-radius: 4rpx;
|
||||
margin: 10rpx 0 0rpx 0;
|
||||
overflow: hidden;
|
||||
font-size: 24rpx;
|
||||
position: relative;
|
||||
font-family: arial;
|
||||
}
|
||||
.prodinfo .opt .prod-info-text.empty-n{
|
||||
padding:0;
|
||||
}
|
||||
|
||||
/* .prod-info-text:before, .prod-info-text:after {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 0;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
border: 5px solid transparent;
|
||||
right: 5px;
|
||||
top: 10px;
|
||||
} */
|
||||
|
||||
.prod-info-text:before {
|
||||
border-top: 5px solid #aaa;
|
||||
}
|
||||
|
||||
.prod-info-text:after {
|
||||
border-top: 5px solid #f9f9f9;
|
||||
top: 9px;
|
||||
}
|
||||
|
||||
.prod-list .item .prodinfo .pic {
|
||||
text-align: center;
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
line-height: 180rpx;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.prod-list .item .pic image {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
/* border-radius: 8rpx; */
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.prodinfo .opt .price-count {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.prodinfo .opt .price-count .price {
|
||||
color: #eb2444;
|
||||
}
|
||||
|
||||
.lose-efficacy .prodinfo .opt .price-count .price {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 加减框 */
|
||||
|
||||
.m-numSelector .minus, .m-numSelector input, .m-numSelector .plus {
|
||||
float: left;
|
||||
box-sizing: border-box;
|
||||
height: 56rpx;
|
||||
border: 2rpx solid #d9d9d9;
|
||||
}
|
||||
|
||||
.m-numSelector {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.m-numSelector .minus, .m-numSelector .plus {
|
||||
position: relative;
|
||||
width: 56rpx;
|
||||
}
|
||||
|
||||
.m-numSelector .minus {
|
||||
border-right: 0;
|
||||
border-top-left-radius: 4rpx;
|
||||
border-bottom-left-radius: 4rpx;
|
||||
}
|
||||
|
||||
.m-numSelector input {
|
||||
width: 56rpx;
|
||||
text-align: center;
|
||||
color:#333;
|
||||
}
|
||||
|
||||
.m-numSelector .plus {
|
||||
border-left: 0;
|
||||
border-top-right-radius: 4rpx;
|
||||
border-bottom-right-radius: 4rpx;
|
||||
}
|
||||
|
||||
.m-numSelector .minus::before, .m-numSelector .plus::before,
|
||||
.m-numSelector .plus::after {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
margin: auto;
|
||||
content: ' ';
|
||||
width: 22rpx;
|
||||
height: 3rpx;
|
||||
background-color: #7f7f7f;
|
||||
}
|
||||
|
||||
.m-numSelector .plus::after {
|
||||
transform: rotate(90deg);
|
||||
}
|
||||
|
||||
.m-numSelector:not(.disabled) .minus:not(.disabled):active,
|
||||
.m-numSelector:not(.disabled) .plus:not(.disabled):active {
|
||||
background-color: #f4f4f4;
|
||||
}
|
||||
|
||||
/*checkbox 选项框大小 */
|
||||
|
||||
checkbox .wx-checkbox-input {
|
||||
border-radius: 50%;
|
||||
width: 35rpx;
|
||||
height: 35rpx;
|
||||
}
|
||||
|
||||
/*checkbox选中后样式 */
|
||||
|
||||
checkbox .wx-checkbox-input.wx-checkbox-input-checked {
|
||||
background: #eb2444;
|
||||
border-color: #eb2444;
|
||||
}
|
||||
|
||||
/*checkbox选中后图标样式 */
|
||||
|
||||
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
|
||||
text-align: center;
|
||||
font-size: 22rpx;
|
||||
color: #fff;
|
||||
background: transparent;
|
||||
transform: translate(-50%, -50%) scale(1);
|
||||
-webkit-transform: translate(-50%, -50%) scale(1);
|
||||
}
|
||||
|
||||
/* 购物车为空 */
|
||||
|
||||
.empty {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.empty .txt {
|
||||
text-align: center;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.empty .img {
|
||||
margin-top: 80rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.empty .img image {
|
||||
width: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
|
||||
/* 失效商品 */
|
||||
|
||||
.lose-efficacy {
|
||||
margin-top: 20rpx;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.lose-efficacy .item {
|
||||
background: #f8f8f9;
|
||||
}
|
||||
|
||||
.prod-list .lose-efficacy .discount-tips {
|
||||
padding: 20rpx 0;
|
||||
border-bottom: 2rpx solid #ddd;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
margin-left: 20rpx;
|
||||
}
|
||||
|
||||
.lose-efficacy .discount-tips .empty-prod {
|
||||
color: #777;
|
||||
font-size: 26rpx;
|
||||
border: 2rpx solid #999;
|
||||
padding: 0 10rpx;
|
||||
border-radius: 8rpx;
|
||||
float: right;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.price-count .disable-price {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.prod-list .lose-efficacy .discount-tips .text-list {
|
||||
font-size: 30rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
/** 底部按钮 */
|
||||
|
||||
.cart-footer {
|
||||
position: fixed;
|
||||
bottom: 100rpx;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row nowrap;
|
||||
height: 98rpx;
|
||||
border-top: 2rpx solid #f4f4f4;
|
||||
z-index:999;
|
||||
}
|
||||
|
||||
.cart-footer .btn {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 0;
|
||||
background-color: #fafafa;
|
||||
background:rgba(255,255,255,0.95);
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.cart-footer .btn .total-msg{
|
||||
font-size: 20rpx;
|
||||
}
|
||||
.cart-footer .btn.total{
|
||||
display:flex;
|
||||
flex-flow:column;
|
||||
align-items:flex-start;
|
||||
|
||||
}
|
||||
.cart-footer .btn.del {
|
||||
color:#eb2444;
|
||||
width:70rpx;
|
||||
font-size:22rpx;
|
||||
text-align:left;
|
||||
display:block;
|
||||
line-height:102rpx;
|
||||
|
||||
}
|
||||
|
||||
.cart-footer .btn.all {
|
||||
width: 150rpx;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.cart-footer .btn.all label {
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cart-footer .btn.total {
|
||||
width: 300rpx;
|
||||
}
|
||||
|
||||
.cart-footer .btn.total .price {
|
||||
color: #eb2444;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.cart-footer .btn.settle {
|
||||
width: 200rpx;
|
||||
background: #eb2444;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
/** end 底部按钮 */
|
||||
434
mall4uni/pages/basket/basket.vue
Normal file
@ -0,0 +1,434 @@
|
||||
<template>
|
||||
<!--pages/basket/basket.wxml-->
|
||||
<view class="container">
|
||||
<view class="prod-list">
|
||||
<block v-for="(item, scIndex) in shopCartItemDiscounts" :key="scIndex">
|
||||
<view class="prod-block">
|
||||
<view class="discount-tips" v-if="item.chooseDiscountItemDto">
|
||||
<text class="text-block">{{wxs.parseDiscount(item.chooseDiscountItemDto.discountRule)}}</text>
|
||||
<text class="text-list">{{wxs.parseDiscountMsg(item.chooseDiscountItemDto.discountRule,item.chooseDiscountItemDto.needAmount,item.chooseDiscountItemDto.discount)}}</text>
|
||||
</view>
|
||||
<block v-for="(prod, index) in item.shopCartItems" :key="index">
|
||||
<view class="item">
|
||||
<view class="btn">
|
||||
<label>
|
||||
<checkbox @tap="onSelectedItem" :data-scindex="scIndex" :data-index="index" :value="prod.prodId" :checked="prod.checked" color="#105c3e"></checkbox>
|
||||
</label>
|
||||
</view>
|
||||
<view class="prodinfo">
|
||||
<view class="pic">
|
||||
<image :src="prod.pic"></image>
|
||||
</view>
|
||||
<view class="opt">
|
||||
<view class="prod-name">{{prod.prodName}}</view>
|
||||
<text :class="'prod-info-text ' + (prod.skuName?'':'empty-n')">{{prod.skuName}}</text>
|
||||
<view class="price-count">
|
||||
<view class="price">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(prod.price)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(prod.price)[1]}}</text>
|
||||
</view>
|
||||
<view class="m-numSelector">
|
||||
<view @tap="onCountMinus" class="minus" :data-scindex="scIndex" :data-index="index"></view>
|
||||
<input type="number" :value="prod.prodCount" disabled></input>
|
||||
<view @tap="onCountPlus" class="plus" :data-scindex="scIndex" :data-index="index"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<!-- <view class='lose-efficacy'>
|
||||
<view class='discount-tips'>
|
||||
|
||||
<text class='text-list'>失效商品</text>
|
||||
<text class='empty-prod'>清空失效商品</text>
|
||||
</view>
|
||||
<view class='item'>
|
||||
<view class="staus">
|
||||
<text>失效</text>
|
||||
</view>
|
||||
<view class='prodinfo'>
|
||||
<view class="pic">
|
||||
<image src='../../images/prod/pic11.jpg' />
|
||||
</view>
|
||||
<view class="opt">
|
||||
<view class='prod-name'>宠物用品洗澡香波沐浴除臭留</view>
|
||||
<view class='prod-info-text'>60克</view>
|
||||
<view class='price-count'>
|
||||
<view class='price'>
|
||||
<text class='symbol'>¥</text>
|
||||
<text class='big-num'>{{wxs.parsePrice(10.00)[0]}}</text>
|
||||
<text class='small-num'>.{{wxs.parsePrice(10.00)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
</view>
|
||||
|
||||
<view class="empty" v-if="shopCartItemDiscounts.length==0">
|
||||
<view class="img">
|
||||
<image src="/static/images/tabbar/basket.png"></image>
|
||||
</view>
|
||||
<view class="txt">
|
||||
您还没有添加任何商品哦~
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 底部按钮 -->
|
||||
<view class="cart-footer" v-if="shopCartItemDiscounts.length>0">
|
||||
<view class="btn all">
|
||||
<label @tap="onSelAll">
|
||||
<checkbox :checked="allChecked" color="#f7d731;"></checkbox>全选</label>
|
||||
</view>
|
||||
<view class="btn del" @tap="onDelBasket">
|
||||
<text>删除</text>
|
||||
</view>
|
||||
<view class="btn total">
|
||||
<view class="finally">
|
||||
<text>合计:</text>
|
||||
<view class="price">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(finalMoney)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(finalMoney)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="total-msg" v-if="subtractMoney>0">
|
||||
总额:¥{{wxs.toPrice(totalMoney)}} 立减:¥{{wxs.toPrice(subtractMoney)}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="btn settle" @tap="toFirmOrder">
|
||||
<text>结算</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- end 底部按钮 -->
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script module="wxs" lang="wxs" src="../../wxs/number.wxs"></script>
|
||||
|
||||
<script>
|
||||
// pages/basket/basket.js
|
||||
var http = require("../../utils/http.js"); // var config = require("../../utils/config.js");
|
||||
// var config = require("../../utils/config.js");
|
||||
const Big = require("../../utils/big.min.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// picDomain: config.picDomain,
|
||||
shopCartItemDiscounts: [],
|
||||
finalMoney: 0,
|
||||
totalMoney: 0,
|
||||
subtractMoney: 0,
|
||||
allChecked: true
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
uni.showLoading(); //加载购物车
|
||||
|
||||
var params = {
|
||||
url: "/p/shopCart/info",
|
||||
method: "POST",
|
||||
data: {},
|
||||
callBack: res => {
|
||||
if (res.length > 0) {
|
||||
// 默认全选
|
||||
var shopCartItemDiscounts = res[0].shopCartItemDiscounts;
|
||||
shopCartItemDiscounts.forEach(shopCartItemDiscount => {
|
||||
shopCartItemDiscount.shopCartItems.forEach(shopCartItem => {
|
||||
shopCartItem.checked = true;
|
||||
});
|
||||
});
|
||||
this.setData({
|
||||
shopCartItemDiscounts: shopCartItemDiscounts,
|
||||
allChecked: true
|
||||
});
|
||||
} else {
|
||||
this.setData({
|
||||
shopCartItemDiscounts: []
|
||||
});
|
||||
}
|
||||
|
||||
this.calTotalPrice(); //计算总价
|
||||
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
http.getCartCount(); //重新计算购物车总数量
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 去结算
|
||||
*/
|
||||
toFirmOrder: function () {
|
||||
var shopCartItemDiscounts = this.shopCartItemDiscounts;
|
||||
var basketIds = [];
|
||||
shopCartItemDiscounts.forEach(shopCartItemDiscount => {
|
||||
shopCartItemDiscount.shopCartItems.forEach(shopCartItem => {
|
||||
if (shopCartItem.checked) {
|
||||
basketIds.push(shopCartItem.basketId);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
if (!basketIds.length) {
|
||||
uni.showToast({
|
||||
title: '请选择商品',
|
||||
icon: "none"
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
uni.setStorageSync("basketIds", JSON.stringify(basketIds));
|
||||
uni.navigateTo({
|
||||
url: '/pages/submit-order/submit-order?orderEntry=0'
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 全选
|
||||
*/
|
||||
onSelAll: function () {
|
||||
var allChecked = this.allChecked;
|
||||
allChecked = !allChecked; //改变状态
|
||||
|
||||
var shopCartItemDiscounts = this.shopCartItemDiscounts;
|
||||
|
||||
for (var i = 0; i < shopCartItemDiscounts.length; i++) {
|
||||
var cItems = shopCartItemDiscounts[i].shopCartItems;
|
||||
|
||||
for (var j = 0; j < cItems.length; j++) {
|
||||
cItems[j].checked = allChecked;
|
||||
}
|
||||
}
|
||||
|
||||
this.setData({
|
||||
allChecked: allChecked,
|
||||
shopCartItemDiscounts: shopCartItemDiscounts
|
||||
});
|
||||
this.calTotalPrice(); //计算总价
|
||||
},
|
||||
|
||||
/**
|
||||
* 每一项的选择事件
|
||||
*/
|
||||
onSelectedItem: function (e) {
|
||||
var index = e.currentTarget.dataset.index; // 获取data- 传进来的index
|
||||
|
||||
var scindex = e.currentTarget.dataset.scindex;
|
||||
var shopCartItemDiscounts = this.shopCartItemDiscounts; // 获取购物车列表
|
||||
|
||||
var checked = shopCartItemDiscounts[scindex].shopCartItems[index].checked; // 获取当前商品的选中状态
|
||||
|
||||
shopCartItemDiscounts[scindex].shopCartItems[index].checked = !checked; // 改变状态
|
||||
|
||||
this.setData({
|
||||
shopCartItemDiscounts: shopCartItemDiscounts
|
||||
});
|
||||
this.checkAllSelected(); //检查全选状态
|
||||
|
||||
this.calTotalPrice(); //计算总价
|
||||
},
|
||||
|
||||
/**
|
||||
* 检查全选状态
|
||||
*/
|
||||
checkAllSelected: function () {
|
||||
var allChecked = true;
|
||||
var shopCartItemDiscounts = this.shopCartItemDiscounts;
|
||||
var flag = false;
|
||||
|
||||
for (var i = 0; i < shopCartItemDiscounts.length; i++) {
|
||||
var cItems = shopCartItemDiscounts[i].shopCartItems;
|
||||
|
||||
for (var j = 0; j < cItems.length; j++) {
|
||||
if (!cItems[j].checked) {
|
||||
allChecked = !allChecked;
|
||||
flag = true;
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
if (flag) {
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
this.setData({
|
||||
allChecked: allChecked
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 计算购物车总额
|
||||
*/
|
||||
calTotalPrice: function () {
|
||||
var shopCartItemDiscounts = this.shopCartItemDiscounts;
|
||||
var shopCartIds = [];
|
||||
|
||||
for (var i = 0; i < shopCartItemDiscounts.length; i++) {
|
||||
var cItems = shopCartItemDiscounts[i].shopCartItems;
|
||||
|
||||
for (var j = 0; j < cItems.length; j++) {
|
||||
if (cItems[j].checked) {
|
||||
shopCartIds.push(cItems[j].basketId);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
var ths = this;
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/shopCart/totalPay",
|
||||
method: "POST",
|
||||
data: shopCartIds,
|
||||
callBack: function (res) {
|
||||
ths.setData({
|
||||
finalMoney: res.finalMoney,
|
||||
totalMoney: res.totalMoney,
|
||||
subtractMoney: res.subtractMoney
|
||||
});
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 减少数量
|
||||
*/
|
||||
onCountMinus: function (e) {
|
||||
var index = e.currentTarget.dataset.index;
|
||||
var scindex = e.currentTarget.dataset.scindex;
|
||||
var shopCartItemDiscounts = this.shopCartItemDiscounts;
|
||||
var prodCount = shopCartItemDiscounts[scindex].shopCartItems[index].prodCount;
|
||||
|
||||
if (prodCount > 1) {
|
||||
this.updateCount(shopCartItemDiscounts, scindex, index, -1);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 增加数量
|
||||
*/
|
||||
onCountPlus: function (e) {
|
||||
var index = e.currentTarget.dataset.index;
|
||||
var scindex = e.currentTarget.dataset.scindex;
|
||||
var shopCartItemDiscounts = this.shopCartItemDiscounts;
|
||||
this.updateCount(shopCartItemDiscounts, scindex, index, 1);
|
||||
},
|
||||
|
||||
/**
|
||||
* 改变购物车数量接口
|
||||
*/
|
||||
updateCount: function (shopCartItemDiscounts, scindex, index, prodCount) {
|
||||
var ths = this;
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/shopCart/changeItem",
|
||||
method: "POST",
|
||||
data: {
|
||||
count: prodCount,
|
||||
prodId: shopCartItemDiscounts[scindex].shopCartItems[index].prodId,
|
||||
skuId: shopCartItemDiscounts[scindex].shopCartItems[index].skuId,
|
||||
shopId: 1
|
||||
},
|
||||
callBack: function (res) {
|
||||
shopCartItemDiscounts[scindex].shopCartItems[index].prodCount += prodCount;
|
||||
ths.setData({
|
||||
shopCartItemDiscounts: shopCartItemDiscounts
|
||||
});
|
||||
ths.calTotalPrice(); //计算总价
|
||||
|
||||
uni.hideLoading();
|
||||
http.getCartCount(); //重新计算购物车总数量
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 删除购物车商品
|
||||
*/
|
||||
onDelBasket: function () {
|
||||
var ths = this;
|
||||
var shopCartItemDiscounts = this.shopCartItemDiscounts;
|
||||
var basketIds = [];
|
||||
|
||||
for (var i = 0; i < shopCartItemDiscounts.length; i++) {
|
||||
var cItems = shopCartItemDiscounts[i].shopCartItems;
|
||||
|
||||
for (var j = 0; j < cItems.length; j++) {
|
||||
if (cItems[j].checked) {
|
||||
basketIds.push(cItems[j].basketId);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (basketIds.length == 0) {
|
||||
uni.showToast({
|
||||
title: '请选择商品',
|
||||
icon: "none"
|
||||
});
|
||||
} else {
|
||||
uni.showModal({
|
||||
title: '',
|
||||
content: '确认要删除选中的商品吗?',
|
||||
confirmColor: "#eb2444",
|
||||
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/shopCart/deleteItem",
|
||||
method: "DELETE",
|
||||
data: basketIds,
|
||||
callBack: function (res) {
|
||||
uni.hideLoading();
|
||||
ths.onShow();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./basket.css";
|
||||
</style>
|
||||
69
mall4uni/pages/binding-phone/binding-phone.css
Normal file
@ -0,0 +1,69 @@
|
||||
/* pages/binding-phone/binding-phone.wxss */
|
||||
|
||||
page {
|
||||
background: #f4f4f4;
|
||||
}
|
||||
|
||||
.binding-phone {
|
||||
height: 100%;
|
||||
margin-top: 20rpx;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.binding-phone .item {
|
||||
display: flex;
|
||||
padding: 20rpx 0;
|
||||
height: 60rpx;
|
||||
line-height: 60rpx;
|
||||
border-bottom: 2rpx solid #e1e1e1;
|
||||
}
|
||||
|
||||
.binding-phone .item:last-child {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.binding-phone .item input {
|
||||
flex: 1;
|
||||
height: auto;
|
||||
padding: 0 20rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.binding-phone .item .item-tip {
|
||||
width: 140rpx;
|
||||
font-size: 28rpx;
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.binding-phone .item .get-code {
|
||||
font-size: 30rpx;
|
||||
color: #999;
|
||||
margin-right: 20rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.binding-phone .item .get-code.gray {
|
||||
color: #3eb370;
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
padding: 0 20rpx;
|
||||
margin-top: 60rpx;
|
||||
}
|
||||
|
||||
.btn-box .sure-btn {
|
||||
display: block;
|
||||
font-size: 32rpx;
|
||||
color: #fff;
|
||||
background: #3eb370;
|
||||
width: 100%;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
padding: 20rpx 0;
|
||||
border-radius: 50rpx;
|
||||
}
|
||||
|
||||
.btn-box .sure-btn.gray {
|
||||
background: #e1e1e1;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
120
mall4uni/pages/binding-phone/binding-phone.vue
Normal file
@ -0,0 +1,120 @@
|
||||
<template>
|
||||
<!--pages/binding-phone/binding-phone.wxml-->
|
||||
<view class="container">
|
||||
<view class="binding-phone">
|
||||
<!-- <block wx:for='{{couponList}}' wx:key=''> -->
|
||||
<view class="item">
|
||||
<text class="item-tip">手机号码:</text>
|
||||
<input placeholder="输入手机号码" type="number" maxlength="11" :value="phonenum" @input="onPhoneInput"></input>
|
||||
</view>
|
||||
<view class="item ">
|
||||
<text class="item-tip">验证码:</text>
|
||||
<input placeholder="输入验证码" type="number" :value="code" @input="onCodeInput"></input>
|
||||
<text class="get-code gray" @tap="getCodeNumber">获取验证码</text>
|
||||
</view>
|
||||
<!-- </block> -->
|
||||
</view>
|
||||
|
||||
<view class="btn-box">
|
||||
<text class="sure-btn gray">确定</text>
|
||||
<text class="sure-btn ">确定</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/binding-phone/binding-phone.js
|
||||
var http = require("../../utils/http.js");
|
||||
var config = require("../../utils/config.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
phonenum: '',
|
||||
code: ''
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
getCodeNumber: function () {
|
||||
if (this.phoneNumber == "") {
|
||||
uni.showToast({
|
||||
title: '请输入手机号',
|
||||
icon: "none"
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
var params = {
|
||||
url: "/p/sms/send",
|
||||
method: "POST",
|
||||
data: {// phonenum: this.data.phonenum,
|
||||
// code: this.data.code
|
||||
},
|
||||
callBack: res => {
|
||||
this.setData({
|
||||
phonenum: this.phonenum,
|
||||
code: this.code
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
onPhoneInput: function (e) {
|
||||
this.setData({
|
||||
phonenum: e.detail.value
|
||||
});
|
||||
},
|
||||
onCodeInput: function (e) {
|
||||
this.setData({
|
||||
code: e.detail.value
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./binding-phone.css";
|
||||
</style>
|
||||
223
mall4uni/pages/category/category.css
Normal file
@ -0,0 +1,223 @@
|
||||
/* pages/category/category.wxss */
|
||||
|
||||
page {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.container {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.main {
|
||||
position: fixed;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
margin-top: 100rpx;
|
||||
height: calc(100% - 100rpx);
|
||||
}
|
||||
|
||||
/* 搜索栏 */
|
||||
|
||||
.search-bar {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
color: #777;
|
||||
background: #fff;
|
||||
box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.07);
|
||||
z-index: 3;
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
|
||||
.search-bar .arrow {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
border-bottom: 2rpx solid #777;
|
||||
border-left: 2rpx solid #777;
|
||||
transform: rotate(45deg);
|
||||
position: absolute;
|
||||
left: 30rpx;
|
||||
top: 41rpx;
|
||||
}
|
||||
|
||||
.search-bar .search-box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 60rpx;
|
||||
background: #f7f7f7;
|
||||
z-index: 999;
|
||||
width: 92%;
|
||||
border-radius: 50rpx;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.sear-input {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.search-bar .search-hint {
|
||||
font-size: 28rpx;
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 32rpx;
|
||||
}
|
||||
|
||||
.search-bar .search-box .search-img {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
/* 左侧菜单栏 */
|
||||
|
||||
.leftmenu {
|
||||
width: 200rpx;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #f5f6f7;
|
||||
overflow: scroll;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.menu-item {
|
||||
line-height: 90rpx;
|
||||
height: 90rpx;
|
||||
text-align: center;
|
||||
border-bottom: 2rpx silid #e3e3e3;
|
||||
position: relative;
|
||||
color: #777;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.menu-item.active {
|
||||
color: #eb2444;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
position: relative;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.menu-item.active:before {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
content: "";
|
||||
width: 8rpx;
|
||||
height: 32rpx;
|
||||
top: 29rpx;
|
||||
background: #eb2444;
|
||||
}
|
||||
|
||||
.menu-item text.tips-num {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
right: 15rpx;
|
||||
border-radius: 15rpx;
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
background: red;
|
||||
color: #fff;
|
||||
font-size: 25rpx;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
|
||||
/* 右侧商品栏 */
|
||||
|
||||
.rightcontent {
|
||||
width: 550rpx;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.rightcontent .adver-map {
|
||||
width: auto;
|
||||
box-sizing: border-box;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
margin: 30rpx 20rpx 0;
|
||||
}
|
||||
|
||||
.rightcontent .adver-map .item-a {
|
||||
display: block;
|
||||
font-size: 0;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.rightcontent .adver-map .item-a image {
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.rightcontent .cont-item {
|
||||
padding: 0 20rpx 20rpx 20rpx;
|
||||
}
|
||||
|
||||
.rightcontent .cont-item .show-item .more-prod-pic {
|
||||
text-align: center;
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
line-height: 150rpx;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.rightcontent .cont-item .show-item .more-prod-pic .more-pic {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
border-radius: 8rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.rightcontent .cont-item .show-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
padding: 20rpx 0;
|
||||
}
|
||||
|
||||
.rightcontent .cont-item .show-item::after {
|
||||
content: '';
|
||||
background-color: #f4f4f4;
|
||||
left: 0;
|
||||
height: 1px;
|
||||
transform-origin: 50% 100% 0;
|
||||
bottom: 0;
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 510rpx;
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
|
||||
.rightcontent .cont-item .show-item .prod-text-right {
|
||||
margin-left: 20rpx;
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
.rightcontent .cont-item .show-item .prod-text-right .cate-prod-info {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
margin: 10rpx 0 20rpx 0;
|
||||
}
|
||||
|
||||
.rightcontent .cont-item .show-item .prod-text-right .prod-text.more {
|
||||
margin: 0;
|
||||
font-size: 28rpx;
|
||||
display: -webkit-box;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.rightcontent .cont-item .show-item .prod-text-right .prod-price.more {
|
||||
font-size: 28rpx;
|
||||
color: #eb2444;
|
||||
font-family: arial;
|
||||
}
|
||||
192
mall4uni/pages/category/category.vue
Normal file
@ -0,0 +1,192 @@
|
||||
<template>
|
||||
<!--pages/category/category.wxml-->
|
||||
|
||||
<view class="container">
|
||||
|
||||
|
||||
<!-- 头部搜索区 -->
|
||||
|
||||
<view class="search-bar">
|
||||
<view class="search-box" @tap="toSearchPage">
|
||||
<image src="/static/images/icon/search.png" class="search-img"></image>
|
||||
<text class="sear-input">搜索您想要的商品</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 滚动内容区 -->
|
||||
<view class="main">
|
||||
<!-- 左侧菜单start -->
|
||||
<scroll-view scroll-y="true" class="leftmenu">
|
||||
<block v-for="(item, index) in categoryList" :key="index">
|
||||
<view :class="'menu-item ' + (selIndex==index?'active':'') + ' '" :data-index="index" :data-id="item.categoryId" @tap="onMenuTab">
|
||||
{{item.categoryName}}
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
<!-- 左侧菜单end -->
|
||||
|
||||
<!-- 右侧内容start -->
|
||||
<scroll-view scroll-y="true" class="rightcontent">
|
||||
<!-- <block wx:for='{{ productList}}' wx:key=''> -->
|
||||
<view class="adver-map">
|
||||
<view class="item-a">
|
||||
<image :src="categoryImg" mode="widthFix"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cont-item">
|
||||
<block v-for="(item, index) in productList" :key="index">
|
||||
<view class="show-item" @tap="toProdPage" :data-prodid="item.prodId">
|
||||
<view class="more-prod-pic">
|
||||
<image :src="item.pic" class="more-pic" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="prod-text-right">
|
||||
<view class="prod-text more">{{item.prodName}}</view>
|
||||
<view class="cate-prod-info">{{item.brief}}</view>
|
||||
<view class="prod-price more">
|
||||
<text class="symbol">¥</text> <text class="big-num">{{wxs.parsePrice(item.price)[0]}}</text><text class="small-num">.{{wxs.parsePrice(item.price)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</block>
|
||||
</view>
|
||||
<!-- </block> -->
|
||||
</scroll-view>
|
||||
<!-- 右侧内容end -->
|
||||
<!-- </block> -->
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script module="wxs" lang="wxs" src="../../wxs/number.wxs"></script>
|
||||
|
||||
<script>
|
||||
// pages/category/category.js
|
||||
var http = require("../../utils/http.js");
|
||||
var config = require("../../utils/config.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
selIndex: 0,
|
||||
categoryList: [],
|
||||
productList: [],
|
||||
categoryImg: '',
|
||||
prodid: ''
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
var ths = this; //加载分类列表
|
||||
|
||||
var params = {
|
||||
url: "/category/categoryInfo",
|
||||
method: "GET",
|
||||
data: {
|
||||
parentId: ''
|
||||
},
|
||||
callBack: function (res) {
|
||||
// console.log(res);
|
||||
ths.setData({
|
||||
categoryImg: res[0].pic,
|
||||
categoryList: res
|
||||
});
|
||||
ths.getProdList(res[0].categoryId);
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
/**
|
||||
* 分类点击事件
|
||||
*/
|
||||
onMenuTab: function (e) {
|
||||
console.log(e);
|
||||
var id = e.currentTarget.dataset.id;
|
||||
var index = e.currentTarget.dataset.index; // this.getProdList(id);
|
||||
|
||||
this.getProdList(this.categoryList[index].categoryId);
|
||||
this.setData({
|
||||
categoryImg: this.categoryList[index].pic,
|
||||
selIndex: index
|
||||
});
|
||||
},
|
||||
// 跳转搜索页
|
||||
toSearchPage: function () {
|
||||
uni.navigateTo({
|
||||
url: '/pages/search-page/search-page'
|
||||
});
|
||||
},
|
||||
|
||||
getProdList(categoryId) {
|
||||
//加载分类列表
|
||||
var params = {
|
||||
url: "/prod/pageProd",
|
||||
method: "GET",
|
||||
data: {
|
||||
categoryId: categoryId
|
||||
},
|
||||
callBack: res => {
|
||||
// console.log(res);
|
||||
this.setData({
|
||||
productList: res.records
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
//跳转商品详情页
|
||||
toProdPage: function (e) {
|
||||
var prodid = e.currentTarget.dataset.prodid;
|
||||
uni.navigateTo({
|
||||
url: '/pages/prod/prod?prodid=' + prodid
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./category.css";
|
||||
</style>
|
||||
101
mall4uni/pages/delivery-address/delivery-address.css
Normal file
@ -0,0 +1,101 @@
|
||||
/* pages/delivery-address/delivery-address.wxss */
|
||||
|
||||
page {
|
||||
background-color: #f4f4f4;
|
||||
border-top: 2rpx solid #e9eaec;
|
||||
padding-bottom: 150rpx;
|
||||
}
|
||||
|
||||
.main {
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.address {
|
||||
margin-bottom: 15rpx;
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
border-bottom: 2rpx solid #e9eaec;
|
||||
}
|
||||
|
||||
.address .personal {
|
||||
position: relative;
|
||||
padding: 20rpx 30rpx;
|
||||
border-bottom: 3rpx dashed #e9eaec;
|
||||
}
|
||||
|
||||
.address .personal .info-tit .name {
|
||||
margin-right: 30rpx;
|
||||
font-size: 32rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.address .personal .info-tit .tel {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.address .personal .info-tit image {
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 46rpx;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
margin-left: 50rpx;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.personal .addr {
|
||||
font-size: 26rpx;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
|
||||
.personal .addr .addr-get {
|
||||
display: inline-block;
|
||||
color: #999;
|
||||
width: 85%;
|
||||
}
|
||||
|
||||
.address .select-btn {
|
||||
padding: 15rpx 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.address .select-btn .box {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
text-align: center;
|
||||
background-color: #fff;
|
||||
box-shadow: 0 -1rpx 8rpx rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.footer text {
|
||||
font-size: 32rpx;
|
||||
color: #eb2444;
|
||||
}
|
||||
|
||||
.empty .img {
|
||||
text-align: center;
|
||||
margin-top: 130rpx;
|
||||
}
|
||||
|
||||
.empty .img image {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
display: block;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.empty .txt {
|
||||
margin-top: 30rpx;
|
||||
font-size: 24rpx;
|
||||
text-align: center;
|
||||
color: #999;
|
||||
}
|
||||
145
mall4uni/pages/delivery-address/delivery-address.vue
Normal file
@ -0,0 +1,145 @@
|
||||
<template>
|
||||
<!--pages/delivery-address/delivery-address.wxml-->
|
||||
<view class="container">
|
||||
<view class="main">
|
||||
<view class="empty" v-if="addressList.length==0">
|
||||
<view class="img">
|
||||
<image src="http://jiales.gz-yami.com/addr.png"></image>
|
||||
</view>
|
||||
<view class="txt">您还没有收货地址</view>
|
||||
</view>
|
||||
<radio-group class="radio-group" @change="radioChange">
|
||||
<block v-for="(item, index) in addressList" :key="index">
|
||||
<view class="address">
|
||||
<view class="personal" @tap="selAddrToOrder" :data-item="item">
|
||||
<view class="info-tit">
|
||||
<text class="name">{{item.receiver}}</text>
|
||||
<text class="tel">{{item.mobile}}</text>
|
||||
<image src="/static/images/icon/revise.png" @tap.stop="toEditAddress" :data-addrid="item.addrId"></image>
|
||||
</view>
|
||||
<view class="addr">
|
||||
|
||||
<text class="addr-get"> {{item.province}}{{item.city}}{{item.area}}{{item.addr}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="select-btn">
|
||||
<view class="box">
|
||||
<label @tap="onDefaultAddr" :data-addrid="item.addrId">
|
||||
<radio :value="item.prodId" :checked="item.commonAddr==1" color="#eb2444"></radio>设为默认地址</label>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</radio-group>
|
||||
</view>
|
||||
<view class="footer" @tap="onAddAddr">
|
||||
<text>新增收货地址</text>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/delivery-address/delivery-address.js
|
||||
var http = require("../../utils/http.js"); // var config = require("../../utils/config.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
defaultSize: 'mini',
|
||||
disabled: false,
|
||||
plain: true,
|
||||
loading: false,
|
||||
addressList: [],
|
||||
addAddress: '',
|
||||
order: -1,
|
||||
item: "",
|
||||
selAddress: ""
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
onLoad: function (option) {
|
||||
if (option.order) {
|
||||
this.setData({
|
||||
order: option.order
|
||||
});
|
||||
}
|
||||
},
|
||||
//加载地址列表
|
||||
onShow: function () {
|
||||
var ths = this;
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/address/list",
|
||||
method: "GET",
|
||||
data: {},
|
||||
callBack: function (res) {
|
||||
//console.log(res)
|
||||
ths.setData({
|
||||
addressList: res
|
||||
});
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
methods: {
|
||||
//新增收货地址
|
||||
onAddAddr: function (e) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/editAddress/editAddress'
|
||||
});
|
||||
},
|
||||
//设置为默认地址
|
||||
onDefaultAddr: function (e) {
|
||||
var addrId = e.currentTarget.dataset.addrid;
|
||||
console.log(addrId);
|
||||
var ths = this;
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/address/defaultAddr/" + addrId,
|
||||
method: "PUT",
|
||||
data: {
|
||||
addrId: addrId
|
||||
},
|
||||
callBack: function (res) {
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
// 修改地址
|
||||
toEditAddress: function (e) {
|
||||
var addrId = e.currentTarget.dataset.addrid;
|
||||
uni.navigateTo({
|
||||
url: '/pages/editAddress/editAddress?addrId=' + addrId
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 选择地址 跳转回提交订单页
|
||||
*/
|
||||
selAddrToOrder: function (e) {
|
||||
if (this.order == 0) {
|
||||
var pages = getCurrentPages(); //当前页面
|
||||
|
||||
var prevPage = pages[pages.length - 2]; //上一页面
|
||||
|
||||
prevPage.setData({
|
||||
//直接给上移页面赋值
|
||||
item: e.currentTarget.dataset.item,
|
||||
selAddress: 'yes'
|
||||
});
|
||||
uni.navigateBack({
|
||||
//返回
|
||||
delta: 1
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./delivery-address.css";
|
||||
</style>
|
||||
181
mall4uni/pages/editAddress/editAddress.css
Normal file
@ -0,0 +1,181 @@
|
||||
/* pages/editAddress/editAddress.wxss */
|
||||
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
/* input列表 */
|
||||
|
||||
.input-box {
|
||||
margin-bottom: 50rpx;
|
||||
background: #fff;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.input-box .section {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
font-size: 28rpx;
|
||||
padding: 30rpx 0;
|
||||
line-height: 48rpx;
|
||||
height: 100%;
|
||||
box-sizing: border-box;
|
||||
border-bottom: 2rpx solid #e5e5e5;
|
||||
}
|
||||
|
||||
.input-box .section text {
|
||||
width: 20%;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.input-box .section input {
|
||||
width: 70%;
|
||||
padding: 0 20rpx;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.input-box .section picker {
|
||||
width: 70%;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.input-box .section .pca {
|
||||
width: 70%;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.input-box .section .arrow {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
|
||||
.input-box .section .arrow image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
/* end input列表 */
|
||||
|
||||
/* 功能按钮 */
|
||||
|
||||
.btn-box {
|
||||
padding: 5px 10px;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.btn-box text {
|
||||
font-size: 30rpx;
|
||||
}
|
||||
|
||||
.btn-box .clear.btn, .keep.btn {
|
||||
width: 60%;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
margin: auto;
|
||||
text-align: center;
|
||||
border: 1rpx solid #eb2444;
|
||||
border-radius: 50rpx;
|
||||
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), 0 1px 0 rgba(255, 255, 255, 0.3);
|
||||
}
|
||||
|
||||
.btn-box .keep {
|
||||
color: #fff;
|
||||
background-color: #eb2444;
|
||||
}
|
||||
|
||||
.btn-box .clear.btn {
|
||||
margin-top: 40rpx;
|
||||
color: #eb2444;
|
||||
background-color: #f8f0f1b6;
|
||||
}
|
||||
|
||||
/* end 功能按钮 */
|
||||
|
||||
.infoText {
|
||||
margin-top: 20rpx;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
picker-view {
|
||||
background-color: white;
|
||||
padding: 0;
|
||||
width: 100%;
|
||||
height: 380rpx;
|
||||
bottom: 0;
|
||||
position: fixed;
|
||||
}
|
||||
|
||||
picker-view-column view {
|
||||
vertical-align: middle;
|
||||
font-size: 28rpx;
|
||||
line-height: 28rpx;
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.animation-element-wrapper {
|
||||
display: flex;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.animation-element {
|
||||
display: flex;
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 470rpx;
|
||||
bottom: 0;
|
||||
background-color: rgba(255, 255, 255, 1);
|
||||
}
|
||||
|
||||
.animation-button {
|
||||
top: 20rpx;
|
||||
width: 290rpx;
|
||||
height: 100rpx;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
picker-view text {
|
||||
color: #999;
|
||||
display: inline-flex;
|
||||
position: fixed;
|
||||
margin-top: 20rpx;
|
||||
height: 50rpx;
|
||||
text-align: center;
|
||||
line-height: 50rpx;
|
||||
font-size: 34rpx;
|
||||
font-family: Arial, Helvetica, sans-serif;
|
||||
}
|
||||
|
||||
.left-bt {
|
||||
left: 30rpx;
|
||||
}
|
||||
|
||||
.right-bt {
|
||||
right: 20rpx;
|
||||
top: 20rpx;
|
||||
position: absolute;
|
||||
width: 80rpx !important;
|
||||
}
|
||||
|
||||
.line {
|
||||
display: block;
|
||||
position: fixed;
|
||||
height: 2rpx;
|
||||
width: 100%;
|
||||
margin-top: 89rpx;
|
||||
background-color: #eee;
|
||||
}
|
||||
476
mall4uni/pages/editAddress/editAddress.vue
Normal file
@ -0,0 +1,476 @@
|
||||
<template>
|
||||
<!--pages/editAddress/editAddress.wxml-->
|
||||
|
||||
<view class="container">
|
||||
<!--input列表 -->
|
||||
<view class="input-box">
|
||||
<view class="section">
|
||||
<text>收 货 人</text>
|
||||
<input placeholder="姓名" type="text" maxlength="15" :value="receiver" @input="onReceiverInput"></input>
|
||||
</view>
|
||||
<view class="section">
|
||||
<text>手机号码</text>
|
||||
<input placeholder="11位手机号码" type="number" maxlength="11" :value="mobile" @input="onMobileInput"></input>
|
||||
</view>
|
||||
<view class="section" @tap="translate">
|
||||
<text>所在地区</text>
|
||||
<view class="pca">{{province}} {{city}} {{area}}</view>
|
||||
<view class="animation-element-wrapper" :animation="animation" :style="'visibility:' + (show ? 'visible':'hidden')" @tap="hiddenFloatView">
|
||||
<view class="animation-element" @tap.stop="nono">
|
||||
<text class="right-bt" @tap.stop="hiddenFloatView">确定</text>
|
||||
<view class="line"></view>
|
||||
<picker-view indicator-style="height: 50rpx;" :value="value" @change="bindChange" @tap.stop="nono">
|
||||
<!--省-->
|
||||
<picker-view-column>
|
||||
<view v-for="(item, index) in provArray" :key="index">
|
||||
{{item.areaName}}
|
||||
</view>
|
||||
</picker-view-column>
|
||||
<!--地级市-->
|
||||
<picker-view-column>
|
||||
<view v-for="(item, index) in cityArray" :key="index">
|
||||
{{item.areaName}}
|
||||
</view>
|
||||
</picker-view-column>
|
||||
<!--区县-->
|
||||
<picker-view-column>
|
||||
<view v-for="(item, index) in areaArray" :key="index">
|
||||
{{item.areaName}}
|
||||
</view>
|
||||
</picker-view-column>
|
||||
</picker-view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="arrow">
|
||||
<image src="/static/images/icon/more.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="section">
|
||||
<text>详细地址</text>
|
||||
<input placeholder="如楼号/单元/门牌号" type="text" :value="addr" @input="onAddrInput"></input>
|
||||
</view>
|
||||
</view>
|
||||
<!-- end input列表 -->
|
||||
<!-- 功能按钮 -->
|
||||
<view class="btn-box">
|
||||
<view class="keep btn" @tap="onSaveAddr">
|
||||
<text>保存收货地址</text>
|
||||
</view>
|
||||
|
||||
<view class="clear btn" @tap="onDeleteAddr" v-if="addrId!=0">
|
||||
<text>删除收货地址</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- end 功能按钮 -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/editAddress/editAddress.js
|
||||
var http = require("../../utils/http.js");
|
||||
var config = require("../../utils/config.js");
|
||||
var index = [18, 0, 0];
|
||||
var t = 0;
|
||||
var show = false;
|
||||
var moveY = 200;
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
value: [0, 0, 0],
|
||||
provArray: [],
|
||||
cityArray: [],
|
||||
areaArray: [],
|
||||
province: "",
|
||||
city: "",
|
||||
area: "",
|
||||
provinceId: 0,
|
||||
cityId: 0,
|
||||
areaId: 0,
|
||||
receiver: "",
|
||||
mobile: "",
|
||||
addr: "",
|
||||
addrId: 0,
|
||||
animation: "",
|
||||
show: "",
|
||||
region: ""
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
onLoad: function (options) {
|
||||
if (options.addrId) {
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/address/addrInfo/" + options.addrId,
|
||||
method: "GET",
|
||||
data: {},
|
||||
callBack: res => {
|
||||
//console.log(res)
|
||||
this.setData({
|
||||
province: res.province,
|
||||
city: res.city,
|
||||
area: res.area,
|
||||
provinceId: res.provinceId,
|
||||
cityId: res.cityId,
|
||||
areaId: res.areaId,
|
||||
receiver: res.receiver,
|
||||
mobile: res.mobile,
|
||||
addr: res.addr,
|
||||
addrId: options.addrId
|
||||
});
|
||||
this.initCityData(res.provinceId, res.cityId, res.areaId);
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
} else {
|
||||
this.initCityData(this.provinceId, this.cityId, this.areaId);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {},
|
||||
onReady: function () {
|
||||
this.animation = uni.createAnimation({
|
||||
transformOrigin: "50% 50%",
|
||||
duration: 0,
|
||||
timingFunction: "ease",
|
||||
delay: 0
|
||||
});
|
||||
this.animation.translateY(200 + 'vh').step();
|
||||
this.setData({
|
||||
animation: this.animation.export(),
|
||||
show: show
|
||||
});
|
||||
},
|
||||
methods: {
|
||||
initCityData: function (provinceId, cityId, areaId) {
|
||||
var ths = this;
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/area/listByPid",
|
||||
method: "GET",
|
||||
data: {
|
||||
pid: 0
|
||||
},
|
||||
callBack: function (res) {
|
||||
//console.log(res)
|
||||
ths.setData({
|
||||
provArray: res
|
||||
});
|
||||
|
||||
if (provinceId) {
|
||||
for (var index in res) {
|
||||
if (res[index].areaId == provinceId) {
|
||||
ths.setData({
|
||||
value: [index, ths.value[1], ths.value[2]]
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ths.getCityArray(provinceId ? provinceId : res[0].areaId, cityId, areaId);
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
//滑动事件
|
||||
bindChange: function (e) {
|
||||
var ths = this;
|
||||
var val = e.detail.value; //判断滑动的是第几个column
|
||||
//若省份column做了滑动则定位到地级市和区县第一位
|
||||
|
||||
if (index[0] != val[0]) {
|
||||
val[1] = 0;
|
||||
val[2] = 0; //更新数据
|
||||
|
||||
ths.getCityArray(this.provArray[val[0]].areaId); //获取地级市数据
|
||||
} else {
|
||||
//若省份column未做滑动,地级市做了滑动则定位区县第一位
|
||||
if (index[1] != val[1]) {
|
||||
val[2] = 0; //更新数据
|
||||
|
||||
ths.getAreaArray(this.cityArray[val[1]].areaId); //获取区县数据
|
||||
} else {}
|
||||
}
|
||||
|
||||
index = val;
|
||||
this.setData({
|
||||
value: [val[0], val[1], val[2]]
|
||||
});
|
||||
ths.setData({
|
||||
province: ths.provArray[ths.value[0]].areaName,
|
||||
city: ths.cityArray[ths.value[1]].areaName,
|
||||
area: ths.areaArray[ths.value[2]].areaName,
|
||||
provinceId: ths.provArray[ths.value[0]].areaId,
|
||||
cityId: ths.cityArray[ths.value[1]].areaId,
|
||||
areaId: ths.areaArray[ths.value[2]].areaId
|
||||
});
|
||||
},
|
||||
//移动按钮点击事件
|
||||
translate: function (e) {
|
||||
if (t == 0) {
|
||||
moveY = 0;
|
||||
show = false;
|
||||
t = 1;
|
||||
} else {
|
||||
moveY = 200;
|
||||
show = true;
|
||||
t = 0;
|
||||
} // this.animation.translate(arr[0], arr[1]).step();
|
||||
|
||||
|
||||
this.animationEvents(this, moveY, show);
|
||||
},
|
||||
|
||||
//隐藏弹窗浮层
|
||||
hiddenFloatView(e) {
|
||||
//console.log(e);
|
||||
moveY = 200;
|
||||
show = true;
|
||||
t = 0;
|
||||
this.animationEvents(this, moveY, show);
|
||||
},
|
||||
|
||||
//动画事件
|
||||
animationEvents: function (that, moveY, show) {
|
||||
//console.log("moveY:" + moveY + "\nshow:" + show);
|
||||
that.animation = uni.createAnimation({
|
||||
transformOrigin: "50% 50%",
|
||||
duration: 400,
|
||||
timingFunction: "ease",
|
||||
delay: 0
|
||||
});
|
||||
that.animation.translateY(moveY + 'vh').step();
|
||||
that.setData({
|
||||
animation: that.animation.export(),
|
||||
show: show
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 根据省份ID获取 城市数据
|
||||
*/
|
||||
getCityArray: function (provinceId, cityId, areaId) {
|
||||
var ths = this;
|
||||
var params = {
|
||||
url: "/p/area/listByPid",
|
||||
method: "GET",
|
||||
data: {
|
||||
pid: provinceId
|
||||
},
|
||||
callBack: function (res) {
|
||||
//console.log(res)
|
||||
ths.setData({
|
||||
cityArray: res
|
||||
});
|
||||
|
||||
if (cityId) {
|
||||
for (var index in res) {
|
||||
if (res[index].areaId == cityId) {
|
||||
ths.setData({
|
||||
value: [ths.value[0], index, ths.value[2]]
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
ths.getAreaArray(cityId ? cityId : res[0].areaId, areaId);
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 根据城市ID获取 区数据
|
||||
*/
|
||||
getAreaArray: function (cityId, areaId) {
|
||||
var ths = this;
|
||||
var params = {
|
||||
url: "/p/area/listByPid",
|
||||
method: "GET",
|
||||
data: {
|
||||
pid: cityId
|
||||
},
|
||||
callBack: function (res) {
|
||||
//console.log(res)
|
||||
ths.setData({
|
||||
areaArray: res
|
||||
});
|
||||
|
||||
if (areaId) {
|
||||
for (var _index in res) {
|
||||
if (res[_index].areaId == areaId) {
|
||||
ths.setData({
|
||||
value: [ths.value[0], ths.value[1], _index]
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
index = ths.value;
|
||||
ths.setData({
|
||||
province: ths.province,
|
||||
city: ths.city,
|
||||
area: ths.area,
|
||||
provinceId: ths.provinceId,
|
||||
cityId: ths.cityId,
|
||||
areaId: ths.areaId
|
||||
});
|
||||
} else {
|
||||
ths.setData({
|
||||
province: ths.provArray[ths.value[0]].areaName,
|
||||
city: ths.cityArray[ths.value[1]].areaName,
|
||||
area: ths.areaArray[ths.value[2]].areaName,
|
||||
provinceId: ths.provArray[ths.value[0]].areaId,
|
||||
cityId: ths.cityArray[ths.value[1]].areaId,
|
||||
areaId: ths.areaArray[ths.value[2]].areaId
|
||||
});
|
||||
}
|
||||
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
bindRegionChange: function (e) {
|
||||
//console.log('picker发送选择改变,携带值为', e.detail.value)
|
||||
this.setData({
|
||||
region: e.detail.value
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 保存地址
|
||||
*/
|
||||
onSaveAddr: function () {
|
||||
var ths = this;
|
||||
var receiver = ths.receiver;
|
||||
var mobile = ths.mobile;
|
||||
var addr = ths.addr;
|
||||
|
||||
if (!receiver) {
|
||||
uni.showToast({
|
||||
title: '请输入收货人姓名',
|
||||
icon: "none"
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!mobile) {
|
||||
uni.showToast({
|
||||
title: '请输入手机号码',
|
||||
icon: "none"
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (mobile.length != 11) {
|
||||
uni.showToast({
|
||||
title: '请输入正确的手机号码',
|
||||
icon: "none"
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
if (!addr) {
|
||||
uni.showToast({
|
||||
title: '请输入详细地址',
|
||||
icon: "none"
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
uni.showLoading();
|
||||
var url = "/p/address/addAddr";
|
||||
var method = "POST";
|
||||
|
||||
if (ths.addrId != 0) {
|
||||
url = "/p/address/updateAddr";
|
||||
method = "PUT";
|
||||
} //添加或修改地址
|
||||
|
||||
|
||||
var params = {
|
||||
url: url,
|
||||
method: method,
|
||||
data: {
|
||||
receiver: ths.receiver,
|
||||
mobile: ths.mobile,
|
||||
addr: ths.addr,
|
||||
province: ths.province,
|
||||
provinceId: ths.provinceId,
|
||||
city: ths.city,
|
||||
cityId: ths.cityId,
|
||||
areaId: ths.areaId,
|
||||
area: ths.area,
|
||||
userType: 0,
|
||||
addrId: ths.addrId
|
||||
},
|
||||
callBack: function (res) {
|
||||
uni.hideLoading();
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
onReceiverInput: function (e) {
|
||||
this.setData({
|
||||
receiver: e.detail.value
|
||||
});
|
||||
},
|
||||
onMobileInput: function (e) {
|
||||
this.setData({
|
||||
mobile: e.detail.value
|
||||
});
|
||||
},
|
||||
onAddrInput: function (e) {
|
||||
this.setData({
|
||||
addr: e.detail.value
|
||||
});
|
||||
},
|
||||
//删除配送地址
|
||||
onDeleteAddr: function (e) {
|
||||
var ths = this;
|
||||
uni.showModal({
|
||||
title: '',
|
||||
content: '确定要删除此收货地址吗?',
|
||||
confirmColor: "#eb2444",
|
||||
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
var addrId = ths.addrId;
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/address/deleteAddr/" + addrId,
|
||||
method: "DELETE",
|
||||
data: {},
|
||||
callBack: function (res) {
|
||||
uni.hideLoading();
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消');
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./editAddress.css";
|
||||
</style>
|
||||
184
mall4uni/pages/express-delivery/express-delivery.css
Normal file
@ -0,0 +1,184 @@
|
||||
/* pages/express-delivery/express-delivery.wxss */
|
||||
|
||||
.container {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.padding20 {
|
||||
padding-top: 88rpx;
|
||||
}
|
||||
|
||||
.f-fl {
|
||||
float: left;
|
||||
}
|
||||
|
||||
.f-fr {
|
||||
float: right;
|
||||
}
|
||||
|
||||
.navWrap {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
overflow: hidden;
|
||||
background-color: #fafafa;
|
||||
border-bottom: 2rpx solid #f4f4f4;
|
||||
height: 92rpx;
|
||||
}
|
||||
|
||||
.nav {
|
||||
display: flex;
|
||||
flex-flow: row nowrap;
|
||||
}
|
||||
|
||||
.nav-slider {
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
height: 4rpx;
|
||||
background-color: #b4282d;
|
||||
transition: transform 0.3s;
|
||||
transition: transform 0.3s, -webkit-transform 0.3s;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
float: left;
|
||||
height: 88rpx;
|
||||
padding: 0 16rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.nav-item text {
|
||||
box-sizing: border-box;
|
||||
color: #333;
|
||||
padding: 27rpx 16rpx 23rpx;
|
||||
line-height: 34rpx;
|
||||
}
|
||||
|
||||
.nav-item.active text {
|
||||
color: #b4282d;
|
||||
}
|
||||
|
||||
.u-icon {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.deliveryInfo {
|
||||
height: 198rpx;
|
||||
width: 100%;
|
||||
vertical-align: middle;
|
||||
padding-left: 30rpx;
|
||||
background-size: cover;
|
||||
display: table;
|
||||
position: relative;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.icon-express {
|
||||
width: 104rpx;
|
||||
height: 104rpx;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
top: 48rpx;
|
||||
left: 30rpx;
|
||||
}
|
||||
|
||||
.infoWarp {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.deliveryInfo .companyname, .deliveryInfo .expno {
|
||||
line-height: 1;
|
||||
margin-left: 136rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.deliveryInfo .companyname .key, .deliveryInfo .expno .key {
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.deliveryInfo .expno {
|
||||
margin-top: 16rpx;
|
||||
}
|
||||
|
||||
.deliveryDetail {
|
||||
margin-top: 20rpx;
|
||||
padding-top: 40rpx;
|
||||
background-color: #fff;
|
||||
min-height: 670rpx;
|
||||
}
|
||||
|
||||
.detailItem {
|
||||
border-left: 1px dashed #f4f4f4;
|
||||
margin-left: 42rpx;
|
||||
position: relative;
|
||||
margin-bottom: 2rpx;
|
||||
}
|
||||
|
||||
.dot image {
|
||||
width: 35rpx;
|
||||
height: 35rpx;
|
||||
background-size: 100%;
|
||||
position: absolute;
|
||||
top: 40rpx;
|
||||
left: -18rpx;
|
||||
}
|
||||
|
||||
.lastest .dot image {
|
||||
top: -2rpx;
|
||||
}
|
||||
|
||||
.detail .desc {
|
||||
font-size: 24rpx;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
|
||||
.detail .time {
|
||||
font-size: 24rpx;
|
||||
line-height: 30rpx;
|
||||
color: #999;
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
|
||||
.detail {
|
||||
border-top: 1px solid #f4f4f4;
|
||||
margin-left: 28rpx;
|
||||
overflow: hidden;
|
||||
padding-right: 30rpx;
|
||||
}
|
||||
|
||||
.detail .desc {
|
||||
margin-top: 40rpx;
|
||||
}
|
||||
|
||||
.detail .time {
|
||||
margin-bottom: 39rpx;
|
||||
}
|
||||
|
||||
.lastest .detail .desc, .lastest .detail .time {
|
||||
color: #105c3e;
|
||||
}
|
||||
|
||||
.lastest .detail {
|
||||
border-top: 0;
|
||||
}
|
||||
|
||||
.lastest .detail .desc {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.deliveryTip {
|
||||
height: 80rpx;
|
||||
background-color: #fff8d8;
|
||||
padding-left: 30rpx;
|
||||
color: #f48f18;
|
||||
font-size: 28rpx;
|
||||
line-height: 80rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
119
mall4uni/pages/express-delivery/express-delivery.vue
Normal file
@ -0,0 +1,119 @@
|
||||
<template>
|
||||
<!--pages/express-delivery/express-delivery.wxml-->
|
||||
<!-- 物流信息 -->
|
||||
<view class="container">
|
||||
<view class="wrapper">
|
||||
<view class="deliveryInfo" style="background:url(http://jiales.gz-yami.com/delivery-bg.png) center center no-repeat #fff;">
|
||||
<view class="icon-express" style="background:url(http://jiales.gz-yami.com/delivery-car.png) no-repeat;background-size:100% 100%;">
|
||||
</view>
|
||||
<view class="infoWarp">
|
||||
<view class="companyname">
|
||||
<text class="key">物流公司:</text>
|
||||
<text class="value">{{companyName}}</text>
|
||||
</view>
|
||||
<view class="expno">
|
||||
<text class="key">运单编号:</text>
|
||||
<text class="value">{{dvyFlowId}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="deliveryDetail">
|
||||
<block v-for="(item, index) in dvyData" :key="index">
|
||||
|
||||
<view :class="'detailItem ' + (index==0?'lastest':'')">
|
||||
<view class="dot">
|
||||
<image src="/static/images/icon/delive-dot.png"></image>
|
||||
<image src="/static/images/icon/dot.png"></image>
|
||||
</view>
|
||||
<view class="detail">
|
||||
<view class="desc">{{item.context}}</view>
|
||||
<view class="time">{{item.time}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/express-delivery/express-delivery.js
|
||||
var http = require("../../utils/http.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
companyName: "",
|
||||
dvyFlowId: "",
|
||||
dvyData: []
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
var ths = this;
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/delivery/check",
|
||||
method: "GET",
|
||||
data: {
|
||||
orderNumber: options.orderNum
|
||||
},
|
||||
callBack: function (res) {
|
||||
//console.log(res);
|
||||
ths.setData({
|
||||
companyName: res.companyName,
|
||||
dvyFlowId: res.dvyFlowId,
|
||||
dvyData: res.data
|
||||
});
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./express-delivery.css";
|
||||
</style>
|
||||
462
mall4uni/pages/index/index.css
Normal file
@ -0,0 +1,462 @@
|
||||
/**index.wxss**/
|
||||
|
||||
page {
|
||||
background: #f7f7f7;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
/* 轮播图及搜索框 */
|
||||
|
||||
swiper {
|
||||
width: 100%;
|
||||
height: 350rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
swiper.pic-swiper {
|
||||
margin-top: 75rpx;
|
||||
padding: 10rpx 0;
|
||||
background: #fff;
|
||||
height: 422rpx;
|
||||
}
|
||||
|
||||
swiper-item {
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
swiper.pic-swiper .img-box {
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.wx-swiper-dots {
|
||||
margin-bottom: 15rpx;
|
||||
}
|
||||
|
||||
.banner-item {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
swiper.pic-swiper .banner {
|
||||
position: absolute;
|
||||
width: 690rpx;
|
||||
margin: 0 10rpx;
|
||||
height: 402rpx;
|
||||
border-radius: 8rpx;
|
||||
display: inline-block;
|
||||
box-shadow: 0 4px 10px 0 rgba(83, 83, 83, 0.288);
|
||||
}
|
||||
|
||||
.container .bg-sear {
|
||||
position: fixed;
|
||||
z-index: 999;
|
||||
width: 100%;
|
||||
line-height: 56rpx;
|
||||
background: #fff;
|
||||
padding: 20rpx 0;
|
||||
text-align: center;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.bg-sear .section {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
height: 60rpx;
|
||||
background: #fff;
|
||||
z-index: 1;
|
||||
border-radius: 50rpx;
|
||||
width: 92%;
|
||||
margin: auto;
|
||||
left: 4%;
|
||||
background: #f7f7f7;
|
||||
}
|
||||
|
||||
.bg-sear .section .placeholder {
|
||||
display: block;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.bg-sear .section .search-img {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
/* 分类栏目 */
|
||||
|
||||
.content {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.cat-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
background: #fff;
|
||||
padding-top: 20rpx;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.cat-item .item {
|
||||
text-align: center;
|
||||
width: 25%;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin: auto;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.cat-item .item image {
|
||||
width: 75rpx;
|
||||
height: 75rpx;
|
||||
}
|
||||
|
||||
.cat-item .item text {
|
||||
font-size: 26rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
/* 消息播放 */
|
||||
|
||||
.message-play {
|
||||
position: relative;
|
||||
height: 90rpx;
|
||||
background: #fff;
|
||||
margin: auto;
|
||||
padding: 0 60rpx 0 100rpx;
|
||||
box-sizing: border-box;
|
||||
box-shadow: 0 16rpx 32rpx 0 rgba(7, 17, 27, 0.05);
|
||||
border: 2rpx solid #fafafa;
|
||||
}
|
||||
|
||||
.message-play .hornpng {
|
||||
width: 77rpx;
|
||||
height: 36rpx;
|
||||
position: absolute;
|
||||
left: 20rpx;
|
||||
top: 27rpx;
|
||||
margin-right: 8rpx;
|
||||
}
|
||||
|
||||
.message-play .swiper-cont {
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
}
|
||||
|
||||
.message-play .swiper-cont .items {
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.arrow {
|
||||
width: 15rpx;
|
||||
height: 15rpx;
|
||||
border-top: 3rpx solid #686868;
|
||||
border-right: 3rpx solid #686868;
|
||||
transform: rotate(45deg);
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 34rpx;
|
||||
}
|
||||
|
||||
/* 每日上新 */
|
||||
|
||||
.title {
|
||||
position: relative;
|
||||
height: 64rpx;
|
||||
line-height: 64rpx;
|
||||
font-size: 32rpx;
|
||||
padding:40rpx 0 10rpx 30rpx;
|
||||
color:#333;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.up-to-date .title{
|
||||
color: #fff;
|
||||
background: none;
|
||||
}
|
||||
|
||||
.title .more-prod-cont {
|
||||
color: #999;
|
||||
display: inline-block;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.up-to-date .title .more-prod-cont .more {
|
||||
position:absolute;
|
||||
right:30rpx;
|
||||
top:48rpx;
|
||||
color:#fff;
|
||||
font-size:24rpx;
|
||||
background:#65addf;
|
||||
border-radius:30rpx;
|
||||
padding:0 30rpx;
|
||||
height:44rpx;
|
||||
line-height:44rpx;
|
||||
|
||||
}
|
||||
|
||||
.title .more-prod-cont .more{
|
||||
position:absolute;
|
||||
right:30rpx;
|
||||
top:48rpx;
|
||||
color:#666;
|
||||
font-size:24rpx;
|
||||
padding:0 20rpx;
|
||||
height:44rpx;
|
||||
line-height:44rpx;
|
||||
}
|
||||
|
||||
.title .more-prod-cont .arrow {
|
||||
top:58rpx;
|
||||
right: 30rpx;
|
||||
border-top: 2rpx solid #666;
|
||||
border-right: 2rpx solid #666;
|
||||
}
|
||||
|
||||
.up-to-date {
|
||||
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAUAAAABxCAYAAACkwXoWAAABS2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4KPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS42LWMxMzggNzkuMTU5ODI0LCAyMDE2LzA5LzE0LTAxOjA5OjAxICAgICAgICAiPgogPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4KICA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIi8+CiA8L3JkZjpSREY+CjwveDp4bXBtZXRhPgo8P3hwYWNrZXQgZW5kPSJyIj8+IEmuOgAAAZBJREFUeJzt1DEBwCAAwLAxYfhEGXJABkcTBb065trnAwj6XwcAvGKAQJYBAlkGCGQZIJBlgECWAQJZBghkGSCQZYBAlgECWQYIZBkgkGWAQJYBAlkGCGQZIJBlgECWAQJZBghkGSCQZYBAlgECWQYIZBkgkGWAQJYBAlkGCGQZIJBlgECWAQJZBghkGSCQZYBAlgECWQYIZBkgkGWAQJYBAlkGCGQZIJBlgECWAQJZBghkGSCQZYBAlgECWQYIZBkgkGWAQJYBAlkGCGQZIJBlgECWAQJZBghkGSCQZYBAlgECWQYIZBkgkGWAQJYBAlkGCGQZIJBlgECWAQJZBghkGSCQZYBAlgECWQYIZBkgkGWAQJYBAlkGCGQZIJBlgECWAQJZBghkGSCQZYBAlgECWQYIZBkgkGWAQJYBAlkGCGQZIJBlgECWAQJZBghkGSCQZYBAlgECWQYIZBkgkGWAQJYBAlkGCGQZIJBlgECWAQJZBghkGSCQZYBAlgECWQYIZBkgkGWAQJYBAlkGCGRdKykDj9OUNYkAAAAASUVORK5CYII=");
|
||||
background-position: top;
|
||||
background-size: 100% 332rpx;
|
||||
background-repeat: no-repeat;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.up-to-date .item-cont {
|
||||
margin: auto;
|
||||
height: auto;
|
||||
width: calc(100% - 40rpx);
|
||||
padding:0 20rpx;
|
||||
display: flex;
|
||||
flex-wrap:wrap;
|
||||
justify-content: space-around;
|
||||
/* padding: 10rpx 0 0 0; */
|
||||
}
|
||||
|
||||
.hotsale-item-cont {
|
||||
padding-bottom: 20rpx;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.up-to-date .item-cont::before {
|
||||
clear: both;
|
||||
height: 0;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.up-to-date .item-cont .prod-item {
|
||||
border-radius: 10rpx;
|
||||
width: 220rpx;
|
||||
background: #fff;
|
||||
display: inline-block;
|
||||
margin-bottom:20rpx;
|
||||
box-shadow: 0rpx 6rpx 8rpx rgba(58,134,185,0.2);
|
||||
}
|
||||
|
||||
.up-to-date .item-cont .prod-item .imagecont {
|
||||
width: 100%;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.up-to-date .item-cont .prod-item .imagecont .prodimg {
|
||||
width: 220rpx;
|
||||
height: 220rpx;
|
||||
vertical-align: middle;
|
||||
border-top-left-radius: 10rpx;
|
||||
border-top-right-radius: 10rpx;
|
||||
font-size:0;
|
||||
|
||||
}
|
||||
|
||||
.up-to-date .item-cont .prod-item .prod-text {
|
||||
font-size: 28rpx;
|
||||
overflow: hidden;
|
||||
margin: 10rpx 0;
|
||||
height: 75rpx;
|
||||
display: -webkit-box;
|
||||
word-break: break-all;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
color: #000;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
|
||||
.up-to-date .item-cont .prod-item .prod-price {
|
||||
font-size: 25rpx;
|
||||
color: #eb2444;
|
||||
font-family: Arial;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
|
||||
.more.prod-price {
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
}
|
||||
|
||||
/* 商城热卖 */
|
||||
|
||||
.hot-sale {
|
||||
/* margin: 15rpx 0; */
|
||||
}
|
||||
|
||||
.hot-sale .prod-items {
|
||||
width: 345rpx;
|
||||
display: inline-block;
|
||||
background: #fff;
|
||||
padding-bottom: 20rpx;
|
||||
box-sizing: border-box;
|
||||
/* border: 2rpx solid #e1e1e1; */
|
||||
box-shadow: 0rpx 6rpx 8rpx rgba(58,134,185,0.2);
|
||||
}
|
||||
|
||||
.hot-sale .prod-items:nth-child(2n-1) {
|
||||
margin: 20rpx 10rpx 10rpx 20rpx;
|
||||
}
|
||||
|
||||
.hot-sale .prod-items:nth-child(2n) {
|
||||
margin: 20rpx 20rpx 10rpx 10rpx;
|
||||
}
|
||||
|
||||
.prod-items .hot-imagecont .hotsaleimg {
|
||||
width: 341rpx;
|
||||
height: 341rpx;
|
||||
}
|
||||
|
||||
.prod-items .hot-text .hotprod-text {
|
||||
font-size: 28rpx;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.prod-items .hot-imagecont {
|
||||
font-size: 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.prod-items .hot-text {
|
||||
margin-top: 20rpx;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
|
||||
.prod-items .hot-text .prod-info, .more-prod .prod-text-right .prod-info {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.prod-items .hot-text .prod-text-info {
|
||||
position: relative;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
font-family: Arial;
|
||||
}
|
||||
|
||||
.prod-items .hot-text .prod-text-info .hotprod-price {
|
||||
display: inline;
|
||||
font-size: 26rpx;
|
||||
color: #eb2444;
|
||||
}
|
||||
|
||||
.prod-items .hot-text .prod-text-info .basket-img {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
bottom: 7rpx;
|
||||
/* border: 2rpx solid #eb2444;
|
||||
border-radius: 50%; */
|
||||
padding: 8rpx;
|
||||
}
|
||||
|
||||
.singal-price {
|
||||
display: inline;
|
||||
font-size: 20rpx;
|
||||
text-decoration: line-through;
|
||||
color: #777;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
|
||||
/* 更多宝贝 */
|
||||
|
||||
.more-prod {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
|
||||
.more-prod .prod-show .show-item .more-prod-pic {
|
||||
width: 250rpx;
|
||||
height: 250rpx;
|
||||
}
|
||||
|
||||
.more-prod .prod-show .show-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
padding: 20rpx;
|
||||
justify-content: start;
|
||||
border-top: 2rpx solid #f4f4f4;
|
||||
}
|
||||
|
||||
.more-prod .prod-show .show-item .more-prod-pic .more-pic {
|
||||
max-width: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.more-prod .prod-show .show-item .prod-text-right {
|
||||
margin-left: 30rpx;
|
||||
width: 72%;
|
||||
padding-bottom: 10rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.more-prod .prod-show .show-item .prod-text-right .go-to-buy {
|
||||
font-size: 26rpx;
|
||||
background: #fff2f5;
|
||||
color: #eb2444;
|
||||
border-radius: 50rpx;
|
||||
text-align: center;
|
||||
padding: 12rpx 20rpx;
|
||||
position: absolute;
|
||||
right: 20rpx;
|
||||
bottom: 20rpx;
|
||||
}
|
||||
|
||||
.more-prod .prod-show .show-item .prod-text-right .prod-text.more {
|
||||
margin: 0;
|
||||
font-size: 28rpx;
|
||||
overflow: hidden;
|
||||
margin-bottom: 20rpx;
|
||||
display: -webkit-box;
|
||||
word-break: break-all;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.more-prod .prod-show .show-item .prod-text-right .more.prod-price {
|
||||
font-size: 28rpx;
|
||||
font-family: arial;
|
||||
}
|
||||
|
||||
.b-cart {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.b-cart .basket-img {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
position: absolute;
|
||||
right: 46rpx;
|
||||
/* border: 2rpx solid #eb2444;
|
||||
border-radius: 50%; */
|
||||
padding: 8rpx;
|
||||
}
|
||||
385
mall4uni/pages/index/index.vue
Normal file
@ -0,0 +1,385 @@
|
||||
<template>
|
||||
<!--index.wxml-->
|
||||
<view class="container">
|
||||
<view class="bg-sear">
|
||||
<view class="scrolltop">
|
||||
<view class="section" @tap="toSearchPage">
|
||||
<image src="/static/images/icon/search.png" class="search-img"></image>
|
||||
<text class="placeholder">搜索</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="content">
|
||||
<!-- swiper -->
|
||||
<swiper :autoplay="autoplay" :indicator-color="indicatorColor" :interval="interval" :duration="duration" :indicator-active-color="indicatorActiveColor + ' '" circular="true" class="pic-swiper" indicator-dots previous-margin="20rpx" next-margin="20rpx">
|
||||
<block v-for="(item, index) in indexImgs" :key="index">
|
||||
<swiper-item class="banner-item">
|
||||
<view class="img-box">
|
||||
<image :src="item.imgUrl" :data-prodid="item.relation" @tap="toProdPage" class="banner"></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
<!-- end swiper -->
|
||||
|
||||
<view class="cat-item">
|
||||
<view class="item" @tap="toClassifyPage" data-sts="1">
|
||||
<image src="/static/images/icon/newProd.png"></image>
|
||||
<text>新品推荐</text>
|
||||
</view>
|
||||
<view class="item" @tap="toClassifyPage" data-sts="1">
|
||||
<image src="/static/images/icon/timePrice.png"></image>
|
||||
<text>限时特惠</text>
|
||||
</view>
|
||||
<view class="item" @tap="toClassifyPage" data-sts="3">
|
||||
<image src="/static/images/icon/neweveryday.png"></image>
|
||||
<text>每日疯抢</text>
|
||||
</view>
|
||||
<view class="item" @tap="toCouponCenter">
|
||||
<image src="/static/images/icon/newprods.png"></image>
|
||||
<text>领优惠券</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 消息播放 -->
|
||||
<view class="message-play" @tap="onNewsPage">
|
||||
<image src="/static/images/icon/horn.png" class="hornpng"></image>
|
||||
<swiper vertical="true" autoplay="true" duration="1000" class="swiper-cont">
|
||||
<block v-for="(item, index) in news" :key="index">
|
||||
<swiper-item class="items">{{item.title}}</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
<text class="arrow"></text>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="updata" v-if="updata">
|
||||
<block v-for="(item, index) in taglist" :key="index">
|
||||
<!-- 每日上新 -->
|
||||
<view class="up-to-date" v-if="item.style==2">
|
||||
<view class="title">
|
||||
<text>{{item.title}}</text>
|
||||
<view class="more-prod-cont" @tap="toClassifyPage" data-sts="0" :data-id="item.id" :data-title="item.title">
|
||||
<text class="more">查看更多</text>
|
||||
<!-- <text class='arrow'></text> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="item-cont">
|
||||
<block v-for="(prod, index2) in item.prods" :key="index2">
|
||||
<view class="prod-item" @tap="toProdPage" :data-prodid="prod.prodId">
|
||||
<view>
|
||||
<view class="imagecont">
|
||||
<image :src="prod.pic" class="prodimg"></image>
|
||||
</view>
|
||||
<view class="prod-text">{{prod.prodName}}</view>
|
||||
<view class="price">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(prod.price)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(prod.price)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 商城热卖 -->
|
||||
<view class="hot-sale" v-if="item.style==1">
|
||||
<view class="title">
|
||||
<text>{{item.title}}</text>
|
||||
<view class="more-prod-cont" @tap="toClassifyPage" data-sts="0" :data-id="item.id" :data-title="item.title">
|
||||
<text class="more">更多</text>
|
||||
<text class="arrow"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="hotsale-item-cont">
|
||||
<block v-for="(prod, index2) in item.prods" :key="index2">
|
||||
<view class="prod-items" @tap="toProdPage" :data-prodid="prod.prodId">
|
||||
<view class="hot-imagecont">
|
||||
<image :src="prod.pic" class="hotsaleimg"></image>
|
||||
</view>
|
||||
<view class="hot-text">
|
||||
<view class="hotprod-text">{{prod.prodName}}</view>
|
||||
<view class="prod-info">{{prod.brief}}</view>
|
||||
<view class="prod-text-info">
|
||||
<view class="price">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(prod.price)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(prod.price)[1]}}</text>
|
||||
</view>
|
||||
<!-- <view class='singal-price'>
|
||||
<text>¥</text>
|
||||
<text>{{prod.oriPrice}}</text>
|
||||
</view> -->
|
||||
<image src="/static/images/tabbar/basket-sel.png" class="basket-img"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 更多宝贝 -->
|
||||
<view class="more-prod" v-if="item.style==0">
|
||||
<view class="title">{{item.title}}</view>
|
||||
<view class="prod-show">
|
||||
<block v-for="(prod, index2) in item.prods" :key="index2">
|
||||
<view class="show-item" @tap="toProdPage" :data-prodid="prod.prodId">
|
||||
<view class="more-prod-pic">
|
||||
<image :src="prod.pic" class="more-pic"></image>
|
||||
</view>
|
||||
<view class="prod-text-right">
|
||||
<view class="prod-text more">{{prod.prodName}}</view>
|
||||
<view class="prod-info">{{prod.brief}}</view>
|
||||
<view class="b-cart">
|
||||
<view class="price">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(prod.price)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(prod.price)[1]}}</text>
|
||||
</view>
|
||||
<!-- <view class='go-to-buy'>立即购买</view> -->
|
||||
<image src="/static/images/tabbar/basket-sel.png" class="basket-img"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script module="wxs" lang="wxs" src="../../wxs/number.wxs"></script>
|
||||
|
||||
<script>
|
||||
//index.js
|
||||
//获取应用实例
|
||||
var http = require("../../utils/http.js");
|
||||
var config = require("../../utils/config.js");
|
||||
const app = getApp();
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
indicatorDots: true,
|
||||
indicatorColor: '#d1e5fb',
|
||||
indicatorActiveColor: '#1b7dec',
|
||||
autoplay: true,
|
||||
interval: 2000,
|
||||
duration: 1000,
|
||||
indexImgs: [],
|
||||
seq: 0,
|
||||
news: [],
|
||||
taglist: [],
|
||||
sts: 0,
|
||||
scrollTop: "",
|
||||
current: 0,
|
||||
updata: true
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
onLoad: function () {
|
||||
this.getAllData();
|
||||
},
|
||||
onShow: function () {
|
||||
//#ifdef MP-WEIXIN
|
||||
uni.getSetting({
|
||||
success(res) {
|
||||
if (!res.authSetting['scope.userInfo']) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/login/login'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
//#endif
|
||||
},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
// onPullDownRefresh: function () {
|
||||
// wx.request({
|
||||
// url: '',
|
||||
// data: {},
|
||||
// method: 'GET',
|
||||
// success: function (res) { },
|
||||
// fail: function (res) { },
|
||||
// complete: function (res) {
|
||||
// wx.stopPullDownRefresh();
|
||||
// }
|
||||
// })
|
||||
// },
|
||||
onPullDownRefresh: function () {
|
||||
// wx.showNavigationBarLoading() //在标题栏中显示加载
|
||||
//模拟加载
|
||||
var ths = this;
|
||||
setTimeout(function () {
|
||||
ths.getAllData(); // wx.hideNavigationBarLoading() //完成停止加载
|
||||
|
||||
uni.stopPullDownRefresh(); //停止下拉刷新
|
||||
}, 100);
|
||||
},
|
||||
methods: {
|
||||
//事件处理函数
|
||||
bindViewTap: function () {
|
||||
uni.navigateTo({
|
||||
url: '../logs/logs'
|
||||
});
|
||||
},
|
||||
// 页面滚动到指定位置指定元素固定在顶部
|
||||
onPageScroll: function (e) {
|
||||
//监听页面滚动
|
||||
this.setData({
|
||||
scrollTop: e.scrollTop
|
||||
});
|
||||
},
|
||||
toProdPage: function (e) {
|
||||
var prodid = e.currentTarget.dataset.prodid;
|
||||
|
||||
if (prodid) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/prod/prod?prodid=' + prodid
|
||||
});
|
||||
}
|
||||
},
|
||||
toCouponCenter: function () {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '该功能未开源'
|
||||
});
|
||||
},
|
||||
// 跳转搜索页
|
||||
toSearchPage: function () {
|
||||
uni.navigateTo({
|
||||
url: '/pages/search-page/search-page'
|
||||
});
|
||||
},
|
||||
//跳转商品活动页面
|
||||
toClassifyPage: function (e) {
|
||||
var url = '/pages/prod-classify/prod-classify?sts=' + e.currentTarget.dataset.sts;
|
||||
var id = e.currentTarget.dataset.id;
|
||||
var title = e.currentTarget.dataset.title;
|
||||
|
||||
if (id) {
|
||||
url += "&tagid=" + id + "&title=" + title;
|
||||
}
|
||||
|
||||
uni.navigateTo({
|
||||
url: url
|
||||
});
|
||||
},
|
||||
//跳转公告列表页面
|
||||
onNewsPage: function () {
|
||||
uni.navigateTo({
|
||||
url: '/pages/recent-news/recent-news'
|
||||
});
|
||||
},
|
||||
|
||||
getAllData() {
|
||||
http.getCartCount(); //重新计算购物车总数量
|
||||
|
||||
this.getIndexImgs();
|
||||
this.getNoticeList();
|
||||
this.getTag();
|
||||
},
|
||||
|
||||
//加载轮播图
|
||||
getIndexImgs() {
|
||||
//加载轮播图
|
||||
var params = {
|
||||
url: "/indexImgs",
|
||||
method: "GET",
|
||||
data: {},
|
||||
callBack: res => {
|
||||
this.setData({
|
||||
indexImgs: res,
|
||||
seq: res
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
getNoticeList() {
|
||||
// 加载公告
|
||||
var params = {
|
||||
url: "/shop/notice/topNoticeList",
|
||||
method: "GET",
|
||||
data: {},
|
||||
callBack: res => {
|
||||
this.setData({
|
||||
news: res
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
// 加载商品标题分组列表
|
||||
getTag() {
|
||||
var params = {
|
||||
url: "/prod/tag/prodTagList",
|
||||
method: "GET",
|
||||
data: {},
|
||||
callBack: res => {
|
||||
this.setData({
|
||||
taglist: res
|
||||
});
|
||||
|
||||
for (var i = 0; i < res.length; i++) {
|
||||
this.updata = false
|
||||
this.updata = true
|
||||
this.getTagProd(res[i].id, i);
|
||||
}
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
getTagProd(id, index) {
|
||||
var param = {
|
||||
url: "/prod/prodListByTagId",
|
||||
method: "GET",
|
||||
data: {
|
||||
tagId: id,
|
||||
size: 6
|
||||
},
|
||||
callBack: res => {
|
||||
this.updata = false
|
||||
this.updata = true
|
||||
var taglist = this.taglist;
|
||||
taglist[index].prods = res.records;
|
||||
this.setData({
|
||||
taglist: taglist
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(param);
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转至商品详情
|
||||
*/
|
||||
showProdInfo: function (e) {
|
||||
let relation = e.currentTarget.dataset.relation;
|
||||
|
||||
if (relation) {
|
||||
uni.navigateTo({
|
||||
url: 'pages/prod/prod'
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./index.css";
|
||||
</style>
|
||||
44
mall4uni/pages/login/login.css
Normal file
@ -0,0 +1,44 @@
|
||||
/* pages/login/login.wxss */
|
||||
|
||||
|
||||
image {
|
||||
display: block;
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
margin: auto;
|
||||
margin-top: 100rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
view.msg {
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
|
||||
view.title {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
button {
|
||||
margin-top: 30rpx;
|
||||
width: 450rpx;
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
font-size: 30rpx;
|
||||
color: #fff;
|
||||
background: #eb2444;
|
||||
border: 2rpx solid #eb2444;
|
||||
}
|
||||
|
||||
|
||||
.button-hover{
|
||||
background-color: #fff;
|
||||
color: #eb2444;
|
||||
}
|
||||
73
mall4uni/pages/login/login.vue
Normal file
@ -0,0 +1,73 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--pages/login/login.wxml-->
|
||||
<image src="http://img-test.gz-yami.com/mini/logo.jpg" class="c-logo"></image>
|
||||
<view class="title">亚米科技mall4j</view>
|
||||
<view class="msg">申请获得你的公开信息(昵称、头像等)</view>
|
||||
<button color="#eb2444" open-type="getUserInfo" lang="zh_CN" @getuserinfo="onGotUserInfo" class>微信授权</button>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
var http = require("../../utils/http.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
onGotUserInfo: function (res) {
|
||||
http.updateUserInfo();
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./login.css";
|
||||
</style>
|
||||
9
mall4uni/pages/logs/logs.css
Normal file
@ -0,0 +1,9 @@
|
||||
.log-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 40rpx;
|
||||
}
|
||||
|
||||
.log-item {
|
||||
margin: 10rpx;
|
||||
}
|
||||
35
mall4uni/pages/logs/logs.vue
Normal file
@ -0,0 +1,35 @@
|
||||
<template>
|
||||
<!--logs.wxml-->
|
||||
<view class="container log-list">
|
||||
<block v-for="(log, index) in logs" :key="index">
|
||||
<text class="log-item">{{index + 1}}. {{log}}</text>
|
||||
</block>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
//logs.js
|
||||
const util = require("../../utils/util.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
logs: []
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
onLoad: function () {
|
||||
this.setData({
|
||||
logs: (uni.getStorageSync('logs') || []).map(log => {
|
||||
return util.formatTime(new Date(log));
|
||||
})
|
||||
});
|
||||
},
|
||||
methods: {}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./logs.css";
|
||||
</style>
|
||||
20
mall4uni/pages/news-detail/news-detail.css
Normal file
@ -0,0 +1,20 @@
|
||||
/* pages/news-detail/news-detail.wxss */
|
||||
|
||||
.news-detail {
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.news-detail .news-detail-title {
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
line-height: 50rpx;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.news-detail .news-detail-text {
|
||||
font-size: 28rpx;
|
||||
line-height: 46rpx;
|
||||
text-align: justify;
|
||||
text-justify: inter-ideograph;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
98
mall4uni/pages/news-detail/news-detail.vue
Normal file
@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<!--pages/news-detail/news-detail.wxml-->
|
||||
<view class="container">
|
||||
<!-- <block wx:for='{{news}}' wx:key=''> -->
|
||||
<view class="news-detail">
|
||||
<view class="news-detail-title">{{news.title}}</view>
|
||||
<!-- <view class='news-detail-text'>{{news.content}}</view> -->
|
||||
<rich-text :nodes="news.content"></rich-text>
|
||||
</view>
|
||||
<!-- </block> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/news-detail/news-detail.js
|
||||
var http = require("../../utils/http.js");
|
||||
var config = require("../../utils/config.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
news: {
|
||||
title: '',
|
||||
content: '',
|
||||
id: null
|
||||
}
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
// var ths = this;
|
||||
//加载公告详情
|
||||
var params = {
|
||||
// `/shop/notice/info/${options.id}`
|
||||
url: '/shop/notice/info/' + options.id,
|
||||
method: "GET",
|
||||
// data: {
|
||||
// id: id,
|
||||
// },
|
||||
// callBack: function(news){
|
||||
callBack: res => {
|
||||
res.content = res.content.replace(/width=/gi, 'sss=');
|
||||
res.content = res.content.replace(/height=/gi, 'sss=');
|
||||
res.content = res.content.replace(/ \/\>/gi, ' style="max-width:100% !important;display:block;" \/\>');
|
||||
this.setData({
|
||||
news: res
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./news-detail.css";
|
||||
</style>
|
||||
286
mall4uni/pages/order-detail/order-detail.css
Normal file
@ -0,0 +1,286 @@
|
||||
/* pages/order-detail/order-detail.wxss */
|
||||
|
||||
page {
|
||||
background: #f4f4f4;
|
||||
}
|
||||
|
||||
.order-detail {
|
||||
margin-bottom: 120rpx;
|
||||
}
|
||||
|
||||
.order-detail .delivery-addr {
|
||||
padding: 20rpx 30rpx;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.order-detail .delivery-addr .user-info {
|
||||
line-height: 48rpx;
|
||||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.order-detail .delivery-addr .user-info .item {
|
||||
font-size: 28rpx;
|
||||
margin-right: 30rpx;
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.order-detail .delivery-addr .addr {
|
||||
font-size: 26rpx;
|
||||
line-height: 36rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
/* 商品列表 */
|
||||
|
||||
.prod-item {
|
||||
background-color: #fff;
|
||||
margin-top: 15rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-pic image {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
}
|
||||
|
||||
.prod-item .item-cont {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
border-top: 2rpx solid #f1f1f1;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-pic {
|
||||
font-size: 0;
|
||||
display: block;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-pic image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info {
|
||||
margin-left: 10rpx;
|
||||
font-size: 28rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
height: 80px;
|
||||
-webkit-flex: 1;
|
||||
-ms-flex: 1;
|
||||
-webkit-box-flex: 1;
|
||||
-moz-box-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info .prodname {
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
max-height: 86rpx;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info .prod-info-cont {
|
||||
position: relative;
|
||||
color: #999;
|
||||
margin-top: 10rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info .prod-info-cont .info-item {
|
||||
color: #999;
|
||||
height: 28rpx;
|
||||
margin-top: 10rpx;
|
||||
font-size: 24rpx;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
width: 70%;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info .prod-info-cont .number {
|
||||
float: left;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.prod-item .price-nums {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
|
||||
.prod-item .price-nums .prodprice {
|
||||
color: #333;
|
||||
height: 50rpx;
|
||||
line-height: 50rpx;
|
||||
font-size: 24rpx;
|
||||
float: left;
|
||||
}
|
||||
|
||||
.prod-item .price-nums .btn-box {
|
||||
float: right;
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.prod-item .price-nums .btn-box .btn {
|
||||
padding: 6rpx 30rpx;
|
||||
line-height: 36rpx;
|
||||
margin-left: 20rpx;
|
||||
font-size: 24rpx;
|
||||
display: inline-block;
|
||||
border: 2rpx solid #e4e4e4;
|
||||
border-radius: 50rpx;
|
||||
}
|
||||
|
||||
/*
|
||||
订单信息 */
|
||||
|
||||
.order-msg {
|
||||
background: #fff;
|
||||
margin-top: 15rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.order-msg .msg-item {
|
||||
padding: 20rpx;
|
||||
border-top: 2rpx solid #f1f1f1;
|
||||
}
|
||||
|
||||
.order-msg .msg-item:first-child {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item {
|
||||
display: flex;
|
||||
padding: 10rpx 0;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item.payment {
|
||||
border-top: 2rpx solid #f1f1f1;
|
||||
color: #eb2444;
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item .item-tit {
|
||||
color: #999;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item .item-txt {
|
||||
flex: 1;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item .copy-btn {
|
||||
display: block;
|
||||
margin-left: 20rpx;
|
||||
border: 2rpx solid #e4e4e4;
|
||||
padding: 6rpx 24rpx;
|
||||
border-radius: 50rpx;
|
||||
font-size: 24rpx;
|
||||
line-height: 28rpx;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item .item-txt.price {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
/* 底部栏 */
|
||||
|
||||
.order-detail-footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
max-width: 750rpx;
|
||||
background: #fff;
|
||||
margin: auto;
|
||||
display: -webkit-flex;
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
padding: 22rpx 0;
|
||||
font-size: 26rpx;
|
||||
box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.order-detail-footer .dele-order {
|
||||
margin-left: 20rpx;
|
||||
line-height: 60rpx;
|
||||
display: block;
|
||||
margin-right: 20rpx;
|
||||
width: 150rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.order-detail-footer .footer-box {
|
||||
flex: 1;
|
||||
text-align: right;
|
||||
line-height: 60rpx;
|
||||
}
|
||||
|
||||
.order-detail-footer .footer-box .buy-again {
|
||||
font-size: 26rpx;
|
||||
color: #fff;
|
||||
background: #eb2444;
|
||||
border-radius: 50rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.order-detail-footer .footer-box .apply-service {
|
||||
font-size: 26rpx;
|
||||
border-radius: 50rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
border: 1px solid #e4e4e4;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
/* 根据状态显示不同的颜色 */
|
||||
|
||||
.order-state {
|
||||
height: 70rpx;
|
||||
line-height: 70rpx;
|
||||
text-align: right;
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.order-state .order-sts {
|
||||
color: #eb2444;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.order-state .order-sts.gray {
|
||||
color: #999;
|
||||
height: 32rpx;
|
||||
line-height: 32rpx;
|
||||
}
|
||||
|
||||
.order-state .order-sts.normal {
|
||||
color: #333;
|
||||
}
|
||||
285
mall4uni/pages/order-detail/order-detail.vue
Normal file
@ -0,0 +1,285 @@
|
||||
<template>
|
||||
<!--pages/order-detail/order-detail.wxml-->
|
||||
|
||||
<view class="container">
|
||||
|
||||
<view class="order-detail">
|
||||
<view class="delivery-addr" v-if="userAddrDto">
|
||||
<view class="user-info">
|
||||
<text class="item">{{userAddrDto.receiver}}</text>
|
||||
<text class="item">{{userAddrDto.mobile}}</text>
|
||||
</view>
|
||||
<view class="addr">{{userAddrDto.province}}{{userAddrDto.city}}{{userAddrDto.area}}{{userAddrDto.area}}{{userAddrDto.addr}}</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<!-- 商品信息 -->
|
||||
<view class="prod-item" v-if="orderItemDtos">
|
||||
|
||||
<block v-for="(item, index) in orderItemDtos" :key="index">
|
||||
<view class="item-cont" @tap="toProdPage" :data-prodid="item.prodId">
|
||||
<view class="prod-pic">
|
||||
<image :src="item.pic"></image>
|
||||
</view>
|
||||
<view class="prod-info">
|
||||
<view class="prodname">
|
||||
{{item.prodName}}
|
||||
</view>
|
||||
<view class="prod-info-cont">
|
||||
<text class="number">数量:{{item.prodCount}}</text>
|
||||
<text class="info-item">{{item.skuName}}</text>
|
||||
</view>
|
||||
<view class="price-nums clearfix">
|
||||
<text class="prodprice"><text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(item.price)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(item.price)[1]}}</text></text>
|
||||
<view class="btn-box">
|
||||
<text class="btn" v-if="item.status!=1">申请售后</text>
|
||||
<text class="btn">加购物车</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- <view class='item-cont' bindtap='toOrderDetailPage' data-ordernum="{{item.primaryOrderNo}}">
|
||||
<view class='prod-pic'>
|
||||
<image src='../../images/prod/pic10.jpg'></image>
|
||||
</view>
|
||||
<view class='prod-info'>
|
||||
<view class='prodname'>
|
||||
THE BEAST/野兽派 雪花发财狗
|
||||
</view>
|
||||
<view class='prod-info-cont'>
|
||||
<text class='number'>数量:1</text>
|
||||
<text class='info-item'>发财狗</text>
|
||||
</view>
|
||||
<view class='price-nums clearfix'>
|
||||
<text class='prodprice'><text class='symbol'>¥</text>
|
||||
<text class='big-num'>{{wxs.parsePrice(40.00)[0]}}</text>
|
||||
<text class='small-num'>.{{wxs.parsePrice(40.00)[1]}}</text></text>
|
||||
<view class='btn-box'>
|
||||
<text class='btn'>申请售后</text>
|
||||
<text class='btn'>加购物车</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="prod-foot">
|
||||
<view class="btn">
|
||||
<button v-if="status==1" class="button" @tap="onCancelOrder" :data-ordernum="orderNumber" hover-class="none">取消订单</button>
|
||||
<button v-if="status==1" class="button warn" @tap="onConfirmReceive" :data-ordernum="orderNumber" hover-class="none">再次购买</button>
|
||||
<button v-if="status==1" class="button warn" @tap="onPayAgain" :data-ordernum="orderNumber" hover-class="none">付款</button>
|
||||
<button v-if="status==3 || status==5" class="button" @tap="toDeliveryPage" :data-ordernum="orderNumber" hover-class="none">查看物流</button>
|
||||
<button v-if="status==3" class="button warn" @tap="onConfirmReceive" :data-ordernum="orderNumber" hover-class="none">确认收货</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订单信息 -->
|
||||
<view class="order-msg">
|
||||
<view class="msg-item">
|
||||
<view class="item">
|
||||
<text class="item-tit">订单编号:</text>
|
||||
<text class="item-txt">{{orderNumber}}</text>
|
||||
<text class="copy-btn" @tap="copyBtn">复制</text>
|
||||
</view>
|
||||
<view class="item">
|
||||
<text class="item-tit">下单时间:</text>
|
||||
<text class="item-txt">{{createTime}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="msg-item">
|
||||
<view class="item">
|
||||
<text class="item-tit">支付方式:</text>
|
||||
<text class="item-txt">微信支付</text>
|
||||
</view>
|
||||
<view class="item">
|
||||
<text class="item-tit">配送方式:</text>
|
||||
<text class="item-txt">普通配送</text>
|
||||
</view>
|
||||
<view class="item">
|
||||
<text class="item-tit">订单备注:</text>
|
||||
<text class="item-txt">{{remarks}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="order-msg">
|
||||
<view class="msg-item">
|
||||
<view class="item">
|
||||
<view class="item-tit">订单总额:</view>
|
||||
<view class="item-txt price">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(productTotalAmount)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(productTotalAmount)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="item-tit">运费:</view>
|
||||
<view class="item-txt price">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(transfee)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(transfee)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="item-tit">优惠券:</view>
|
||||
<view class="item-txt price">
|
||||
<text class="symbol">-¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(reduceAmount)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(reduceAmount)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item payment">
|
||||
<view class="item-txt price">
|
||||
实付款:
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(actualTotal)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(actualTotal)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 底部栏 -->
|
||||
<view class="order-detail-footer">
|
||||
<text class="dele-order" v-if="status==5||status==6">删除订单</text>
|
||||
<view class="footer-box">
|
||||
<text class="apply-service">联系客服</text>
|
||||
<text class="buy-again">再次购买</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script module="wxs" lang="wxs" src="../../wxs/number.wxs"></script>
|
||||
|
||||
<script>
|
||||
// pages/order-detail/order-detail.js
|
||||
var http = require("../../utils/http.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
orderItemDtos: [],
|
||||
remarks: "",
|
||||
actualTotal: 0,
|
||||
userAddrDto: null,
|
||||
orderNumber: "",
|
||||
createTime: "",
|
||||
status: 0,
|
||||
productTotalAmount: '',
|
||||
transfee: '',
|
||||
reduceAmount: '',
|
||||
actualTotal: '',
|
||||
prodid: ''
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
this.loadOrderDetail(options.orderNum);
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
//跳转商品详情页
|
||||
toProdPage: function (e) {
|
||||
var prodid = e.currentTarget.dataset.prodid;
|
||||
uni.navigateTo({
|
||||
url: '/pages/prod/prod?prodid=' + prodid
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 加载订单数据
|
||||
*/
|
||||
loadOrderDetail: function (orderNum) {
|
||||
uni.showLoading(); //加载订单详情
|
||||
|
||||
var params = {
|
||||
url: "/p/myOrder/orderDetail",
|
||||
method: "GET",
|
||||
data: {
|
||||
orderNumber: orderNum
|
||||
},
|
||||
callBack: res => {
|
||||
this.setData({
|
||||
orderNumber: orderNum,
|
||||
actualTotal: res.actualTotal,
|
||||
userAddrDto: res.userAddrDto,
|
||||
remarks: res.remarks,
|
||||
orderItemDtos: res.orderItemDtos,
|
||||
createTime: res.createTime,
|
||||
status: res.status,
|
||||
productTotalAmount: res.orderItemDtos[0].productTotalAmount,
|
||||
transfee: res.transfee,
|
||||
reduceAmount: res.reduceAmount,
|
||||
actualTotal: res.actualTotal
|
||||
});
|
||||
uni.hideLoading();
|
||||
console.log("orderDetail",this.userAddrDto)
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
// 一键复制事件
|
||||
copyBtn: function (e) {
|
||||
var ths = this;
|
||||
uni.setClipboardData({
|
||||
//准备复制的数据
|
||||
data: ths.orderNumber,
|
||||
success: function (res) {
|
||||
uni.showToast({
|
||||
title: '复制成功'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./order-detail.css";
|
||||
</style>
|
||||
257
mall4uni/pages/orderList/orderList.css
Normal file
@ -0,0 +1,257 @@
|
||||
/* pages/orderList/orderList.wxss */
|
||||
|
||||
page {
|
||||
background-color: #f4f4f4;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
/* 头部菜单 */
|
||||
|
||||
.order-tit {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
z-index: 999;
|
||||
width: 100%;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
background-color: #fff;
|
||||
border-bottom: 2rpx solid #f4f4f4;
|
||||
}
|
||||
|
||||
.order-tit text {
|
||||
display: block;
|
||||
font-size: 28rpx;
|
||||
color: 999;
|
||||
width: 100rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.order-tit text.on {
|
||||
border-bottom: 4rpx solid #eb2444;
|
||||
color: #eb2444;
|
||||
}
|
||||
|
||||
/* end 头部菜单 */
|
||||
|
||||
.main {
|
||||
margin-top: 100rpx;
|
||||
}
|
||||
|
||||
/* 商品列表 */
|
||||
|
||||
.prod-item {
|
||||
background-color: #fff;
|
||||
margin-top: 15rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-pic image {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
}
|
||||
|
||||
.prod-item .order-num {
|
||||
padding: 20rpx 30rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.order-state {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .categories {
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.prod-item .item-cont {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx 30rpx;
|
||||
border-radius: 10rpx;
|
||||
display: -webkit-flex;
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -ms-flexbox;
|
||||
background: #fafafa;
|
||||
}
|
||||
|
||||
.prod-item .order-num .clear-btn {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
font-size: 0;
|
||||
vertical-align: top;
|
||||
margin-left: 42rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.prod-item .order-num .clear-btn::after {
|
||||
content: " ";
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: -10px;
|
||||
top: 0rpx;
|
||||
width: 1px;
|
||||
height: 32rpx;
|
||||
background: #ddd;
|
||||
}
|
||||
|
||||
.prod-item .order-num .clear-btn .clear-list-btn {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-pic {
|
||||
font-size: 0;
|
||||
display: inline-block;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-pic image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info {
|
||||
margin-left: 10rpx;
|
||||
font-size: 28rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
height: 160rpx;
|
||||
-webkit-flex: 1;
|
||||
-ms-flex: 1;
|
||||
-webkit-box-flex: 1;
|
||||
-moz-box-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info .prodname {
|
||||
font-size: 28rpx;
|
||||
line-height: 36rpx;
|
||||
max-height: 86rpx;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info .prod-info-cont {
|
||||
color: #999;
|
||||
line-height: 40rpx;
|
||||
margin-top: 10rpx;
|
||||
font-size: 22rpx;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.prod-item .total-num {
|
||||
text-align: right;
|
||||
padding: 20rpx 30rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.prod-item .price-nums .prodprice {
|
||||
color: #333;
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.prod-item .price-nums .prodcount {
|
||||
position: absolute;
|
||||
bottom: 5rpx;
|
||||
right: 0;
|
||||
color: #999;
|
||||
font-family: verdana;
|
||||
}
|
||||
|
||||
.prod-item .total-num .prodprice {
|
||||
display: inline-block;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.prod-item .total-num .prodcount {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
.prod-item .prod-foot {
|
||||
padding: 20rpx 30rpx;
|
||||
border-top: 2rpx solid #e6e6e6;
|
||||
}
|
||||
|
||||
.prod-item .prod-foot .total {
|
||||
font-size: 25rpx;
|
||||
margin-bottom: 20rpx;
|
||||
padding-bottom: 20rpx;
|
||||
border-bottom: 2rpx solid #e9eaec;
|
||||
}
|
||||
|
||||
.prod-item .prod-foot .btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
||||
.other-button-hover {
|
||||
background-color: blue;
|
||||
}
|
||||
|
||||
.button-hover {
|
||||
background-color: red;
|
||||
}
|
||||
|
||||
/** 添加自定义button点击态样式类**/
|
||||
|
||||
.button-hover {
|
||||
background-color: blue;
|
||||
}
|
||||
|
||||
.button {
|
||||
margin-left: 10px;
|
||||
font-size: 26rpx;
|
||||
background: #fff;
|
||||
padding: 10rpx 30rpx;
|
||||
border-radius: 80rpx;
|
||||
border: 2rpx solid #e1e1e1;
|
||||
}
|
||||
|
||||
.button.warn {
|
||||
color: #eb2444;
|
||||
border-color: #eb2444;
|
||||
}
|
||||
|
||||
/* end 商品列表 */
|
||||
|
||||
.empty {
|
||||
font-size: 24rpx;
|
||||
margin-top: 100rpx;
|
||||
text-align: center;
|
||||
color: #999;
|
||||
height: 300rpx;
|
||||
line-height: 300rpx;
|
||||
}
|
||||
|
||||
/* 根据状态显示不同的颜色 */
|
||||
|
||||
.order-state .order-sts.red {
|
||||
color: #eb2444;
|
||||
}
|
||||
|
||||
.order-state .order-sts.gray {
|
||||
color: #999;
|
||||
}
|
||||
412
mall4uni/pages/orderList/orderList.vue
Normal file
@ -0,0 +1,412 @@
|
||||
<template>
|
||||
<!--pages/orderList/orderList.wxml-->
|
||||
|
||||
<view class="container">
|
||||
<!-- 头部菜单 -->
|
||||
<view class="order-tit">
|
||||
<text @tap="onStsTap" data-sts="0" :class="sts==0?'on':''">全部</text>
|
||||
<text @tap="onStsTap" data-sts="1" :class="sts==1?'on':''">待支付</text>
|
||||
<text @tap="onStsTap" data-sts="2" :class="sts==2?'on':''">待发货</text>
|
||||
<text @tap="onStsTap" data-sts="3" :class="sts==3?'on':''">待收货</text>
|
||||
<text @tap="onStsTap" data-sts="5" :class="sts==5?'on':''">已完成</text>
|
||||
</view>
|
||||
<!-- end 头部菜单 -->
|
||||
<view class="main">
|
||||
<view class="empty" v-if="list.length==0">
|
||||
还没有任何相关订单
|
||||
</view>
|
||||
<!-- 订单列表 -->
|
||||
<block v-for="(item, index) in list" :key="index">
|
||||
<view class="prod-item">
|
||||
<view class="order-num">
|
||||
<text>订单编号:{{item.orderNumber}}</text>
|
||||
<view class="order-state">
|
||||
<text :class="'order-sts ' + (item.status==1?'red':'') + ' ' + ((item.status==5||item.status==6)?'gray':'')">{{item.status==1?'待支付':(item.status==2?'待发货':(item.status==3?'待收货':(item.status==5?'已完成':'已取消')))}}</text>
|
||||
|
||||
<view class="clear-btn" v-if="item.status==5 || item.status==6">
|
||||
<image src="/static/images/icon/clear-his.png" class="clear-list-btn" @tap="delOrderList" :data-ordernum="item.orderNumber"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 商品列表 -->
|
||||
<!-- 一个订单单个商品的显示 -->
|
||||
<block v-if="item.orderItemDtos.length==1">
|
||||
<block v-for="(prod, index2) in item.orderItemDtos" :key="index2">
|
||||
<view>
|
||||
<view class="item-cont" @tap="toOrderDetailPage" :data-ordernum="item.orderNumber">
|
||||
<view class="prod-pic">
|
||||
<image :src="prod.pic"></image>
|
||||
</view>
|
||||
<view class="prod-info">
|
||||
<view class="prodname">
|
||||
{{prod.prodName}}
|
||||
</view>
|
||||
<view class="prod-info-cont">{{prod.skuName}}</view>
|
||||
<view class="price-nums">
|
||||
<text class="prodprice"><text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(prod.price)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(prod.price)[1]}}</text></text>
|
||||
<text class="prodcount">x{{prod.prodCount}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</block>
|
||||
<!-- 一个订单多个商品时的显示 -->
|
||||
<block v-else>
|
||||
<view class="item-cont" @tap="toOrderDetailPage" :data-ordernum="item.orderNumber">
|
||||
<scroll-view scroll-x="true" scroll-left="0" scroll-with-animation="false" class="categories">
|
||||
<block v-for="(prod, index2) in item.orderItemDtos" :key="index2">
|
||||
<view class="prod-pic">
|
||||
<image :src="prod.pic"></image>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</block>
|
||||
|
||||
<view class="total-num">
|
||||
<text class="prodcount">共1件商品</text>
|
||||
<view class="prodprice">合计:
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(item.actualTotal)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(item.actualTotal)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<!-- end 商品列表 -->
|
||||
<view class="prod-foot">
|
||||
<view class="btn">
|
||||
<text v-if="item.status==1" class="button" @tap="onCancelOrder" :data-ordernum="item.orderNumber" hover-class="none">取消订单</text>
|
||||
<text class="button warn" @tap :data-ordernum="item.orderNumber" hover-class="none">再次购买</text>
|
||||
<text v-if="item.status==1" class="button warn" @tap="normalPay" :data-ordernum="item.orderNumber" hover-class="none">付款</text>
|
||||
<text v-if="item.status==3 || item.status==5" class="button" @tap="toDeliveryPage" :data-ordernum="item.orderNumber" hover-class="none">查看物流</text>
|
||||
<text v-if="item.status==3" class="button warn" @tap="onConfirmReceive" :data-ordernum="item.orderNumber" hover-class="none">确认收货</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
</block>
|
||||
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<!-- end 订单列表 -->
|
||||
</template>
|
||||
|
||||
<script module="wxs" lang="wxs" src="../../wxs/number.wxs"></script>
|
||||
|
||||
<script>
|
||||
var http = require("../../utils/http.js");
|
||||
var config = require("../../utils/config.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
list: [],
|
||||
current: 1,
|
||||
pages: 0,
|
||||
sts: 0
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
if (options.sts) {
|
||||
this.setData({
|
||||
sts: options.sts
|
||||
});
|
||||
this.loadOrderData(options.sts, 1);
|
||||
} else {
|
||||
this.loadOrderData(0, 1);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
if (this.current < this.pages) {
|
||||
this.loadOrderData(this.sts, this.current + 1);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
/**
|
||||
* 加载订单数据
|
||||
*/
|
||||
loadOrderData: function (sts, current) {
|
||||
var ths = this;
|
||||
uni.showLoading(); //加载订单列表
|
||||
|
||||
var params = {
|
||||
url: "/p/myOrder/myOrder",
|
||||
method: "GET",
|
||||
data: {
|
||||
current: current,
|
||||
size: 10,
|
||||
status: sts
|
||||
},
|
||||
callBack: function (res) {
|
||||
//console.log(res);
|
||||
var list = [];
|
||||
|
||||
if (res.current == 1) {
|
||||
list = res.records;
|
||||
} else {
|
||||
list = ths.list;
|
||||
Array.prototype.push.apply(list, res.records);
|
||||
}
|
||||
|
||||
ths.setData({
|
||||
list: list,
|
||||
pages: res.pages,
|
||||
current: res.current
|
||||
});
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 状态点击事件
|
||||
*/
|
||||
onStsTap: function (e) {
|
||||
var sts = e.currentTarget.dataset.sts;
|
||||
this.setData({
|
||||
sts: sts
|
||||
});
|
||||
this.loadOrderData(sts, 1);
|
||||
},
|
||||
|
||||
/**
|
||||
* 查看物流
|
||||
*/
|
||||
toDeliveryPage: function (e) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/express-delivery/express-delivery?orderNum=' + e.currentTarget.dataset.ordernum
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 取消订单
|
||||
*/
|
||||
onCancelOrder: function (e) {
|
||||
var ordernum = e.currentTarget.dataset.ordernum;
|
||||
var ths = this;
|
||||
uni.showModal({
|
||||
title: '',
|
||||
content: '要取消此订单?',
|
||||
confirmColor: "#3e62ad",
|
||||
cancelColor: "#3e62ad",
|
||||
cancelText: '否',
|
||||
confirmText: '是',
|
||||
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/myOrder/cancel/" + ordernum,
|
||||
method: "PUT",
|
||||
data: {},
|
||||
callBack: function (res) {
|
||||
//console.log(res);
|
||||
ths.loadOrderData(ths.sts, 1);
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
} else if (res.cancel) {//console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 付款
|
||||
*/
|
||||
onPayAgain: function (e) {
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/order/pay",
|
||||
method: "POST",
|
||||
data: {
|
||||
payType: 1,
|
||||
orderNumbers: e.currentTarget.dataset.ordernum
|
||||
},
|
||||
callBack: res => {
|
||||
//console.log(res);
|
||||
uni.hideLoading();
|
||||
uni.requestPayment({
|
||||
timeStamp: res.timeStamp,
|
||||
nonceStr: res.nonceStr,
|
||||
package: res.packageValue,
|
||||
signType: res.signType,
|
||||
paySign: res.paySign,
|
||||
success: function () {
|
||||
uni.navigateTo({
|
||||
url: '/pages/pay-result/pay-result?sts=1&orderNumbers=' + e.currentTarget.dataset.ordernum
|
||||
});
|
||||
},
|
||||
fail: function (err) {//console.log("支付失败");
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
//模拟支付,直接提交成功
|
||||
normalPay: function(e){
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/order/normalPay",
|
||||
method: "POST",
|
||||
data: {
|
||||
orderNumbers: e.currentTarget.dataset.ordernum
|
||||
},
|
||||
callBack: res => {
|
||||
console.log("res",res)
|
||||
uni.hideLoading();
|
||||
if(res){
|
||||
uni.showToast({
|
||||
title: "模拟支付成功",
|
||||
icon:"none"
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/pay-result/pay-result?sts=1&orderNumbers=' + e.currentTarget.dataset.ordernum
|
||||
});
|
||||
},1200)
|
||||
}else{
|
||||
uni.showToast({
|
||||
title: "支付失败!",
|
||||
icon:"none"
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 查看订单详情
|
||||
*/
|
||||
toOrderDetailPage: function (e) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/order-detail/order-detail?orderNum=' + e.currentTarget.dataset.ordernum
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 确认收货
|
||||
*/
|
||||
onConfirmReceive: function (e) {
|
||||
var ths = this;
|
||||
uni.showModal({
|
||||
title: '',
|
||||
content: '我已收到货?',
|
||||
confirmColor: "#eb2444",
|
||||
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/myOrder/receipt/" + e.currentTarget.dataset.ordernum,
|
||||
method: "PUT",
|
||||
data: {},
|
||||
callBack: function (res) {
|
||||
//console.log(res);
|
||||
ths.loadOrderData(ths.sts, 1);
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
} else if (res.cancel) {//console.log('用户点击取消')
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
},
|
||||
//删除已完成||已取消的订单
|
||||
delOrderList: function (e) {
|
||||
var ths = this;
|
||||
uni.showModal({
|
||||
title: '',
|
||||
content: '确定要删除此订单吗?',
|
||||
confirmColor: "#eb2444",
|
||||
|
||||
success(res) {
|
||||
if (res.confirm) {
|
||||
var ordernum = e.currentTarget.dataset.ordernum;
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/myOrder/" + ordernum,
|
||||
method: "DELETE",
|
||||
data: {},
|
||||
callBack: function (res) {
|
||||
ths.loadOrderData(ths.sts, 1);
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
} else if (res.cancel) {
|
||||
console.log('用户点击取消');
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./orderList.css";
|
||||
</style>
|
||||
61
mall4uni/pages/pay-result/pay-result.css
Normal file
@ -0,0 +1,61 @@
|
||||
/* pages/pay-result/pay-result.wxss */
|
||||
|
||||
.pay-sts {
|
||||
font-size: 40rpx;
|
||||
margin-top: 100rpx;
|
||||
padding: 30rpx 0;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.pay-sts.fail {
|
||||
color: #f43530;
|
||||
}
|
||||
|
||||
.pay-sts.succ {
|
||||
color: #19be6b;
|
||||
}
|
||||
|
||||
.btns {
|
||||
margin-top: 50rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tips {
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tips .warn {
|
||||
color: #f43530;
|
||||
}
|
||||
|
||||
.btns .button {
|
||||
border-radius: 10rpx;
|
||||
font-size: 28rpx;
|
||||
background: #fff;
|
||||
color: #333;
|
||||
padding: 20rpx 35rpx;
|
||||
width: 300rpx;
|
||||
margin: 0 20rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.btns .button.checkorder {
|
||||
background: #19be6b;
|
||||
color: #fff;
|
||||
margin-bottom: 20rpx;
|
||||
border: 2rpx solid #19be6b;
|
||||
}
|
||||
|
||||
.btns .button.payagain {
|
||||
background: #fff;
|
||||
border: 2rpx solid #f90;
|
||||
color: #f90;
|
||||
}
|
||||
|
||||
.btns .button.shopcontinue {
|
||||
background: #fff;
|
||||
border: 2rpx solid #19be6b;
|
||||
color: #19be6b;
|
||||
}
|
||||
132
mall4uni/pages/pay-result/pay-result.vue
Normal file
@ -0,0 +1,132 @@
|
||||
<template>
|
||||
<!--pages/pay-result/pay-result.wxml-->
|
||||
<view class="container">
|
||||
<view v-if="sts == 0">
|
||||
<view class="pay-sts fail">支付失败</view>
|
||||
<view class="tips">请在
|
||||
<text class="warn">30分钟</text>内完成付款</view>
|
||||
<view class="tips">否则订单会被系统取消</view>
|
||||
<view class="btns">
|
||||
<text class="button checkorder" @tap="toOrderList">查看订单</text>
|
||||
<text class="button payagain" @tap="payAgain">重新支付</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view v-if="sts == 1">
|
||||
<view class="pay-sts succ">支付成功</view>
|
||||
<view class="tips">感谢您的购买</view>
|
||||
<view class="btns">
|
||||
<text class="button checkorder" @tap="toOrderList">查看订单</text>
|
||||
<text class="button shopcontinue" @tap="toIndex">继续购物</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
sts: 0,
|
||||
orderNumbers: ''
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
this.setData({
|
||||
sts: options.sts,
|
||||
orderNumbers: options.orderNumbers
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
toOrderList: function () {
|
||||
uni.navigateTo({
|
||||
url: '/pages/orderList/orderList?sts=0'
|
||||
});
|
||||
},
|
||||
toIndex: function () {
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
},
|
||||
payAgain: function () {
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/order/pay",
|
||||
method: "POST",
|
||||
data: {
|
||||
payType: 1,
|
||||
orderNumbers: this.orderNumbers
|
||||
},
|
||||
callBack: function (res) {
|
||||
//console.log(res);
|
||||
uni.hideLoading();
|
||||
uni.requestPayment({
|
||||
timeStamp: res.timeStamp,
|
||||
nonceStr: res.nonceStr,
|
||||
package: res.packageValue,
|
||||
signType: res.signType,
|
||||
paySign: res.paySign,
|
||||
success: e => {
|
||||
//console.log("支付成功");
|
||||
uni.redirectTo({
|
||||
url: '/pages/pay-result/pay-result?sts=1&orderNum=' + orderNumbers + "&orderType=" + this.orderType
|
||||
});
|
||||
},
|
||||
fail: err => {}
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./pay-result.css";
|
||||
</style>
|
||||
19
mall4uni/pages/prod-classify/prod-classify.css
Normal file
@ -0,0 +1,19 @@
|
||||
/* pages/prod-classify/prod-classify.wxss */
|
||||
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.line-fix {
|
||||
width: 100%;
|
||||
height: 2rpx;
|
||||
background: #e1e1e1;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.tit-background {
|
||||
width: 100%;
|
||||
height: 20rpx;
|
||||
background: #f4f4f4;
|
||||
}
|
||||
303
mall4uni/pages/prod-classify/prod-classify.vue
Normal file
@ -0,0 +1,303 @@
|
||||
<template>
|
||||
<!--pages/prod-classify/prod-classify.wxml-->
|
||||
|
||||
<view class="container">
|
||||
<view class="line-fix"></view>
|
||||
<view class="tit-background"></view>
|
||||
<view>
|
||||
<block v-for="(item, index) in prodList" :key="index">
|
||||
<prod :item="item"></prod>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/prod-classify/prod-classify.js
|
||||
var http = require("../../utils/http.js");
|
||||
import prod from "../../components/production/production";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
sts: 0,
|
||||
prodList: [],
|
||||
title: "",
|
||||
current: 1,
|
||||
size: 10,
|
||||
pages: 0,
|
||||
tagid: 0
|
||||
};
|
||||
},
|
||||
|
||||
components: {
|
||||
prod
|
||||
},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
this.setData({
|
||||
current: 1,
|
||||
pages: 0,
|
||||
sts: options.sts,
|
||||
title: options.title ? options.title : ""
|
||||
});
|
||||
|
||||
if (options.tagid) {
|
||||
this.setData({
|
||||
tagid: options.tagid
|
||||
});
|
||||
}
|
||||
|
||||
if (this.sts == 0) {
|
||||
if (options.tagid == 1) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '每日上新'
|
||||
});
|
||||
} else if (options.tagid == 2) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '商城热卖'
|
||||
});
|
||||
} else if (options.tagid == 3) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '更多宝贝'
|
||||
});
|
||||
}
|
||||
} else if (this.sts == 1) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '新品推荐'
|
||||
});
|
||||
} else if (this.sts == 2) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '限时特惠'
|
||||
});
|
||||
} else if (this.sts == 3) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '每日疯抢'
|
||||
});
|
||||
} else if (this.sts == 4) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '优惠券活动商品'
|
||||
});
|
||||
} else if (this.sts == 5) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '我的收藏商品'
|
||||
});
|
||||
} else {
|
||||
uni.setNavigationBarTitle({
|
||||
title: this.title
|
||||
});
|
||||
}
|
||||
|
||||
this.loadProdData(options);
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {
|
||||
if (this.current < this.pages) {
|
||||
this.setData({
|
||||
current: this.current + 1
|
||||
});
|
||||
this.loadProdData();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
/**
|
||||
* 加载商品数据
|
||||
*/
|
||||
loadProdData: function (options) {
|
||||
let sts = this.sts;
|
||||
|
||||
if (sts == 0) {
|
||||
// 分组标签商品列表
|
||||
this.getTagProd();
|
||||
} else if (sts == 1) {
|
||||
// 新品推荐
|
||||
let url = "/prod/lastedProdPage";
|
||||
this.getActProd(url);
|
||||
} else if (sts == 2) {
|
||||
// 限时特惠
|
||||
let url = "/prod/discountProdList";
|
||||
this.getActProd(url);
|
||||
} else if (sts == 3) {
|
||||
// 每日疯抢
|
||||
let url = "/prod/moreBuyProdList";
|
||||
this.getActProd(url);
|
||||
} else if (sts == 4) {
|
||||
// 优惠券商品列表
|
||||
this.getProdByCouponId(options.tagid);
|
||||
} else if (sts == 5) {
|
||||
// 收藏商品列表
|
||||
this.getCollectionProd();
|
||||
}
|
||||
},
|
||||
getActProd: function (url) {
|
||||
var ths = this;
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: url,
|
||||
method: "GET",
|
||||
data: {
|
||||
current: ths.current,
|
||||
size: ths.size
|
||||
},
|
||||
callBack: function (res) {
|
||||
let list = [];
|
||||
|
||||
if (res.current == 1) {
|
||||
list = res.records;
|
||||
} else {
|
||||
list = ths.prodList;
|
||||
list = list.concat(res.records);
|
||||
}
|
||||
|
||||
ths.setData({
|
||||
prodList: list,
|
||||
pages: res.pages
|
||||
});
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取我的收藏商品
|
||||
*/
|
||||
getCollectionProd: function () {
|
||||
var ths = this;
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/user/collection/prods",
|
||||
method: "GET",
|
||||
data: {
|
||||
current: ths.current,
|
||||
size: ths.size
|
||||
},
|
||||
callBack: function (res) {
|
||||
let list = [];
|
||||
|
||||
if (res.current == 1) {
|
||||
list = res.records;
|
||||
} else {
|
||||
list = ths.prodList;
|
||||
list = list.concat(res.records);
|
||||
}
|
||||
|
||||
ths.setData({
|
||||
prodList: list,
|
||||
pages: res.pages
|
||||
});
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取标签列表
|
||||
*/
|
||||
getTagProd: function (id) {
|
||||
var ths = this;
|
||||
uni.showLoading();
|
||||
var param = {
|
||||
url: "/prod/prodListByTagId",
|
||||
method: "GET",
|
||||
data: {
|
||||
tagId: ths.tagid,
|
||||
current: ths.current,
|
||||
size: ths.size
|
||||
},
|
||||
callBack: res => {
|
||||
let list = [];
|
||||
|
||||
if (res.current == 1) {
|
||||
list = res.records;
|
||||
} else {
|
||||
list = ths.prodList.concat(res.records);
|
||||
}
|
||||
|
||||
ths.setData({
|
||||
prodList: list,
|
||||
pages: res.pages
|
||||
});
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(param);
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取优惠券商品列表
|
||||
*/
|
||||
getProdByCouponId(id) {
|
||||
var ths = this;
|
||||
uni.showLoading();
|
||||
var param = {
|
||||
url: "/coupon/prodListByCouponId",
|
||||
method: "GET",
|
||||
data: {
|
||||
couponId: id,
|
||||
current: this.current,
|
||||
size: this.size
|
||||
},
|
||||
callBack: res => {
|
||||
let list = [];
|
||||
|
||||
if (res.current == 1) {
|
||||
list = res.records;
|
||||
} else {
|
||||
list = ths.prodList.concat(res.records);
|
||||
}
|
||||
|
||||
ths.setData({
|
||||
prodList: list,
|
||||
pages: res.pages
|
||||
});
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(param);
|
||||
}
|
||||
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./prod-classify.css";
|
||||
</style>
|
||||
878
mall4uni/pages/prod/prod.css
Normal file
@ -0,0 +1,878 @@
|
||||
page {
|
||||
background: #f4f4f4;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.container {
|
||||
height: auto;
|
||||
padding-bottom: 150rpx;
|
||||
}
|
||||
|
||||
swiper {
|
||||
height: 750rpx;
|
||||
width: 100%;
|
||||
border-bottom: 2rpx solid #f8f8f8;
|
||||
}
|
||||
|
||||
swiper image {
|
||||
height: 750rpx;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/** 商品信息 */
|
||||
|
||||
.prod-info {
|
||||
padding: 30rpx 30rpx 0 30rpx;
|
||||
position: relative;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.tit-wrap {
|
||||
position: relative;
|
||||
line-height: 40rpx;
|
||||
padding-right: 104rpx;
|
||||
}
|
||||
|
||||
.prod-tit {
|
||||
font-size: 32rpx;
|
||||
color: #333;
|
||||
padding-right: 20rpx;
|
||||
}
|
||||
|
||||
.tit-wrap .col {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 80rpx;
|
||||
color: #666;
|
||||
font-size: 20rpx;
|
||||
padding-left: 20rpx;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.tit-wrap .col image {
|
||||
display: block;
|
||||
margin: auto;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
.tit-wrap .col::after {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 1px;
|
||||
height: auto;
|
||||
background: #f1f1f1;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
bottom: 5px;
|
||||
left: 0;
|
||||
}
|
||||
|
||||
.sales-p {
|
||||
background: #fff;
|
||||
line-height: 40rpx;
|
||||
color: #999;
|
||||
font-size: 24rpx;
|
||||
margin-top: 6rpx;
|
||||
margin-right: 104rpx;
|
||||
}
|
||||
|
||||
.prod-price {
|
||||
font-size: 30rpx;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
}
|
||||
|
||||
.price {
|
||||
color: #eb2444;
|
||||
font-size: 24rpx;
|
||||
font-weight: 600;
|
||||
margin-right: 50rpx;
|
||||
}
|
||||
|
||||
.price-num {
|
||||
font-size: 46rpx;
|
||||
font-weight: 400;
|
||||
}
|
||||
|
||||
.sales {
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.share-icon {
|
||||
position: absolute;
|
||||
right: 50rpx;
|
||||
top: 50rpx;
|
||||
background: none;
|
||||
line-height: 40rpx;
|
||||
border: none;
|
||||
outline: none;
|
||||
box-shadow: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.share-icon::after {
|
||||
border: none;
|
||||
}
|
||||
|
||||
.share-icon image {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
.share-text {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
line-height: 30rpx;
|
||||
}
|
||||
|
||||
/** end 商品信息 */
|
||||
|
||||
/**优惠券*/
|
||||
|
||||
.coupon {
|
||||
padding: 28rpx 100rpx 14rpx 100rpx;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.coupon .coupon-tit {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
width: 60rpx;
|
||||
left: 20rpx;
|
||||
font-size: 22rpx;
|
||||
top: 28rpx;
|
||||
line-height: 36rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.coupon-con .item {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
vertical-align: top;
|
||||
padding: 0 18rpx;
|
||||
background: #eb2444;
|
||||
height: 36rpx;
|
||||
line-height: 36rpx;
|
||||
color: #fff;
|
||||
font-size: 22rpx;
|
||||
margin: 0 16rpx 16rpx 0;
|
||||
font-family: arial;
|
||||
}
|
||||
|
||||
.coupon-con .item:before, .coupon-con .item:after {
|
||||
content: "";
|
||||
display: block;
|
||||
width: 0;
|
||||
height: 0;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
border: 18rpx solid transparent;
|
||||
}
|
||||
|
||||
.coupon-con .item:before {
|
||||
left: 0;
|
||||
border-left: 4rpx solid #fff;
|
||||
}
|
||||
|
||||
.coupon-con .item:after {
|
||||
right: 0;
|
||||
border-right: 4rpx solid #fff;
|
||||
}
|
||||
|
||||
.coupon .num {
|
||||
position: absolute;
|
||||
right: 80rpx;
|
||||
width: 80rpx;
|
||||
top: 28rpx;
|
||||
text-align: right;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
line-height: 36rpx;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
font-family: arial;
|
||||
}
|
||||
|
||||
.more {
|
||||
position: absolute;
|
||||
right: 20rpx;
|
||||
width: 60rpx;
|
||||
top: 10rpx;
|
||||
text-align: right;
|
||||
font-size: 40rpx;
|
||||
color: #999;
|
||||
letter-spacing: 1px;
|
||||
}
|
||||
|
||||
/* 已选 */
|
||||
|
||||
.sku {
|
||||
padding: 20rpx;
|
||||
background: #fff;
|
||||
margin-top: 20rpx;
|
||||
position: relative;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
|
||||
.sku-tit {
|
||||
position: absolute;
|
||||
display: inline-block;
|
||||
width: 60rpx;
|
||||
left: 20rpx;
|
||||
font-size: 22rpx;
|
||||
top: 20rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.sku-con {
|
||||
margin: 0 80rpx;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/** 评价*/
|
||||
|
||||
.cmt-wrap {
|
||||
background: #fff;
|
||||
margin-top: 20rpx;
|
||||
position: relative;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
|
||||
.cmt-tit {
|
||||
font-size: 32rpx;
|
||||
position: relative;
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.cmt-t {
|
||||
width: 300rpx;
|
||||
}
|
||||
|
||||
.cmt-good {
|
||||
color: #eb2444;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
|
||||
.cmt-count {
|
||||
position: absolute;
|
||||
right: 20rpx;
|
||||
top: 20rpx;
|
||||
font-size: 24rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.cmt-more {
|
||||
width: 20rpx;
|
||||
height: 20rpx;
|
||||
border-top: 2rpx solid #999;
|
||||
border-right: 2rpx solid #999;
|
||||
transform: rotate(45deg);
|
||||
margin-left: 10rpx;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.cmt-cont {
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
|
||||
.cmt-tag {
|
||||
position: relative;
|
||||
padding: 14px 3px 0 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.cmt-tag text {
|
||||
margin: 0 10px 10px 0;
|
||||
background: #fdf0f0;
|
||||
display: inline-block;
|
||||
padding: 0 10px;
|
||||
height: 25px;
|
||||
border-radius: 3px;
|
||||
line-height: 25px;
|
||||
font-size: 12px;
|
||||
font-family: -apple-system, Helvetica, sans-serif;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.cmt-tag text.selected {
|
||||
color: #fff;
|
||||
background: #e93b3d;
|
||||
}
|
||||
|
||||
.cmt-item {
|
||||
position: relative;
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.cmt-item::after {
|
||||
content: "";
|
||||
height: 0;
|
||||
display: block;
|
||||
border-bottom: 1px solid #ddd;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
right: -10px;
|
||||
border-bottom-color: #e5e5e5;
|
||||
}
|
||||
|
||||
.cmt-user {
|
||||
line-height: 25px;
|
||||
margin-bottom: 8px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.cmt-user-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 400rpx;
|
||||
}
|
||||
|
||||
.cmt-user .user-img {
|
||||
width: 25px;
|
||||
height: 25px;
|
||||
border-radius: 50%;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.cmt-user .nickname {
|
||||
margin-left: 10px;
|
||||
display: inline-block;
|
||||
color: #333;
|
||||
max-width: 8.2em;
|
||||
height: 25px;
|
||||
line-height: 27px;
|
||||
}
|
||||
|
||||
.cmt-user .stars {
|
||||
display: flex;
|
||||
margin-left: 3px;
|
||||
}
|
||||
|
||||
.cmt-user .stars image {
|
||||
width: 35rpx;
|
||||
height: 35rpx;
|
||||
}
|
||||
|
||||
.cmt-user .date {
|
||||
float: right;
|
||||
color: #999;
|
||||
margin-left: -60px;
|
||||
}
|
||||
|
||||
.cmt-cnt {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 3;
|
||||
-webkit-box-orient: vertical;
|
||||
position: relative;
|
||||
line-height: 1.5;
|
||||
font-size: 14px;
|
||||
margin: 5px 0;
|
||||
word-break: break-all;
|
||||
max-height: 126px;
|
||||
}
|
||||
|
||||
.cmt-attr {
|
||||
height: 85px;
|
||||
width: 100%;
|
||||
white-space: nowrap;
|
||||
}
|
||||
|
||||
.cmt-attr .img-wrap {
|
||||
width: 85px;
|
||||
height: 85px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.cmt-attr image {
|
||||
display: inline-block;
|
||||
width: 80px;
|
||||
height: 80px;
|
||||
margin-right: 5px;
|
||||
margin-bottom: 5px;
|
||||
border-radius: 2px;
|
||||
background: #f3f3f3;
|
||||
}
|
||||
|
||||
.cmt-more-v {
|
||||
text-align: center;
|
||||
background-color: #fff;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.cmt-more-v text {
|
||||
height: 25px;
|
||||
line-height: 25px;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
color: #333;
|
||||
padding: 0px 10px;
|
||||
margin: 10px 0;
|
||||
border: 1px solid #ccc;
|
||||
border-radius: 40px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/** 评价弹窗 */
|
||||
|
||||
.cmt-popup {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 998;
|
||||
background-color: #fff;
|
||||
padding-bottom: 98rpx;
|
||||
}
|
||||
|
||||
.cmt-popup .cmt-cont {
|
||||
height: calc(100% - 80rpx);
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.cmt-popup .cmt-cnt {
|
||||
-webkit-line-clamp: 20;
|
||||
max-height: 500px;
|
||||
}
|
||||
|
||||
.cmt-reply {
|
||||
font-size: 14px;
|
||||
border-top: 1px dashed #ddd;
|
||||
padding: 5px 0;
|
||||
}
|
||||
|
||||
.cmt-reply .reply-tit {
|
||||
color: #eb2444;
|
||||
}
|
||||
|
||||
.cmt-popup .load-more {
|
||||
font-size: 14px;
|
||||
padding: 20px;
|
||||
text-align: center;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.cmt-popup .load-more text {
|
||||
border: 1px solid #ddd;
|
||||
padding: 5px 10px;
|
||||
border-radius: 10px;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
/** 商品详情 */
|
||||
|
||||
.prod-detail {
|
||||
background: #fff;
|
||||
margin-top: 20rpx;
|
||||
position: relative;
|
||||
line-height: 48rpx;
|
||||
}
|
||||
|
||||
.det-tit {
|
||||
width: 300rpx;
|
||||
}
|
||||
|
||||
.detail-tit {
|
||||
font-size: 32rpx;
|
||||
position: relative;
|
||||
border-bottom: 1px solid #ddd;
|
||||
padding: 20rpx;
|
||||
}
|
||||
|
||||
.prod-detail image {
|
||||
width: 750rpx !important;
|
||||
display: block;
|
||||
}
|
||||
|
||||
rich-text image {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 100% !important;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/** end 商品详情 */
|
||||
|
||||
/** 底部按钮 */
|
||||
|
||||
.cart-footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row nowrap;
|
||||
height: 98rpx;
|
||||
z-index: 999;
|
||||
box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.cart-footer .btn {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 0;
|
||||
background-color: #fff;
|
||||
font-size: 28rpx;
|
||||
flex-flow: column;
|
||||
}
|
||||
|
||||
.cart-footer .btn.icon {
|
||||
flex-grow: 0;
|
||||
flex-shrink: 0;
|
||||
width: 125rpx;
|
||||
font-size: 20rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.cart-footer .btn.icon image {
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
}
|
||||
|
||||
.cart-footer .btn.cart {
|
||||
background: #584e61;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.cart-footer .btn.buy {
|
||||
background: #eb2444;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.cart-footer .btn .badge {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 62rpx;
|
||||
display: inline-block;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
border-radius: 14rpx;
|
||||
background-color: #eb2444;
|
||||
text-align: center;
|
||||
line-height: 28rpx;
|
||||
font-size: 18rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.cart-footer .btn .badge-1 {
|
||||
width: 36rpx;
|
||||
}
|
||||
|
||||
.cart-footer .btn .badge-2 {
|
||||
width: 48rpx;
|
||||
left: 52rpx;
|
||||
}
|
||||
|
||||
/** end 底部按钮 */
|
||||
|
||||
/** 优惠券弹窗 **/
|
||||
|
||||
.popup-hide {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.popup-box {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
min-height: 375px;
|
||||
max-height: 475px;
|
||||
overflow: hidden;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.popup-tit {
|
||||
position: relative;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
padding-left: 10px;
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
background-color: #f7f7f7;
|
||||
}
|
||||
|
||||
.close {
|
||||
color: #aaa;
|
||||
border-radius: 12px;
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
font-size: 18px;
|
||||
padding: 1px;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.close::before {
|
||||
content: "\2716";
|
||||
}
|
||||
|
||||
.popup-cnt {
|
||||
max-height: 429px;
|
||||
overflow: auto;
|
||||
padding: 0 10px;
|
||||
}
|
||||
|
||||
/** 规格弹窗**/
|
||||
|
||||
.pup-sku {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.pup-sku-main {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
min-height: 375px;
|
||||
max-height: 475px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.pup-sku-header {
|
||||
position: relative;
|
||||
line-height: 46px;
|
||||
padding-left: 10px;
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
height: 70px;
|
||||
padding: 0 0 10px 110px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.pup-sku-img {
|
||||
position: absolute;
|
||||
left: 10px;
|
||||
top: -20px;
|
||||
border-radius: 2px;
|
||||
width: 90px;
|
||||
height: 90px;
|
||||
border: 0 none;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.pup-sku-price {
|
||||
display: inline-block;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
color: #e4393c;
|
||||
font-size: 10px;
|
||||
}
|
||||
|
||||
.pup-sku-price-int {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.pup-sku-prop {
|
||||
word-break: break-all;
|
||||
font-size: 12px;
|
||||
color: #333;
|
||||
line-height: 1.4em;
|
||||
padding-right: 10px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.pup-sku-prop text {
|
||||
color: #999;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.pup-sku-body {
|
||||
box-sizing: border-box;
|
||||
max-height: 379px;
|
||||
padding-bottom: 100px;
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
.pup-sku-area .sku-kind {
|
||||
font-size: 12px;
|
||||
color: #999;
|
||||
margin: 0 10px;
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
}
|
||||
|
||||
.pup-sku-area .sku-choose {
|
||||
overflow: hidden;
|
||||
margin-bottom: 3px;
|
||||
}
|
||||
|
||||
.sku-choose-item {
|
||||
display: inline-block;
|
||||
padding: 0 10px;
|
||||
min-width: 20px;
|
||||
max-width: 270px;
|
||||
overflow: hidden;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
text-align: center;
|
||||
margin-left: 10px;
|
||||
margin-bottom: 10px;
|
||||
border-radius: 4px;
|
||||
color: #333;
|
||||
background-color: #f7f7f7;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.sku-choose-item.active {
|
||||
background-color: #eb2444;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.sku-choose-item.gray {
|
||||
background-color: #f9f9f9;
|
||||
color: #ddd;
|
||||
}
|
||||
|
||||
.pup-sku-count {
|
||||
padding: 0 10px 13px;
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.pup-sku-count .count-name {
|
||||
color: #999;
|
||||
height: 31px;
|
||||
line-height: 31px;
|
||||
width: 100rpx;
|
||||
}
|
||||
|
||||
.pup-sku-count .num-wrap {
|
||||
position: relative;
|
||||
z-index: 0;
|
||||
width: 110px;
|
||||
float: right;
|
||||
vertical-align: middle;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.num-wrap .minus, .num-wrap .plus {
|
||||
position: relative;
|
||||
max-width: 30px;
|
||||
min-width: 30px;
|
||||
height: 30px;
|
||||
line-height: 30px;
|
||||
background: #f7f7f7;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.num-wrap .minus {
|
||||
border-top-left-radius: 3px;
|
||||
border-bottom-left-radius: 3px;
|
||||
}
|
||||
|
||||
.num-wrap .plus {
|
||||
border-top-right-radius: 3px;
|
||||
border-bottom-right-radius: 3px;
|
||||
}
|
||||
|
||||
.num-wrap .row {
|
||||
border-radius: 20px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -7px;
|
||||
margin-top: -1px;
|
||||
width: 14px;
|
||||
height: 2px;
|
||||
background-color: #ccc;
|
||||
}
|
||||
|
||||
.num-wrap .col {
|
||||
border-radius: 20px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -1px;
|
||||
margin-top: -7px;
|
||||
width: 2px;
|
||||
height: 14px;
|
||||
background-color: #999;
|
||||
}
|
||||
|
||||
.pup-sku-count .text-wrap {
|
||||
position: relative;
|
||||
width: 45px;
|
||||
z-index: 0;
|
||||
margin: 0 1px;
|
||||
}
|
||||
|
||||
.pup-sku-count .text-wrap input {
|
||||
height: 30px;
|
||||
width: 100%;
|
||||
color: #333;
|
||||
background: #fff;
|
||||
font-size: 12px;
|
||||
text-align: center;
|
||||
border: none;
|
||||
background: #f7f7f7;
|
||||
}
|
||||
|
||||
.pup-sku-footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
flex-direction: row nowrap;
|
||||
height: 98rpx;
|
||||
z-index: 999;
|
||||
box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.pup-sku-footer .btn {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-grow: 1;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 0;
|
||||
background-color: #fff;
|
||||
font-size: 28rpx;
|
||||
flex-flow: column;
|
||||
}
|
||||
|
||||
.pup-sku-footer .btn.cart {
|
||||
background: #584e61;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.pup-sku-footer .btn.buy {
|
||||
background: #eb2444;
|
||||
color: #fff;
|
||||
}
|
||||
805
mall4uni/pages/prod/prod.vue
Normal file
@ -0,0 +1,805 @@
|
||||
<template>
|
||||
<!-- 商品详情 -->
|
||||
<view class="container">
|
||||
<!-- 轮播图 -->
|
||||
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :indicator-color="indicatorColor" :interval="interval" :duration="duration" :indicator-active-color="indicatorActiveColor">
|
||||
<block v-for="(item, index) in imgs" :key="index">
|
||||
<swiper-item>
|
||||
<image :src="item"></image>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
<!-- end 轮播图 -->
|
||||
<!-- 商品信息 -->
|
||||
<!-- <block wx:for="{{imgs}}" wx:key=''> -->
|
||||
<view class="prod-info">
|
||||
<view class="tit-wrap">
|
||||
<view class="prod-tit">{{prodName}}</view>
|
||||
<view class="col" @tap="addOrCannelCollection">
|
||||
<image v-if="!isCollection" src="/static/images/icon/prod-col.png"></image>
|
||||
<image v-if="isCollection" src="/static/images/icon/prod-col-red.png"></image>
|
||||
收藏
|
||||
</view>
|
||||
</view>
|
||||
<view class="sales-p">{{brief}}</view>
|
||||
<view class="prod-price">
|
||||
<text class="price">¥<text class="price-num">{{wxs.parsePrice(defaultSku.price)[0]}}</text>.{{wxs.parsePrice(defaultSku.price)[1]}}</text>
|
||||
<text class="sales"></text>
|
||||
</view>
|
||||
<!-- <button class="share-icon" open-type="share">
|
||||
<image src='../../images/icon/share.png'></image>
|
||||
<view class="share-text">分享</view>
|
||||
</button> -->
|
||||
</view>
|
||||
<!-- </block> -->
|
||||
<!-- end 商品信息 -->
|
||||
<!-- 领券 -->
|
||||
<!-- <view class="coupon" bindtap='showPopup' wx:if="{{couponList.length}}">
|
||||
<view class="coupon-tit">领券</view>
|
||||
<view class="coupon-con">
|
||||
<text class="item" wx:for="{{couponList}}" wx:key="item.couponId">满{{item.cashCondition}}<block wx:if="{{item.couponType == 1}}">减{{item.reduceAmount}}</block><block wx:if="{{item.couponType == 2}}">打{{item.couponDiscount}}折</block></text>
|
||||
</view>
|
||||
<view class="num">共{{couponList.length}}张</view>
|
||||
<view class="more">...</view>
|
||||
</view> -->
|
||||
<!-- 已选规格 -->
|
||||
<view class="sku" @tap="showSku">
|
||||
<view class="sku-tit">已选</view>
|
||||
<view class="sku-con">{{selectedProp.length>0?selectedProp+',':selectedProp}}{{prodNum}}件</view>
|
||||
<view class="more">...</view>
|
||||
</view>
|
||||
<!-- 评价 -->
|
||||
<view class="cmt-wrap">
|
||||
<view class="cmt-tit" @tap="showComment">
|
||||
<view class="cmt-t">
|
||||
评价
|
||||
<text class="cmt-good">好评{{prodCommData.positiveRating}}%</text>
|
||||
</view>
|
||||
<view class="cmt-count">
|
||||
共{{prodCommData.number}}条
|
||||
<text class="cmt-more"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cmt-cont">
|
||||
<view class="cmt-tag" @tap="showComment">
|
||||
<text>全部({{prodCommData.number}})</text>
|
||||
<text>好评({{prodCommData.praiseNumber}})</text>
|
||||
<text>中评({{prodCommData.secondaryNumber}})</text>
|
||||
<text>差评({{prodCommData.negativeNumber}})</text>
|
||||
<text>有图({{prodCommData.picNumber}})</text>
|
||||
</view>
|
||||
<view class="cmt-items">
|
||||
<view v-for="(item, index) in littleCommPage" :key="index" class="cmt-item">
|
||||
<view class="cmt-user">
|
||||
<text class="date">{{item.recTime}}</text>
|
||||
<view class="cmt-user-info">
|
||||
<image class="user-img" :src="item.pic"></image>
|
||||
<view class="nickname">{{item.nickName}}</view>
|
||||
<!-- <van-rate readonly :value="item.score" @change="onChange" color="#f44"></van-rate> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="cmt-cnt">{{item.content}}</view>
|
||||
<scroll-view class="cmt-attr" scroll-x="true" v-if="item.pics.length">
|
||||
<image v-for="(commPic, index2) in item.pics" :key="index2" :src="commPic"></image>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="cmt-more-v" v-if="prodCommPage.records.length > 2">
|
||||
<text @tap="showComment">查看全部评价</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 商品详情 -->
|
||||
<view class="prod-detail">
|
||||
<view>
|
||||
<rich-text :nodes="content"></rich-text>
|
||||
<!-- <image src="//img14.360buyimg.com/cms/jfs/t1/25195/1/9487/388554/5c7f80a5E8b8f8f0c/46818404849d6ec6.jpg!q70.dpg" mode="widthFix"></image> -->
|
||||
</view>
|
||||
</view>
|
||||
<!-- end 商品详情 -->
|
||||
<!-- 底部按钮 -->
|
||||
<view class="cart-footer">
|
||||
<view class="btn icon" @tap="toHomePage">
|
||||
<image src="/static/images/tabbar/homepage.png"></image>
|
||||
首页
|
||||
</view>
|
||||
<view class="btn icon" @tap="toCartPage">
|
||||
<image src="/static/images/tabbar/basket.png"></image>
|
||||
购物车
|
||||
<view class="badge badge-1" v-if="totalCartNum>0">{{totalCartNum}}</view>
|
||||
</view>
|
||||
<view class="btn cart" @tap="addToCart">
|
||||
<text>加入购物车</text>
|
||||
</view>
|
||||
<view class="btn buy" @tap="buyNow">
|
||||
<text>立即购买</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- end 底部按钮 -->
|
||||
|
||||
<!-- 优惠券 -->
|
||||
<!-- <view class="popup-hide" wx:if="{{popupShow}}">
|
||||
<view class="popup-box">
|
||||
<view class="popup-tit">
|
||||
<text>优惠券</text>
|
||||
<text class="close" bindtap='closePopup'></text>
|
||||
</view>
|
||||
<view class='popup-cnt'>
|
||||
<block wx:for="{{couponList}}" wx:key='couponId'>
|
||||
<coupon showTimeType="{{1}}" canUse="{{true}}" item="{{item}}"></coupon>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<!-- 规格弹窗 -->
|
||||
<view class="pup-sku" v-if="skuShow">
|
||||
<view class="pup-sku-main">
|
||||
<view class="pup-sku-header">
|
||||
<image class="pup-sku-img" :src="defaultSku.pic?defaultSku.pic:pic"></image>
|
||||
<view class="pup-sku-price">
|
||||
¥
|
||||
<text class="pup-sku-price-int">{{wxs.parsePrice(defaultSku.price)[0]}}</text> .{{wxs.parsePrice(defaultSku.price)[1]}}
|
||||
</view>
|
||||
<view class="pup-sku-prop">
|
||||
<text>已选</text> {{selectedProp.length>0?selectedProp+',':selectedProp}}{{prodNum}}件
|
||||
</view>
|
||||
<view class="close" @tap="closePopup"></view>
|
||||
</view>
|
||||
<view class="pup-sku-body">
|
||||
<view class="pup-sku-area">
|
||||
<block v-for="(value, key) in skuGroup" :key="key">
|
||||
<view class="sku-kind">{{key}}</view>
|
||||
<view class="sku-choose">
|
||||
<block v-for="(item, index) in value" :key="index">
|
||||
<text :class="'sku-choose-item ' + (wxs.array_contain(selectedProp,item)?'active':'') + ' ' + (wxs.props_contain(allProperties,selectedPropObj,key,item,propKeys)?'':'gray')" :data-ok="wxs.props_contain(allProperties,selectedPropObj,key,item,propKeys)" @tap="toChooseItem" :data-key="key" :data-val="item">{{item}}</text>
|
||||
</block>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="pup-sku-count">
|
||||
<view class="num-wrap">
|
||||
<view class="minus" @tap="onCountMinus">
|
||||
<text class="row"></text>
|
||||
</view>
|
||||
<view class="text-wrap">
|
||||
<input type="number" :value="prodNum" disabled></input>
|
||||
</view>
|
||||
<view class="plus" @tap="onCountPlus">
|
||||
<text class="row"></text>
|
||||
<text class="col"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="count-name">数量</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="pup-sku-footer">
|
||||
<view class="btn cart" @tap="addToCart">加入购物车</view>
|
||||
<view class="btn buy" @tap="buyNow">立即购买</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 评价弹窗 -->
|
||||
<view class="cmt-popup" v-if="commentShow">
|
||||
<view class="cmt-tit">
|
||||
<view class="cmt-t">
|
||||
商品评价
|
||||
<text class="cmt-good">好评度{{prodCommData.positiveRating}}%</text>
|
||||
</view>
|
||||
<text class="close" @tap="closePopup"></text>
|
||||
</view>
|
||||
<view class="cmt-cont">
|
||||
<view class="cmt-tag">
|
||||
<text @tap="getProdCommPage" data-evaluate="-1" :class="evaluate==-1?'selected':''">全部({{prodCommData.number}})</text>
|
||||
<text @tap="getProdCommPage" data-evaluate="0" :class="evaluate==0?'selected':''">好评({{prodCommData.praiseNumber}})</text>
|
||||
<text @tap="getProdCommPage" data-evaluate="1" :class="evaluate==1?'selected':''">中评({{prodCommData.secondaryNumber}})</text>
|
||||
<text @tap="getProdCommPage" data-evaluate="2" :class="evaluate==2?'selected':''">差评({{prodCommData.negativeNumber}})</text>
|
||||
<text @tap="getProdCommPage" data-evaluate="3" :class="evaluate==3?'selected':''">有图({{prodCommData.picNumber}})</text>
|
||||
</view>
|
||||
<view class="cmt-items">
|
||||
<view v-for="(item, index) in prodCommPage.records" :key="index" class="cmt-item">
|
||||
<view class="cmt-user">
|
||||
<text class="date">{{item.recTime}}</text>
|
||||
<view class="cmt-user-info">
|
||||
<image class="user-img" :src="item.pic"></image>
|
||||
<view class="nickname">{{item.nickName}}</view>
|
||||
<!-- <van-rate readonly :value="item.score" @change="onChange" color="#f44"></van-rate> -->
|
||||
</view>
|
||||
</view>
|
||||
<view class="cmt-cnt">{{item.content}}</view>
|
||||
<scroll-view class="cmt-attr" scroll-x="true" v-if="item.pics.length">
|
||||
<image v-for="(commPic, index2) in item.pics" :key="index2" :src="commPic"></image>
|
||||
</scroll-view>
|
||||
<view class="cmt-reply" v-if="item.replyContent">
|
||||
<text class="reply-tit">店铺回复:</text> {{item.replyContent}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="load-more" v-if="prodCommPage.pages > prodCommPage.current">
|
||||
<text @tap="getMoreCommPage">点击加载更多</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script module="wxs" lang="wxs" src="../../wxs/number.wxs"></script>
|
||||
|
||||
<script>
|
||||
// pages/prod/prod.js
|
||||
const app = getApp();
|
||||
var http = require("../../utils/http.js");
|
||||
var config = require("../../utils/config.js");
|
||||
var util = require("../../utils/util.js");
|
||||
import coupon from "../../components/coupon/coupon";
|
||||
// import vanRate from "../../vant/rate/index";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
shopId: 1,
|
||||
// picDomain: config.picDomain,
|
||||
indicatorDots: true,
|
||||
indicatorColor: '#f2f2f2',
|
||||
indicatorActiveColor: '#eb2444',
|
||||
autoplay: true,
|
||||
interval: 3000,
|
||||
duration: 1000,
|
||||
prodNum: 1,
|
||||
totalCartNum: 0,
|
||||
pic: "",
|
||||
imgs: '',
|
||||
prodName: '',
|
||||
price: 0,
|
||||
content: '',
|
||||
prodId: 0,
|
||||
brief: '',
|
||||
skuId: 0,
|
||||
popupShow: false,
|
||||
// 是否获取过用户领取过的优惠券id
|
||||
loadCouponIds: false,
|
||||
skuShow: false,
|
||||
commentShow: false,
|
||||
couponList: [],
|
||||
skuList: [],
|
||||
skuGroup: {},
|
||||
defaultSku: undefined,
|
||||
selectedProp: [],
|
||||
selectedPropObj: {},
|
||||
propKeys: [],
|
||||
allProperties: [],
|
||||
prodCommData: {},
|
||||
prodCommPage: {
|
||||
current: 0,
|
||||
pages: 0,
|
||||
records: []
|
||||
},
|
||||
littleCommPage: [],
|
||||
evaluate: -1,
|
||||
isCollection: false
|
||||
};
|
||||
},
|
||||
|
||||
components: {
|
||||
coupon
|
||||
},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
this.setData({
|
||||
prodId: options.prodid
|
||||
}); // 加载商品信息
|
||||
|
||||
this.getProdInfo(); // 加载评论数据
|
||||
|
||||
this.getProdCommData(); // 加载评论项
|
||||
|
||||
this.getLittleProdComm(); // 查看用户是否关注
|
||||
|
||||
this.getCollection();
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
this.setData({
|
||||
totalCartNum: app.globalData.totalCartCount
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
|
||||
/**
|
||||
* 分享设置
|
||||
*/
|
||||
onShareAppMessage: function (res) {
|
||||
return {
|
||||
title: this.prodName,
|
||||
path: '/pages/prod/prod?prodid=' + this.prodid
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 获取是否关注信息
|
||||
*/
|
||||
getCollection() {
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/user/collection/isCollection",
|
||||
method: "GET",
|
||||
data: {
|
||||
prodId: this.prodId
|
||||
},
|
||||
callBack: res => {
|
||||
this.setData({
|
||||
isCollection: res
|
||||
});
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 添加或者取消收藏商品
|
||||
*/
|
||||
addOrCannelCollection() {
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/user/collection/addOrCancel",
|
||||
method: "POST",
|
||||
data: this.prodId,
|
||||
callBack: res => {
|
||||
this.setData({
|
||||
isCollection: !this.isCollection
|
||||
});
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
// 获取商品信息
|
||||
getProdInfo() {
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/prod/prodInfo",
|
||||
method: "GET",
|
||||
data: {
|
||||
prodId: this.prodId // userType: 0
|
||||
|
||||
},
|
||||
callBack: res => {
|
||||
//console.log(res);
|
||||
var imgStrs = res.imgs;
|
||||
var imgs = imgStrs.split(",");
|
||||
var content = util.formatHtml(res.content);
|
||||
this.setData({
|
||||
imgs: imgs,
|
||||
content: content,
|
||||
price: res.price,
|
||||
prodName: res.prodName,
|
||||
prodId: res.prodId,
|
||||
brief: res.brief,
|
||||
// skuId: res.skuId
|
||||
skuList: res.skuList,
|
||||
pic: res.pic
|
||||
}); // 获取优惠券
|
||||
//this.getCouponList();
|
||||
// 组装sku
|
||||
|
||||
this.groupSkuProp();
|
||||
uni.hideLoading();
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
getProdCommData() {
|
||||
http.request({
|
||||
url: "/prodComm/prodCommData",
|
||||
method: "GET",
|
||||
data: {
|
||||
prodId: this.prodId
|
||||
},
|
||||
callBack: res => {
|
||||
this.setData({
|
||||
prodCommData: res
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 获取部分评论
|
||||
getLittleProdComm() {
|
||||
if (this.prodCommPage.records.length) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.getProdCommPage();
|
||||
},
|
||||
|
||||
getMoreCommPage(e) {
|
||||
this.getProdCommPage();
|
||||
},
|
||||
|
||||
// 获取分页获取评论
|
||||
getProdCommPage(e) {
|
||||
if (e) {
|
||||
if (e.currentTarget.dataset.evaluate === this.evaluate) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.setData({
|
||||
prodCommPage: {
|
||||
current: 0,
|
||||
pages: 0,
|
||||
records: []
|
||||
},
|
||||
evaluate: e.currentTarget.dataset.evaluate
|
||||
});
|
||||
}
|
||||
|
||||
http.request({
|
||||
url: "/prodComm/prodCommPageByProd",
|
||||
method: "GET",
|
||||
data: {
|
||||
prodId: this.prodId,
|
||||
size: 10,
|
||||
current: this.prodCommPage.current + 1,
|
||||
evaluate: this.evaluate
|
||||
},
|
||||
callBack: res => {
|
||||
res.records.forEach(item => {
|
||||
if (item.pics) {
|
||||
item.pics = item.pics.split(',');
|
||||
}
|
||||
});
|
||||
let records = this.prodCommPage.records;
|
||||
records = records.concat(res.records);
|
||||
this.setData({
|
||||
prodCommPage: {
|
||||
current: res.current,
|
||||
pages: res.pages,
|
||||
records: records
|
||||
}
|
||||
}); // 如果商品详情中没有评论的数据,截取两条到商品详情页商品详情
|
||||
|
||||
if (!this.littleCommPage.length) {
|
||||
this.setData({
|
||||
littleCommPage: records.slice(0, 2)
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
getCouponList() {
|
||||
http.request({
|
||||
url: "/coupon/listByProdId",
|
||||
method: "GET",
|
||||
data: {
|
||||
prodId: this.prodId,
|
||||
shopId: this.shopId
|
||||
},
|
||||
callBack: res => {
|
||||
this.setData({
|
||||
couponList: res
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
//根据sku的属性 分组
|
||||
groupSkuProp: function () {
|
||||
var skuList = this.skuList;
|
||||
|
||||
if (skuList.length == 1 && skuList[0].properties == "") {
|
||||
this.setData({
|
||||
defaultSku: skuList[0]
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
var skuGroup = {};
|
||||
var allProperties = [];
|
||||
var propKeys = [];
|
||||
|
||||
for (var i = 0; i < skuList.length; i++) {
|
||||
var defaultSku = this.defaultSku;
|
||||
var isDefault = false;
|
||||
|
||||
if (!defaultSku && skuList[i].price == this.price) {
|
||||
//找到和商品价格一样的那个SKU,作为默认选中的SKU
|
||||
defaultSku = skuList[i];
|
||||
isDefault = true;
|
||||
this.setData({
|
||||
defaultSku: defaultSku
|
||||
});
|
||||
}
|
||||
|
||||
var properties = skuList[i].properties; //版本:公开版;颜色:金色;内存:64GB
|
||||
|
||||
allProperties.push(properties);
|
||||
var propList = properties.split(";"); // ["版本:公开版","颜色:金色","内存:64GB"]
|
||||
|
||||
var selectedPropObj = this.selectedPropObj;
|
||||
|
||||
for (var j = 0; j < propList.length; j++) {
|
||||
var propval = propList[j].split(":"); //["版本","公开版"]
|
||||
|
||||
var props = skuGroup[propval[0]]; //先取出 版本对应的值数组
|
||||
//如果当前是默认选中的sku,把对应的属性值 组装到selectedProp
|
||||
|
||||
if (isDefault) {
|
||||
propKeys.push(propval[0]);
|
||||
selectedPropObj[propval[0]] = propval[1];
|
||||
}
|
||||
|
||||
if (props == undefined) {
|
||||
props = []; //假设还没有版本,新建个新的空数组
|
||||
|
||||
props.push(propval[1]); //把 "公开版" 放进空数组
|
||||
} else {
|
||||
if (!this.array_contain(props, propval[1])) {
|
||||
//如果数组里面没有"公开版"
|
||||
props.push(propval[1]); //把 "公开版" 放进数组
|
||||
}
|
||||
}
|
||||
|
||||
skuGroup[propval[0]] = props; //最后把数据 放回版本对应的值
|
||||
}
|
||||
|
||||
this.setData({
|
||||
selectedPropObj: selectedPropObj,
|
||||
propKeys: propKeys
|
||||
});
|
||||
}
|
||||
|
||||
this.parseSelectedObjToVals();
|
||||
this.setData({
|
||||
skuGroup: skuGroup,
|
||||
allProperties: allProperties
|
||||
});
|
||||
},
|
||||
//将已选的 {key:val,key2:val2}转换成 [val,val2]
|
||||
parseSelectedObjToVals: function () {
|
||||
var selectedPropObj = this.selectedPropObj;
|
||||
var selectedProperties = "";
|
||||
var selectedProp = [];
|
||||
|
||||
for (var key in selectedPropObj) {
|
||||
selectedProp.push(selectedPropObj[key]);
|
||||
selectedProperties += key + ":" + selectedPropObj[key] + ";";
|
||||
}
|
||||
|
||||
selectedProperties = selectedProperties.substring(0, selectedProperties.length - 1); // console.log(selectedProperties);
|
||||
|
||||
this.setData({
|
||||
selectedProp: selectedProp
|
||||
});
|
||||
|
||||
for (var i = 0; i < this.skuList.length; i++) {
|
||||
if (this.skuList[i].properties == selectedProperties) {
|
||||
this.setData({
|
||||
defaultSku: this.skuList[i]
|
||||
});
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
//点击选择规格
|
||||
toChooseItem: function (e) {
|
||||
var ok = e.currentTarget.dataset.ok;
|
||||
|
||||
if (!ok) {
|
||||
return;
|
||||
}
|
||||
|
||||
var val = e.currentTarget.dataset.val;
|
||||
var key = e.currentTarget.dataset.key;
|
||||
var selectedPropObj = this.selectedPropObj;
|
||||
selectedPropObj[key] = val;
|
||||
this.setData({
|
||||
selectedPropObj: selectedPropObj
|
||||
});
|
||||
this.parseSelectedObjToVals();
|
||||
},
|
||||
//判断数组是否包含某对象
|
||||
array_contain: function (array, obj) {
|
||||
for (var i = 0; i < array.length; i++) {
|
||||
if (array[i] == obj) //如果要求数据类型也一致,这里可使用恒等号===
|
||||
return true;
|
||||
}
|
||||
|
||||
return false;
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转到首页
|
||||
*/
|
||||
toHomePage: function () {
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 跳转到购物车
|
||||
*/
|
||||
toCartPage: function () {
|
||||
uni.switchTab({
|
||||
url: '/pages/basket/basket'
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 加入购物车
|
||||
*/
|
||||
addToCart: function (event) {
|
||||
// var ths = this;
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/shopCart/changeItem",
|
||||
method: "POST",
|
||||
data: {
|
||||
basketId: 0,
|
||||
count: this.prodNum,
|
||||
prodId: this.prodId,
|
||||
shopId: this.shopId,
|
||||
skuId: this.defaultSku.skuId
|
||||
},
|
||||
callBack: res => {
|
||||
//console.log(res);
|
||||
this.setData({
|
||||
totalCartNum: this.totalCartNum + this.prodNum
|
||||
});
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: "加入购物车成功",
|
||||
icon: "none"
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 立即购买
|
||||
*/
|
||||
buyNow: function () {
|
||||
uni.setStorageSync("orderItem", JSON.stringify({
|
||||
prodId: this.prodId,
|
||||
skuId: this.defaultSku.skuId,
|
||||
prodCount: this.prodNum,
|
||||
shopId: this.shopId
|
||||
}));
|
||||
uni.navigateTo({
|
||||
url: '/pages/submit-order/submit-order?orderEntry=1'
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 减数量
|
||||
*/
|
||||
onCountMinus: function () {
|
||||
var prodNum = this.prodNum;
|
||||
|
||||
if (prodNum > 1) {
|
||||
this.setData({
|
||||
prodNum: prodNum - 1
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 加数量
|
||||
*/
|
||||
onCountPlus: function () {
|
||||
var prodNum = this.prodNum;
|
||||
|
||||
if (prodNum < 1000) {
|
||||
this.setData({
|
||||
prodNum: prodNum + 1
|
||||
});
|
||||
}
|
||||
},
|
||||
showPopup: function () {
|
||||
if (this.loadCouponIds) {
|
||||
this.setData({
|
||||
popupShow: true
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
http.request({
|
||||
url: "/p/myCoupon/listCouponIds",
|
||||
method: "GET",
|
||||
data: {},
|
||||
callBack: couponIds => {
|
||||
var couponList = this.couponList;
|
||||
console.log(couponList);
|
||||
couponList.forEach(coupon => {
|
||||
if (couponIds && couponIds.length) {
|
||||
// 领取该优惠券数量
|
||||
var couponLimit = 0;
|
||||
couponIds.forEach(couponId => {
|
||||
if (couponId == coupon.couponId) {
|
||||
couponLimit++;
|
||||
}
|
||||
}); // 小于用户领取优惠券上限,可以领取优惠券
|
||||
|
||||
if (couponLimit < coupon.limitNum) {
|
||||
coupon.canReceive = true;
|
||||
} else {
|
||||
coupon.canReceive = false;
|
||||
}
|
||||
} else {
|
||||
coupon.canReceive = true;
|
||||
}
|
||||
});
|
||||
this.setData({
|
||||
couponList: couponList,
|
||||
popupShow: true,
|
||||
loadCouponIds: true
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
showSku: function () {
|
||||
this.setData({
|
||||
skuShow: true
|
||||
});
|
||||
},
|
||||
showComment: function () {
|
||||
this.setData({
|
||||
commentShow: true
|
||||
});
|
||||
},
|
||||
closePopup: function () {
|
||||
this.setData({
|
||||
popupShow: false,
|
||||
skuShow: false,
|
||||
commentShow: false
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./prod.css";
|
||||
</style>
|
||||
33
mall4uni/pages/recent-news/recent-news.css
Normal file
@ -0,0 +1,33 @@
|
||||
/* pages/recent-news/recent-news.wxss */
|
||||
|
||||
.recent-news {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.recent-news .news-item {
|
||||
padding: 20rpx 20rpx 0 20rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.recent-news .news-item::after {
|
||||
content: " ";
|
||||
width: 100%;
|
||||
height: 2rpx;
|
||||
background-color: #e1e1e1;
|
||||
left: 20rpx;
|
||||
display: block;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.recent-news .news-item .news-item-title {
|
||||
font-size: 28rpx;
|
||||
text-align: left;
|
||||
}
|
||||
|
||||
.recent-news .news-item .news-item-date {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
text-align: right;
|
||||
margin-top: 10rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
101
mall4uni/pages/recent-news/recent-news.vue
Normal file
@ -0,0 +1,101 @@
|
||||
<template>
|
||||
<!--pages/recent-news/recent-news.wxml-->
|
||||
<view class="container">
|
||||
<view class="recent-news">
|
||||
<block v-for="(item, index) in news" :key="index">
|
||||
<view class="news-item" @tap="toNewsDetail" :data-id="item.id">
|
||||
<view class="news-item-title">{{item.title}}</view>
|
||||
<view class="news-item-date">
|
||||
{{item.publishTime}}
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/recent-news/recent-news.js
|
||||
var http = require("../../utils/http.js");
|
||||
var config = require("../../utils/config.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
news: []
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
var ths = this; //加载公告
|
||||
|
||||
var params = {
|
||||
url: "/shop/notice/noticeList",
|
||||
method: "GET",
|
||||
data: {},
|
||||
callBack: function (res) {
|
||||
// console.log(res);
|
||||
ths.setData({
|
||||
news: res.records
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
// 跳转公告详情页
|
||||
toNewsDetail: function (e) {
|
||||
console.log(e);
|
||||
var id = e.currentTarget.dataset.id; // console.log(id)
|
||||
|
||||
uni.navigateTo({
|
||||
url: '/pages/news-detail/news-detail?id=' + e.currentTarget.dataset.id
|
||||
}); // console.log(id)
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./recent-news.css";
|
||||
</style>
|
||||
235
mall4uni/pages/register/register.css
Normal file
@ -0,0 +1,235 @@
|
||||
page{
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
}
|
||||
.con{
|
||||
margin-top: 50px;
|
||||
}
|
||||
image {
|
||||
display: block;
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
margin: auto;
|
||||
border-radius: 50%;
|
||||
margin-bottom: 8%;
|
||||
}
|
||||
.login-form{
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 20%;
|
||||
}
|
||||
.authorized-btn {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
background-color: #0ab906;
|
||||
border: 1rpx solid #0ab906;
|
||||
color: #fff;
|
||||
border-radius: 6rpx;
|
||||
font-size: 26rpx;
|
||||
padding: 8rpx;
|
||||
margin-top: 80rpx;
|
||||
}
|
||||
.to-idx-btn{
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
background-color: #eeeeee;
|
||||
color: #333;
|
||||
border-radius: 6rpx;
|
||||
font-size: 26rpx;
|
||||
padding: 8rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.form-title {
|
||||
width: 100%;
|
||||
margin-bottom: 50rpx;
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
color: #00a0e9;
|
||||
}
|
||||
.item {
|
||||
display: block;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.account{
|
||||
display: flex;
|
||||
background: #f8f8f8;
|
||||
padding: 15rpx;
|
||||
box-sizing: border-box;
|
||||
font-size: 26rpx;
|
||||
align-items: center;
|
||||
}
|
||||
.account input{
|
||||
padding-left: 20rpx;
|
||||
width:75%;
|
||||
}
|
||||
.inp-palcehoder{
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.account input.int-yzm {
|
||||
width: 410rpx;
|
||||
padding-right: 10rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.input-btn {
|
||||
width: 152rpx;
|
||||
font-size: 26rpx;
|
||||
color: #00a0ea;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
button::after{
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
/* 找回密码&去注册 */
|
||||
.operate {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.forgot-password,
|
||||
.to-register {
|
||||
font-size: 28rpx;
|
||||
color: #00AAFF;
|
||||
}
|
||||
|
||||
/* 错误提示 */
|
||||
.error .error-text {
|
||||
display: block;
|
||||
width: 100%;
|
||||
font-size: 28rpx;
|
||||
color: #e43130;
|
||||
text-align: left;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.error .error-text .warning-icon {
|
||||
display: inline-block;;
|
||||
color: #fff;
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
line-height: 26rpx;
|
||||
background: #e43130;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
margin-right: 12rpx;
|
||||
font-size: 22rpx;
|
||||
}page{
|
||||
background: #fff;
|
||||
height: 100%;
|
||||
}
|
||||
.con{
|
||||
margin-top: 50px;
|
||||
}
|
||||
image {
|
||||
display: block;
|
||||
width: 150rpx;
|
||||
height: 150rpx;
|
||||
margin: auto;
|
||||
border-radius: 50%;
|
||||
margin-bottom: 8%;
|
||||
}
|
||||
.login-form{
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
margin-bottom: 20%;
|
||||
}
|
||||
.authorized-btn {
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
background-color: #0ab906;
|
||||
border: 1rpx solid #0ab906;
|
||||
color: #fff;
|
||||
border-radius: 6rpx;
|
||||
font-size: 26rpx;
|
||||
padding: 8rpx;
|
||||
margin-top: 80rpx;
|
||||
}
|
||||
.to-idx-btn{
|
||||
width: 90%;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
background-color: #eeeeee;
|
||||
color: #333;
|
||||
border-radius: 6rpx;
|
||||
font-size: 26rpx;
|
||||
padding: 8rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.form-title {
|
||||
width: 100%;
|
||||
margin-bottom: 50rpx;
|
||||
font-size: 32rpx;
|
||||
text-align: center;
|
||||
color: #00a0e9;
|
||||
}
|
||||
.item {
|
||||
display: block;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.account{
|
||||
display: flex;
|
||||
background: #f8f8f8;
|
||||
padding: 15rpx;
|
||||
box-sizing: border-box;
|
||||
font-size: 26rpx;
|
||||
align-items: center;
|
||||
}
|
||||
.account input{
|
||||
padding-left: 20rpx;
|
||||
width:75%;
|
||||
}
|
||||
.inp-palcehoder{
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.account input.int-yzm {
|
||||
width: 410rpx;
|
||||
padding-right: 10rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.input-btn {
|
||||
width: 152rpx;
|
||||
font-size: 26rpx;
|
||||
color: #00a0ea;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
button::after{
|
||||
border: 0 !important;
|
||||
}
|
||||
|
||||
/* 找回密码&去注册 */
|
||||
.operate {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
.forgot-password,
|
||||
.to-register {
|
||||
font-size: 28rpx;
|
||||
color: #00AAFF;
|
||||
}
|
||||
|
||||
/* 错误提示 */
|
||||
.error .error-text {
|
||||
display: block;
|
||||
width: 100%;
|
||||
font-size: 28rpx;
|
||||
color: #e43130;
|
||||
text-align: left;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.error .error-text .warning-icon {
|
||||
display: inline-block;;
|
||||
color: #fff;
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
line-height: 26rpx;
|
||||
background: #e43130;
|
||||
border-radius: 50%;
|
||||
text-align: center;
|
||||
margin-right: 12rpx;
|
||||
font-size: 22rpx;
|
||||
}
|
||||
192
mall4uni/pages/register/register.vue
Normal file
@ -0,0 +1,192 @@
|
||||
<template>
|
||||
<!--pages/register/register.wxml-->
|
||||
|
||||
<view class="register">
|
||||
|
||||
<view class="con">
|
||||
<image src="../../static/logo.png"></image>
|
||||
<!-- 登录 -->
|
||||
<view class="login-form">
|
||||
<view :class="['item',errorTips==1? 'error':'']">
|
||||
<view class="account">
|
||||
<text class="input-item">注册账号</text>
|
||||
<input type="text" @input="getInputVal" data-type="account" placeholder-class="inp-palcehoder" placeholder="请输入账号名称"></input>
|
||||
</view>
|
||||
<view class="error-text" v-if="errorTips==1"><text class="warning-icon">!</text>请输入账号!</view>
|
||||
</view>
|
||||
<view :class="['item',errorTips==2? 'error':'']">
|
||||
<view class="account">
|
||||
<text class="input-item">密码</text>
|
||||
<input type="password" @input="getInputVal" data-type="password" placeholder-class="inp-palcehoder" placeholder="请输入密码"></input>
|
||||
</view>
|
||||
<view class="error-text" v-if="errorTips==2"><text class="warning-icon">!</text>请输入密码!</view>
|
||||
</view>
|
||||
<view class="operate">
|
||||
<view class="to-register" @tap="toLogin">已有账号?<text>去登录></text></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view>
|
||||
<button class="authorized-btn" @tap="toRegister">注册</button>
|
||||
<button class="to-idx-btn" @tap="toIndex">回到首页</button>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/register/register.js
|
||||
var http = require("../../utils/http");
|
||||
var util = require("../../utils/util.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
errorTips: 0, // 输入错误提示: 1账号输入 2密码输入
|
||||
principal: '', // 账号
|
||||
credentials: '', // 密码
|
||||
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
computed: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function(options) {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function() {
|
||||
//头部导航标题
|
||||
uni.setNavigationBarTitle({
|
||||
title: "用户注册"
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function() {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function() {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function() {},
|
||||
methods: {
|
||||
/**
|
||||
* 输入框的值
|
||||
*/
|
||||
getInputVal: function(e) {
|
||||
const type = e.currentTarget.dataset.type;
|
||||
if (type == 'account') {
|
||||
this.setData({
|
||||
principal: e.detail.value
|
||||
});
|
||||
} else if (type == 'password') {
|
||||
this.setData({
|
||||
credentials: e.detail.value
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
/**
|
||||
* 注册
|
||||
*/
|
||||
toRegister() {
|
||||
|
||||
if (this.principal.length == 0) {
|
||||
this.setData({
|
||||
errorTips: 1
|
||||
})
|
||||
return
|
||||
} else if (this.credentials.length == 0) {
|
||||
this.setData({
|
||||
errorTips: 2
|
||||
})
|
||||
return
|
||||
} else {
|
||||
this.setData({
|
||||
errorTips: 0
|
||||
})
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/user/register",
|
||||
method: "post",
|
||||
data: {
|
||||
// appType: 1,
|
||||
// 应用类型 1小程序 2微信公众号 3 PC 4 H5
|
||||
userMail: this.principal,
|
||||
password: this.credentials,
|
||||
},
|
||||
callBack: res => {
|
||||
console.log("1111",res)
|
||||
uni.hideLoading();
|
||||
uni.showToast({
|
||||
title: "注册成功,请登录",
|
||||
icon: "none",
|
||||
duration: 1500
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.navigateTo({
|
||||
url: "/pages/accountLogin/accountLogin"
|
||||
})
|
||||
}, 1800)
|
||||
// wx.setStorageSync('loginResult', res);
|
||||
// wx.setStorageSync('token', 'bearer' + res.access_token);
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 去登陆
|
||||
*/
|
||||
toLogin: function() {
|
||||
uni.navigateTo({
|
||||
url: "/pages/accountLogin/accountLogin"
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 回到首页
|
||||
*/
|
||||
toIndex: function() {
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
// this.$Router.pushTab('/pages/index/index')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
@import "./register.css";
|
||||
</style>
|
||||
125
mall4uni/pages/search-page/search-page.css
Normal file
@ -0,0 +1,125 @@
|
||||
/* pages/search-page/search-page.wxss */
|
||||
|
||||
/* 搜索栏 */
|
||||
|
||||
.search-bar {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
color: #777;
|
||||
background: #fff;
|
||||
box-shadow: 0 2rpx 6rpx rgba(0, 0, 0, 0.07);
|
||||
z-index: 3;
|
||||
}
|
||||
|
||||
.search-bar .search-box {
|
||||
position: relative;
|
||||
height: 60rpx;
|
||||
background: #f7f7f7;
|
||||
z-index: 999;
|
||||
width: 80%;
|
||||
margin-left: 70rpx;
|
||||
border-radius: 50rpx;
|
||||
margin: 20rpx 0 20rpx 20rpx;
|
||||
}
|
||||
|
||||
.sear-input {
|
||||
height: 60rpx;
|
||||
border-radius: 50rpx;
|
||||
border: 0;
|
||||
margin: 0 30rpx 0 64rpx;
|
||||
line-height: 48rpx;
|
||||
vertical-align: top;
|
||||
background: #f7f7f7;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.search-bar .search-hint {
|
||||
font-size: 28rpx;
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 31rpx;
|
||||
color: #eb2444;
|
||||
}
|
||||
|
||||
.search-bar .search-box .search-img {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
position: absolute;
|
||||
left: 20rpx;
|
||||
top: 14rpx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* 热门搜索&搜索历史 */
|
||||
|
||||
.search-display {
|
||||
background: #fff;
|
||||
padding: 20rpx;
|
||||
margin-top: 100rpx;
|
||||
}
|
||||
|
||||
.search-display .title-text {
|
||||
padding: 30rpx 0;
|
||||
font-size: 30rpx;
|
||||
color: #666;
|
||||
}
|
||||
|
||||
.hot-search .hot-search-tags {
|
||||
overflow: hidden;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
padding-bottom: 30rpx;
|
||||
}
|
||||
|
||||
.hot-search .hot-search-tags .tags {
|
||||
display: block;
|
||||
max-width: 100%;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
border-radius: 50rpx;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
background-color: #f2f2f2;
|
||||
box-sizing: border-box;
|
||||
margin-right: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
padding: 10rpx 30rpx;
|
||||
}
|
||||
|
||||
/* 搜索历史 */
|
||||
|
||||
.history-search .title-text.history-line {
|
||||
position: relative;
|
||||
border-top: 2rpx solid #e1e1e1;
|
||||
}
|
||||
|
||||
.history-search .his-search-tags {
|
||||
overflow: hidden;
|
||||
font-size: 26rpx;
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.history-search .his-search-tags .tags {
|
||||
max-width: 300rpx;
|
||||
overflow: hidden;
|
||||
float: left;
|
||||
border-radius: 50rpx;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
background-color: #f2f2f2;
|
||||
box-sizing: border-box;
|
||||
margin-right: 20rpx;
|
||||
margin-bottom: 20rpx;
|
||||
padding: 10rpx 30rpx;
|
||||
}
|
||||
|
||||
.clear-history image {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
position: absolute;
|
||||
right: 10rpx;
|
||||
top: 30rpx;
|
||||
}
|
||||
185
mall4uni/pages/search-page/search-page.vue
Normal file
@ -0,0 +1,185 @@
|
||||
<template>
|
||||
<!--pages/search-page/search-page.wxml-->
|
||||
<view class="container">
|
||||
|
||||
<!-- 搜索框 -->
|
||||
<view class="search-bar">
|
||||
<view class="search-box">
|
||||
<input placeholder="输入关键字搜索" class="sear-input" confirm-type="search" @confirm="toSearchProdPage" @input="getSearchContent" :value="prodName"></input>
|
||||
<image src="/static/images/icon/search.png" class="search-img"></image>
|
||||
</view>
|
||||
<text class="search-hint" @tap="goBackIndex">取消</text>
|
||||
</view>
|
||||
|
||||
<view class="search-display">
|
||||
<!-- 热门搜索 -->
|
||||
<view class="hot-search">
|
||||
<view class="title-text">
|
||||
热门搜索
|
||||
</view>
|
||||
<view class="hot-search-tags">
|
||||
<block v-for="(item, index) in hotSearchList" :key="index">
|
||||
<text class="tags" @tap="onHistSearch" :data-name="item.content">{{item.title}}</text>
|
||||
</block>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<!-- 搜索历史 -->
|
||||
<view class="history-search">
|
||||
<view class="title-text history-line">
|
||||
搜索历史
|
||||
<view class="clear-history">
|
||||
<image src="/static/images/icon/clear-his.png" @tap="clearSearch"></image>
|
||||
</view>
|
||||
</view>
|
||||
<block v-for="(item, index) in recentSearch" :key="index">
|
||||
<view class="his-search-tags">
|
||||
<text class="tags" @tap="onHistSearch" :data-name="item">{{item}}</text>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/search-page/search-page.js
|
||||
var http = require("../../utils/http.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
hotSearchList: [],
|
||||
prodName: "",
|
||||
recentSearch: []
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
var ths = this; //热门搜索
|
||||
|
||||
var params = {
|
||||
url: "/search/hotSearchByShopId",
|
||||
method: "GET",
|
||||
data: {
|
||||
number: 10,
|
||||
shopId: 1,
|
||||
sort: 1
|
||||
},
|
||||
callBack: function (res) {
|
||||
ths.setData({
|
||||
hotSearchList: res
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params); // 获取历史搜索
|
||||
|
||||
this.getRecentSearch();
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
/**
|
||||
* 获取历史搜索
|
||||
*/
|
||||
getRecentSearch: function () {
|
||||
let recentSearch = uni.getStorageSync('recentSearch');
|
||||
this.setData({
|
||||
recentSearch
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 搜索提交
|
||||
*/
|
||||
toSearchProdPage: function () {
|
||||
if (this.prodName.trim()) {
|
||||
// 记录最近搜索
|
||||
let recentSearch = uni.getStorageSync('recentSearch') || [];
|
||||
recentSearch = recentSearch.filter(item => item !== this.prodName);
|
||||
recentSearch.unshift(this.prodName);
|
||||
|
||||
if (recentSearch.length > 10) {
|
||||
recentSearch.pop();
|
||||
}
|
||||
|
||||
uni.setStorageSync('recentSearch', recentSearch); // 跳转到商品列表页
|
||||
|
||||
uni.navigateTo({
|
||||
url: '/pages/search-prod-show/search-prod-show?prodName=' + this.prodName
|
||||
});
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 清空搜索历史
|
||||
*/
|
||||
clearSearch: function () {
|
||||
uni.removeStorageSync('recentSearch');
|
||||
this.getRecentSearch();
|
||||
},
|
||||
// 返回首页
|
||||
goBackIndex: function () {
|
||||
uni.navigateBack({// url: '/pages/search-page/search-page',
|
||||
});
|
||||
},
|
||||
//输入商品名获取数据 || 绑定输入值
|
||||
getSearchContent: function (e) {
|
||||
this.setData({
|
||||
prodName: e.detail.value
|
||||
}); // this.data.prodName=e.detail.value
|
||||
},
|
||||
//点击搜素历史
|
||||
onHistSearch: function (e) {
|
||||
var name = e.currentTarget.dataset.name;
|
||||
this.setData({
|
||||
prodName: name
|
||||
});
|
||||
this.toSearchProdPage();
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./search-page.css";
|
||||
</style>
|
||||
199
mall4uni/pages/search-prod-show/search-prod-show.css
Normal file
@ -0,0 +1,199 @@
|
||||
/* pages/search-prod-show/search-prod-show.wxss */
|
||||
|
||||
page {
|
||||
background: #f4f4f4;
|
||||
}
|
||||
|
||||
/* 搜索栏 */
|
||||
|
||||
.fixed-box {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
z-index: 999;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.search-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
color: #777;
|
||||
background: #fff;
|
||||
z-index: 3;
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
.search-bar .search-box {
|
||||
position: relative;
|
||||
height: 60rpx;
|
||||
background: #f7f7f7;
|
||||
z-index: 999;
|
||||
width: 80%;
|
||||
border-radius: 50rpx;
|
||||
margin-right: 30rpx;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.sear-input {
|
||||
height: 60rpx;
|
||||
border-radius: 50rpx;
|
||||
border: 0;
|
||||
margin: 0 30rpx 0 64rpx;
|
||||
line-height: 48rpx;
|
||||
vertical-align: top;
|
||||
background: #f7f7f7;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.search-bar .search-hint {
|
||||
font-size: 28rpx;
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 31rpx;
|
||||
color: #eb2444;
|
||||
}
|
||||
|
||||
.search-bar .search-box .search-img {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
position: absolute;
|
||||
left: 20rpx;
|
||||
top: 14rpx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.search-bar .search-list-img {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.search-bar .search-list-img image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.fixed-box .tabs {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
padding: 10rpx 0;
|
||||
z-index: 999;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.fixed-box .tabs::after {
|
||||
content: '';
|
||||
background-color: #e1e1e1;
|
||||
left: 0;
|
||||
height: 1px;
|
||||
transform-origin: 50% 100% 0;
|
||||
bottom: 0;
|
||||
position: absolute;
|
||||
display: block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.fixed-box .tabs .tab-item {
|
||||
display: inline-block;
|
||||
width: 33.33%;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.fixed-box .tabs .tab-item.on {
|
||||
color: #eb2444;
|
||||
}
|
||||
|
||||
/* 横向列表 */
|
||||
|
||||
.prod-show {
|
||||
background: #fff;
|
||||
margin-top: 160rpx;
|
||||
}
|
||||
|
||||
.prod-show .prod-items {
|
||||
width: 375rpx;
|
||||
float: left;
|
||||
background: #fff;
|
||||
padding-bottom: 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
|
||||
/* 纵向列表 */
|
||||
|
||||
.prod-list .cont-item {
|
||||
padding: 0 20rpx 20rpx 20rpx;
|
||||
margin-top: 180rpx;
|
||||
}
|
||||
|
||||
.prod-list .cont-item .show-item .more-prod-pic {
|
||||
text-align: center;
|
||||
width: 170rpx;
|
||||
height: 170rpx;
|
||||
font-size: 0;
|
||||
}
|
||||
|
||||
.prod-list .cont-item .show-item .more-prod-pic .more-pic {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.prod-list .cont-item .show-item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: start;
|
||||
padding: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
background: #fff;
|
||||
margin-bottom: 20rpx;
|
||||
box-shadow: 0 16rpx 32rpx 0 rgba(7, 17, 27, 0.05);
|
||||
}
|
||||
|
||||
.prod-list .cont-item .show-item .prod-text-right {
|
||||
margin-left: 20rpx;
|
||||
width: 75%;
|
||||
}
|
||||
|
||||
.prod-list .cont-item .show-item .prod-text-right .cate-prod-info {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
margin: 10rpx 0 20rpx 0;
|
||||
}
|
||||
|
||||
.prod-list .cont-item .show-item .prod-text-right .go-to-buy {
|
||||
font-size: 26rpx;
|
||||
background: #eb2444;
|
||||
color: #fff;
|
||||
border-radius: 50rpx;
|
||||
width: 150rpx;
|
||||
text-align: center;
|
||||
padding: 8rpx 3rpx;
|
||||
position: absolute;
|
||||
right: 20rpx;
|
||||
bottom: 20rpx;
|
||||
}
|
||||
|
||||
.prod-list .cont-item .show-item .prod-text-right .prod-text.more {
|
||||
margin: 0;
|
||||
height: 78rpx;
|
||||
font-size: 28rpx;
|
||||
display: -webkit-box;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
color: #000;
|
||||
}
|
||||
|
||||
.prod-list .cont-item .show-item .prod-text-right .prod-price.more {
|
||||
font-size: 28rpx;
|
||||
color: #eb2444;
|
||||
font-family: arial;
|
||||
}
|
||||
193
mall4uni/pages/search-prod-show/search-prod-show.vue
Normal file
@ -0,0 +1,193 @@
|
||||
<template>
|
||||
<!--pages/search-prod-show/search-prod-show.wxml-->
|
||||
<view class="container">
|
||||
|
||||
<!-- 搜索框 -->
|
||||
<view class="fixed-box">
|
||||
<view class="search-bar">
|
||||
<view class="search-box">
|
||||
<input class="sear-input" :value="prodName" @input="getSearchContent" confirm-type="search" @confirm="toSearchConfirm"></input>
|
||||
<image src="/static/images/icon/search.png" class="search-img"></image>
|
||||
</view>
|
||||
<view class="search-list-img" @tap="changeShowType">
|
||||
<image v-if="showType==1" src="/static/images/icon/search-col.png"></image>
|
||||
<image v-if="showType==2" src="/static/images/icon/search-col2.png"></image>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tabs">
|
||||
<text :class="'tab-item complete ' + (sts==0?'on':'')" @tap="onStsTap" data-sts="0">综合</text>
|
||||
<text :class="'tab-item ' + (sts==1?'on':'')" @tap="onStsTap" data-sts="1">销量</text>
|
||||
<text :class="'tab-item ' + (sts==2?'on':'')" @tap="onStsTap" data-sts="2">价格</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 商品列表 -->
|
||||
<view class="prod-list">
|
||||
<!-- 横向列表 -->
|
||||
<view class="prod-show" v-if="showType==1">
|
||||
<view class="hotsale-item-cont">
|
||||
<block v-for="(item, index) in searchProdList" :key="index">
|
||||
<prod :item="item" sts="6"></prod>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 纵向列表 -->
|
||||
<view class="cont-item" v-if="showType==2">
|
||||
<block v-for="(item, index) in searchProdList" :key="index">
|
||||
<view class="show-item" @tap="toProdPage" :data-prodid="item.prodId">
|
||||
<view class="more-prod-pic">
|
||||
<image :src="item.pic" class="more-pic"></image>
|
||||
</view>
|
||||
<view class="prod-text-right">
|
||||
<view class="prod-text more">{{item.prodName}}</view>
|
||||
<view class="cate-prod-info">{{item.praiseNumber}}评价 {{item.positiveRating}}%好评</view>
|
||||
<view class="prod-price more">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(item.price)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(item.price)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script module="wxs" lang="wxs" src="../../wxs/number.wxs"></script>
|
||||
|
||||
<script>
|
||||
// pages/search-prod-show/search-prod-show.js
|
||||
var http = require("../../utils/http.js");
|
||||
import prod from "../../components/production/production";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
sts: 0,
|
||||
showType: 2,
|
||||
searchProdList: [],
|
||||
prodName: ""
|
||||
};
|
||||
},
|
||||
|
||||
components: {
|
||||
prod
|
||||
},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
this.setData({
|
||||
prodName: options.prodName
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
this.toLoadData();
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
changeShowType: function () {
|
||||
var showType = this.showType;
|
||||
|
||||
if (showType == 1) {
|
||||
showType = 2;
|
||||
} else {
|
||||
showType = 1;
|
||||
}
|
||||
|
||||
this.setData({
|
||||
showType: showType
|
||||
});
|
||||
},
|
||||
//输入商品获取数据
|
||||
getSearchContent: function (e) {
|
||||
this.setData({
|
||||
prodName: e.detail.value
|
||||
});
|
||||
},
|
||||
//请求商品接口
|
||||
toLoadData: function () {
|
||||
var ths = this; //热门搜索
|
||||
|
||||
var params = {
|
||||
url: "/search/searchProdPage",
|
||||
method: "GET",
|
||||
data: {
|
||||
current: 1,
|
||||
prodName: this.prodName,
|
||||
size: 10,
|
||||
sort: this.sts
|
||||
},
|
||||
callBack: function (res) {
|
||||
ths.setData({
|
||||
searchProdList: res.records
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
//当前搜索页二次搜索商品
|
||||
toSearchConfirm: function () {
|
||||
this.toLoadData();
|
||||
},
|
||||
|
||||
/**
|
||||
* 状态点击事件
|
||||
*/
|
||||
onStsTap: function (e) {
|
||||
var sts = e.currentTarget.dataset.sts;
|
||||
this.setData({
|
||||
sts: sts
|
||||
});
|
||||
this.toLoadData();
|
||||
},
|
||||
toProdPage: function (e) {
|
||||
var prodid = e.currentTarget.dataset.prodid;
|
||||
uni.navigateTo({
|
||||
url: '/pages/prod/prod?prodid=' + prodid
|
||||
});
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./search-prod-show.css";
|
||||
</style>
|
||||
502
mall4uni/pages/submit-order/submit-order.css
Normal file
@ -0,0 +1,502 @@
|
||||
/* pages/submit-order/submit-order.wxss */
|
||||
|
||||
page {
|
||||
background: #f4f4f4;
|
||||
}
|
||||
|
||||
/* 收货地址 */
|
||||
|
||||
.submit-order {
|
||||
margin-bottom: 100rpx;
|
||||
}
|
||||
|
||||
.submit-order .delivery-addr {
|
||||
position: relative;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.delivery-addr .addr-bg .add-addr .plus-sign {
|
||||
color: #eb2444;
|
||||
border: 2rpx solid #eb2444;
|
||||
padding: 0rpx 6rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.delivery-addr .addr-bg {
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.delivery-addr .addr-bg.whole {
|
||||
padding: 0 39rpx 0 77rpx;
|
||||
}
|
||||
|
||||
.delivery-addr .addr-bg .add-addr {
|
||||
font-size: 28rpx;
|
||||
color: #666;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
|
||||
.submit-order .delivery-addr .addr-icon {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 30rpx;
|
||||
top: 24rpx;
|
||||
}
|
||||
|
||||
.submit-order .delivery-addr .addr-icon image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.submit-order .delivery-addr .user-info {
|
||||
padding-top: 20rpx;
|
||||
line-height: 48rpx;
|
||||
word-wrap: break-word;
|
||||
word-break: break-all;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
|
||||
.submit-order .delivery-addr .user-info .item {
|
||||
font-size: 30rpx;
|
||||
margin-right: 30rpx;
|
||||
vertical-align: top;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.submit-order .delivery-addr .addr {
|
||||
font-size: 26rpx;
|
||||
line-height: 36rpx;
|
||||
color: #999;
|
||||
width: 90%;
|
||||
padding-bottom: 20rpx;
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
|
||||
.submit-order .delivery-addr .arrow {
|
||||
width: 15rpx;
|
||||
height: 15rpx;
|
||||
border-top: 2rpx solid #777;
|
||||
border-right: 2rpx solid #777;
|
||||
transform: rotate(45deg);
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 60rpx;
|
||||
}
|
||||
|
||||
.submit-order .delivery-addr .arrow.empty {
|
||||
top: 39rpx;
|
||||
}
|
||||
|
||||
.addr-bg .add-addr .plus-sign-img {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
font-size: 0;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
|
||||
.addr-bg .add-addr .plus-sign-img image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
/* 商品列表 */
|
||||
|
||||
.prod-item {
|
||||
background-color: #fff;
|
||||
margin-top: 15rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-pic image {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
}
|
||||
|
||||
.prod-item .order-num {
|
||||
padding: 20rpx 30rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.order-state {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.prod-item .item-cont {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 30rpx;
|
||||
border-bottom: 2rpx solid #f1f1f1;
|
||||
}
|
||||
|
||||
.prod-item .order-num .clear-btn {
|
||||
width: 32rpx;
|
||||
height: 32rpx;
|
||||
font-size: 0;
|
||||
vertical-align: top;
|
||||
margin-top: 6rpx;
|
||||
margin-left: 42rpx;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.prod-item .order-num .clear-btn::after {
|
||||
content: " ";
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: -10px;
|
||||
top: 1px;
|
||||
width: 1px;
|
||||
height: 12px;
|
||||
background: #ddd;
|
||||
}
|
||||
|
||||
.prod-item .order-num .clear-btn .clear-list-btn {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-pic {
|
||||
font-size: 0;
|
||||
display: block;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
overflow: hidden;
|
||||
background: #fff;
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-pic image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info {
|
||||
margin-left: 10rpx;
|
||||
font-size: 28rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
height: 160rpx;
|
||||
-webkit-flex: 1;
|
||||
-ms-flex: 1;
|
||||
-webkit-box-flex: 1;
|
||||
-moz-box-flex: 1;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info .prodname {
|
||||
font-size: 28rpx;
|
||||
line-height: 40rpx;
|
||||
max-height: 86rpx;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.prod-item .item-cont .prod-info .prod-info-cont {
|
||||
color: #999;
|
||||
line-height: 40rpx;
|
||||
margin-top: 10rpx;
|
||||
font-size: 22rpx;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.prod-item .total-num {
|
||||
text-align: right;
|
||||
padding: 20rpx 30rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.prod-item .price-nums .prodprice {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
.prod-item .price-nums .prodcount {
|
||||
position: absolute;
|
||||
bottom: 5rpx;
|
||||
right: 0;
|
||||
color: #999;
|
||||
font-family: verdana;
|
||||
}
|
||||
|
||||
.prod-item .total-num .prodprice {
|
||||
display: inline-block;
|
||||
color: #333;
|
||||
}
|
||||
|
||||
.prod-item .total-num .prodcount {
|
||||
margin-right: 20rpx;
|
||||
}
|
||||
|
||||
/*
|
||||
订单信息 */
|
||||
|
||||
.order-msg {
|
||||
background: #fff;
|
||||
margin-top: 15rpx;
|
||||
padding: 0 30rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.order-msg .msg-item {
|
||||
border-top: 2rpx solid #f1f1f1;
|
||||
}
|
||||
|
||||
.order-msg .msg-item:first-child {
|
||||
border: 0;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item {
|
||||
position: relative;
|
||||
display: flex;
|
||||
padding: 16rpx 0;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item.payment {
|
||||
border-top: 2rpx solid #f1f1f1;
|
||||
color: #eb2444;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item .item-tit {
|
||||
line-height: 48rpx;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item .item-txt {
|
||||
-webkit-box-flex: 1;
|
||||
-moz-box-flex: 1;
|
||||
flex: 1;
|
||||
font-family: arial;
|
||||
max-height: 48rpx;
|
||||
overflow: hidden;
|
||||
line-height: 48rpx;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item.coupon {
|
||||
border-bottom: 2rpx solid #e1e1e1;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item input {
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item .coupon-btn {
|
||||
display: block;
|
||||
margin: 0 30rpx;
|
||||
line-height: 28rpx;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item .item-txt.price {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.order-msg .msg-item .item .arrow {
|
||||
width: 15rpx;
|
||||
height: 15rpx;
|
||||
border-top: 2rpx solid #999;
|
||||
border-right: 2rpx solid #999;
|
||||
transform: rotate(45deg);
|
||||
position: absolute;
|
||||
right: 0rpx;
|
||||
}
|
||||
|
||||
/* 底部栏 */
|
||||
|
||||
.submit-order-footer {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
max-width: 750rpx;
|
||||
background: #fff;
|
||||
margin: auto;
|
||||
display: -webkit-flex;
|
||||
display: -webkit-box;
|
||||
display: -moz-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
font-size: 26rpx;
|
||||
box-shadow: 0 -1px 3px rgba(0, 0, 0, 0.05);
|
||||
}
|
||||
|
||||
.submit-order-footer .sub-order {
|
||||
flex: 1;
|
||||
margin: 0 30rpx;
|
||||
line-height: 100rpx;
|
||||
display: block;
|
||||
text-align: left;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.submit-order-footer .footer-box {
|
||||
padding: 0 10rpx;
|
||||
width: 200rpx;
|
||||
background: #eb2444;
|
||||
text-align: center;
|
||||
line-height: 100rpx;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
.submit-order-footer .sub-order .item-txt .price {
|
||||
display: inline;
|
||||
color: #eb2444;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
|
||||
.clearfix:after {
|
||||
content: " ";
|
||||
display: table;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
/** 优惠券弹窗 **/
|
||||
|
||||
.popup-hide {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
z-index: 999;
|
||||
background-color: rgba(0, 0, 0, 0.3);
|
||||
}
|
||||
|
||||
.popup-box {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 80%;
|
||||
overflow: hidden;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.popup-tit {
|
||||
position: relative;
|
||||
height: 46px;
|
||||
line-height: 46px;
|
||||
padding-left: 10px;
|
||||
font-size: 16px;
|
||||
color: #333;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.close {
|
||||
color: #aaa;
|
||||
border-radius: 12px;
|
||||
line-height: 20px;
|
||||
text-align: center;
|
||||
height: 20px;
|
||||
width: 20px;
|
||||
font-size: 18px;
|
||||
padding: 1px;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.close::before {
|
||||
content: "\2716";
|
||||
}
|
||||
|
||||
.coupon-tabs {
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
justify-content: space-around;
|
||||
border-bottom: 1px solid #f2f2f2;
|
||||
}
|
||||
|
||||
.coupon-tab {
|
||||
padding: 10px 0;
|
||||
}
|
||||
|
||||
.coupon-tab.on {
|
||||
border-bottom: 2px solid #eb2444;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.popup-cnt {
|
||||
height: calc(100% - 88px);
|
||||
overflow: auto;
|
||||
padding: 0 10px;
|
||||
background: #f4f4f4;
|
||||
}
|
||||
|
||||
.coupon-ok {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 60px;
|
||||
line-height: 50px;
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
box-shadow: 0px -1px 1px #ddd;
|
||||
background: rgba(255, 255, 255, 0.9);
|
||||
}
|
||||
|
||||
.coupon-ok text {
|
||||
border-radius: 20px;
|
||||
display: inline-block;
|
||||
height: 20px;
|
||||
line-height: 20px;
|
||||
width: 450rpx;
|
||||
padding: 7px;
|
||||
background: -o-linear-gradient(right, #f45c43, #eb2444);
|
||||
background: linear-gradient(right, #f45c43, #eb2444);
|
||||
background: -webkit-linear-gradient(right, #f45c43, #eb2444);
|
||||
color: #fff;
|
||||
box-shadow: -1px 3px 3px #aaa;
|
||||
}
|
||||
|
||||
.botm-empty {
|
||||
height: 60px;
|
||||
}
|
||||
|
||||
/*checkbox 选项框大小 */
|
||||
|
||||
checkbox .wx-checkbox-input {
|
||||
border-radius: 50%;
|
||||
width: 35rpx;
|
||||
height: 35rpx;
|
||||
}
|
||||
|
||||
/*checkbox选中后样式 */
|
||||
|
||||
checkbox .wx-checkbox-input.wx-checkbox-input-checked {
|
||||
background: #eb2444;
|
||||
border-color: #eb2444;
|
||||
}
|
||||
|
||||
/*checkbox选中后图标样式 */
|
||||
|
||||
checkbox .wx-checkbox-input.wx-checkbox-input-checked::before {
|
||||
text-align: center;
|
||||
font-size: 22rpx;
|
||||
color: #fff;
|
||||
background: transparent;
|
||||
transform: translate(-50%, -50%) scale(1);
|
||||
-webkit-transform: translate(-50%, -50%) scale(1);
|
||||
}
|
||||
528
mall4uni/pages/submit-order/submit-order.vue
Normal file
@ -0,0 +1,528 @@
|
||||
<template>
|
||||
<view>
|
||||
<!--pages/submit-order/submit-order.wxml-->
|
||||
<view class="container">
|
||||
<view class="submit-order">
|
||||
<!-- 收货地址 -->
|
||||
<view class="delivery-addr " @tap="toAddrListPage">
|
||||
<view class="addr-bg " v-if="!userAddr">
|
||||
<view class="add-addr">
|
||||
<view class="plus-sign-img">
|
||||
<image src="/static/images/icon/plus-sign.png"></image>
|
||||
</view>
|
||||
<text>新增收货地址</text>
|
||||
</view>
|
||||
<view class="arrow empty"></view>
|
||||
</view>
|
||||
<view class="addr-bg whole" v-if="userAddr">
|
||||
<view class="addr-icon">
|
||||
<image src="/static/images/icon/addr.png"></image>
|
||||
</view>
|
||||
<view class="user-info">
|
||||
<text class="item">{{userAddr.receiver}}</text>
|
||||
<text class="item">{{userAddr.mobile}}</text>
|
||||
</view>
|
||||
<view class="addr">{{userAddr.province}}{{userAddr.city}}{{userAddr.area}}{{userAddr.addr}}</view>
|
||||
<view class="arrow"></view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 商品详情 -->
|
||||
<view class="prod-item">
|
||||
<block v-for="(item, index) in orderItems" :key="index">
|
||||
<view class="item-cont" @tap="toOrderDetailPage" :data-ordernum="item.primaryOrderNo">
|
||||
<view class="prod-pic">
|
||||
<image :src="item.pic"></image>
|
||||
</view>
|
||||
<view class="prod-info">
|
||||
<view class="prodname">
|
||||
{{item.prodName}}
|
||||
</view>
|
||||
<view class="prod-info-cont">{{item.skuName}}</view>
|
||||
<view class="price-nums">
|
||||
<text class="prodprice"><text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(item.price)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(item.price)[1]}}</text></text>
|
||||
<text class="prodcount">x{{item.prodCount}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<!-- <view class='item-cont' bindtap='toOrderDetailPage' data-ordernum="{{item.primaryOrderNo}}">
|
||||
<view class='prod-pic'>
|
||||
<image src='../../images/prod/pic09.jpg'></image>
|
||||
</view>
|
||||
<view class='prod-info'>
|
||||
<view class='prodname'>
|
||||
THE BEAST/野兽派 易烊千玺同款
|
||||
</view>
|
||||
<view class='prod-info-cont'>经典杯型升级,杯型更细长优雅</view>
|
||||
<view class='price-nums'>
|
||||
<text class='prodprice'><text class='symbol'>¥</text>
|
||||
<text class='big-num'>{{wxs.parsePrice(40.00)[0]}}</text>
|
||||
<text class='small-num'>.{{wxs.parsePrice(40.00)[1]}}</text></text>
|
||||
<text class="prodcount">x1</text>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
|
||||
<view class="total-num">
|
||||
<text class="prodcount">共{{totalCount}}件商品</text>
|
||||
<view class="prodprice">合计:
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(total)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(total)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 订单详情 -->
|
||||
<view class="order-msg">
|
||||
<view class="msg-item">
|
||||
<view class="item coupon" @tap="showCouponPopup">
|
||||
<text class="item-tit">优惠券:</text>
|
||||
<text class="item-txt" v-if="!coupons.canUseCoupons">暂无可用</text>
|
||||
<text class="coupon-btn">{{coupons.totalLength? coupons.totalLength: 0}}张</text>
|
||||
<text class="arrow"></text>
|
||||
</view>
|
||||
<view class="item">
|
||||
<text>买家留言:</text>
|
||||
<input placeholder="给卖家留言"></input>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
<view class="order-msg">
|
||||
<view class="msg-item">
|
||||
<view class="item">
|
||||
<view class="item-tit">订单总额:</view>
|
||||
<view class="item-txt price">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(total)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(total)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="item-tit">运费:</view>
|
||||
<view class="item-txt price">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(transfee)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(transfee)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="item-tit">优惠金额:</view>
|
||||
<view class="item-txt price">
|
||||
<text class="symbol">-¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(shopReduce)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(shopReduce)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="item payment">
|
||||
<view class="item-txt price">
|
||||
小计:
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(actualTotal)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(actualTotal)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<!-- 底部栏 -->
|
||||
<view class="submit-order-footer">
|
||||
<view class="sub-order">
|
||||
<view class="item-txt">
|
||||
合计:
|
||||
<view class="price">
|
||||
<text class="symbol">¥</text>
|
||||
<text class="big-num">{{wxs.parsePrice(actualTotal)[0]}}</text>
|
||||
<text class="small-num">.{{wxs.parsePrice(actualTotal)[1]}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="footer-box" @tap="toPay">
|
||||
提交订单
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<!-- 选择优惠券弹窗 -->
|
||||
<view class="popup-hide" v-if="popupShow">
|
||||
<view class="popup-box">
|
||||
<view class="popup-tit">
|
||||
<text>优惠券</text>
|
||||
<text class="close" @tap="closePopup"></text>
|
||||
</view>
|
||||
<view class="coupon-tabs">
|
||||
<view :class="'coupon-tab ' + (couponSts==1?'on':'')" @tap="changeCouponSts" data-sts="1">可用优惠券({{coupons.canUseCoupons.length}})</view>
|
||||
<view :class="'coupon-tab ' + (couponSts==2?'on':'')" @tap="changeCouponSts" data-sts="2">不可用优惠券({{coupons.unCanUseCoupons.length}})</view>
|
||||
</view>
|
||||
<view class="popup-cnt">
|
||||
<block v-for="(item, index) in coupons.canUseCoupons" :key="index" v-if="couponSts == 1">
|
||||
<coupon :item="item" order="true" @checkCoupon="checkCoupon" canUse="true"></coupon>
|
||||
</block>
|
||||
<block v-for="(item, index) in coupons.unCanUseCoupons" :key="index" v-if="couponSts == 2">
|
||||
<coupon :item="item" order="true" canUse="false"></coupon>
|
||||
</block>
|
||||
<view class="botm-empty"></view>
|
||||
</view>
|
||||
<view class="coupon-ok" v-if="couponSts==1">
|
||||
<text @tap="choosedCoupon">确定</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script module="wxs" lang="wxs" src="../../wxs/number.wxs"></script>
|
||||
|
||||
<script>
|
||||
// pages/submit-order/submit-order.js
|
||||
var http = require("../../utils/http.js");
|
||||
import coupon from "../../components/coupon/coupon";
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
popupShow: false,
|
||||
couponSts: 1,
|
||||
couponList: [],
|
||||
// 订单入口 0购物车 1立即购买
|
||||
orderEntry: "0",
|
||||
userAddr: null,
|
||||
orderItems: [],
|
||||
coupon: {
|
||||
totalLength: 0,
|
||||
canUseCoupons: [],
|
||||
noCanUseCoupons: []
|
||||
},
|
||||
actualTotal: 0,
|
||||
total: 0,
|
||||
totalCount: 0,
|
||||
transfee: 0,
|
||||
reduceAmount: 0,
|
||||
remark: "",
|
||||
couponIds: [],
|
||||
coupons: {},
|
||||
shopReduce: ""
|
||||
};
|
||||
},
|
||||
|
||||
components: {
|
||||
coupon
|
||||
},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function (options) {
|
||||
this.setData({
|
||||
orderEntry: options.orderEntry
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function () {
|
||||
var pages = getCurrentPages();
|
||||
var currPage = pages[pages.length - 1];
|
||||
|
||||
// if (currPage.data.selAddress == "yes") {
|
||||
// this.setData({
|
||||
// //将携带的参数赋值
|
||||
// userAddr: currPage.data.item
|
||||
// });
|
||||
// } //获取订单数据
|
||||
|
||||
|
||||
this.loadOrderData();
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function () {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function () {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function () {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function () {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function () {},
|
||||
methods: {
|
||||
//加载订单数据
|
||||
loadOrderData: function () {
|
||||
var addrId = 0;
|
||||
|
||||
if (this.userAddr != null) {
|
||||
addrId = this.userAddr.addrId;
|
||||
}
|
||||
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/order/confirm",
|
||||
method: "POST",
|
||||
data: {
|
||||
addrId: addrId,
|
||||
orderItem: this.orderEntry === "1" ? JSON.parse(uni.getStorageSync("orderItem")) : undefined,
|
||||
basketIds: this.orderEntry === "0" ? JSON.parse(uni.getStorageSync("basketIds")) : undefined,
|
||||
couponIds: this.couponIds,
|
||||
userChangeCoupon: 1
|
||||
},
|
||||
callBack: res => {
|
||||
uni.hideLoading();
|
||||
let orderItems = [];
|
||||
res.shopCartOrders[0].shopCartItemDiscounts.forEach(itemDiscount => {
|
||||
orderItems = orderItems.concat(itemDiscount.shopCartItems);
|
||||
});
|
||||
|
||||
if (res.shopCartOrders[0].coupons) {
|
||||
let canUseCoupons = [];
|
||||
let unCanUseCoupons = [];
|
||||
res.shopCartOrders[0].coupons.forEach(coupon => {
|
||||
if (coupon.canUse) {
|
||||
canUseCoupons.push(coupon);
|
||||
} else {
|
||||
unCanUseCoupons.push(coupon);
|
||||
}
|
||||
});
|
||||
this.setData({
|
||||
coupons: {
|
||||
totalLength: res.shopCartOrders[0].coupons.length,
|
||||
canUseCoupons: canUseCoupons,
|
||||
unCanUseCoupons: unCanUseCoupons
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
this.setData({
|
||||
orderItems: orderItems,
|
||||
actualTotal: res.actualTotal,
|
||||
total: res.total,
|
||||
totalCount: res.totalCount,
|
||||
userAddr: res.userAddr,
|
||||
transfee: res.shopCartOrders[0].transfee,
|
||||
shopReduce: res.shopCartOrders[0].shopReduce
|
||||
});
|
||||
},
|
||||
errCallBack: res => {
|
||||
uni.hideLoading();
|
||||
this.chooseCouponErrHandle(res);
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 优惠券选择出错处理方法
|
||||
*/
|
||||
chooseCouponErrHandle(res) {
|
||||
// 优惠券不能共用处理方法
|
||||
if (res.statusCode == 601) {
|
||||
uni.showToast({
|
||||
title: res.data,
|
||||
icon: "none",
|
||||
duration: 3000,
|
||||
success: res => {
|
||||
this.setData({
|
||||
couponIds: []
|
||||
});
|
||||
}
|
||||
});
|
||||
setTimeout(() => {
|
||||
this.loadOrderData();
|
||||
}, 2500);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 提交订单
|
||||
*/
|
||||
toPay: function () {
|
||||
if (!this.userAddr) {
|
||||
uni.showToast({
|
||||
title: '请选择地址',
|
||||
icon: "none"
|
||||
});
|
||||
return;
|
||||
}
|
||||
|
||||
this.submitOrder();
|
||||
},
|
||||
submitOrder: function () {
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/order/submit",
|
||||
method: "POST",
|
||||
data: {
|
||||
orderShopParam: [{
|
||||
remarks: this.remark,
|
||||
shopId: 1
|
||||
}]
|
||||
},
|
||||
callBack: res => {
|
||||
console.log("res",res)
|
||||
uni.hideLoading();
|
||||
// this.calWeixinPay(res.orderNumbers);
|
||||
this.normalPay(res.orderNumbers)
|
||||
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
//模拟支付,直接提交成功
|
||||
normalPay: function(orderNumbers){
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/order/normalPay",
|
||||
method: "POST",
|
||||
data: {
|
||||
orderNumbers: orderNumbers
|
||||
},
|
||||
callBack: res => {
|
||||
console.log("res",res)
|
||||
uni.hideLoading();
|
||||
if(res){
|
||||
uni.showToast({
|
||||
title: "模拟支付成功",
|
||||
icon:"none"
|
||||
})
|
||||
setTimeout(() => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/pay-result/pay-result?sts=1&orderNumbers=' + orderNumbers
|
||||
});
|
||||
},1200)
|
||||
}else{
|
||||
uni.showToast({
|
||||
title: "支付失败!",
|
||||
icon:"none"
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 唤起微信支付
|
||||
*/
|
||||
calWeixinPay: function (orderNumbers) {
|
||||
uni.showLoading({
|
||||
mask: true
|
||||
});
|
||||
var params = {
|
||||
url: "/p/order/pay",
|
||||
method: "POST",
|
||||
data: {
|
||||
payType: 1,
|
||||
orderNumbers: orderNumbers
|
||||
},
|
||||
callBack: function (res) {
|
||||
uni.hideLoading();
|
||||
uni.requestPayment({
|
||||
timeStamp: res.timeStamp,
|
||||
nonceStr: res.nonceStr,
|
||||
package: res.packageValue,
|
||||
signType: res.signType,
|
||||
paySign: res.paySign,
|
||||
success: e => {
|
||||
// console.log("支付成功");
|
||||
uni.navigateTo({
|
||||
url: '/pages/pay-result/pay-result?sts=1&orderNumbers=' + orderNumbers + "&orderType=" + this.orderType
|
||||
});
|
||||
},
|
||||
fail: err => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/pay-result/pay-result?sts=0&orderNumbers=' + orderNumbers + "&orderType=" + this.orderType
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
changeCouponSts: function (e) {
|
||||
this.setData({
|
||||
couponSts: e.currentTarget.dataset.sts
|
||||
});
|
||||
},
|
||||
showCouponPopup: function () {
|
||||
this.setData({
|
||||
popupShow: true
|
||||
});
|
||||
},
|
||||
closePopup: function () {
|
||||
this.setData({
|
||||
popupShow: false
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 去地址页面
|
||||
*/
|
||||
toAddrListPage: function () {
|
||||
uni.navigateTo({
|
||||
url: '/pages/delivery-address/delivery-address?order=0'
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 确定选择好的优惠券
|
||||
*/
|
||||
choosedCoupon: function () {
|
||||
this.loadOrderData();
|
||||
this.setData({
|
||||
popupShow: false
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 优惠券子组件发过来
|
||||
*/
|
||||
checkCoupon: function (e) {
|
||||
var ths = this;
|
||||
let index = ths.couponIds.indexOf(e.detail.couponId);
|
||||
|
||||
if (index === -1) {
|
||||
ths.couponIds.push(e.detail.couponId);
|
||||
} else {
|
||||
ths.couponIds.splice(index, 1);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./submit-order.css";
|
||||
</style>
|
||||
262
mall4uni/pages/user/user.css
Normal file
@ -0,0 +1,262 @@
|
||||
/* pages/user/user.wxss */
|
||||
|
||||
page {
|
||||
background-color: #f7f7f7;
|
||||
padding-bottom: 60rpx;
|
||||
}
|
||||
|
||||
/* 用户信息 */
|
||||
.userinfo {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
background: #fff;
|
||||
text-align: center;
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
.userinfo .userinfo-con{
|
||||
width: 240rpx;
|
||||
margin: auto;
|
||||
}
|
||||
.userinfo .userinfo-con .userinfo-avatar {
|
||||
overflow: hidden;
|
||||
display: block;
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
border-radius: 50%;
|
||||
box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.2);
|
||||
margin: auto;
|
||||
}
|
||||
.userinfo .userinfo-con .userinfo-avatar image{
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
.userinfo .userinfo-con .userinfo-name {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
margin-top: 20rpx;
|
||||
overflow: hidden;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 1;
|
||||
-webkit-box-orient: vertical;
|
||||
text-overflow: ellipsis;
|
||||
word-break: break-all;
|
||||
}
|
||||
|
||||
/** 未登录信息 */
|
||||
.userinfo-none {
|
||||
display: flex;
|
||||
padding: 30rpx;
|
||||
background: #fff;
|
||||
align-items: center;
|
||||
}
|
||||
.userinfo-none .default-pic{
|
||||
padding-right:30rpx;
|
||||
}
|
||||
.userinfo-none .default-pic image{
|
||||
width:160rpx;
|
||||
height:160rpx;
|
||||
}
|
||||
.none-login button{
|
||||
background: #fff;
|
||||
}
|
||||
.none-login button::after{
|
||||
border:0;
|
||||
}
|
||||
.none-login .unlogin{
|
||||
font-size:30rpx;
|
||||
}
|
||||
.none-login .click-login{
|
||||
font-size:26rpx;
|
||||
}
|
||||
|
||||
.binding-phone {
|
||||
position: relative;
|
||||
background: #fff;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
padding: 0 30rpx;
|
||||
border-top: 2rpx solid #f7f7f7;
|
||||
border-bottom: 2rpx solid #f7f7f7;
|
||||
}
|
||||
|
||||
.binding-phone .show-tip {
|
||||
font-size: 26rpx;
|
||||
}
|
||||
|
||||
.binding-phone .gotobinding {
|
||||
border-radius: 8rpx;
|
||||
font-size: 28rpx;
|
||||
color: #e24b4b;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
/*end 用户信息 */
|
||||
|
||||
/* 订单状态 */
|
||||
|
||||
.list-cont {
|
||||
|
||||
width: 100%;
|
||||
background: #f7f7f7;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
|
||||
.list-cont .total-order {
|
||||
/* width: 100%; */
|
||||
/* margin-bottom: 30rpx; */
|
||||
background: #fff;
|
||||
|
||||
}
|
||||
|
||||
.list-cont .total-order .order-tit {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
font-size: 30rpx;
|
||||
border-bottom:1px solid #f7f7f7;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
|
||||
.list-cont .total-order .order-tit .checkmore {
|
||||
font-size: 22rpx;
|
||||
color: #80848f;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.list-cont .total-order .procedure {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: center;
|
||||
font-size: 25rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
|
||||
.list-cont .total-order .procedure .items {
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.list-cont .total-order .procedure .items image {
|
||||
width: 70rpx;
|
||||
height: 70rpx;
|
||||
margin-bottom: 20rpx;
|
||||
}
|
||||
|
||||
.list-cont .total-order .procedure .items .num-badge {
|
||||
position: absolute;
|
||||
top: -15rpx;
|
||||
right: -12rpx;
|
||||
color: #eb2444;
|
||||
border: 3rpx solid #eb2444;
|
||||
border-radius: 50rpx;
|
||||
background: #fff;
|
||||
min-width: 30rpx;
|
||||
height: 30rpx;
|
||||
line-height: 30rpx;
|
||||
text-align: center;
|
||||
padding: 2rpx;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* end 订单状态 */
|
||||
|
||||
/* 列表项 */
|
||||
|
||||
.list-cont .my-menu {
|
||||
/* width: 100%; */
|
||||
background-color: #fff;
|
||||
margin-top:20rpx;
|
||||
}
|
||||
|
||||
.list-cont .my-menu .memu-item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 100rpx;
|
||||
border-bottom: 2rpx solid #f7f7f7;
|
||||
padding:0 30rpx;
|
||||
}
|
||||
|
||||
.list-cont .my-menu .memu-item:nth-child(1) {
|
||||
border-top: 2rpx solid #f7f7f7;
|
||||
}
|
||||
|
||||
.list-cont .my-menu .memu-item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
.list-cont .my-menu .memu-item text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.list-cont .my-menu .memu-item image{
|
||||
width:50rpx;
|
||||
height:50rpx;
|
||||
margin-right:20rpx;
|
||||
|
||||
}
|
||||
.list-cont .my-menu .memu-item .i-name{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
/* end 列表项 */
|
||||
|
||||
/* 箭头 */
|
||||
|
||||
.arrowhead {
|
||||
width: 15rpx;
|
||||
height: 15rpx;
|
||||
border-top: 2rpx solid #999;
|
||||
border-right: 2rpx solid #999;
|
||||
transform: rotate(45deg);
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
|
||||
|
||||
/* 商品收藏消息等 */
|
||||
.prod-col{
|
||||
margin-top:20rpx;
|
||||
background: #fff;
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding:30rpx 0 10rpx 0;
|
||||
font-size: 12px;
|
||||
}
|
||||
.prod-col .col-item{
|
||||
text-align: center;
|
||||
}
|
||||
.prod-col .col-item .num{
|
||||
font-size: 16px;
|
||||
font-weight: 700;
|
||||
color: #3a86b9;
|
||||
}
|
||||
|
||||
.prod-col .col-item .tit{
|
||||
line-height: 34px;
|
||||
}
|
||||
|
||||
/* 退出登录 */
|
||||
.log-out{
|
||||
padding:20rpx;
|
||||
text-align: center;
|
||||
margin-top:20rpx;
|
||||
}
|
||||
.log-out-n{
|
||||
font-size: 30rpx;
|
||||
margin: auto;
|
||||
width:200rpx;
|
||||
padding:20rpx;
|
||||
border-radius: 10rpx;
|
||||
background: #e43130;
|
||||
color:#ffffff;
|
||||
}
|
||||
button.memu-btn.memu-item {
|
||||
background-color: #fff;
|
||||
}
|
||||
button.memu-btn.memu-item:after {
|
||||
border: 0;
|
||||
}
|
||||
345
mall4uni/pages/user/user.vue
Normal file
@ -0,0 +1,345 @@
|
||||
<template>
|
||||
<!--pages/user/user.wxml-->
|
||||
<view class="container">
|
||||
<!-- 用户信息 -->
|
||||
<!-- # indef MP-wei -->
|
||||
<!-- <view class="userinfo">
|
||||
<view class="userinfo-avatar">
|
||||
<open-data type="userAvatarUrl"></open-data>
|
||||
</view>
|
||||
<view class="userinfo-name">
|
||||
<open-data type="userNickName"></open-data>
|
||||
</view>
|
||||
</view>
|
||||
<view class="binding-phone">
|
||||
<text class="show-tip">绑定手机号后可查看订单和领取优惠券,</text>
|
||||
<text class="gotobinding" @tap="toBindingPhone">去绑定</text>
|
||||
</view> -->
|
||||
|
||||
<view class="userinfo" v-if="isAuthInfo">
|
||||
<view class="userinfo-con" @tap="toPersonalInformation">
|
||||
<view class="userinfo-avatar">
|
||||
<!-- <open-data type="userAvatarUrl"></open-data> -->
|
||||
<image :src="loginResult.pic?loginResult.pic:'../../static/images/icon/head04.png'"></image>
|
||||
</view>
|
||||
<view class="userinfo-name" @tap="toPersonalInformation">
|
||||
<view>{{loginResult.nickName ? loginResult.nickName : "用户昵称"}}</view>
|
||||
<!-- <open-data type="userNickName"></open-data> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="userinfo-none" v-if="!isAuthInfo">
|
||||
<view class="default-pic">
|
||||
<image src="../../static/images/icon/head04.png"></image>
|
||||
</view>
|
||||
<view class="none-login">
|
||||
<button class="unlogin" @tap="toLogin">未登录</button>
|
||||
<button class="click-login" @tap="toLogin">点击账号登录</button>
|
||||
</view>
|
||||
</view>
|
||||
<!-- end 用户信息 -->
|
||||
|
||||
<view class="list-cont">
|
||||
|
||||
<!-- 订单状态 -->
|
||||
<view class="total-order">
|
||||
<view class="order-tit">
|
||||
<text style="font-weight:bold">我的订单</text>
|
||||
<view class="checkmore" @tap="toOrderListPage" data-sts="0">
|
||||
<text>查看全部 </text>
|
||||
<text class="arrowhead"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="procedure">
|
||||
<view class="items" @tap="toOrderListPage" data-sts="1">
|
||||
<image src="/static/images/icon/toPay.png"></image>
|
||||
<text>待支付</text>
|
||||
<text class="num-badge" v-if="orderAmount.unPay>0">{{orderAmount.unPay}}</text>
|
||||
</view>
|
||||
<view class="items" @tap="toOrderListPage" data-sts="2">
|
||||
<image src="/static/images/icon/toDelivery.png"></image>
|
||||
<text>待发货</text>
|
||||
<text class="num-badge" v-if="orderAmount.payed>0">{{orderAmount.payed}}</text>
|
||||
</view>
|
||||
<view class="items" @tap="toOrderListPage" data-sts="3">
|
||||
<image src="/static/images/icon/toTake.png"></image>
|
||||
<text>待收货</text>
|
||||
<text class="num-badge" v-if="orderAmount.consignment>0">{{orderAmount.consignment}}</text>
|
||||
</view>
|
||||
<view class="items" @tap="toOrderListPage" data-sts="5">
|
||||
<image src="/static/images/icon/toComment.png"></image>
|
||||
<text>已完成</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!--end 订单状态 -->
|
||||
|
||||
<view class="prod-col">
|
||||
<view class="col-item" @tap="myCollectionHandle">
|
||||
<view class="num">{{collectionCount}}</view>
|
||||
<view class="tit">我的收藏</view>
|
||||
</view>
|
||||
<view class="col-item">
|
||||
<view class="num">5</view>
|
||||
<view class="tit">我的消息</view>
|
||||
</view>
|
||||
<view class="col-item">
|
||||
<view class="num">3</view>
|
||||
<view class="tit">我的足迹</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="my-menu">
|
||||
<view class="memu-item" @tap="toDistCenter">
|
||||
<view class="i-name">
|
||||
<image src="/static/images/icon/promotion.png"></image>
|
||||
<text>分销中心</text>
|
||||
</view>
|
||||
<view class="arrowhead"></view>
|
||||
</view>
|
||||
<view class="memu-item" @tap="toCouponCenter">
|
||||
<view class="i-name">
|
||||
<image src="/static/images/icon/getCoupon.png"></image>
|
||||
<text>领券中心</text>
|
||||
</view>
|
||||
<view class="arrowhead"></view>
|
||||
</view>
|
||||
<view class="memu-item" @tap="toMyCouponPage">
|
||||
<view class="i-name">
|
||||
<image src="/static/images/icon/myCoupon.png"></image>
|
||||
<text>我的优惠券</text>
|
||||
</view>
|
||||
<view class="arrowhead"></view>
|
||||
</view>
|
||||
<view class="memu-item" @tap="toAddressList">
|
||||
<view class="i-name">
|
||||
<image src="/static/images/icon/myAddr.png"></image>
|
||||
<text>收货地址</text>
|
||||
</view>
|
||||
<view class="arrowhead"></view>
|
||||
</view>
|
||||
</view>
|
||||
<!--end 列表项 -->
|
||||
|
||||
<view class="log-out" @tap="logout" v-if="isAuthInfo">
|
||||
<view class="log-out-n">
|
||||
<text>退出登录</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// pages/user/user.js
|
||||
var http = require("../../utils/http.js");
|
||||
var util = require("../../utils/util.js");
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
orderAmount: '',
|
||||
sts: '',
|
||||
collectionCount: 0,
|
||||
isAuthInfo: false,
|
||||
loginResult: '',
|
||||
};
|
||||
},
|
||||
|
||||
components: {},
|
||||
props: {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面加载
|
||||
*/
|
||||
onLoad: function(options) {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面初次渲染完成
|
||||
*/
|
||||
onReady: function() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面显示
|
||||
*/
|
||||
onShow: function() {
|
||||
//加载订单数字
|
||||
var ths = this; // var status = ths.data.status
|
||||
|
||||
ths.setData({
|
||||
loginResult: uni.getStorageSync("loginResult"),
|
||||
// isAuthInfo: Boolean(wx.getStorageSync('loginResult').userId),
|
||||
});
|
||||
if (ths.loginResult) {
|
||||
ths.setData({
|
||||
isAuthInfo: true
|
||||
})
|
||||
} else {
|
||||
ths.setData({
|
||||
isAuthInfo: false
|
||||
})
|
||||
}
|
||||
if (ths.isAuthInfo) {
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/myOrder/orderCount",
|
||||
method: "GET",
|
||||
data: {},
|
||||
callBack: function(res) {
|
||||
uni.hideLoading();
|
||||
ths.setData({
|
||||
orderAmount: res
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
this.showCollectionCount();
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面隐藏
|
||||
*/
|
||||
onHide: function() {},
|
||||
|
||||
/**
|
||||
* 生命周期函数--监听页面卸载
|
||||
*/
|
||||
onUnload: function() {},
|
||||
|
||||
/**
|
||||
* 页面相关事件处理函数--监听用户下拉动作
|
||||
*/
|
||||
onPullDownRefresh: function() {},
|
||||
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {},
|
||||
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function() {},
|
||||
methods: {
|
||||
toDistCenter: function() {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '该功能未开源'
|
||||
});
|
||||
},
|
||||
toCouponCenter: function() {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '该功能未开源'
|
||||
});
|
||||
},
|
||||
toMyCouponPage: function() {
|
||||
uni.showToast({
|
||||
icon: "none",
|
||||
title: '该功能未开源'
|
||||
});
|
||||
},
|
||||
toAddressList: function() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/delivery-address/delivery-address'
|
||||
});
|
||||
},
|
||||
// 跳转绑定手机号
|
||||
toBindingPhone: function() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/binding-phone/binding-phone'
|
||||
});
|
||||
},
|
||||
toOrderListPage: function(e) {
|
||||
var sts = e.currentTarget.dataset.sts;
|
||||
uni.navigateTo({
|
||||
url: '/pages/orderList/orderList?sts=' + sts
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 查询所有的收藏量
|
||||
*/
|
||||
showCollectionCount: function() {
|
||||
var ths = this;
|
||||
uni.showLoading();
|
||||
var params = {
|
||||
url: "/p/user/collection/count",
|
||||
method: "GET",
|
||||
data: {},
|
||||
callBack: function(res) {
|
||||
uni.hideLoading();
|
||||
ths.setData({
|
||||
collectionCount: res
|
||||
});
|
||||
}
|
||||
};
|
||||
http.request(params);
|
||||
},
|
||||
|
||||
/**
|
||||
* 我的收藏跳转
|
||||
*/
|
||||
myCollectionHandle: function() {
|
||||
var url = '/pages/prod-classify/prod-classify?sts=5';
|
||||
var id = 0;
|
||||
var title = "我的收藏商品";
|
||||
|
||||
if (id) {
|
||||
url += "&tagid=" + id + "&title=" + title;
|
||||
}
|
||||
|
||||
uni.navigateTo({
|
||||
url: url
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 去登陆
|
||||
*/
|
||||
toLogin: function() {
|
||||
uni.navigateTo({
|
||||
url: "../accountLogin/accountLogin"
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* 退出登录
|
||||
*/
|
||||
logout: function() {
|
||||
// 请求退出登陆接口
|
||||
http.request({
|
||||
url: '/p/user/logout',
|
||||
method: 'GET',
|
||||
callBack: res => {
|
||||
util.removeTabBadge()
|
||||
|
||||
uni.removeStorageSync('loginResult');
|
||||
uni.removeStorageSync('token');
|
||||
|
||||
// this.$Router.pushTab('/pages/index/index')
|
||||
uni.showToast({
|
||||
title: "退出成功",
|
||||
icon: "none"
|
||||
})
|
||||
|
||||
this.setData({
|
||||
orderAmount: ''
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.switchTab({
|
||||
url: "/pages/index/index"
|
||||
})
|
||||
}, 1000)
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style>
|
||||
@import "./user.css";
|
||||
</style>
|
||||
70
mall4uni/project.config.json
Normal file
@ -0,0 +1,70 @@
|
||||
{
|
||||
"description": "项目配置文件",
|
||||
"packOptions": {
|
||||
"ignore": []
|
||||
},
|
||||
"setting": {
|
||||
"urlCheck": false,
|
||||
"es6": true,
|
||||
"enhance": false,
|
||||
"postcss": true,
|
||||
"preloadBackgroundData": false,
|
||||
"minified": true,
|
||||
"newFeature": true,
|
||||
"coverView": true,
|
||||
"nodeModules": false,
|
||||
"autoAudits": false,
|
||||
"showShadowRootInWxmlPanel": true,
|
||||
"scopeDataCheck": false,
|
||||
"uglifyFileName": false,
|
||||
"checkInvalidKey": true,
|
||||
"checkSiteMap": true,
|
||||
"uploadWithSourceMap": true,
|
||||
"compileHotReLoad": false,
|
||||
"useMultiFrameRuntime": true,
|
||||
"useApiHook": true,
|
||||
"useApiHostProcess": true,
|
||||
"babelSetting": {
|
||||
"ignore": [],
|
||||
"disablePlugins": [],
|
||||
"outputPath": ""
|
||||
},
|
||||
"enableEngineNative": false,
|
||||
"bundle": false,
|
||||
"useIsolateContext": true,
|
||||
"useCompilerModule": true,
|
||||
"userConfirmedUseCompilerModuleSwitch": false,
|
||||
"userConfirmedBundleSwitch": false,
|
||||
"packNpmManually": false,
|
||||
"packNpmRelationList": [],
|
||||
"minifyWXSS": true
|
||||
},
|
||||
"compileType": "miniprogram",
|
||||
"libVersion": "2.6.4",
|
||||
"appid": "wx6fa71e69231a4fa4",
|
||||
"projectname": "%E4%BA%9A%E7%B1%B3%E7%A7%91%E6%8A%80mall4j",
|
||||
"debugOptions": {
|
||||
"hidedInDevtools": []
|
||||
},
|
||||
"isGameTourist": false,
|
||||
"simulatorType": "wechat",
|
||||
"simulatorPluginLibVersion": {},
|
||||
"condition": {
|
||||
"search": {
|
||||
"list": []
|
||||
},
|
||||
"conversation": {
|
||||
"list": []
|
||||
},
|
||||
"plugin": {
|
||||
"list": []
|
||||
},
|
||||
"game": {
|
||||
"currentL": -1,
|
||||
"list": []
|
||||
},
|
||||
"miniprogram": {
|
||||
"list": []
|
||||
}
|
||||
}
|
||||
}
|
||||
7
mall4uni/sitemap.json
Normal file
@ -0,0 +1,7 @@
|
||||
{
|
||||
"desc": "关于本文件的更多信息,请参考文档 https://developers.weixin.qq.com/miniprogram/dev/framework/sitemap.html",
|
||||
"rules": [{
|
||||
"action": "allow",
|
||||
"page": "*"
|
||||
}]
|
||||
}
|
||||
BIN
mall4uni/static/images/icon/addr.png
Normal file
|
After Width: | Height: | Size: 3.0 KiB |
BIN
mall4uni/static/images/icon/bg1.png
Normal file
|
After Width: | Height: | Size: 800 B |
BIN
mall4uni/static/images/icon/car-new.png
Normal file
|
After Width: | Height: | Size: 2.8 KiB |
BIN
mall4uni/static/images/icon/car.png
Normal file
|
After Width: | Height: | Size: 1.1 KiB |
BIN
mall4uni/static/images/icon/clear-his.png
Normal file
|
After Width: | Height: | Size: 1.7 KiB |
BIN
mall4uni/static/images/icon/coupon-ot.png
Normal file
|
After Width: | Height: | Size: 7.5 KiB |
BIN
mall4uni/static/images/icon/coupon-used.png
Normal file
|
After Width: | Height: | Size: 7.4 KiB |
BIN
mall4uni/static/images/icon/delive-dot.png
Normal file
|
After Width: | Height: | Size: 1.7 KiB |
BIN
mall4uni/static/images/icon/delivery-car.png
Normal file
|
After Width: | Height: | Size: 1.2 KiB |
BIN
mall4uni/static/images/icon/dot.png
Normal file
|
After Width: | Height: | Size: 775 B |
BIN
mall4uni/static/images/icon/empty-cash.png
Normal file
|
After Width: | Height: | Size: 7.5 KiB |
BIN
mall4uni/static/images/icon/everydaySale.png
Normal file
|
After Width: | Height: | Size: 3.4 KiB |
BIN
mall4uni/static/images/icon/getCoupon.png
Normal file
|
After Width: | Height: | Size: 2.9 KiB |
BIN
mall4uni/static/images/icon/head04.png
Normal file
|
After Width: | Height: | Size: 2.3 KiB |
BIN
mall4uni/static/images/icon/horn.png
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
mall4uni/static/images/icon/menu-01.png
Normal file
|
After Width: | Height: | Size: 5.0 KiB |
BIN
mall4uni/static/images/icon/menu-02.png
Normal file
|
After Width: | Height: | Size: 2.5 KiB |
BIN
mall4uni/static/images/icon/menu-03.png
Normal file
|
After Width: | Height: | Size: 4.1 KiB |
BIN
mall4uni/static/images/icon/menu-04.png
Normal file
|
After Width: | Height: | Size: 2.5 KiB |
BIN
mall4uni/static/images/icon/more.png
Normal file
|
After Width: | Height: | Size: 1.4 KiB |
BIN
mall4uni/static/images/icon/myAddr.png
Normal file
|
After Width: | Height: | Size: 2.9 KiB |
BIN
mall4uni/static/images/icon/myCoupon.png
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
mall4uni/static/images/icon/newProd.png
Normal file
|
After Width: | Height: | Size: 2.8 KiB |
BIN
mall4uni/static/images/icon/neweveryday.png
Normal file
|
After Width: | Height: | Size: 3.8 KiB |
BIN
mall4uni/static/images/icon/newprods.png
Normal file
|
After Width: | Height: | Size: 3.7 KiB |
BIN
mall4uni/static/images/icon/plus-sign.png
Normal file
|
After Width: | Height: | Size: 1.1 KiB |
BIN
mall4uni/static/images/icon/prod-col-red.png
Normal file
|
After Width: | Height: | Size: 1.5 KiB |
BIN
mall4uni/static/images/icon/prod-col.png
Normal file
|
After Width: | Height: | Size: 2.5 KiB |
BIN
mall4uni/static/images/icon/promotion.png
Normal file
|
After Width: | Height: | Size: 2.1 KiB |
BIN
mall4uni/static/images/icon/revise.png
Normal file
|
After Width: | Height: | Size: 1.4 KiB |
BIN
mall4uni/static/images/icon/search-01.png
Normal file
|
After Width: | Height: | Size: 1.8 KiB |
BIN
mall4uni/static/images/icon/search-col.png
Normal file
|
After Width: | Height: | Size: 2.0 KiB |
BIN
mall4uni/static/images/icon/search-col2.png
Normal file
|
After Width: | Height: | Size: 1.7 KiB |
BIN
mall4uni/static/images/icon/search.png
Normal file
|
After Width: | Height: | Size: 767 B |
BIN
mall4uni/static/images/icon/star-empty.png
Normal file
|
After Width: | Height: | Size: 2.3 KiB |
BIN
mall4uni/static/images/icon/star-red.png
Normal file
|
After Width: | Height: | Size: 1.4 KiB |
BIN
mall4uni/static/images/icon/timePrice.png
Normal file
|
After Width: | Height: | Size: 2.7 KiB |
BIN
mall4uni/static/images/icon/toComment.png
Normal file
|
After Width: | Height: | Size: 2.9 KiB |
BIN
mall4uni/static/images/icon/toDelivery.png
Normal file
|
After Width: | Height: | Size: 2.9 KiB |
BIN
mall4uni/static/images/icon/toPay.png
Normal file
|
After Width: | Height: | Size: 2.2 KiB |
BIN
mall4uni/static/images/icon/toTake.png
Normal file
|
After Width: | Height: | Size: 2.4 KiB |